npm - @limetech/lime-elements - Versions diffs - 36.4.0 → 37.0.0-dev.1 - Mend

@limetech/lime-elements 36.4.0 → 37.0.0-dev.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (942) hide show

package/dist/collection/components/select/select.js CHANGED Viewed

@@ -287,11 +287,11 @@ export class Select {
         "reflect": true
       },
       "value": {
-        "type": "unknown",
+        "type": "any",
         "mutable": false,
         "complexType": {
           "original": "Option | Option[]",
-          "resolved": "Option<string> | Option<string>[]",
+          "resolved": "any",
           "references": {
             "Option": {
               "location": "import",
@@ -304,14 +304,16 @@ export class Select {
         "docs": {
           "tags": [],
           "text": "Currently selected value or values.\nIf `multiple` is `true`, this must be an array. Otherwise it must be a\nsingle value."
-        }
+        },
+        "attribute": "value",
+        "reflect": false
       },
       "options": {
         "type": "unknown",
         "mutable": false,
         "complexType": {
           "original": "Option[]",
-          "resolved": "Option<string>[]",
+          "resolved": "Option[]",
           "references": {
             "Option": {
               "location": "import",
@@ -365,7 +367,7 @@ export class Select {
         },
         "complexType": {
           "original": "Option | Option[]",
-          "resolved": "Option<string> | Option<string>[]",
+          "resolved": "any",
           "references": {
             "Option": {
               "location": "import",
@@ -383,3 +385,4 @@ export class Select {
       }];
   }
 }
+//# sourceMappingURL=select.js.map

package/dist/collection/components/select/select.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ListItem, Option } from '@limetech/lime-elements';\nimport { MDCFloatingLabel } from '@material/floating-label';\nimport { MDCSelectHelperText } from '@material/select/helper-text';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { isMobileDevice } from '../../util/device';\nimport {\n ENTER,\n ENTER_KEY_CODE,\n SPACE,\n SPACE_KEY_CODE,\n} from '../../util/keycodes';\nimport { isMultiple } from '../../util/multiple';\nimport { createRandomString } from '../../util/random-string';\nimport { SelectTemplate } from './select.template';\n\n/**\n * @exampleComponent limel-example-select\n * @exampleComponent limel-example-select-with-icons\n * @exampleComponent limel-example-select-multiple\n * @exampleComponent limel-example-select-with-empty-option\n * @exampleComponent limel-example-select-preselected\n * @exampleComponent limel-example-select-change-options\n * @exampleComponent limel-example-select-narrow\n * @exampleComponent limel-example-select-dialog\n */\n@Component({\n tag: 'limel-select',\n shadow: true,\n styleUrl: 'select.scss',\n})\nexport class Select {\n /**\n * Set to `true` to make the field disabled.\n * and visually shows that the `select` component is editable but disabled.\n * This tells the users that if certain requirements are met,\n * the component may become interactable.\n */\n @Prop({ reflect: true })\n public disabled = false;\n\n /**\n * Set to `true` to make the field read-only.\n * This visualizes the component slightly differently.\n * But shows no visual sign indicating that the component is disabled\n * or can ever become interactable.\n */\n @Prop({ reflect: true })\n public readonly = false;\n\n /**\n * Set to `true` to indicate that the current value of the select is\n * invalid.\n */\n @Prop({ reflect: true })\n public invalid: boolean;\n\n /**\n * True if the control requires a value.\n */\n @Prop({ reflect: true })\n public required = false;\n\n /**\n * Text to display next to the select.\n */\n @Prop({ reflect: true })\n public label: string;\n\n /**\n * Optional helper text to display below the input field when it has focus.\n */\n @Prop({ reflect: true })\n public helperText: string;\n\n /**\n * Currently selected value or values.\n * If `multiple` is `true`, this must be an array. Otherwise it must be a\n * single value.\n */\n @Prop()\n public value: Option | Option[];\n\n /**\n * List of options.\n */\n @Prop()\n public options: Option[] = [];\n\n /**\n * Set to `true` to allow multiple values to be selected.\n */\n @Prop()\n public multiple: boolean = false;\n\n /**\n * Emitted when the value is changed.\n */\n @Event()\n private change: EventEmitter<Option | Option[]>;\n\n @Element()\n private host: HTMLLimelSelectElement;\n\n @State()\n private menuOpen: boolean = false;\n\n private hasChanged: boolean = false;\n private checkValid: boolean = false;\n private mdcSelectHelperText: MDCSelectHelperText;\n private mdcFloatingLabel: MDCFloatingLabel;\n private isMobileDevice: boolean;\n private portalId: string;\n\n constructor() {\n this.handleMenuChange = this.handleMenuChange.bind(this);\n this.handleNativeChange = this.handleNativeChange.bind(this);\n this.handleMenuTriggerKeyPress =\n this.handleMenuTriggerKeyPress.bind(this);\n this.openMenu = this.openMenu.bind(this);\n this.closeMenu = this.closeMenu.bind(this);\n\n this.portalId = createRandomString();\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentWillLoad() {\n this.isMobileDevice = isMobileDevice();\n\n // It should not be possible to render the native select for consumers, but we still want to make it testable.\n // We can set this attribute in tests to force rendering of the native select\n if (this.host.hasAttribute('data-native')) {\n this.isMobileDevice = true;\n }\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n private initialize() {\n let element: HTMLElement;\n element = this.host.shadowRoot.querySelector('.mdc-floating-label');\n if (!element) {\n return;\n }\n\n this.mdcFloatingLabel = new MDCFloatingLabel(element);\n\n element = this.host.shadowRoot.querySelector('.mdc-select-helper-text');\n if (element) {\n this.mdcSelectHelperText = new MDCSelectHelperText(element);\n }\n }\n\n public disconnectedCallback() {\n if (this.mdcFloatingLabel) {\n this.mdcFloatingLabel.destroy();\n }\n\n if (this.mdcSelectHelperText) {\n this.mdcSelectHelperText.destroy();\n }\n }\n\n public componentDidUpdate() {\n if (this.menuOpen) {\n this.setMenuFocus();\n }\n }\n\n public render() {\n const dropdownZIndex = getComputedStyle(this.host).getPropertyValue(\n '--dropdown-z-index'\n );\n\n return (\n <SelectTemplate\n id={this.portalId}\n disabled={this.disabled || this.readonly}\n readonly={this.readonly}\n required={this.required}\n invalid={this.invalid}\n label={this.label}\n helperText={this.helperText}\n value={this.value}\n options={this.options}\n onMenuChange={this.handleMenuChange}\n onNativeChange={this.handleNativeChange}\n onTriggerPress={this.handleMenuTriggerKeyPress}\n multiple={this.multiple}\n isOpen={this.menuOpen}\n open={this.openMenu}\n close={this.closeMenu}\n checkValid={this.checkValid}\n native={this.isMobileDevice}\n dropdownZIndex={dropdownZIndex}\n />\n );\n }\n\n @Watch('menuOpen')\n protected watchOpen(newValue: boolean, oldValue: boolean) {\n if (this.checkValid) {\n return;\n }\n\n // Menu was closed for the first time\n if (!newValue && oldValue) {\n this.checkValid = true;\n }\n }\n\n private setMenuFocus() {\n if (this.isMobileDevice) {\n return;\n }\n\n setTimeout(() => {\n const list: HTMLElement = document.querySelector(\n `#${this.portalId} limel-menu-surface limel-list`\n );\n const firstItem: HTMLElement =\n list?.shadowRoot?.querySelector('[tabindex]');\n\n if (firstItem) {\n firstItem.focus();\n }\n });\n }\n\n private setTriggerFocus() {\n const trigger: HTMLElement = this.host.shadowRoot.querySelector(\n '.limel-select-trigger'\n );\n trigger.focus();\n }\n\n private handleMenuChange(\n event: CustomEvent<Array<ListItem<Option>> | ListItem<Option>>\n ) {\n event.stopPropagation();\n\n if (isMultiple(event.detail)) {\n const listItems: ListItem[] = event.detail;\n const options: Option[] = listItems.map((item) => item.value);\n this.change.emit(options);\n\n return;\n }\n\n if (!event.detail.selected) {\n return;\n }\n\n const listItem: ListItem = event.detail;\n const option: Option = listItem.value;\n if (option.disabled) {\n return;\n }\n\n this.change.emit(option);\n this.menuOpen = false;\n this.setTriggerFocus();\n }\n\n private openMenu() {\n if (this.emitFirstChangeEvent()) {\n this.hasChanged = true;\n this.change.emit(this.options[0]);\n }\n\n this.menuOpen = true;\n }\n\n private emitFirstChangeEvent() {\n return !this.hasChanged && this.isMobileDevice && !this.value;\n }\n\n private closeMenu() {\n this.menuOpen = false;\n this.setTriggerFocus();\n }\n\n private handleMenuTriggerKeyPress(event: KeyboardEvent) {\n const isEnter = event.key === ENTER || event.keyCode === ENTER_KEY_CODE;\n const isSpace = event.key === SPACE || event.keyCode === SPACE_KEY_CODE;\n\n if (!this.menuOpen && (isSpace || isEnter)) {\n event.stopPropagation();\n event.preventDefault();\n this.menuOpen = true;\n }\n }\n\n private handleNativeChange(event: Event) {\n event.stopPropagation();\n\n const element: HTMLSelectElement = this.host.shadowRoot.querySelector(\n 'select.limel-select__native-control'\n );\n const options = Array.apply(null, element.options) // eslint-disable-line prefer-spread\n .filter((optionElement: HTMLOptionElement) => {\n return !!optionElement.selected;\n })\n .map((optionElement: HTMLOptionElement) => {\n return this.options.find(\n (o) => o.value === optionElement.value\n );\n });\n\n if (this.multiple) {\n this.change.emit(options);\n\n return;\n }\n\n this.change.emit(options[0]);\n this.menuOpen = false;\n }\n}\n"]}

package/dist/collection/components/select/select.template.js CHANGED Viewed

@@ -139,3 +139,4 @@ function getSelectedIcon(value) {
   }
   return (h("limel-icon", { class: "limel-select__selected-option__icon", name: value.icon, size: "medium", style: style }));
 }
+//# sourceMappingURL=select.template.js.map

package/dist/collection/components/select/select.template.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"select.template.js","sourceRoot":"","sources":["../../../src/components/select/select.template.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ListItem, Option } from '@limetech/lime-elements';\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { isMultiple } from '../../util/multiple';\n\ninterface SelectTemplateProps {\n disabled?: boolean;\n readonly?: boolean;\n required?: boolean;\n invalid?: boolean;\n options: Option[];\n value: Option | Option[];\n label?: string;\n helperText?: string;\n multiple?: boolean;\n native: boolean;\n\n onNativeChange: (event: Event) => void;\n\n id: string;\n onMenuChange: (event: CustomEvent<ListItem | ListItem[]>) => void;\n onTriggerPress: (event: KeyboardEvent) => void;\n isOpen: boolean;\n open: () => void;\n close: () => void;\n checkValid: boolean;\n\n dropdownZIndex: string;\n}\n\nexport const SelectTemplate: FunctionalComponent<SelectTemplateProps> = (\n props\n) => {\n const value = props.value;\n let hasValue = !!props.value;\n let hasEmptyText = true;\n if (isMultiple(value)) {\n hasValue = value.length > 0;\n } else if (hasValue) {\n hasValue = !!value.value;\n hasEmptyText = value.text === '';\n }\n\n let isValid = !props.invalid;\n if (props.checkValid && props.required && !hasValue) {\n isValid = false;\n }\n\n const classList = {\n 'limel-select': true,\n 'mdc-select': true,\n 'mdc-select--outlined': true,\n 'mdc-select--disabled': props.disabled,\n 'limel-select--readonly': props.readonly,\n 'limel-select--required': props.required,\n 'limel-select--invalid': !isValid,\n 'limel-select--empty': !hasValue,\n 'limel-select--with-helper-text': typeof props.helperText === 'string',\n };\n\n return (\n <div class={classList}>\n <SelectValue\n {...props}\n hasValue={hasValue}\n isValid={isValid}\n hasEmptyText={hasEmptyText}\n />\n <HelperText text={props.helperText} isValid={!props.invalid} />\n <SelectDropdown {...props} />\n </div>\n );\n};\n\nconst SelectValue: FunctionalComponent<\n SelectTemplateProps & {\n hasValue: boolean;\n isValid: boolean;\n hasEmptyText: boolean;\n }\n> = (props) => {\n const anchorClassList = {\n 'mdc-select__anchor': true,\n 'limel-select-trigger': true,\n 'limel-select--focused': props.isOpen,\n };\n const labelClassList = {\n 'mdc-floating-label': true,\n 'mdc-floating-label--float-above':\n !props.hasEmptyText ||\n props.isOpen ||\n props.readonly ||\n props.hasValue,\n 'mdc-floating-label--active': props.isOpen,\n };\n\n return (\n <button\n class={anchorClassList}\n onClick={props.open}\n onKeyPress={props.onTriggerPress}\n aria-haspopup=\"listbox\"\n aria-expanded={props.isOpen}\n aria-controls={props.id}\n aria-labelledby=\"s-label s-selected-text\"\n aria-required={props.required}\n disabled={props.disabled || props.readonly}\n >\n <span id=\"s-label\" class={labelClassList}>\n {props.label}\n </span>\n <span class=\"mdc-select__selected-text-container limel-select__selected-option\">\n {getSelectedIcon(props.value)}\n <span\n id=\"s-selected-text\"\n class=\"mdc-select__selected-text limel-select__selected-option__text\"\n >\n {getSelectedText(props.value, props.readonly)}\n </span>\n </span>\n <ShowIcon {...props} isValid={props.isValid} />\n <span class=\"mdc-select__dropdown-icon\">\n <svg\n class=\"mdc-select__dropdown-icon-graphic\"\n viewBox=\"7 10 10 5\"\n focusable=\"false\"\n >\n <polygon\n stroke=\"none\"\n fill-rule=\"evenodd\"\n points=\"7 10 12 15 17 10\"\n ></polygon>\n </svg>\n </span>\n </button>\n );\n};\n\nconst ShowIcon: FunctionalComponent<\n SelectTemplateProps & {\n isValid: boolean;\n }\n> = (props) => {\n if (props.isValid) {\n return;\n }\n\n return (\n <limel-icon name=\"high_importance\" size=\"medium\" class=\"invalid-icon\" />\n );\n};\n\nconst HelperText: FunctionalComponent<{ text: string; isValid: boolean }> = (\n props\n) => {\n if (typeof props.text !== 'string') {\n return;\n }\n\n return (\n <limel-helper-line\n helperText={props.text.trim()}\n invalid={!props.isValid}\n />\n );\n};\n\nconst SelectDropdown: FunctionalComponent<SelectTemplateProps> = (props) => {\n if (props.native) {\n return <NativeDropdown {...props} />;\n }\n\n return <MenuDropdown {...props} />;\n};\n\nconst MenuDropdown: FunctionalComponent<SelectTemplateProps> = (props) => {\n const items = createMenuItems(props.options, props.value, props.required);\n\n return (\n <limel-portal\n containerId={props.id}\n visible={props.isOpen}\n inheritParentWidth={true}\n containerStyle={{ 'z-index': props.dropdownZIndex }}\n >\n <limel-menu-surface\n open={props.isOpen}\n onDismiss={props.close}\n style={{\n '--mdc-menu-min-width': '100%',\n 'max-height': 'inherit',\n display: 'flex',\n 'min-width': '100%',\n width: 'fit-content',\n }}\n >\n <limel-list\n items={items}\n type={props.multiple ? 'checkbox' : 'selectable'}\n onChange={props.onMenuChange}\n />\n </limel-menu-surface>\n </limel-portal>\n );\n};\n\nconst NativeDropdown: FunctionalComponent<SelectTemplateProps> = (props) => {\n return (\n <select\n required={props.required}\n aria-disabled={props.disabled}\n aria-required={props.required}\n onChange={props.onNativeChange}\n onFocus={props.open}\n onBlur={props.close}\n class=\"limel-select__native-control\"\n disabled={props.disabled}\n multiple={props.multiple}\n >\n {props.options.map((option) => {\n return (\n <option\n key={option.value}\n value={option.value}\n selected={isSelected(option, props.value)}\n disabled={option.disabled}\n >\n {option.text}\n </option>\n );\n })}\n </select>\n );\n};\n\nfunction isSelected(option: Option, value: Option | Option[]): boolean {\n if (!value) {\n return false;\n }\n\n if (isMultiple(value)) {\n return value.some((o) => option.value === o.value);\n }\n\n return option.value === value.value;\n}\n\nfunction createMenuItems(\n options: Option[],\n value: Option | Option[],\n selectIsRequired = false\n): Array<ListItem<Option>> {\n const menuOptionFilter = getMenuOptionFilter(selectIsRequired);\n\n return options.filter(menuOptionFilter).map((option) => {\n const selected = isSelected(option, value);\n const { text, disabled } = option;\n\n return {\n text: text,\n selected: selected,\n disabled: disabled,\n value: option,\n icon: option.icon,\n iconColor: option.iconColor,\n };\n });\n}\n\nfunction getMenuOptionFilter(selectIsRequired: boolean) {\n return (option: Option) => {\n if (!selectIsRequired) {\n // If the select component is NOT required, we keep all options.\n return true;\n }\n\n if (option.text) {\n // If the select component IS required, we keep only options\n // that are not \"empty\". We only check the text property, because\n // some systems use an \"empty option\" that will have a value for\n // the `value` property, to signify \"no option selected\". Such\n // an option should be treated as \"empty\".\n return true;\n }\n };\n}\n\nfunction getSelectedText(value: Option | Option[], readonly: boolean): string {\n if ((!value || (isMultiple(value) && !value.length)) && readonly) {\n return '–';\n }\n\n if (!value) {\n return '';\n }\n\n if (isMultiple(value)) {\n return value.map((option) => option.text).join(', ');\n }\n\n return value.text;\n}\n\nfunction getSelectedIcon(value: any) {\n if (!value || !value.icon) {\n return '';\n }\n\n const style: any = {};\n if (value.iconColor) {\n style.color = value.iconColor;\n }\n\n return (\n <limel-icon\n class=\"limel-select__selected-option__icon\"\n name={value.icon}\n size=\"medium\"\n style={style}\n />\n );\n}\n"]}

package/dist/collection/components/shortcut/shortcut.js CHANGED Viewed

@@ -136,7 +136,7 @@ export class Shortcut {
         "reflect": true
       },
       "link": {
-        "type": "unknown",
+        "type": "any",
         "mutable": false,
         "complexType": {
           "original": "Link",
@@ -153,8 +153,11 @@ export class Shortcut {
         "docs": {
           "tags": [],
           "text": "If supplied, the shortcut will be a clickable link."
-        }
+        },
+        "attribute": "link",
+        "reflect": false
       }
     };
   }
 }
+//# sourceMappingURL=shortcut.js.map

package/dist/collection/components/shortcut/shortcut.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"shortcut.js","sourceRoot":"","sources":["../../../src/components/shortcut/shortcut.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAGnD;;;;;;;;;;;;GAYG;AAOH,MAAM,OAAO,QAAQ;;IAiDT,gBAAW,GAAG,GAAG,EAAE;MACvB,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAO,2BAAkB,MAAM,IAAE,IAAI,CAAC,KAAK,CAAQ,CAAC;OACvD;IACL,CAAC,CAAC;IAEM,iBAAY,GAAG,GAAG,EAAE;;MACxB,IAAI,IAAI,CAAC,KAAK,KAAI,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,CAAA,EAAE;QAChC,OAAO,IAAI,CAAC,KAAK,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;OAC9C;MAED,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAO,IAAI,CAAC,KAAK,CAAC;OACrB;MAED,IAAI,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,EAAE;QAClB,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;OAC1B;MAED,OAAO,SAAS,CAAC;IACrB,CAAC,CAAC;IAEM,uBAAkB,GAAG,GAAG,EAAE;MAC9B,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAO,mBAAa,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CAAC;OAC7C;IACL,CAAC,CAAC;;iBAhEsB,IAAI;oBAMA,KAAK;;;;EAe1B,MAAM;;IACT,OAAO;MACH,0BACmB,IAAI,CAAC,QAAQ,EAC5B,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,EACrB,MAAM,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,MAAM,EACzB,QAAQ,EAAC,GAAG,gBACA,IAAI,CAAC,YAAY,EAAE,EAC/B,KAAK,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK;QAEvB,kBAAY,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CAC/B;MACJ,IAAI,CAAC,WAAW,EAAE;MAClB,IAAI,CAAC,kBAAkB,EAAE;KAC5B,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BJ","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { Link } from '@limetech/lime-elements';\n\n/**\n * This component can be used on places such as a start page or a dashboard.\n * Clicking on the component should navigate the user to a new screen,\n * to which you need to provide a URL, by specifying an `href` for the `link` property.\n *\n * By default, this navigation will happen within the same browser tab.\n * However, it is possible to override that behavior, by specifying a `target`\n * for the `link` property\n * @exampleComponent limel-example-shortcut\n * @exampleComponent limel-example-shortcut-notification\n * @exampleComponent limel-example-shortcut-styling\n * @exampleComponent limel-example-shortcut-with-click-handler\n */\n\n@Component({\n tag: 'limel-shortcut',\n shadow: true,\n styleUrl: 'shortcut.scss',\n})\nexport class Shortcut {\n /**\n * Name of icon for the shortcut.\n */\n @Prop({ reflect: true })\n public icon: string;\n\n /**\n * The text to show below the shortcut. Long label will be truncated.\n */\n @Prop({ reflect: true })\n public label?: string = null;\n\n /**\n * Set to `true` if shortcut is disabled.\n */\n @Prop({ reflect: true })\n public disabled?: boolean = false;\n\n /**\n * If specified, will display a notification badge\n * on the shortcut.\n */\n @Prop({ reflect: true })\n public badge?: number | string;\n\n /**\n * If supplied, the shortcut will be a clickable link.\n */\n @Prop()\n public link?: Link;\n\n public render() {\n return [\n <a\n aria-disabled={this.disabled}\n href={this.link?.href}\n target={this.link?.target}\n tabindex=\"0\"\n aria-label={this.getAriaLabel()}\n title={this.link?.title}\n >\n <limel-icon name={this.icon} />\n </a>,\n this.renderLabel(),\n this.renderNotification(),\n ];\n }\n\n private renderLabel = () => {\n if (this.label) {\n return <span aria-hidden=\"true\">{this.label}</span>;\n }\n };\n\n private getAriaLabel = () => {\n if (this.label && this.link?.title) {\n return this.label + '. ' + this.link.title;\n }\n\n if (this.label) {\n return this.label;\n }\n\n if (this.link?.title) {\n return this.link.title;\n }\n\n return undefined;\n };\n\n private renderNotification = () => {\n if (this.badge) {\n return <limel-badge label={this.badge} />;\n }\n };\n}\n"]}

package/dist/collection/components/slider/getPercentageClass.js CHANGED Viewed

@@ -40,3 +40,4 @@ export function getPercentageClass(value) {
   }
   return 'percent-90-100';
 }
+//# sourceMappingURL=getPercentageClass.js.map

package/dist/collection/components/slider/getPercentageClass.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"getPercentageClass.js","sourceRoot":"","sources":["../../../src/components/slider/getPercentageClass.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,kBAAkB,CAAC,KAAa;EAC5C,MAAM,UAAU,GAAG,GAAG,CAAC;EACvB,MAAM,aAAa,GAAG,GAAG,CAAC;EAC1B,MAAM,aAAa,GAAG,GAAG,CAAC;EAC1B,MAAM,YAAY,GAAG,GAAG,CAAC;EACzB,MAAM,YAAY,GAAG,GAAG,CAAC;EACzB,MAAM,YAAY,GAAG,GAAG,CAAC;EACzB,MAAM,cAAc,GAAG,GAAG,CAAC;EAC3B,MAAM,aAAa,GAAG,GAAG,CAAC;EAC1B,MAAM,aAAa,GAAG,GAAG,CAAC;EAE1B,IAAI,KAAK,KAAK,CAAC,EAAE;IACb,OAAO,WAAW,CAAC;GACtB;EAED,IAAI,KAAK,GAAG,UAAU,EAAE;IACpB,OAAO,cAAc,CAAC;GACzB;EAED,IAAI,KAAK,GAAG,aAAa,EAAE;IACvB,OAAO,eAAe,CAAC;GAC1B;EAED,IAAI,KAAK,GAAG,aAAa,EAAE;IACvB,OAAO,eAAe,CAAC;GAC1B;EAED,IAAI,KAAK,GAAG,YAAY,EAAE;IACtB,OAAO,eAAe,CAAC;GAC1B;EAED,IAAI,KAAK,GAAG,YAAY,EAAE;IACtB,OAAO,eAAe,CAAC;GAC1B;EAED,IAAI,KAAK,GAAG,YAAY,EAAE;IACtB,OAAO,eAAe,CAAC;GAC1B;EAED,IAAI,KAAK,GAAG,cAAc,EAAE;IACxB,OAAO,eAAe,CAAC;GAC1B;EAED,IAAI,KAAK,GAAG,aAAa,EAAE;IACvB,OAAO,eAAe,CAAC;GAC1B;EAED,IAAI,KAAK,GAAG,aAAa,EAAE;IACvB,OAAO,eAAe,CAAC;GAC1B;EAED,OAAO,gBAAgB,CAAC;AAC5B,CAAC","sourcesContent":["export function getPercentageClass(value: number) {\n const tenPercent = 0.1;\n const twentyPercent = 0.2;\n const thirtyPercent = 0.3;\n const fortyPercent = 0.4;\n const fiftyPercent = 0.5;\n const sixtyPercent = 0.6;\n const seventyPercent = 0.7;\n const eightyPercent = 0.8;\n const ninetyPercent = 0.9;\n\n if (value === 0) {\n return 'percent-0';\n }\n\n if (value < tenPercent) {\n return 'percent-0-10';\n }\n\n if (value < twentyPercent) {\n return 'percent-10-20';\n }\n\n if (value < thirtyPercent) {\n return 'percent-20-30';\n }\n\n if (value < fortyPercent) {\n return 'percent-30-40';\n }\n\n if (value < fiftyPercent) {\n return 'percent-40-50';\n }\n\n if (value < sixtyPercent) {\n return 'percent-50-60';\n }\n\n if (value < seventyPercent) {\n return 'percent-60-70';\n }\n\n if (value < eightyPercent) {\n return 'percent-70-80';\n }\n\n if (value < ninetyPercent) {\n return 'percent-80-90';\n }\n\n return 'percent-90-100';\n}\n"]}

package/dist/collection/components/slider/slider.js CHANGED Viewed

@@ -432,3 +432,4 @@ export class Slider {
       }];
   }
 }
