2023-03-15 16:00:52 +00:00
|
|
|
/**
|
|
|
|
* Copyright (c) HashiCorp, Inc.
|
|
|
|
* SPDX-License-Identifier: MPL-2.0
|
|
|
|
*/
|
|
|
|
|
2023-03-17 16:22:12 +00:00
|
|
|
import Component from '@glimmer/component';
|
2021-12-07 17:05:14 +00:00
|
|
|
import { assert } from '@ember/debug';
|
|
|
|
import flightIconMap from '@hashicorp/flight-icons/catalog.json';
|
|
|
|
const flightIconNames = flightIconMap.assets.mapBy('iconName').uniq();
|
2023-03-17 16:22:12 +00:00
|
|
|
|
2019-05-13 19:05:25 +00:00
|
|
|
/**
|
|
|
|
* @module Icon
|
|
|
|
* `Icon` components are glyphs used to indicate important information.
|
|
|
|
*
|
2021-12-07 17:05:14 +00:00
|
|
|
* Flight icon documentation at https://flight-hashicorp.vercel.app/
|
|
|
|
*
|
2019-05-13 19:05:25 +00:00
|
|
|
* @example
|
|
|
|
* ```js
|
2021-12-07 17:05:14 +00:00
|
|
|
* <Icon @name="cancel-square-outline" @size="24" />
|
2019-05-13 19:05:25 +00:00
|
|
|
* ```
|
2021-12-07 17:05:14 +00:00
|
|
|
* @param {string} name=null - The name of the SVG to render inline.
|
|
|
|
* @param {string} [size=16] - size for flight icon, can be 16 or 24
|
2019-05-13 19:05:25 +00:00
|
|
|
*
|
|
|
|
*/
|
2021-12-07 17:05:14 +00:00
|
|
|
|
2023-03-17 16:22:12 +00:00
|
|
|
export default class Icon extends Component {
|
|
|
|
constructor(owner, args) {
|
|
|
|
super(owner, args);
|
2021-12-07 17:05:14 +00:00
|
|
|
assert('Icon component size argument must be either "16" or "24"', ['16', '24'].includes(this.size));
|
2023-03-17 16:22:12 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
get size() {
|
|
|
|
return this.args.size || '16';
|
|
|
|
}
|
|
|
|
|
|
|
|
get name() {
|
|
|
|
return this.args.name || null;
|
|
|
|
}
|
2021-12-07 17:05:14 +00:00
|
|
|
|
|
|
|
// favor flight icon set and fall back to structure icons if not found
|
2023-03-17 16:22:12 +00:00
|
|
|
get isFlightIcon() {
|
2021-12-07 17:05:14 +00:00
|
|
|
return this.name ? flightIconNames.includes(this.name) : false;
|
2023-03-17 16:22:12 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
get hsIconClass() {
|
2021-12-07 17:05:14 +00:00
|
|
|
return this.size === '24' ? 'hs-icon-xl' : 'hs-icon-l';
|
2023-03-17 16:22:12 +00:00
|
|
|
}
|
|
|
|
}
|