+//# sourceMappingURL=slider.js.map

package/dist/collection/components/slider/slider.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { MDCSlider } from '@material/slider';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { getPercentageClass } from './getPercentageClass';\n/**\n * @exampleComponent limel-example-slider\n * @exampleComponent limel-example-slider-multiplier\n * @exampleComponent limel-example-slider-multiplier-percentage-colors\n * @exampleComponent limel-example-slider-composite\n */\n@Component({\n tag: 'limel-slider',\n shadow: true,\n styleUrl: 'slider.scss',\n})\nexport class Slider {\n /**\n * Disables the slider when `true`,\n * and visually shows that the field is editable but disabled.\n * This tells the users that if certain requirements are met,\n * the slider may become interactable.\n */\n @Prop({ reflect: true })\n public disabled = false;\n\n /**\n * Disables the slider when `true`. This visualizes the slider slightly differently.\n * But shows no visual sign indicating that the slider field\n * is disabled or can ever become interactable.\n */\n @Prop({ reflect: true })\n public readonly = false;\n\n /**\n * Default value: 1.\n * The factor that the properties `value`, `valuemax`, `valuemin`, and\n * `step` are multiplied by. On `change` divides the value by the factor,\n * so the original format stays the same.\n */\n @Prop({ reflect: true })\n public factor: number = 1;\n\n /**\n * Label to display next to the input\n */\n @Prop({ reflect: true })\n public label: string;\n\n /**\n * Optional helper text to display below the slider\n */\n @Prop({ reflect: true })\n public helperText: string;\n\n /**\n * Unit to display next to the value\n */\n @Prop({ reflect: true })\n public unit: string = '';\n\n /**\n * The value of the input\n */\n @Prop({ reflect: true })\n public value: number;\n\n /**\n * The maximum value allowed\n */\n @Prop({ reflect: true })\n public valuemax: number = 100; // eslint-disable-line no-magic-numbers\n\n /**\n * The minimum value allowed\n */\n @Prop({ reflect: true })\n public valuemin: number = 0;\n\n /**\n * The stepping interval to use when adjusting the value\n */\n @Prop({ reflect: true })\n public step: number;\n\n /**\n * Emitted when the value has been changed\n */\n @Event()\n private change: EventEmitter<number>;\n\n @Element()\n private rootElement: HTMLLimelSliderElement;\n\n private mdcSlider: MDCSlider;\n\n @State()\n private percentageClass: string;\n\n public constructor() {\n this.inputHandler = this.inputHandler.bind(this);\n this.getContainerClassList = this.getContainerClassList.bind(this);\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n private initialize() {\n const inputElement = this.getInputElement();\n if (!inputElement) {\n return;\n }\n\n const value = this.getValue();\n\n /*\n For some reason the input element's `value` attribute is removed\n (probably by Stencil) when the element is first rendered. But if the\n attribute is missing when MDCSlider is initialized (MDC v11.0.0),\n MDCSlider crashes.\n So we add the attribute right before initializing MDCSlider. /Ads\n */\n inputElement.setAttribute('value', `${this.multiplyByFactor(value)}`);\n\n /*\n When creating the `mdcSlider` component, its important that the value set in\n the input field obeys the range and the step size.\n\n The MDCSlider will throw an exception unless the value in the input element\n is dividible by the step value and is in the provided range.\n If an exception occurs, this component will crash and it will be impossible to change\n its value.\n The logic below ensures that the component will render even though the\n provided value is wrong.\n This could be considered wrong, but it at least fixes so that it's possible\n to change the value from the UI.\n */\n const greaterThanOrEqualMin = value >= this.valuemin;\n const lessThanOrEqualMax = value <= this.valuemax;\n\n if (!greaterThanOrEqualMin) {\n const newMin = this.multiplyByFactor(value);\n inputElement.setAttribute('min', `${newMin}`);\n }\n\n if (!lessThanOrEqualMax) {\n const newMax = this.multiplyByFactor(value);\n inputElement.setAttribute('max', `${newMax}`);\n }\n\n if (!this.isMultipleOfStep(value, this.step)) {\n inputElement.removeAttribute('step');\n }\n\n this.createMDCSlider();\n }\n\n public componentWillLoad() {\n this.setPercentageClass(this.value);\n }\n\n public disconnectedCallback() {\n this.destroyMDCSlider();\n }\n\n private getContainerClassList() {\n return {\n [this.percentageClass]: true,\n disabled: this.disabled || this.readonly,\n readonly: this.readonly,\n };\n }\n\n public render() {\n const inputProps: any = {};\n if (this.step) {\n inputProps.step = this.multiplyByFactor(this.step);\n }\n\n if (this.disabled || this.readonly) {\n inputProps.disabled = true;\n }\n\n return (\n <Host class={this.getContainerClassList()}>\n <label class=\"slider__label mdc-floating-label mdc-floating-label--float-above\">\n {this.label}\n </label>\n <div class=\"slider__content-range-container\">\n <span class=\"slider__content-min-label\">\n {this.multiplyByFactor(this.valuemin)}\n {this.unit}\n </span>\n <span class=\"slider__content-max-label\">\n {this.multiplyByFactor(this.valuemax)}\n {this.unit}\n </span>\n </div>\n <div\n class={{\n 'mdc-slider': true,\n 'mdc-slider--discrete': true,\n 'mdc-slider--disabled': this.disabled || this.readonly,\n }}\n >\n <input\n class=\"mdc-slider__input\"\n type=\"range\"\n min={this.multiplyByFactor(this.valuemin)}\n max={this.multiplyByFactor(this.valuemax)}\n value={this.multiplyByFactor(this.value)}\n name=\"volume\"\n aria-label=\"Discrete slider demo\"\n {...inputProps}\n />\n <div class=\"mdc-slider__track\">\n <div class=\"mdc-slider__track--inactive\"></div>\n <div class=\"mdc-slider__track--active\">\n <div class=\"mdc-slider__track--active_fill\"></div>\n </div>\n </div>\n <div class=\"mdc-slider__thumb\">\n <div\n class=\"mdc-slider__value-indicator-container\"\n aria-hidden=\"true\"\n >\n <div class=\"mdc-slider__value-indicator\">\n <span class=\"mdc-slider__value-indicator-text\">\n {this.multiplyByFactor(this.value)}\n </span>\n </div>\n </div>\n <div class=\"mdc-slider__thumb-knob\"></div>\n </div>\n </div>\n {this.renderHelperLine()}\n </Host>\n );\n }\n\n private renderHelperLine() {\n if (!this.helperText) {\n return;\n }\n\n return <limel-helper-line helperText={this.helperText} />;\n }\n\n @Watch('disabled')\n protected watchDisabled() {\n this.updateDisabledState();\n }\n\n @Watch('readonly')\n protected watchReadonly() {\n this.updateDisabledState();\n }\n\n @Watch('value')\n protected watchValue() {\n if (!this.mdcSlider) {\n return;\n }\n\n const value = this.multiplyByFactor(this.getValue());\n this.mdcSlider.setValue(value);\n\n if (this.isStepConfigured()) {\n return;\n }\n\n const step = this.multiplyByFactor(this.step);\n if (!this.isMultipleOfStep(value, step)) {\n return;\n }\n\n this.reCreateSliderWithStep();\n }\n\n private updateDisabledState() {\n if (!this.mdcSlider) {\n return;\n }\n\n this.mdcSlider.setDisabled(this.disabled || this.readonly);\n }\n\n private changeHandler = (event) => {\n let value = event.detail.value;\n const step = this.multiplyByFactor(this.step);\n\n if (!this.isMultipleOfStep(value, step)) {\n value = this.roundToStep(value, step);\n }\n\n this.change.emit(value / this.factor);\n };\n\n private multiplyByFactor(value) {\n return Math.round(value * this.factor);\n }\n\n private getValue() {\n let value = this.value;\n if (!isFinite(value)) {\n value = this.valuemin;\n }\n\n return value;\n }\n\n private inputHandler(event) {\n this.setPercentageClass(event.detail.value / this.factor);\n }\n\n private setPercentageClass(value) {\n this.percentageClass = getPercentageClass(\n (value - this.valuemin) / (this.valuemax - this.valuemin)\n );\n }\n\n private isMultipleOfStep(value: number, step: number): boolean {\n if (!step) {\n return true;\n }\n\n return value % step === 0;\n }\n\n private roundToStep(value: number, step: number): number {\n return Math.round(value / step) * step;\n }\n\n private getRootElement(): HTMLElement | undefined {\n return this.rootElement.shadowRoot.querySelector('.mdc-slider');\n }\n\n private getInputElement(): HTMLInputElement | undefined {\n const element = this.getRootElement();\n if (!element) {\n return;\n }\n\n return element.querySelector('input');\n }\n\n private isStepConfigured(): boolean {\n if (!this.step) {\n return true;\n }\n\n const input = this.getInputElement();\n if (!input) {\n return true;\n }\n\n return input.hasAttribute('step');\n }\n\n private reCreateSliderWithStep() {\n const inputElement = this.getInputElement();\n const step = `${this.multiplyByFactor(this.step)}`;\n\n inputElement.setAttribute('step', step);\n\n this.destroyMDCSlider();\n this.createMDCSlider();\n }\n\n private createMDCSlider() {\n const element = this.getRootElement();\n\n this.mdcSlider = new MDCSlider(element);\n this.mdcSlider.listen('MDCSlider:change', this.changeHandler);\n this.mdcSlider.listen('MDCSlider:input', this.inputHandler);\n }\n\n private destroyMDCSlider() {\n this.mdcSlider.unlisten('MDCSlider:change', this.changeHandler);\n this.mdcSlider.unlisten('MDCSlider:input', this.inputHandler);\n this.mdcSlider.destroy();\n this.mdcSlider = undefined;\n }\n}\n"]}

package/dist/collection/components/snackbar/snackbar.js CHANGED Viewed

@@ -206,11 +206,11 @@ export class Snackbar {
         "reflect": false
       },
       "language": {
-        "type": "string",
+        "type": "any",
         "mutable": false,
         "complexType": {
           "original": "Languages",
-          "resolved": "\"da\" | \"de\" | \"en\" | \"fi\" | \"fr\" | \"nb\" | \"nl\" | \"no\" | \"sv\"",
+          "resolved": "Languages",
           "references": {
             "Languages": {
               "location": "import",
@@ -285,3 +285,4 @@ export class Snackbar {
   }
   static get elementRef() { return "host"; }
 }
+//# sourceMappingURL=snackbar.js.map

package/dist/collection/components/snackbar/snackbar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"snackbar.js","sourceRoot":"","sources":["../../../src/components/snackbar/snackbar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Languages } from '@limetech/lime-elements';\nimport { MDCSnackbar, MDCSnackbarCloseEvent } from '@material/snackbar';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Method,\n Prop,\n} from '@stencil/core';\nimport translate from '../../global/translations';\n\n/**\n * A Snackbar –also known as \"Toast\"– is used to inform the end user\n * about an action or a process in the system.\n * The information could vary from announcing that a process has just started,\n * is taking place now, has ended, or has been interrupted or canceled.\n *\n * The information that you provide using a snackbar should be:\n * - temporary\n * - contextual\n * - short\n * - and most importantly, ignorable.\n *\n * It means if the user misses the information, it shouldn't be a big deal.\n *\n * :::note\n * If the information you want to display has a higher importance or priority,\n * and you need to make sure that the user takes an action to dismiss it,\n * consider using the [Banner](/#/component/limel-banner/) component instead.\n * For more complex interactions and for delivering more detailed information,\n * [Dialog](/#/component/limel-dialog/) is a better choice.\n * :::\n * @exampleComponent limel-example-snackbar\n * @exampleComponent limel-example-snackbar-dismissible\n * @exampleComponent limel-example-snackbar-with-action\n * @exampleComponent limel-example-snackbar-with-changing-messages\n * @exampleComponent limel-example-snackbar-positioning\n */\n\n@Component({\n tag: 'limel-snackbar',\n shadow: true,\n styleUrl: 'snackbar.scss',\n})\nexport class Snackbar {\n /**\n * The text message to display.\n */\n @Prop()\n public message: string;\n\n /**\n * The amount of time in milliseconds to show the snackbar.\n */\n @Prop()\n // eslint-disable-next-line no-magic-numbers\n public timeout?: number = 5000;\n\n /**\n * The text to display for the action button.\n */\n @Prop()\n public actionText: string;\n\n /**\n * When `true` displays a dismiss button on the snackbar,\n * allowing users to close it.\n */\n @Prop()\n public dismissible: boolean = true;\n\n /**\n * Whether to show the snackbar with space for multiple lines of text\n */\n @Prop()\n public multiline: boolean;\n\n /**\n * Defines the language for translations.\n */\n @Prop()\n public language: Languages = 'en';\n\n @Element()\n private host: HTMLLimelSnackbarElement;\n\n /**\n * Emitted when the action button is pressed\n */\n @Event()\n private action: EventEmitter<void>;\n\n /**\n * Emitted when the snackbar hides itself\n */\n @Event()\n private hide: EventEmitter<void>;\n\n private mdcSnackbar: MDCSnackbar;\n\n constructor() {\n this.handleMdcClosing = this.handleMdcClosing.bind(this);\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n private initialize() {\n const element = this.host.shadowRoot.querySelector('.mdc-snackbar');\n if (!element) {\n return;\n }\n\n this.mdcSnackbar = new MDCSnackbar(element);\n\n this.mdcSnackbar.listen('MDCSnackbar:closing', this.handleMdcClosing);\n }\n\n public disconnectedCallback() {\n this.mdcSnackbar.unlisten('MDCSnackbar:closing', this.handleMdcClosing);\n this.mdcSnackbar.destroy();\n }\n\n /**\n * Show the snackbar\n */\n @Method()\n public async show() {\n if (this.timeout) {\n this.mdcSnackbar.timeoutMs = this.timeout;\n }\n\n this.mdcSnackbar.labelText = this.message;\n\n this.mdcSnackbar.open();\n }\n\n public render() {\n return (\n <aside\n class={`\n mdc-snackbar\n ${this.multiline ? 'mdc-snackbar--stacked' : ''}\n `}\n style={{\n '--snackbar-timeout': `${this.timeout}ms`,\n }}\n >\n <div\n class=\"mdc-snackbar__surface\"\n role=\"status\"\n aria-relevant=\"additions\"\n >\n <div class=\"mdc-snackbar__label\" aria-atomic=\"false\"></div>\n {this.renderActions(this.actionText, this.dismissible)}\n </div>\n </aside>\n );\n }\n\n private handleMdcClosing(event: MDCSnackbarCloseEvent) {\n if (event.detail.reason === 'action') {\n this.action.emit();\n } else {\n this.hide.emit();\n }\n }\n\n private renderActions(actionText: string, dismissible: boolean) {\n if (!actionText && !dismissible) {\n return;\n }\n\n return (\n <div class=\"mdc-snackbar__actions\" aria-atomic=\"true\">\n {this.renderActionButton(actionText)}\n {this.renderDismissButton(dismissible)}\n </div>\n );\n }\n\n private renderActionButton(actionText: string) {\n if (!actionText) {\n return;\n }\n\n return (\n <limel-button\n class=\"mdc-button mdc-snackbar__action\"\n label={actionText}\n />\n );\n }\n\n private renderDismissButton(dismissible: boolean) {\n if (!dismissible) {\n return;\n }\n\n const label = translate.get('snackbar.dismiss', this.language);\n\n return (\n <div class=\"dismiss\">\n {this.renderTimeoutVisualization()}\n <limel-icon-button\n class=\"mdc-icon-button mdc-snackbar__dismiss\"\n icon=\"multiply\"\n label={label}\n />\n </div>\n );\n }\n\n private renderTimeoutVisualization() {\n return (\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\">\n <circle r=\"18\" cx=\"18\" cy=\"18\" fill=\"var(--track-color)\" />\n <path\n class=\"track\"\n d=\"M 18,18 m -16,0 a 16,16 0 1,0 32,0 a 16,16 0 1,0 -32,0\"\n stroke=\"var(--fill-color)\"\n />\n </svg>\n );\n }\n}\n"]}

package/dist/collection/components/spinner/spinner.js CHANGED Viewed

@@ -35,11 +35,11 @@ export class Spinner {
   static get properties() {
     return {
       "size": {
-        "type": "string",
+        "type": "any",
         "mutable": false,
         "complexType": {
           "original": "SpinnerSize",
-          "resolved": "\"large\" | \"medium\" | \"mini\" | \"small\" | \"x-small\"",
+          "resolved": "SpinnerSize",
           "references": {
             "SpinnerSize": {
               "location": "import",
@@ -78,3 +78,4 @@ export class Spinner {
     };
   }
 }
+//# sourceMappingURL=spinner.js.map

package/dist/collection/components/spinner/spinner.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"spinner.js","sourceRoot":"","sources":["../../../src/components/spinner/spinner.tsx"],"names":[],"mappings":"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","sourcesContent":["import { SpinnerSize } from '@limetech/lime-elements';\nimport { Component, Prop, h } from '@stencil/core';\n\n/**\n * @exampleComponent limel-example-spinner\n * @exampleComponent limel-example-spinner-color\n * @exampleComponent limel-example-spinner-size\n */\n@Component({\n tag: 'limel-spinner',\n shadow: true,\n styleUrl: 'spinner.scss',\n})\nexport class Spinner {\n /**\n * Determines the size of the spinner.\n */\n @Prop({ reflect: true })\n public size: SpinnerSize = 'mini';\n\n /**\n * Gives the spinner the shape of Lime Technologies' logo\n */\n @Prop()\n public limeBranded: boolean = true;\n\n public render() {\n return [\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n {this.renderSpinner()}\n </svg>,\n ];\n }\n\n private renderSpinner() {\n if (!this.limeBranded) {\n return (\n <g>\n <circle class=\"outline\" cx=\"12\" cy=\"12\" r=\"10\" />\n <g class=\"spinner\">\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n <circle class=\"color\" cx=\"12\" cy=\"12\" r=\"10\" />\n </g>\n </g>\n );\n }\n\n return (\n <g>\n <g clip-path=\"url(#mask)\">\n <circle class=\"outline thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <g class=\"spinner\">\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n <circle class=\"color thick\" cx=\"12\" cy=\"12\" r=\"12\" />\n </g>\n </g>\n <clipPath id=\"mask\">\n <path d=\"M2.166 11.248C2.166 5.04 7.058 0 13.083 0 19.108 0 24 5.04 24 11.248c0 3.229-1.307 6.548-4.533 9.306-3.908 3.343-9.15 3.8-17.254 3.249-2.405-.164-2.753-.588-1.51-1.533C4.61 19.3 2.165 17.025 2.165 11.248zm3.124 9.834c5.563.227 9.416-.246 12.397-2.76 2.432-2.05 3.482-4.56 3.51-7.074.05-4.613-3.636-8.36-8.114-8.36-4.478 0-8.114 3.746-8.114 8.36 0 2.793.607 4.737.726 6.345.092 1.252.03 2.388-.405 3.49z\" />\n </clipPath>\n </g>\n );\n }\n}\n"]}

package/dist/collection/components/spinner/spinner.types.js CHANGED Viewed

	@@ -1 +1,2 @@
1 1	export {};
2	+ //# sourceMappingURL=spinner.types.js.map

package/dist/collection/components/spinner/spinner.types.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"spinner.types.js","sourceRoot":"","sources":["../../../src/components/spinner/spinner.types.ts"],"names":[],"mappings":"","sourcesContent":["export type SpinnerSize = 'mini' \| 'x-small' \| 'small' \| 'medium' \| 'large';\n"]}

package/dist/collection/components/split-button/split-button.js CHANGED Viewed

@@ -124,7 +124,7 @@ export class SplitButton {
         "mutable": false,
         "complexType": {
           "original": "Array<MenuItem | ListSeparator>",
-          "resolved": "(MenuItem<any> | ListSeparator)[]",
+          "resolved": "any[]",
           "references": {
             "Array": {
               "location": "global"
@@ -162,7 +162,7 @@ export class SplitButton {
         },
         "complexType": {
           "original": "MenuItem",
-          "resolved": "MenuItem<any>",
+          "resolved": "MenuItem",
           "references": {
             "MenuItem": {
               "location": "import",
@@ -173,3 +173,4 @@ export class SplitButton {
       }];
   }
 }
+//# sourceMappingURL=split-button.js.map

package/dist/collection/components/split-button/split-button.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"split-button.js","sourceRoot":"","sources":["../../../src/components/split-button/split-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAG9E;;;;;;;;;;;;;;GAcG;AAMH,MAAM,OAAO,WAAW;;IAuDZ,eAAU,GAAG,GAAG,EAAE;MACtB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;QACpB,OAAO;OACV;MAED,OAAO,CACH,kBACI,KAAK,EAAE;UACH,OAAO,EAAE,IAAI,CAAC,OAAO;SACxB,EACD,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,aAAa,EAAC,QAAQ;QAEtB,cACI,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,SAAS,EACd,QAAQ,EAAE,IAAI,CAAC,QAAQ,aAGlB,CACA,CAChB,CAAC;IACN,CAAC,CAAC;;mBAnEe,KAAK;;oBAYJ,KAAK;iBAMyB,EAAE;;EAQlD,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IACD,KAAK,EAAE;QACH,UAAU,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM;OAClC;MAED,oBACI,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACzB;MACD,IAAI,CAAC,UAAU,EAAE,CACf,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BJ","sourcesContent":["import { Component, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { ListSeparator, MenuItem } from '@limetech/lime-elements';\n\n/**\n * A split button is a button with two components:\n * a button and a side-menu attached to it.\n *\n * Clicking on the button runs a default action,\n * and clicking on the arrow opens up a list of other possible actions.\n *\n * :::warning\n * - Never use a split button for navigation purposes, such as going to next page.\n * The button should only be used for performing commands!\n * - Never use this component instead of a Select or Menu component!\n * :::\n * @exampleComponent limel-example-split-button-basic\n * @exampleComponent limel-example-split-button-repeat-default-command\n */\n@Component({\n tag: 'limel-split-button',\n styleUrl: 'split-button.scss',\n shadow: true,\n})\nexport class SplitButton {\n /**\n * The text to show on the default action part of the button.\n */\n @Prop({ reflect: true })\n public label: string;\n\n /**\n * Set to `true` to make the button primary.\n */\n @Prop({ reflect: true })\n public primary = false;\n\n /**\n * Set icon for the button\n */\n @Prop({ reflect: true })\n public icon: string;\n\n /**\n * Set to `true` to disable the button.\n */\n @Prop({ reflect: true })\n public disabled = false;\n\n /**\n * A list of items and separators to show in the menu.\n */\n @Prop()\n public items: Array<MenuItem | ListSeparator> = [];\n\n /**\n * Is emitted when a menu item is selected.\n */\n @Event()\n public select: EventEmitter<MenuItem>;\n\n render() {\n return (\n <Host\n class={{\n 'has-menu': !!this.items.length,\n }}\n >\n <limel-button\n label={this.label}\n primary={this.primary}\n icon={this.icon}\n disabled={this.disabled}\n />\n {this.renderMenu()}\n </Host>\n );\n }\n\n private renderMenu = () => {\n if (!this.items.length) {\n return;\n }\n\n return (\n <limel-menu\n class={{\n primary: this.primary,\n }}\n disabled={this.disabled}\n items={this.items}\n openDirection=\"bottom\"\n >\n <button\n class=\"menu-trigger\"\n slot=\"trigger\"\n disabled={this.disabled}\n >\n ⋮\n </button>\n </limel-menu>\n );\n };\n}\n"]}

package/dist/collection/components/switch/switch.js CHANGED Viewed

@@ -168,3 +168,4 @@ export class Switch {
       }];
   }
 }
+//# sourceMappingURL=switch.js.map

package/dist/collection/components/switch/switch.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../src/components/switch/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EACH,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,KAAK,EACL,KAAK,GACR,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAE9D;;GAEG;AAMH,MAAM,OAAO,MAAM;;IA6HP,gBAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;MACxC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAClC,CAAC,CAAC;;oBAlHgB,KAAK;oBAQL,KAAK;iBAMR,KAAK;mBAYF,kBAAkB,EAAE;;EAI/B,iBAAiB;IACpB,IAAI,CAAC,UAAU,EAAE,CAAC;EACtB,CAAC;EAEM,gBAAgB;IACnB,IAAI,CAAC,UAAU,EAAE,CAAC;EACtB,CAAC;EAEO,UAAU;IACd,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAC9C,aAAa,CACK,CAAC;IACvB,IAAI,CAAC,OAAO,EAAE;MACV,OAAO;KACV;IAED,IAAI,CAAC,SAAS,GAAG,IAAI,SAAS,CAAC,OAAO,CAAC,CAAC;EAC5C,CAAC;EAEM,oBAAoB;;IACvB,MAAA,IAAI,CAAC,SAAS,0CAAE,OAAO,EAAE,CAAC;EAC9B,CAAC;EAEM,MAAM;IACT,OAAO;MACH,cACI,EAAE,EAAE,IAAI,CAAC,OAAO,EAChB,KAAK,EAAE;UACH,YAAY,EAAE,IAAI;UAClB,uBAAuB,EAAE,IAAI,CAAC,QAAQ;UACtC,wBAAwB,EAAE,CAAC,IAAI,CAAC,KAAK;UACrC,sBAAsB,EAAE,IAAI,CAAC,KAAK;SACrC,EACD,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,kBACC,IAAI,CAAC,KAAK,EACxB,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EACxC,OAAO,EAAE,IAAI,CAAC,WAAW;QAEzB,WAAK,KAAK,EAAC,mBAAmB,GAAG;QACjC,WAAK,KAAK,EAAC,0BAA0B;UACjC,WAAK,KAAK,EAAC,oBAAoB;YAC3B,WAAK,KAAK,EAAC,oBAAoB;cAC3B,WAAK,KAAK,EAAC,uBAAuB,GAAO,CACvC;YACN,WAAK,KAAK,EAAC,oBAAoB,GAAO;YACtC,WAAK,KAAK,EAAC,mBAAmB;cAC1B,WACI,KAAK,EAAC,uCAAuC,EAC7C,OAAO,EAAC,WAAW;gBAEnB,YAAM,CAAC,EAAC,qEAAqE,GAAG,CAC9E;cACN,WACI,KAAK,EAAC,wCAAwC,EAC9C,OAAO,EAAC,WAAW;gBAEnB,YAAM,CAAC,EAAC,mBAAmB,GAAG,CAC5B,CACJ,CACJ,CACJ,CACD;MACT,aACI,KAAK,EAAE,GAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,EAC5D,OAAO,EAAE,IAAI,CAAC,OAAO,IAEpB,IAAI,CAAC,KAAK,CACP;KACX,CAAC;EACN,CAAC;EAGS,YAAY,CAAC,QAAiB;IACpC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;MACjB,OAAO;KACV;IAED,IAAI,CAAC,SAAS,CAAC,QAAQ,GAAG,QAAQ,CAAC;EACvC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAMJ","sourcesContent":["import { MDCSwitch } from '@material/switch';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { createRandomString } from '../../util/random-string';\n\n/**\n * @exampleComponent limel-example-switch\n */\n@Component({\n tag: 'limel-switch',\n shadow: true,\n styleUrl: 'switch.scss',\n})\nexport class Switch {\n /**\n * Label to display next to the switch\n */\n @Prop({ reflect: true })\n public label: string;\n\n /**\n * Disables the switch when `true`,\n * and visually shows that the switch is editable but disabled.\n * This tells the users that if certain requirements are met,\n * the switch may become interactable.\n */\n @Prop({ reflect: true })\n public disabled = false;\n\n /**\n * Disables the switch when `true`. This visualizes the switch slightly differently.\n * But shows no visual sign indicating that the switch is disabled\n * or can ever become interactable.\n */\n @Prop({ reflect: true })\n public readonly = false;\n\n /**\n * The value of the switch\n */\n @Prop({ reflect: true })\n public value = false;\n\n /**\n * Emitted when the value has changed\n */\n @Event()\n private change: EventEmitter<boolean>;\n\n @Element()\n private host: HTMLLimelSwitchElement;\n\n @State()\n private fieldId = createRandomString();\n\n private mdcSwitch: MDCSwitch;\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n private initialize() {\n const element = this.host.shadowRoot.querySelector(\n '.mdc-switch'\n ) as HTMLButtonElement;\n if (!element) {\n return;\n }\n\n this.mdcSwitch = new MDCSwitch(element);\n }\n\n public disconnectedCallback() {\n this.mdcSwitch?.destroy();\n }\n\n public render() {\n return [\n <button\n id={this.fieldId}\n class={{\n 'mdc-switch': true,\n 'lime-switch--readonly': this.readonly,\n 'mdc-switch--unselected': !this.value,\n 'mdc-switch--selected': this.value,\n }}\n type=\"button\"\n role=\"switch\"\n aria-checked={this.value}\n disabled={this.disabled || this.readonly}\n onClick={this.handleClick}\n >\n <div class=\"mdc-switch__track\" />\n <div class=\"mdc-switch__handle-track\">\n <div class=\"mdc-switch__handle\">\n <div class=\"mdc-switch__shadow\">\n <div class=\"mdc-elevation-overlay\"></div>\n </div>\n <div class=\"mdc-switch__ripple\"></div>\n <div class=\"mdc-switch__icons\">\n <svg\n class=\"mdc-switch__icon mdc-switch__icon--on\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M19.69,5.23L8.96,15.96l-4.23-4.23L2.96,13.5l6,6L21.46,7L19.69,5.23z\" />\n </svg>\n <svg\n class=\"mdc-switch__icon mdc-switch__icon--off\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M20 13H4v-2h16v2z\" />\n </svg>\n </div>\n </div>\n </div>\n </button>,\n <label\n class={`${this.disabled || this.readonly ? 'disabled' : ''}`}\n htmlFor={this.fieldId}\n >\n {this.label}\n </label>,\n ];\n }\n\n @Watch('value')\n protected valueWatcher(newValue: boolean) {\n if (!this.mdcSwitch) {\n return;\n }\n\n this.mdcSwitch.selected = newValue;\n }\n\n private handleClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.change.emit(!this.value);\n };\n}\n"]}

package/dist/collection/components/tab-bar/tab-bar.js CHANGED Viewed

@@ -246,3 +246,4 @@ export class TabBar {
       }];
   }
 }
+//# sourceMappingURL=tab-bar.js.map

package/dist/collection/components/tab-bar/tab-bar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"tab-bar.js","sourceRoot":"","sources":["../../../src/components/tab-bar/tab-bar.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Listen,\n Prop,\n Element,\n EventEmitter,\n Event,\n State,\n Watch,\n} from '@stencil/core';\nimport { MDCTabBar, MDCTabBarActivatedEvent } from '@material/tab-bar';\nimport { strings } from '@material/tab-bar/constants';\nimport { Tab } from './tab.types';\nimport { isEqual, difference } from 'lodash-es';\nimport { setActiveTab } from './tabs';\n\nconst { TAB_ACTIVATED_EVENT } = strings;\nconst SCROLL_DISTANCE_ON_CLICK_PX = 150;\nconst HIDE_SCROLL_BUTTONS_WHEN_SCROLLED_LESS_THAN_PX = 40;\n\n/**\n * Tabs are great to organize information hierarchically in the interface and divide it into distinct categories. Using tabs, you can create groups of content that are related and at the same level in the hierarchy.\n * :::warning\n * Tab bars should be strictly used for navigation at the top levels.\n * They should never be used to perform actions, or navigate away from the view which contains them.\n * :::\n * An exception for using tab bars in a high level of hierarchy is their usage in modals. This is because modals are perceived as a separate place and not a part of the current context. Therefore you can use tab bars in a modal to group and organize its content.\n * A tab bar can contain an unlimited number of tabs. However, depending on the device width and width of the tabs, the number of tabs that are visible at the same time will vary. When there is limited horizontal space, the component shows a left-arrow and/or right-arrow button, which scrolls and reveals the additional tabs. The tab bar can also be swiped left and right on a touch-device.\n * :::tip Other things to consider\n * Never divide the content of a tab using a nested tab bar.\n * Never place two tab bars within the same screen.\n * Never use background color for icons in tabs.\n * Avoid having long labels for tabs.\n * A tab will never be removed or get disabled, even if there is no content under it.\n * :::\n * @exampleComponent limel-example-tab-bar\n * @exampleComponent limel-example-tab-bar-with-dynamic-tab-width\n * @exampleComponent limel-example-tab-bar-with-equal-tab-width\n */\n@Component({\n tag: 'limel-tab-bar',\n styleUrl: 'tab-bar.scss',\n shadow: true,\n})\nexport class TabBar {\n /**\n * List of tabs to display\n */\n @Prop({ mutable: true })\n public tabs: Tab[] = [];\n\n /**\n * Emitted when a tab has been changed\n */\n @Event()\n private changeTab: EventEmitter<Tab>;\n\n @Element()\n private host: HTMLLimelTabBarElement;\n\n @State()\n private canScrollLeft = false;\n\n @State()\n private canScrollRight = false;\n\n private mdcTabBar: MDCTabBar;\n private setupMdc = false;\n private scrollArea: HTMLElement;\n private scrollContent: HTMLElement;\n\n constructor() {\n this.handleTabActivated = this.handleTabActivated.bind(this);\n this.handleScroll = this.handleScroll.bind(this);\n this.handleLeftScrollClick = this.handleLeftScrollClick.bind(this);\n this.handleRightScrollClick = this.handleRightScrollClick.bind(this);\n this.renderTab = this.renderTab.bind(this);\n }\n\n public connectedCallback() {\n this.setup();\n }\n\n public componentDidLoad() {\n this.setup();\n }\n\n public componentDidUpdate() {\n if (!this.setupMdc) {\n return;\n }\n\n this.setup();\n this.setupMdc = false;\n }\n\n public disconnectedCallback() {\n this.tearDown();\n }\n\n public render() {\n return (\n <div class=\"mdc-tab-bar\" role=\"tablist\">\n <div\n class={{\n 'mdc-tab-scroller': true,\n 'can-scroll-left': this.canScrollLeft,\n 'can-scroll-right': this.canScrollRight,\n }}\n >\n <div class=\"mdc-tab-scroller__scroll-area lime-hide-scrollbars\">\n <div class=\"mdc-tab-scroller__scroll-content\">\n {this.tabs.map(this.renderTab)}\n </div>\n </div>\n <div class=\"scroll-fade left\" />\n <div class=\"scroll-button left\">\n <limel-icon-button\n icon=\"angle_left\"\n elevated={true}\n tabindex=\"-1\"\n aria-hidden=\"true\"\n disabled={!this.canScrollLeft}\n onClick={this.handleLeftScrollClick}\n />\n </div>\n <div class=\"scroll-fade right\" />\n <div class=\"scroll-button right\">\n <limel-icon-button\n icon=\"angle_right\"\n elevated={true}\n tabindex=\"-1\"\n aria-hidden=\"true\"\n disabled={!this.canScrollRight}\n onClick={this.handleRightScrollClick}\n />\n </div>\n </div>\n </div>\n );\n }\n\n @Watch('tabs')\n protected tabsChanged(newTabs: Tab[] = [], oldTabs: Tab[] = []) {\n const newIds = newTabs.map((tab) => tab.id);\n const oldIds = oldTabs.map((tab) => tab.id);\n\n if (isEqual(newIds, oldIds)) {\n return;\n }\n\n this.setupMdc = true;\n this.tearDown();\n }\n\n @Listen('resize', { passive: true, target: 'window' })\n protected handleWindowResize() {\n this.handleScroll();\n }\n\n private setup() {\n const element = this.host.shadowRoot.querySelector('.mdc-tab-bar');\n if (!element) {\n return;\n }\n\n this.mdcTabBar = new MDCTabBar(element);\n this.mdcTabBar.focusOnActivate = true;\n this.mdcTabBar.useAutomaticActivation = true;\n this.scrollArea = element.querySelector(\n '.mdc-tab-scroller__scroll-area'\n );\n this.scrollContent = element.querySelector(\n '.mdc-tab-scroller__scroll-content'\n );\n\n this.setupListeners();\n\n // Use timeout to avoid Stencil warning about re-renders. /Ads\n setTimeout(this.handleScroll, 0);\n }\n\n private tearDown() {\n if (this.scrollArea) {\n this.scrollArea.removeEventListener('scroll', this.handleScroll);\n }\n\n if (this.mdcTabBar) {\n this.mdcTabBar.unlisten(\n TAB_ACTIVATED_EVENT,\n this.handleTabActivated\n );\n this.mdcTabBar.destroy();\n }\n }\n\n private setupListeners() {\n this.mdcTabBar.listen(TAB_ACTIVATED_EVENT, this.handleTabActivated);\n this.scrollArea.addEventListener('scroll', this.handleScroll, {\n passive: true,\n });\n }\n\n private handleTabActivated(event: MDCTabBarActivatedEvent) {\n const index = event.detail.index;\n const newTabs = setActiveTab(this.tabs, index);\n\n difference(newTabs, this.tabs)\n .sort(this.sortByInactive)\n .forEach((tab: Tab) => {\n this.changeTab.emit(tab);\n });\n\n this.tabs = newTabs;\n }\n\n private sortByInactive(a: Tab, b: Tab) {\n return Number(a.active) - Number(b.active);\n }\n\n private handleScroll() {\n const scrollLeft = this.scrollArea.scrollLeft;\n const scrollRight = Math.floor(\n this.scrollContent.getBoundingClientRect().width -\n this.scrollArea.getBoundingClientRect().width -\n scrollLeft\n );\n\n if (scrollLeft > HIDE_SCROLL_BUTTONS_WHEN_SCROLLED_LESS_THAN_PX) {\n this.canScrollLeft = true;\n } else {\n this.canScrollLeft = false;\n }\n\n if (scrollRight > HIDE_SCROLL_BUTTONS_WHEN_SCROLLED_LESS_THAN_PX) {\n this.canScrollRight = true;\n } else {\n this.canScrollRight = false;\n }\n }\n\n private handleLeftScrollClick() {\n this.scrollArea.scroll({\n left: this.scrollArea.scrollLeft - SCROLL_DISTANCE_ON_CLICK_PX,\n behavior: 'smooth',\n });\n }\n\n private handleRightScrollClick() {\n this.scrollArea.scroll({\n left: this.scrollArea.scrollLeft + SCROLL_DISTANCE_ON_CLICK_PX,\n behavior: 'smooth',\n });\n }\n\n private renderIcon(tab: Tab) {\n if (!tab.icon) {\n return;\n }\n\n const style = { color: '' };\n\n if (tab.iconColor) {\n style.color = tab.iconColor;\n }\n\n return (\n <limel-icon\n class=\"mdc-tab__icon\"\n name={tab.icon}\n style={style}\n size=\"small\"\n aria-hidden=\"true\"\n />\n );\n }\n\n private renderTab(tab: Tab) {\n return (\n <button\n class={{\n 'mdc-tab': true,\n 'mdc-tab--active': !!tab.active,\n }}\n role=\"tab\"\n aria-selected={tab.active ? 'true' : 'false'}\n tabindex={tab.active ? 0 : -1}\n >\n <span class=\"mdc-tab__content\">\n {this.renderIcon(tab)}\n <span class=\"mdc-tab__text-label\">{tab.text}</span>\n {tab.badge ? <limel-badge label={tab.badge} /> : ''}\n </span>\n <span\n class={{\n 'mdc-tab-indicator': true,\n 'mdc-tab-indicator--active': !!tab.active,\n }}\n >\n <span class=\"mdc-tab-indicator__content mdc-tab-indicator__content--underline\" />\n </span>\n <span class=\"mdc-tab__ripple\" />\n </button>\n );\n }\n}\n"]}

package/dist/collection/components/tab-bar/tab.types.js CHANGED Viewed

	@@ -1 +1,2 @@
1 1	export {};
2	+ //# sourceMappingURL=tab.types.js.map

package/dist/collection/components/tab-bar/tab.types.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"tab.types.js","sourceRoot":"","sources":["../../../src/components/tab-bar/tab.types.ts"],"names":[],"mappings":"","sourcesContent":["export interface Tab {\n /**\n * Id of the tab. Must be unique.\n */\n id: number | string;\n\n /**\n * Text to display inside the tab.\n */\n text?: string;\n\n /**\n * Name of the icon to use.\n */\n icon?: string;\n\n /**\n * True if the tab should be selected.\n */\n active?: boolean;\n\n /**\n * Color of the icon.\n */\n iconColor?: string;\n\n /**\n * Shows a badge within the tab with a specified label\n */\n badge?: number | string;\n}\n"]}

package/dist/collection/components/tab-bar/tabs.js CHANGED Viewed

@@ -14,3 +14,4 @@ export function setActiveTab(tabs, index) {
   result[index] = Object.assign(Object.assign({}, tabs[index]), { active: true });
   return result;
 }
+//# sourceMappingURL=tabs.js.map

package/dist/collection/components/tab-bar/tabs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tab-bar/tabs.ts"],"names":[],"mappings":"AAEA;;;;;;GAMG;AACH,MAAM,UAAU,YAAY,CAAC,IAAW,EAAE,KAAa;EACnD,MAAM,mBAAmB,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,CAAC;EACrE,MAAM,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,CAAC;EAEzB,IAAI,mBAAmB,KAAK,CAAC,CAAC,EAAE;IAC5B,MAAM,CAAC,mBAAmB,CAAC,mCACpB,IAAI,CAAC,mBAAmB,CAAC,KAC5B,MAAM,EAAE,KAAK,GAChB,CAAC;GACL;EAED,MAAM,CAAC,KAAK,CAAC,mCAAQ,IAAI,CAAC,KAAK,CAAC,KAAE,MAAM,EAAE,IAAI,GAAE,CAAC;EAEjD,OAAO,MAAM,CAAC;AAClB,CAAC","sourcesContent":["import { Tab } from './tab.types';\n\n/**\n * Set a tabs `active` state to true in a list of tabs. The previous tab with\n * `active` set to true will have it set to `false` instead.\n * @param {Tab[]} tabs list of tabs\n * @param {number} index the index of the tab to set to active\n * @returns {Tab[]} a copy of the list of tabs with the changed tabs replaced\n */\nexport function setActiveTab(tabs: Tab[], index: number): Tab[] {\n const oldSelectedTabIndex = tabs.findIndex((t) => t.active === true);\n const result = [...tabs];\n\n if (oldSelectedTabIndex !== -1) {\n result[oldSelectedTabIndex] = {\n ...tabs[oldSelectedTabIndex],\n active: false,\n };\n }\n\n result[index] = { ...tabs[index], active: true };\n\n return result;\n}\n"]}

package/dist/collection/components/tab-panel/tab-panel.js CHANGED Viewed

@@ -159,3 +159,4 @@ export class TabPanel {
       }];
   }
 }
+//# sourceMappingURL=tab-panel.js.map

package/dist/collection/components/tab-panel/tab-panel.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"tab-panel.js","sourceRoot":"","sources":["../../../src/components/tab-panel/tab-panel.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n h,\n Prop,\n EventEmitter,\n Event,\n Host,\n Watch,\n} from '@stencil/core';\nimport { Tab } from '../tab-bar/tab.types';\nimport { dispatchResizeEvent } from '../../util/dispatch-resize-event';\n\n/**\n * The `limel-tab-panel` component uses the `limel-tab-bar` component together\n * with custom slotted components and will display the content for the currently\n * active tab. Each slotted component must have an id equal to the id of the\n * corresponding tab it belongs to. These components should implement the\n * [TabPanelComponent](#/type/TabPanelComponent/) interface.\n *\n * The `limel-tab-panel` component will automatically set each tab configuration\n * on the corresponding slotted component as a property named `tab` so that the\n * component can take action upon that. Sometimes it might be desirable to not\n * load data or render anything until the tab is active.\n *\n * The slotted components can also emit the `changeTab` event to update anything\n * inside the actual tab, e.g. to change the icon, color or badge.\n * @slot - Content to put inside the `limel-tab-panel`. Each slotted element\n * must have the `id` attribute equal to the id of the tab it belongs to.\n * @exampleComponent limel-example-tab-panel\n */\n@Component({\n tag: 'limel-tab-panel',\n styleUrl: 'tab-panel.scss',\n shadow: true,\n})\nexport class TabPanel {\n /**\n * The tabs to display in the panel\n */\n @Prop({ mutable: true })\n public tabs: Tab[] = [];\n\n /**\n * Emitted when a tab has been changed\n */\n @Event()\n protected changeTab: EventEmitter<Tab>;\n\n @Element()\n private host: HTMLLimelTabPanelElement;\n\n private slotElements: HTMLElement[] = [];\n\n constructor() {\n this.handleChangeTabs = this.handleChangeTabs.bind(this);\n this.setSlotElements = this.setSlotElements.bind(this);\n this.setTabStatus = this.setTabStatus.bind(this);\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n private initialize() {\n const slot = this.getSlot();\n if (!slot) {\n return;\n }\n\n slot.addEventListener('slotchange', this.setSlotElements);\n this.setSlotElements();\n this.tabs.forEach(this.setTabStatus);\n }\n\n public disconnectedCallback() {\n const slot = this.getSlot();\n slot.removeEventListener('slotchange', this.setSlotElements);\n }\n\n @Watch('tabs')\n public tabsChanged() {\n this.hidePanels();\n this.tabs.forEach(this.setTabStatus);\n }\n\n public render() {\n return (\n <Host onChangeTab={this.handleChangeTabs}>\n <div class=\"tab-panel\">\n <limel-tab-bar tabs={this.tabs} />\n <div class=\"tab-content\">\n <slot />\n </div>\n </div>\n </Host>\n );\n }\n\n private setSlotElements() {\n const slot = this.getSlot();\n this.hidePanels();\n this.slotElements = [].slice.call(slot.assignedElements());\n this.tabs.forEach(this.setTabStatus);\n }\n\n private setTabStatus(tab: Tab) {\n const element = this.slotElements.find((e) => e.id === tab.id);\n if (!element) {\n return;\n }\n\n if (tab.active) {\n element.style.display = '';\n } else {\n element.style.display = 'none';\n }\n\n element['tab'] = tab; // eslint-disable-line @typescript-eslint/dot-notation\n }\n\n private handleChangeTabs(event: CustomEvent<Tab>) {\n this.tabs = this.tabs.map((tab) => {\n if (tab.id === event.detail.id) {\n return event.detail;\n }\n\n return tab;\n });\n\n this.setTabStatus(event.detail);\n\n // Content inside the newly activated tab may need to redraw once\n // visible, so we use the resize event trick. /Ads\n setTimeout(dispatchResizeEvent);\n }\n\n private getSlot(): HTMLSlotElement {\n return this.host.shadowRoot.querySelector('slot');\n }\n\n private hidePanels() {\n this.slotElements.forEach((element) => {\n element.style.display = 'none';\n });\n }\n}\n"]}

package/dist/collection/components/tab-panel/tab-panel.types.js CHANGED Viewed

	@@ -1 +1,2 @@
1 1	export {};
2	+ //# sourceMappingURL=tab-panel.types.js.map

package/dist/collection/components/tab-panel/tab-panel.types.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"tab-panel.types.js","sourceRoot":"","sources":["../../../src/components/tab-panel/tab-panel.types.ts"],"names":[],"mappings":"","sourcesContent":["import { EventEmitter } from '@stencil/core';\nimport { Tab } from '../tab-bar/tab.types';\n\n/**\n * Interface for components rendered inside a `limel-tab-panel`\n */\nexport interface TabPanelComponent {\n /**\n * The tab that the component belongs to\n */\n tab: Tab;\n\n /**\n * Emit when the tab is updated for some reason, e.g. changing the text,\n * icon or badge\n */\n changeTab?: EventEmitter<Tab>;\n}\n"]}

package/dist/collection/components/table/columns.js CHANGED Viewed

@@ -210,3 +210,4 @@ export function getColumnAggregator(column) {
 function isAggregatorFunction(value) {
   return typeof value === 'function';
 }
+//# sourceMappingURL=columns.js.map

package/dist/collection/components/table/columns.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"columns.js","sourceRoot":"","sources":["../../../src/components/table/columns.ts"],"names":[],"mappings":"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","sourcesContent":["import { Column, ColumnSorter, ColumnAggregatorFunction } from './table.types';\nimport Tabulator from 'tabulator-tables';\nimport { escape } from 'html-escaper';\nimport { ElementPool } from './element-pool';\nimport { pickBy, negate } from 'lodash-es';\n\nexport class ColumnDefinitionFactory {\n constructor(private pool: ElementPool) {\n this.create = this.create.bind(this);\n }\n\n /**\n * Create Tabulator column definitions from a limel-table column configuration\n * @param {Column} column config describing the column\n * @returns {Tabulator.ColumnDefinition} Tabulator column\n */\n public create(column: Column<object>): Tabulator.ColumnDefinition {\n const definition: Tabulator.ColumnDefinition = {\n title: column.title,\n field: column.field,\n hozAlign: column.horizontalAlign,\n headerSort: column.headerSort,\n };\n\n if (column.headerComponent) {\n definition.titleFormatter = formatHeader(column);\n }\n\n if (column.component?.name || column.formatter) {\n definition.formatter = createFormatter(column, this.pool);\n definition.formatterParams = column as object;\n }\n\n if (column.aggregator) {\n definition.bottomCalc = getColumnAggregator(column);\n }\n\n return definition;\n }\n}\n\n/**\n * Formats the header of the column\n * @param {Column} column the configuration for the column\n * @returns {string | HTMLElement} custom component that renders a column header\n */\nexport const formatHeader = (column: Column) => (): string | HTMLElement => {\n const headerElement = document.createElement('div');\n headerElement.setAttribute('class', 'lime-col-title__custom-component');\n\n const titleElement = document.createElement('span');\n titleElement.setAttribute('class', 'title-component-text');\n titleElement.innerText = column.title;\n\n const customElement = document.createElement(column.headerComponent.name);\n customElement.setAttribute('class', 'title-component-slot');\n\n let props: object = column.headerComponent.props || {};\n if (column.headerComponent.propsFactory) {\n props = {\n ...props,\n // we pass null to propsFactory function because no data in column header\n ...column.headerComponent.propsFactory(null),\n };\n }\n\n setElementProperties(customElement, props);\n\n headerElement.appendChild(titleElement);\n headerElement.appendChild(customElement);\n\n return headerElement;\n};\n\n/**\n * Create a formatter to be used to format values in a column\n * @param {Column} column config describing the column\n * @param {ElementPool} pool pool to get custom components from\n * @returns {Tabulator.Formatter} Tabulator formatter\n */\nexport function createFormatter(\n column: Column,\n pool: ElementPool\n): Tabulator.Formatter {\n if (!column.component?.name) {\n return formatCell;\n }\n\n if (!columnElementExists(column)) {\n // eslint-disable-next-line no-console\n console.warn(\n `Failed to render custom component for column \"${column.field.toString()}\". Custom element <${\n column.component.name\n }/> does not exist. Using the default formatter.`\n );\n\n return formatCell;\n }\n\n return (cell: Tabulator.CellComponent) => {\n const value = formatCell(cell, column);\n\n return createCustomComponent(cell, column, value, pool);\n };\n}\n\nfunction columnElementExists(column: Column<any>) {\n const name = column.component.name;\n if (typeof name === 'string') {\n const isNativeElement = !name.includes('-');\n const customElementExists = customElements.get(column.component.name);\n\n return isNativeElement || customElementExists;\n } else {\n return false;\n }\n}\n\n/**\n * Format the value of a cell in the table\n * @param {Tabulator.CellComponent} cell the cell being rendered in the table\n * @param {Column} column configuration for the current column\n * @returns {string} the formatted value\n */\nexport function formatCell(\n cell: Tabulator.CellComponent,\n column: Column\n): string {\n const data = cell.getData();\n let value = cell.getValue();\n\n if (column.formatter) {\n value = column.formatter(value, data);\n }\n\n if (typeof value === 'string' && !column.component) {\n value = escape(value);\n }\n\n return value;\n}\n\n/**\n * Create a custom component that renders a cell value\n * @param {Tabulator.CellComponent} cell Tabulator cell\n * @param {Column} column lime-elements column configuration\n * @param {string} value the value of the cell being rendered\n * @param {ElementPool} pool pool to get custom components from\n * @returns {HTMLElement} custom component that renders a value in the table\n */\nexport function createCustomComponent(\n cell: Tabulator.CellComponent,\n column: Column,\n value: string,\n pool: ElementPool\n): HTMLElement {\n const field = cell.getField();\n const data = cell.getData();\n\n const element = pool.get(column.component.name);\n let props: object = column.component.props || {};\n if (column.component.propsFactory) {\n props = {\n ...props,\n ...column.component.propsFactory(data),\n };\n }\n\n props = {\n ...props,\n field: field,\n value: value,\n data: data,\n };\n\n element.style.display = 'inline-block';\n setElementProperties(element, props);\n\n createResizeObserver(element, cell.getColumn());\n\n return element;\n}\n\n/**\n * Set all properties for a custom element, including event listeners\n * @param {HTMLElement} element the custom element\n * @param {object} props object of properties and event listeners\n */\nexport function setElementProperties(element: HTMLElement, props: object) {\n const properties = pickBy(props, negate(isEventListener));\n Object.assign(element, properties);\n\n const listeners = pickBy(props, isEventListener);\n Object.entries(listeners).forEach(([key, value]) => {\n const event = getEventName(key);\n element.addEventListener(event, value as any);\n });\n}\n\n/**\n * Check if a property is an event listener.\n *\n * An event listener has to be a function and its property name have to start\n * with \"on\" followed by the name of the event in camel case, e.g. \"onEventName\"\n * @param {any} value the value to check\n * @param {string} key name of the property\n * @returns {boolean} true if the property of the object is an event listener\n */\nfunction isEventListener(value: any, key: string): boolean {\n if (typeof value !== 'function') {\n return false;\n }\n\n return /^on[A-Z]/.test(key);\n}\n\n/**\n * Get the name of an event from the name of an event listener\n *\n * E.g. \"onMyEvent\" will return \"myEvent\"\n * @param {string} eventListener name of the event listener\n * @returns {string} the name of the event\n */\nfunction getEventName(eventListener: string): string {\n // eslint-disable-next-line no-magic-numbers\n return eventListener.charAt(2).toLowerCase() + eventListener.slice(3);\n}\n\nfunction createResizeObserver(\n element: HTMLElement,\n column: Tabulator.ColumnComponent\n) {\n if (!('ResizeObserver' in window)) {\n return;\n }\n\n const RESIZE_TIMEOUT = 1000;\n const COLUMN_PADDING = 16;\n\n const observer = new ResizeObserver(() => {\n const width = element.getBoundingClientRect().width;\n const newWidth = width + COLUMN_PADDING;\n\n if (newWidth < column.getWidth()) {\n return;\n }\n\n column.setWidth(newWidth);\n });\n observer.observe(element);\n\n // We give the component some time to resize itself before we\n // stop listening for resize events\n setTimeout(() => {\n observer.unobserve(element);\n }, RESIZE_TIMEOUT);\n}\n\n// Tabulator seems to also have this `field` property, that does not appear on\n// the interface for some reason\ninterface TabulatorSorter extends Tabulator.Sorter {\n field: string;\n}\n\n/**\n * Create a column sorter from a tabulator sorter\n * @param {Column[]} columns all available columns in the table\n * @returns {Function} function that creates a sorter from a tabulator sorter\n */\nexport const createColumnSorter =\n (columns: Column[]) =>\n (sorter: TabulatorSorter): ColumnSorter => {\n const column = columns.find((col) => col.field === sorter.field);\n const direction = sorter.dir.toUpperCase() as 'ASC' | 'DESC';\n\n return {\n column: column,\n direction: direction,\n };\n };\n\nexport function getColumnAggregator(column: Column): Tabulator.ColumnCalc {\n const aggregator = column.aggregator;\n if (isAggregatorFunction(aggregator)) {\n return (values: any[], data: object[]) => {\n return aggregator(column, values, data);\n };\n }\n\n return aggregator;\n}\n\nfunction isAggregatorFunction(value: any): value is ColumnAggregatorFunction {\n return typeof value === 'function';\n}\n"]}

package/dist/collection/components/table/element-pool.js CHANGED Viewed

@@ -50,3 +50,4 @@ export class ElementPool {
     return element;
   }
 }
+//# sourceMappingURL=element-pool.js.map

package/dist/collection/components/table/element-pool.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"element-pool.js","sourceRoot":"","sources":["../../../src/components/table/element-pool.ts"],"names":[],"mappings":"AAAA,MAAM,OAAO,WAAW;EAKpB,YAAY,QAAkB;IAsBtB,WAAM,GAAG,CAAC,OAAoB,EAAE,EAAE;MACtC,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IAC3C,CAAC,CAAC;IAvBE,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;IACzB,IAAI,CAAC,UAAU,EAAE,CAAC;IAClB,IAAI,CAAC,KAAK,EAAE,CAAC;EACjB,CAAC;EAED;;;;KAIG;EACI,GAAG,CAAC,IAAY;;IACnB,IAAI,OAAO,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,0CAAE,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACjD,IAAI,CAAC,OAAO,EAAE;MACV,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;KACtC;IAED,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IAErC,OAAO,OAAO,CAAC;EACnB,CAAC;EAMD;;;KAGG;EACI,OAAO,CAAC,OAAoB;IAC/B,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;EACtC,CAAC;EAED;;KAEG;EACI,UAAU;IACb,IAAI,CAAC,YAAY,GAAG,IAAI,OAAO,EAAE,CAAC;EACtC,CAAC;EAED;;;KAGG;EACI,KAAK;IACR,IAAI,CAAC,IAAI,GAAG,EAAE,CAAC;EACnB,CAAC;EAEO,aAAa,CAAC,IAAY;IAC9B,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAClD,IAAI,CAAC,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,EAAE;MACtB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC;KACxB;IAED,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAE9B,OAAO,OAAO,CAAC;EACnB,CAAC;CACJ","sourcesContent":["export class ElementPool {\n private pool: Record<string, HTMLElement[]>;\n private usedElements: WeakMap<Element, boolean>;\n private document: Document;\n\n constructor(document: Document) {\n this.document = document;\n this.releaseAll();\n this.clear();\n }\n\n /**\n * Get an element from the pool\n * @param {string} name tag name of the element\n * @returns {HTMLElement} the element\n */\n public get(name: string): HTMLElement {\n let element = this.pool[name]?.find(this.isFree);\n if (!element) {\n element = this.createElement(name);\n }\n\n this.usedElements.set(element, true);\n\n return element;\n }\n\n private isFree = (element: HTMLElement) => {\n return !this.usedElements.has(element);\n };\n\n /**\n * Release an element from the pool so that it can be reused\n * @param {HTMLElement} element the element to release from the pool\n */\n public release(element: HTMLElement): void {\n this.usedElements.delete(element);\n }\n\n /**\n * Release all elements from the pool so that they can be reused\n */\n public releaseAll() {\n this.usedElements = new WeakMap();\n }\n\n /**\n * Remove all elements from the pool and makes them available for garbage\n * collection\n */\n public clear() {\n this.pool = {};\n }\n\n private createElement(name: string) {\n const element = this.document.createElement(name);\n if (!(name in this.pool)) {\n this.pool[name] = [];\n }\n\n this.pool[name].push(element);\n\n return element;\n }\n}\n"]}

package/dist/collection/components/table/layout.js CHANGED Viewed

@@ -6,3 +6,4 @@ export function mapLayout(layout) {
   };
   return layouts[layout] || 'fitDataFill';
 }
+//# sourceMappingURL=layout.js.map

package/dist/collection/components/table/layout.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"layout.js","sourceRoot":"","sources":["../../../src/components/table/layout.ts"],"names":[],"mappings":"AAMA,MAAM,UAAU,SAAS,CAAC,MAAc;EACpC,MAAM,OAAO,GAAG;IACZ,iBAAiB,EAAE,gBAAgB;IACnC,cAAc,EAAE,YAAY;IAC5B,UAAU,EAAE,SAAS;GACxB,CAAC;EAEF,OAAO,OAAO,CAAC,MAAM,CAAC,IAAI,aAAa,CAAC;AAC5C,CAAC","sourcesContent":["export type Layout =\n | 'default'\n | 'stretchLastColumn'\n | 'stretchColumns'\n | 'lowDensity';\n\nexport function mapLayout(layout: Layout) {\n const layouts = {\n stretchLastColumn: 'fitDataStretch',\n stretchColumns: 'fitColumns',\n lowDensity: 'fitData',\n };\n\n return layouts[layout] || 'fitDataFill';\n}\n"]}

package/dist/collection/components/table/selection.js CHANGED Viewed

@@ -105,3 +105,4 @@ export class Selection {
     this.lastToggledIndex = -1;
   }
 }
+//# sourceMappingURL=selection.js.map

package/dist/collection/components/table/selection.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"selection.js","sourceRoot":"","sources":["../../../src/components/table/selection.ts"],"names":[],"mappings":"AAkBA;;;;;GAKG;AACH,MAAM,OAAO,SAAS;EAIlB;;;;;;KAMG;EACH,YAAoB,cAA+B;IAA/B,mBAAc,GAAd,cAAc,CAAiB;IAqE3C,gBAAW,GAAG,CAClB,SAAiB,EACjB,OAAe,EACG,EAAE;MACpB,MAAM,MAAM,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;MAErE,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;MAChD,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;MAChD,MAAM,cAAc,GAAG,EAAE,CAAC;MAC1B,MAAM,YAAY,GAAG,EAAE,CAAC;MACxB,KAAK,IAAI,KAAK,GAAG,UAAU,EAAE,KAAK,IAAI,UAAU,EAAE,KAAK,EAAE,EAAE;QACvD,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;QAExC,IAAI,CAAC,IAAI,EAAE;UACP,SAAS;SACZ;QAED,MAAM,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QAEhD,IAAI,UAAU,KAAK,MAAM,EAAE;UACvB,SAAS;SACZ;QAED,IAAI,MAAM,EAAE;UACR,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;SAChC;aAAM;UACH,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;SACnC;QAED,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3B,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;OAC3B;MAED,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC;MAEhC,OAAO;QACH,QAAQ,EAAE,MAAM;QAChB,KAAK,EAAE,YAAY;QACnB,OAAO,EAAE,cAAc;OAC1B,CAAC;IACN,CAAC,CAAC;IA5GE,IAAI,CAAC,KAAK,EAAE,CAAC;EACjB,CAAC;EAED;;KAEG;EACH,IAAI,IAAI;IACJ,OAAO,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;EACnC,CAAC;EAED;;KAEG;EACH,IAAI,KAAK;IACL,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;EAC1C,CAAC;EAED;;KAEG;EACH,IAAI,KAAK,CAAC,KAAY;IAClB,IAAI,CAAC,aAAa,GAAG,IAAI,GAAG,CAAC,KAAK,CAAC,CAAC;IACpC,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC,CAAC;EAC/B,CAAC;EAED;;;;KAIG;EACI,GAAG,CAAC,IAAS;IAChB,OAAO,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;EACxC,CAAC;EAED;;;;KAIG;EACI,eAAe,CAAC,KAAa;IAChC,OAAO,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;EAC1C,CAAC;EAED;;;;;;;;KAQG;EACI,4BAA4B,CAAC,KAAa;IAC7C,IAAI,IAAI,CAAC,gBAAgB,GAAG,CAAC,EAAE;MAC3B,OAAO,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;KACtC;IAED,OAAO,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;EAC1D,CAAC;EAED;;KAEG;EACI,KAAK;IACR,IAAI,CAAC,aAAa,GAAG,IAAI,GAAG,EAAE,CAAC;IAC/B,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC,CAAC;EAC/B,CAAC;CA2CJ","sourcesContent":["/**\n * Contains changes made to a selection\n */\nexport interface SelectionChangeSet {\n /**\n * Tells whether the items were selected or deselected\n */\n selected: boolean;\n /**\n * Gets the affected items\n */\n items: any[];\n /**\n * Gets the indexes of the affected items\n */\n indexes: number[];\n}\n\n/**\n * Contains a set of selected data objects with methods for adding and removing\n * items to the selection by referring to them by their index/position.\n * Maintains a memory of the last toggled item which can be used to select or\n * deselect a range of items between the last toggled item and a given item.\n */\nexport class Selection {\n private selectedItems: Set<any>;\n private lastToggledIndex: number;\n\n /**\n * Creates an instance of the Selection class.\n * The provided function `getDataByIndex` is used to provide data for the\n * selected items when selection is toggled by using the item index,\n * which can be the row position in a table.\n * @param {Function} getDataByIndex A function that returns the data at the given index\n */\n constructor(private getDataByIndex: (number) => any) {\n this.clear();\n }\n\n /**\n * @returns {number} The size of the selection\n */\n get size(): number {\n return this.selectedItems.size;\n }\n\n /**\n * @returns {any[]} The selected items\n */\n get items(): any[] {\n return Array.from(this.selectedItems);\n }\n\n /**\n * @param {any[]} items The selected items\n */\n set items(items: any[]) {\n this.selectedItems = new Set(items);\n this.lastToggledIndex = -1;\n }\n\n /**\n * Checks whether the given item exist in the selection\n * @param {any} data The data to look up\n * @returns {boolean} `true` if the given data exist in the selection, otherwise `false`\n */\n public has(data: any) {\n return this.selectedItems.has(data);\n }\n\n /**\n * Toggles the item at the given index in the selection\n * @param {number} index The index of the item to toggle\n * @returns {SelectionChangeSet} The changes made to the selection\n */\n public toggleSelection(index: number): SelectionChangeSet {\n return this.toggleRange(index, index);\n }\n\n /**\n * Toggles the items from the last toggled index to the given index in the selection.\n * The toggled items will be toggled as the item at the given index no matter\n * their current state in the selection.\n * Initially, when no last toggled index exist, this function behaves like\n * `toggleSelection`.\n * @param {number} index The index of the item to toggle\n * @returns {SelectionChangeSet} The changes made to the selection\n */\n public toggleSelectionFromLastIndex(index: number): SelectionChangeSet {\n if (this.lastToggledIndex < 0) {\n return this.toggleSelection(index);\n }\n\n return this.toggleRange(this.lastToggledIndex, index);\n }\n\n /**\n * Clears the current selection and resets last toggled index\n */\n public clear() {\n this.selectedItems = new Set();\n this.lastToggledIndex = -1;\n }\n\n private toggleRange = (\n fromIndex: number,\n toIndex: number\n ): SelectionChangeSet => {\n const select = !this.selectedItems.has(this.getDataByIndex(toIndex));\n\n const lowerBound = Math.min(fromIndex, toIndex);\n const upperBound = Math.max(fromIndex, toIndex);\n const updatedIndexes = [];\n const updatedItems = [];\n for (let index = lowerBound; index <= upperBound; index++) {\n const data = this.getDataByIndex(index);\n\n if (!data) {\n continue;\n }\n\n const isSelected = this.selectedItems.has(data);\n\n if (isSelected === select) {\n continue;\n }\n\n if (select) {\n this.selectedItems.add(data);\n } else {\n this.selectedItems.delete(data);\n }\n\n updatedIndexes.push(index);\n updatedItems.push(data);\n }\n\n this.lastToggledIndex = toIndex;\n\n return {\n selected: select,\n items: updatedItems,\n indexes: updatedIndexes,\n };\n };\n}\n"]}