npm - @limetech/lime-elements - Versions diffs - 38.42.0 → 38.44.0 - Mend

@limetech/lime-elements 38.42.0 → 38.44.0

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 (31) hide show

package/CHANGELOG.md +14 -0
package/dist/cjs/lime-elements.cjs.js +1 -1
package/dist/cjs/limel-chart.cjs.entry.js +5 -2
package/dist/cjs/limel-chart.cjs.entry.js.map +1 -1
package/dist/cjs/limel-slider.cjs.entry.js +2 -0
package/dist/cjs/limel-slider.cjs.entry.js.map +1 -1
package/dist/cjs/loader.cjs.js +1 -1
package/dist/collection/components/chart/chart.css +181 -0
package/dist/collection/components/chart/chart.js +40 -1
package/dist/collection/components/chart/chart.js.map +1 -1
package/dist/collection/components/slider/slider.js +20 -0
package/dist/collection/components/slider/slider.js.map +1 -1
package/dist/esm/lime-elements.js +1 -1
package/dist/esm/limel-chart.entry.js +5 -2
package/dist/esm/limel-chart.entry.js.map +1 -1
package/dist/esm/limel-slider.entry.js +2 -0
package/dist/esm/limel-slider.entry.js.map +1 -1
package/dist/esm/loader.js +1 -1
package/dist/lime-elements/lime-elements.esm.js +1 -1
package/dist/lime-elements/lime-elements.esm.js.map +1 -1
package/dist/lime-elements/p-08c6b70d.entry.js +2 -0
package/dist/lime-elements/p-08c6b70d.entry.js.map +1 -0
package/dist/lime-elements/{p-2356b938.entry.js → p-758a9a1c.entry.js} +2 -2
package/dist/lime-elements/p-758a9a1c.entry.js.map +1 -0
package/dist/types/components/chart/chart.d.ts +14 -0
package/dist/types/components/slider/slider.d.ts +6 -0
package/dist/types/components.d.ts +24 -0
package/package.json +1 -1
package/dist/lime-elements/p-2356b938.entry.js.map +0 -1
package/dist/lime-elements/p-7d107fba.entry.js +0 -2
package/dist/lime-elements/p-7d107fba.entry.js.map +0 -1

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

	@@ -1 +1 @@
1	- {"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { MDCSlider, MDCSliderChangeEventDetail } 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 './get-percentage-class';\nimport { createRandomString } from '../../util/random-string';\n\nconst DEFAULT_FACTOR = 1;\nconst DEFAULT_MAX_VALUE = 100;\nconst DEFAULT_MIN_VALUE = 0;\n\n/*\n @exampleComponent limel-example-slider-basic\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 = DEFAULT_FACTOR;\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 Set to `true` to indicate that the slider is required.\n /\n @Prop({ reflect: true })\n public required = false;\n\n /\n Set to `true` to indicate that the current value of the slider is invalid.\n /\n @Prop({ reflect: true })\n public invalid = false;\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 = DEFAULT_MAX_VALUE;\n\n /\n The minimum value allowed\n /\n @Prop({ reflect: true })\n public valuemin: number = DEFAULT_MIN_VALUE;\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 @State()\n private percentageClass: string;\n\n private mdcSlider: MDCSlider;\n private labelId: string;\n private helperTextId: string;\n private observer: ResizeObserver;\n\n public constructor() {\n this.labelId = createRandomString();\n this.helperTextId = createRandomString();\n }\n\n public connectedCallback() {\n this.initialize();\n this.observer = new ResizeObserver(this.resizeObserverCallback);\n this.observer.observe(this.rootElement);\n }\n\n public componentWillLoad() {\n this.setPercentageClass(this.value);\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n public disconnectedCallback() {\n this.destroyMDCSlider();\n this.observer.disconnect();\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 <limel-notched-outline\n labelId={this.labelId}\n label={this.label}\n required={this.required}\n invalid={this.invalid}\n disabled={this.disabled}\n readonly={this.readonly}\n hasValue={!!this.value}\n hasFloatingLabel={true}\n >\n <div slot=\"content\">\n {this.renderRangeContainer()}\n {this.renderSliderContainer(inputProps)}\n </div>\n </limel-notched-outline>\n {this.renderHelperLine()}\n </Host>\n );\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 renderRangeContainer = () => {\n return (\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 );\n };\n\n private renderSliderContainer = (inputProps: any) => {\n return (\n <div\n class={{\n 'mdc-slider': true,\n 'mdc-slider--discrete': true,\n 'mdc-slider--disabled': this.disabled \|\| this.readonly,\n }}\n >\n {this.renderSliderInput(inputProps)}\n {this.renderTrack()}\n {this.renderThumb()}\n </div>\n );\n };\n\n private renderSliderInput = (inputProps: any) => {\n return (\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-labelledby={this.labelId}\n aria-describedby={\n this.helperText ? this.helperTextId : undefined\n }\n aria-controls={this.helperText ? this.helperTextId : undefined}\n {...inputProps}\n />\n );\n };\n\n private renderTrack = () => {\n return (\n <div class=\"mdc-slider__track\">\n <div class=\"mdc-slider__track--inactive\" />\n <div class=\"mdc-slider__track--active\">\n <div class=\"mdc-slider__track--active_fill\" />\n </div>\n </div>\n );\n };\n\n private renderThumb = () => {\n return (\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\" />\n </div>\n );\n };\n\n private renderHelperLine = () => {\n if (!this.helperText) {\n return;\n }\n\n return (\n <limel-helper-line\n helperText={this.helperText}\n helperTextId={this.helperTextId}\n invalid={this.invalid}\n />\n );\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 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 private changeHandler = (\n event: CustomEvent<MDCSliderChangeEventDetail>\n ) => {\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 inputHandler = (event: CustomEvent<MDCSliderChangeEventDetail>) => {\n this.setPercentageClass(event.detail.value / this.factor);\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 private resizeObserverCallback = () => {\n this.mdcSlider?.layout();\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 multiplyByFactor = (value: number) => {\n return Math.round(value this.factor);\n };\n\n private getValue = () => {\n let value = this.value;\n if (!Number.isFinite(value)) {\n value = this.valuemin;\n }\n\n return value;\n };\n\n private setPercentageClass = (value: number) => {\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"]}
1	+ {"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { MDCSlider, MDCSliderChangeEventDetail } 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 './get-percentage-class';\nimport { createRandomString } from '../../util/random-string';\n\nconst DEFAULT_FACTOR = 1;\nconst DEFAULT_MAX_VALUE = 100;\nconst DEFAULT_MIN_VALUE = 0;\n\n/*\n @exampleComponent limel-example-slider-basic\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 = DEFAULT_FACTOR;\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 Set to `true` to indicate that the slider is required.\n /\n @Prop({ reflect: true })\n public required = false;\n\n /\n Set to `true` to indicate that the current value of the slider is invalid.\n /\n @Prop({ reflect: true })\n public invalid = false;\n\n /\n Set to `true` to display percentage-based colors on the slider.\n * The colors change in intervals of 10% as the value changes,\n * creating a color spectrum from red (low) → orange → yellow → green → teal (high).\n /\n @Prop({ reflect: true })\n public displaysPercentageColors = false;\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 = DEFAULT_MAX_VALUE;\n\n /\n The minimum value allowed\n /\n @Prop({ reflect: true })\n public valuemin: number = DEFAULT_MIN_VALUE;\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 @State()\n private percentageClass: string;\n\n private mdcSlider: MDCSlider;\n private labelId: string;\n private helperTextId: string;\n private observer: ResizeObserver;\n\n public constructor() {\n this.labelId = createRandomString();\n this.helperTextId = createRandomString();\n }\n\n public connectedCallback() {\n this.initialize();\n this.observer = new ResizeObserver(this.resizeObserverCallback);\n this.observer.observe(this.rootElement);\n }\n\n public componentWillLoad() {\n this.setPercentageClass(this.value);\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n public disconnectedCallback() {\n this.destroyMDCSlider();\n this.observer.disconnect();\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 <limel-notched-outline\n labelId={this.labelId}\n label={this.label}\n required={this.required}\n invalid={this.invalid}\n disabled={this.disabled}\n readonly={this.readonly}\n hasValue={!!this.value}\n hasFloatingLabel={true}\n >\n <div slot=\"content\">\n {this.renderRangeContainer()}\n {this.renderSliderContainer(inputProps)}\n </div>\n </limel-notched-outline>\n {this.renderHelperLine()}\n </Host>\n );\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 renderRangeContainer = () => {\n return (\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 );\n };\n\n private renderSliderContainer = (inputProps: any) => {\n return (\n <div\n class={{\n 'mdc-slider': true,\n 'mdc-slider--discrete': true,\n 'mdc-slider--disabled': this.disabled \|\| this.readonly,\n }}\n >\n {this.renderSliderInput(inputProps)}\n {this.renderTrack()}\n {this.renderThumb()}\n </div>\n );\n };\n\n private renderSliderInput = (inputProps: any) => {\n return (\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-labelledby={this.labelId}\n aria-describedby={\n this.helperText ? this.helperTextId : undefined\n }\n aria-controls={this.helperText ? this.helperTextId : undefined}\n {...inputProps}\n />\n );\n };\n\n private renderTrack = () => {\n return (\n <div class=\"mdc-slider__track\">\n <div class=\"mdc-slider__track--inactive\" />\n <div class=\"mdc-slider__track--active\">\n <div class=\"mdc-slider__track--active_fill\" />\n </div>\n </div>\n );\n };\n\n private renderThumb = () => {\n return (\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\" />\n </div>\n );\n };\n\n private renderHelperLine = () => {\n if (!this.helperText) {\n return;\n }\n\n return (\n <limel-helper-line\n helperText={this.helperText}\n helperTextId={this.helperTextId}\n invalid={this.invalid}\n />\n );\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 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 private changeHandler = (\n event: CustomEvent<MDCSliderChangeEventDetail>\n ) => {\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 inputHandler = (event: CustomEvent<MDCSliderChangeEventDetail>) => {\n this.setPercentageClass(event.detail.value / this.factor);\n };\n\n private getContainerClassList = () => {\n return {\n [this.percentageClass]: true,\n 'displays-percentage-colors': this.displaysPercentageColors,\n disabled: this.disabled \|\| this.readonly,\n readonly: this.readonly,\n };\n };\n\n private resizeObserverCallback = () => {\n this.mdcSlider?.layout();\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 multiplyByFactor = (value: number) => {\n return Math.round(value this.factor);\n };\n\n private getValue = () => {\n let value = this.value;\n if (!Number.isFinite(value)) {\n value = this.valuemin;\n }\n\n return value;\n };\n\n private setPercentageClass = (value: number) => {\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"]}

package/dist/esm/lime-elements.js CHANGED Viewed

@@ -17,7 +17,7 @@ const patchBrowser = () => {
 };
 patchBrowser().then(options => {
-  return bootstrapLazy(JSON.parse("[[\"limel-text-editor\",[[17,\"limel-text-editor\",{\"contentType\":[1,\"content-type\"],\"language\":[513],\"disabled\":[516],\"readonly\":[516],\"helperText\":[513,\"helper-text\"],\"placeholder\":[513],\"label\":[513],\"invalid\":[516],\"value\":[513],\"customElements\":[16],\"triggers\":[16],\"required\":[516],\"allowResize\":[516,\"allow-resize\"],\"ui\":[513]}]]],[\"limel-card\",[[1,\"limel-card\",{\"heading\":[513],\"subheading\":[513],\"image\":[16],\"icon\":[513],\"value\":[1],\"actions\":[16],\"clickable\":[516],\"orientation\":[513]}]]],[\"limel-file\",[[1,\"limel-file\",{\"value\":[16],\"label\":[513],\"required\":[516],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"accept\":[513],\"language\":[1]}]]],[\"limel-list-item\",[[0,\"limel-list-item\",{\"language\":[513],\"value\":[8],\"text\":[513],\"secondaryText\":[513,\"secondary-text\"],\"disabled\":[516],\"icon\":[1],\"iconSize\":[513,\"icon-size\"],\"badgeIcon\":[516,\"badge-icon\"],\"selected\":[516],\"actions\":[16],\"primaryComponent\":[16],\"image\":[16],\"type\":[513]}]]],[\"limel-picker\",[[17,\"limel-picker\",{\"disabled\":[4],\"readonly\":[516],\"label\":[1],\"searchLabel\":[1,\"search-label\"],\"helperText\":[513,\"helper-text\"],\"leadingIcon\":[1,\"leading-icon\"],\"emptyResultMessage\":[1,\"empty-result-message\"],\"required\":[4],\"invalid\":[516],\"value\":[16],\"searcher\":[16],\"allItems\":[16],\"multiple\":[4],\"delimiter\":[513],\"actions\":[16],\"actionPosition\":[1,\"action-position\"],\"actionScrollBehavior\":[1,\"action-scroll-behavior\"],\"badgeIcons\":[516,\"badge-icons\"],\"items\":[32],\"textValue\":[32],\"loading\":[32],\"chips\":[32]}]]],[\"limel-split-button\",[[17,\"limel-split-button\",{\"label\":[513],\"primary\":[516],\"icon\":[513],\"disabled\":[516],\"loading\":[516],\"loadingFailed\":[516,\"loading-failed\"],\"items\":[16]}]]],[\"limel-file-viewer\",[[1,\"limel-file-viewer\",{\"url\":[513],\"filename\":[513],\"alt\":[513],\"allowFullscreen\":[516,\"allow-fullscreen\"],\"allowOpenInNewTab\":[516,\"allow-open-in-new-tab\"],\"allowDownload\":[516,\"allow-download\"],\"language\":[1],\"officeViewer\":[513,\"office-viewer\"],\"actions\":[16],\"isFullscreen\":[32],\"fileType\":[32],\"loading\":[32],\"fileUrl\":[32]}]]],[\"limel-color-picker\",[[1,\"limel-color-picker\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"tooltipLabel\":[513,\"tooltip-label\"],\"required\":[516],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"placeholder\":[513],\"manualInput\":[516,\"manual-input\"],\"palette\":[16],\"paletteColumnCount\":[514,\"palette-column-count\"],\"isOpen\":[32]}]]],[\"limel-profile-picture\",[[1,\"limel-profile-picture\",{\"language\":[513],\"label\":[513],\"icon\":[1],\"helperText\":[1,\"helper-text\"],\"disabled\":[516],\"readonly\":[516],\"required\":[516],\"invalid\":[516],\"loading\":[516],\"value\":[1],\"imageFit\":[513,\"image-fit\"],\"accept\":[513],\"resize\":[16],\"objectUrl\":[32],\"imageError\":[32],\"isErrorMessagePopoverOpen\":[32]}]]],[\"limel-date-picker\",[[1,\"limel-date-picker\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"placeholder\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516],\"value\":[16],\"type\":[513],\"format\":[513],\"language\":[513],\"formatter\":[16],\"internalFormat\":[32],\"showPortal\":[32]}]]],[\"limel-dock\",[[1,\"limel-dock\",{\"dockItems\":[16],\"dockFooterItems\":[16],\"accessibleLabel\":[513,\"accessible-label\"],\"expanded\":[516],\"allowResize\":[516,\"allow-resize\"],\"mobileBreakPoint\":[514,\"mobile-break-point\"],\"useMobileLayout\":[32]}]]],[\"limel-snackbar\",[[1,\"limel-snackbar\",{\"open\":[516],\"message\":[1],\"timeout\":[514],\"actionText\":[1,\"action-text\"],\"dismissible\":[4],\"multiline\":[4],\"language\":[1],\"offset\":[32],\"isOpen\":[32],\"closing\":[32],\"show\":[64]},[[0,\"changeOffset\",\"onChangeIndex\"]]]]],[\"limel-select\",[[1,\"limel-select\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"required\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"value\":[16],\"options\":[16],\"multiple\":[4],\"menuOpen\":[32]}]]],[\"limel-button-group\",[[1,\"limel-button-group\",{\"value\":[16],\"disabled\":[516],\"selectedButtonId\":[32]}]]],[\"limel-chart\",[[1,\"limel-chart\",{\"language\":[513],\"accessibleLabel\":[513,\"accessible-label\"],\"accessibleItemsLabel\":[513,\"accessible-items-label\"],\"accessibleValuesLabel\":[513,\"accessible-values-label\"],\"displayAxisLabels\":[516,\"display-axis-labels\"],\"items\":[16],\"type\":[513],\"orientation\":[513],\"maxValue\":[514,\"max-value\"],\"axisIncrement\":[514,\"axis-increment\"],\"loading\":[516]}]]],[\"limel-collapsible-section\",[[1,\"limel-collapsible-section\",{\"isOpen\":[1540,\"is-open\"],\"header\":[513],\"icon\":[1],\"invalid\":[516],\"actions\":[16],\"language\":[513]}]]],[\"limel-help\",[[1,\"limel-help\",{\"value\":[1],\"trigger\":[1],\"readMoreLink\":[16],\"openDirection\":[513,\"open-direction\"],\"isOpen\":[32]}]]],[\"limel-info-tile\",[[1,\"limel-info-tile\",{\"value\":[520],\"icon\":[1],\"label\":[513],\"prefix\":[513],\"suffix\":[513],\"disabled\":[516],\"badge\":[520],\"loading\":[516],\"link\":[16],\"progress\":[16],\"hasPrimarySlot\":[32]}]]],[\"limel-checkbox\",[[1,\"limel-checkbox\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"checked\":[516],\"indeterminate\":[516],\"required\":[516],\"readonlyLabels\":[16],\"modified\":[32]}]]],[\"limel-table\",[[1,\"limel-table\",{\"data\":[16],\"columns\":[16],\"mode\":[1],\"layout\":[1],\"pageSize\":[2,\"page-size\"],\"totalRows\":[2,\"total-rows\"],\"sorting\":[16],\"activeRow\":[1040],\"movableColumns\":[4,\"movable-columns\"],\"sortableColumns\":[4,\"sortable-columns\"],\"loading\":[4],\"page\":[2],\"emptyMessage\":[1,\"empty-message\"],\"aggregates\":[16],\"selectable\":[4],\"selection\":[16],\"language\":[513],\"paginationLocation\":[513,\"pagination-location\"]}]]],[\"limel-drag-handle\",[[0,\"limel-drag-handle\",{\"dragDirection\":[513,\"drag-direction\"],\"tooltipOpenDirection\":[513,\"tooltip-open-direction\"],\"language\":[513]}]]],[\"limel-shortcut\",[[1,\"limel-shortcut\",{\"icon\":[513],\"label\":[513],\"disabled\":[516],\"badge\":[520],\"link\":[16]}]]],[\"limel-switch\",[[1,\"limel-switch\",{\"label\":[513],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"value\":[516],\"helperText\":[513,\"helper-text\"],\"readonlyLabels\":[16],\"fieldId\":[32]}]]],[\"limel-tab-bar\",[[1,\"limel-tab-bar\",{\"tabs\":[1040],\"canScrollLeft\":[32],\"canScrollRight\":[32]},[[9,\"resize\",\"handleWindowResize\"]]]]],[\"limel-tab-panel\",[[1,\"limel-tab-panel\",{\"tabs\":[1040]}]]],[\"limel-code-editor\",[[1,\"limel-code-editor\",{\"value\":[1],\"language\":[1],\"readonly\":[516],\"disabled\":[516],\"invalid\":[516],\"required\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"lineNumbers\":[516,\"line-numbers\"],\"lineWrapping\":[516,\"line-wrapping\"],\"fold\":[516],\"lint\":[516],\"colorScheme\":[513,\"color-scheme\"],\"translationLanguage\":[513,\"translation-language\"],\"showCopyButton\":[516,\"show-copy-button\"],\"random\":[32],\"wasCopied\":[32]}]]],[\"limel-dialog\",[[1,\"limel-dialog\",{\"heading\":[1],\"fullscreen\":[516],\"open\":[1540],\"closingActions\":[16]}]]],[\"limel-progress-flow\",[[1,\"limel-progress-flow\",{\"flowItems\":[16],\"disabled\":[4],\"readonly\":[4]}]]],[\"limel-slider\",[[1,\"limel-slider\",{\"disabled\":[516],\"readonly\":[516],\"factor\":[514],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516],\"invalid\":[516],\"unit\":[513],\"value\":[514],\"valuemax\":[514],\"valuemin\":[514],\"step\":[514],\"percentageClass\":[32]}]]],[\"limel-banner\",[[1,\"limel-banner\",{\"message\":[513],\"icon\":[513],\"isOpen\":[32],\"open\":[64],\"close\":[64]}]]],[\"limel-form\",[[1,\"limel-form\",{\"schema\":[16],\"value\":[16],\"disabled\":[4],\"propsFactory\":[16],\"transformErrors\":[16],\"errors\":[16]}]]],[\"limel-menu-item-meta\",[[1,\"limel-menu-item-meta\",{\"commandText\":[1,\"command-text\"],\"badge\":[8],\"showChevron\":[4,\"show-chevron\"]}]]],[\"limel-radio-button-group\",[[0,\"limel-radio-button-group\",{\"items\":[16],\"selectedItem\":[16],\"disabled\":[516],\"badgeIcons\":[516,\"badge-icons\"],\"maxLinesSecondaryText\":[514,\"max-lines-secondary-text\"]}]]],[\"limel-ai-avatar\",[[1,\"limel-ai-avatar\",{\"isThinking\":[516,\"is-thinking\"],\"language\":[513]}]]],[\"limel-config\",[[1,\"limel-config\",{\"config\":[16]}]]],[\"limel-flex-container\",[[1,\"limel-flex-container\",{\"direction\":[513],\"justify\":[513],\"align\":[513],\"reverse\":[516]}]]],[\"limel-grid\",[[1,\"limel-grid\"]]],[\"limel-action-bar-item_2\",[[0,\"limel-action-bar-overflow-menu\",{\"items\":[16],\"openDirection\":[513,\"open-direction\"],\"overFlowIcon\":[16]}],[0,\"limel-action-bar-item\",{\"item\":[16],\"isVisible\":[516,\"is-visible\"],\"selected\":[516]}]]],[\"limel-action-bar_2\",[[1,\"limel-text-editor-link-menu\",{\"link\":[16],\"language\":[513],\"isOpen\":[516,\"is-open\"]}],[1,\"limel-action-bar\",{\"actions\":[16],\"language\":[513],\"accessibleLabel\":[513,\"accessible-label\"],\"layout\":[513],\"collapsible\":[516],\"openDirection\":[513,\"open-direction\"],\"overflowCutoff\":[32],\"actionBarIsShrunk\":[32]}]]],[\"limel-prosemirror-adapter\",[[17,\"limel-prosemirror-adapter\",{\"contentType\":[1,\"content-type\"],\"value\":[1],\"language\":[513],\"disabled\":[516],\"customElements\":[16],\"triggerCharacters\":[16],\"ui\":[1],\"view\":[32],\"actionBarItems\":[32],\"link\":[32],\"isLinkMenuOpen\":[32]}]]],[\"limel-color-picker-palette\",[[17,\"limel-color-picker-palette\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"placeholder\":[513],\"required\":[516],\"invalid\":[516],\"manualInput\":[516,\"manual-input\"],\"columnCount\":[514,\"column-count\"],\"palette\":[16]}]]],[\"limel-dock-button\",[[0,\"limel-dock-button\",{\"item\":[16],\"expanded\":[516],\"useMobileLayout\":[516,\"use-mobile-layout\"],\"isOpen\":[32]}]]],[\"limel-callout\",[[1,\"limel-callout\",{\"heading\":[513],\"icon\":[513],\"type\":[513],\"language\":[1]}]]],[\"limel-header\",[[1,\"limel-header\",{\"icon\":[1],\"heading\":[1],\"subheading\":[1],\"supportingText\":[1,\"supporting-text\"],\"subheadingDivider\":[1,\"subheading-divider\"]}]]],[\"limel-help-content\",[[1,\"limel-help-content\",{\"value\":[1],\"readMoreLink\":[16]}]]],[\"limel-progress-flow-item\",[[0,\"limel-progress-flow-item\",{\"item\":[16],\"disabled\":[4],\"readonly\":[4],\"currentStep\":[4,\"current-step\"]}]]],[\"limel-circular-progress\",[[1,\"limel-circular-progress\",{\"value\":[2],\"maxValue\":[2,\"max-value\"],\"prefix\":[513],\"suffix\":[1],\"displayPercentageColors\":[4,\"display-percentage-colors\"],\"size\":[513]}]]],[\"limel-flatpickr-adapter\",[[1,\"limel-flatpickr-adapter\",{\"value\":[16],\"type\":[1],\"format\":[1],\"isOpen\":[4,\"is-open\"],\"inputElement\":[16],\"language\":[1],\"formatter\":[16]}]]],[\"limel-radio-button\",[[0,\"limel-radio-button\",{\"checked\":[516],\"disabled\":[516],\"id\":[1],\"label\":[1],\"onChange\":[16]}]]],[\"limel-3d-hover-effect-glow\",[[1,\"limel-3d-hover-effect-glow\"]]],[\"limel-icon\",[[1,\"limel-icon\",{\"size\":[513],\"name\":[513],\"badge\":[516]}]]],[\"limel-portal_3\",[[1,\"limel-tooltip\",{\"elementId\":[513,\"element-id\"],\"label\":[513],\"helperLabel\":[513,\"helper-label\"],\"maxlength\":[514],\"openDirection\":[513,\"open-direction\"],\"open\":[32]}],[1,\"limel-tooltip-content\",{\"label\":[513],\"helperLabel\":[513,\"helper-label\"],\"maxlength\":[514]}],[1,\"limel-portal\",{\"openDirection\":[513,\"open-direction\"],\"position\":[513],\"containerId\":[513,\"container-id\"],\"containerStyle\":[16],\"inheritParentWidth\":[516,\"inherit-parent-width\"],\"visible\":[516],\"anchor\":[16]}]]],[\"limel-icon-button\",[[17,\"limel-icon-button\",{\"icon\":[1],\"elevated\":[516],\"label\":[513],\"disabled\":[516]}]]],[\"limel-file-dropzone_2\",[[1,\"limel-file-dropzone\",{\"accept\":[513],\"disabled\":[4],\"text\":[1],\"helperText\":[1,\"helper-text\"],\"hasFileToDrop\":[32]}],[1,\"limel-file-input\",{\"accept\":[513],\"disabled\":[516],\"multiple\":[516]}]]],[\"limel-dynamic-label\",[[1,\"limel-dynamic-label\",{\"value\":[8],\"defaultLabel\":[16],\"labels\":[16]}]]],[\"limel-badge\",[[1,\"limel-badge\",{\"label\":[520]}]]],[\"limel-chip_2\",[[17,\"limel-chip-set\",{\"value\":[16],\"type\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"inputType\":[513,\"input-type\"],\"maxItems\":[514,\"max-items\"],\"required\":[516],\"searchLabel\":[513,\"search-label\"],\"emptyInputOnBlur\":[516,\"empty-input-on-blur\"],\"clearAllButton\":[4,\"clear-all-button\"],\"leadingIcon\":[513,\"leading-icon\"],\"delimiter\":[513],\"autocomplete\":[513],\"language\":[1],\"editMode\":[32],\"textValue\":[32],\"blurred\":[32],\"inputChipIndexSelected\":[32],\"selectedChipIds\":[32],\"getEditMode\":[64],\"setFocus\":[64],\"emptyInput\":[64]}],[17,\"limel-chip\",{\"language\":[513],\"text\":[513],\"icon\":[1],\"image\":[16],\"link\":[16],\"badge\":[520],\"disabled\":[516],\"readonly\":[516],\"selected\":[516],\"invalid\":[516],\"removable\":[516],\"type\":[513],\"loading\":[516],\"progress\":[514],\"identifier\":[520],\"size\":[513],\"menuItems\":[16]}]]],[\"limel-button\",[[17,\"limel-button\",{\"label\":[513],\"primary\":[516],\"outlined\":[516],\"icon\":[513],\"disabled\":[516],\"loading\":[516],\"loadingFailed\":[516,\"loading-failed\"],\"justLoaded\":[32]}]]],[\"limel-linear-progress\",[[1,\"limel-linear-progress\",{\"language\":[513],\"value\":[514],\"indeterminate\":[516],\"accessibleLabel\":[513,\"accessible-label\"]}]]],[\"limel-markdown\",[[1,\"limel-markdown\",{\"value\":[1],\"whitelist\":[16],\"lazyLoadImages\":[516,\"lazy-load-images\"],\"removeEmptyParagraphs\":[516,\"remove-empty-paragraphs\"]}]]],[\"limel-popover_2\",[[1,\"limel-popover\",{\"open\":[4],\"openDirection\":[513,\"open-direction\"]}],[1,\"limel-popover-surface\",{\"contentCollection\":[16]}]]],[\"limel-helper-line_2\",[[4,\"limel-notched-outline\",{\"required\":[516],\"readonly\":[516],\"invalid\":[516],\"disabled\":[516],\"label\":[513],\"labelId\":[513,\"label-id\"],\"hasValue\":[516,\"has-value\"],\"hasLeadingIcon\":[516,\"has-leading-icon\"],\"hasFloatingLabel\":[516,\"has-floating-label\"]}],[1,\"limel-helper-line\",{\"helperText\":[513,\"helper-text\"],\"length\":[514],\"maxLength\":[514,\"max-length\"],\"invalid\":[516],\"helperTextId\":[513,\"helper-text-id\"]}]]],[\"limel-breadcrumbs_7\",[[1,\"limel-menu\",{\"items\":[16],\"disabled\":[516],\"openDirection\":[513,\"open-direction\"],\"surfaceWidth\":[513,\"surface-width\"],\"open\":[1540],\"badgeIcons\":[516,\"badge-icons\"],\"gridLayout\":[516,\"grid-layout\"],\"loading\":[516],\"currentSubMenu\":[1040],\"rootItem\":[16],\"searcher\":[16],\"searchPlaceholder\":[1,\"search-placeholder\"],\"emptyResultMessage\":[1,\"empty-result-message\"],\"loadingSubItems\":[32],\"searchValue\":[32],\"searchResults\":[32]}],[1,\"limel-breadcrumbs\",{\"items\":[16],\"divider\":[1]}],[17,\"limel-menu-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"]}],[17,\"limel-input-field\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"placeholder\":[513],\"helperText\":[513,\"helper-text\"],\"prefix\":[513],\"suffix\":[513],\"required\":[516],\"value\":[513],\"trailingIcon\":[513,\"trailing-icon\"],\"leadingIcon\":[513,\"leading-icon\"],\"pattern\":[513],\"type\":[513],\"formatNumber\":[516,\"format-number\"],\"step\":[520],\"max\":[514],\"min\":[514],\"maxlength\":[514],\"minlength\":[514],\"completions\":[16],\"showLink\":[516,\"show-link\"],\"locale\":[513],\"isFocused\":[32],\"wasInvalid\":[32],\"showCompletions\":[32]}],[1,\"limel-menu-surface\",{\"open\":[4],\"allowClicksElement\":[16]}],[1,\"limel-spinner\",{\"size\":[513],\"limeBranded\":[4,\"lime-branded\"]}],[17,\"limel-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"],\"type\":[1],\"maxLinesSecondaryText\":[2,\"max-lines-secondary-text\"]}]]]]"), options);
+  return bootstrapLazy(JSON.parse("[[\"limel-text-editor\",[[17,\"limel-text-editor\",{\"contentType\":[1,\"content-type\"],\"language\":[513],\"disabled\":[516],\"readonly\":[516],\"helperText\":[513,\"helper-text\"],\"placeholder\":[513],\"label\":[513],\"invalid\":[516],\"value\":[513],\"customElements\":[16],\"triggers\":[16],\"required\":[516],\"allowResize\":[516,\"allow-resize\"],\"ui\":[513]}]]],[\"limel-card\",[[1,\"limel-card\",{\"heading\":[513],\"subheading\":[513],\"image\":[16],\"icon\":[513],\"value\":[1],\"actions\":[16],\"clickable\":[516],\"orientation\":[513]}]]],[\"limel-file\",[[1,\"limel-file\",{\"value\":[16],\"label\":[513],\"required\":[516],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"accept\":[513],\"language\":[1]}]]],[\"limel-list-item\",[[0,\"limel-list-item\",{\"language\":[513],\"value\":[8],\"text\":[513],\"secondaryText\":[513,\"secondary-text\"],\"disabled\":[516],\"icon\":[1],\"iconSize\":[513,\"icon-size\"],\"badgeIcon\":[516,\"badge-icon\"],\"selected\":[516],\"actions\":[16],\"primaryComponent\":[16],\"image\":[16],\"type\":[513]}]]],[\"limel-picker\",[[17,\"limel-picker\",{\"disabled\":[4],\"readonly\":[516],\"label\":[1],\"searchLabel\":[1,\"search-label\"],\"helperText\":[513,\"helper-text\"],\"leadingIcon\":[1,\"leading-icon\"],\"emptyResultMessage\":[1,\"empty-result-message\"],\"required\":[4],\"invalid\":[516],\"value\":[16],\"searcher\":[16],\"allItems\":[16],\"multiple\":[4],\"delimiter\":[513],\"actions\":[16],\"actionPosition\":[1,\"action-position\"],\"actionScrollBehavior\":[1,\"action-scroll-behavior\"],\"badgeIcons\":[516,\"badge-icons\"],\"items\":[32],\"textValue\":[32],\"loading\":[32],\"chips\":[32]}]]],[\"limel-split-button\",[[17,\"limel-split-button\",{\"label\":[513],\"primary\":[516],\"icon\":[513],\"disabled\":[516],\"loading\":[516],\"loadingFailed\":[516,\"loading-failed\"],\"items\":[16]}]]],[\"limel-file-viewer\",[[1,\"limel-file-viewer\",{\"url\":[513],\"filename\":[513],\"alt\":[513],\"allowFullscreen\":[516,\"allow-fullscreen\"],\"allowOpenInNewTab\":[516,\"allow-open-in-new-tab\"],\"allowDownload\":[516,\"allow-download\"],\"language\":[1],\"officeViewer\":[513,\"office-viewer\"],\"actions\":[16],\"isFullscreen\":[32],\"fileType\":[32],\"loading\":[32],\"fileUrl\":[32]}]]],[\"limel-color-picker\",[[1,\"limel-color-picker\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"tooltipLabel\":[513,\"tooltip-label\"],\"required\":[516],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"placeholder\":[513],\"manualInput\":[516,\"manual-input\"],\"palette\":[16],\"paletteColumnCount\":[514,\"palette-column-count\"],\"isOpen\":[32]}]]],[\"limel-profile-picture\",[[1,\"limel-profile-picture\",{\"language\":[513],\"label\":[513],\"icon\":[1],\"helperText\":[1,\"helper-text\"],\"disabled\":[516],\"readonly\":[516],\"required\":[516],\"invalid\":[516],\"loading\":[516],\"value\":[1],\"imageFit\":[513,\"image-fit\"],\"accept\":[513],\"resize\":[16],\"objectUrl\":[32],\"imageError\":[32],\"isErrorMessagePopoverOpen\":[32]}]]],[\"limel-date-picker\",[[1,\"limel-date-picker\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"placeholder\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516],\"value\":[16],\"type\":[513],\"format\":[513],\"language\":[513],\"formatter\":[16],\"internalFormat\":[32],\"showPortal\":[32]}]]],[\"limel-dock\",[[1,\"limel-dock\",{\"dockItems\":[16],\"dockFooterItems\":[16],\"accessibleLabel\":[513,\"accessible-label\"],\"expanded\":[516],\"allowResize\":[516,\"allow-resize\"],\"mobileBreakPoint\":[514,\"mobile-break-point\"],\"useMobileLayout\":[32]}]]],[\"limel-snackbar\",[[1,\"limel-snackbar\",{\"open\":[516],\"message\":[1],\"timeout\":[514],\"actionText\":[1,\"action-text\"],\"dismissible\":[4],\"multiline\":[4],\"language\":[1],\"offset\":[32],\"isOpen\":[32],\"closing\":[32],\"show\":[64]},[[0,\"changeOffset\",\"onChangeIndex\"]]]]],[\"limel-select\",[[1,\"limel-select\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"required\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"value\":[16],\"options\":[16],\"multiple\":[4],\"menuOpen\":[32]}]]],[\"limel-button-group\",[[1,\"limel-button-group\",{\"value\":[16],\"disabled\":[516],\"selectedButtonId\":[32]}]]],[\"limel-chart\",[[1,\"limel-chart\",{\"language\":[513],\"accessibleLabel\":[513,\"accessible-label\"],\"accessibleItemsLabel\":[513,\"accessible-items-label\"],\"accessibleValuesLabel\":[513,\"accessible-values-label\"],\"displayAxisLabels\":[516,\"display-axis-labels\"],\"displayItemText\":[516,\"display-item-text\"],\"displayItemValue\":[516,\"display-item-value\"],\"items\":[16],\"type\":[513],\"orientation\":[513],\"maxValue\":[514,\"max-value\"],\"axisIncrement\":[514,\"axis-increment\"],\"loading\":[516]}]]],[\"limel-collapsible-section\",[[1,\"limel-collapsible-section\",{\"isOpen\":[1540,\"is-open\"],\"header\":[513],\"icon\":[1],\"invalid\":[516],\"actions\":[16],\"language\":[513]}]]],[\"limel-help\",[[1,\"limel-help\",{\"value\":[1],\"trigger\":[1],\"readMoreLink\":[16],\"openDirection\":[513,\"open-direction\"],\"isOpen\":[32]}]]],[\"limel-info-tile\",[[1,\"limel-info-tile\",{\"value\":[520],\"icon\":[1],\"label\":[513],\"prefix\":[513],\"suffix\":[513],\"disabled\":[516],\"badge\":[520],\"loading\":[516],\"link\":[16],\"progress\":[16],\"hasPrimarySlot\":[32]}]]],[\"limel-checkbox\",[[1,\"limel-checkbox\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"checked\":[516],\"indeterminate\":[516],\"required\":[516],\"readonlyLabels\":[16],\"modified\":[32]}]]],[\"limel-table\",[[1,\"limel-table\",{\"data\":[16],\"columns\":[16],\"mode\":[1],\"layout\":[1],\"pageSize\":[2,\"page-size\"],\"totalRows\":[2,\"total-rows\"],\"sorting\":[16],\"activeRow\":[1040],\"movableColumns\":[4,\"movable-columns\"],\"sortableColumns\":[4,\"sortable-columns\"],\"loading\":[4],\"page\":[2],\"emptyMessage\":[1,\"empty-message\"],\"aggregates\":[16],\"selectable\":[4],\"selection\":[16],\"language\":[513],\"paginationLocation\":[513,\"pagination-location\"]}]]],[\"limel-drag-handle\",[[0,\"limel-drag-handle\",{\"dragDirection\":[513,\"drag-direction\"],\"tooltipOpenDirection\":[513,\"tooltip-open-direction\"],\"language\":[513]}]]],[\"limel-shortcut\",[[1,\"limel-shortcut\",{\"icon\":[513],\"label\":[513],\"disabled\":[516],\"badge\":[520],\"link\":[16]}]]],[\"limel-switch\",[[1,\"limel-switch\",{\"label\":[513],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"value\":[516],\"helperText\":[513,\"helper-text\"],\"readonlyLabels\":[16],\"fieldId\":[32]}]]],[\"limel-tab-bar\",[[1,\"limel-tab-bar\",{\"tabs\":[1040],\"canScrollLeft\":[32],\"canScrollRight\":[32]},[[9,\"resize\",\"handleWindowResize\"]]]]],[\"limel-tab-panel\",[[1,\"limel-tab-panel\",{\"tabs\":[1040]}]]],[\"limel-code-editor\",[[1,\"limel-code-editor\",{\"value\":[1],\"language\":[1],\"readonly\":[516],\"disabled\":[516],\"invalid\":[516],\"required\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"lineNumbers\":[516,\"line-numbers\"],\"lineWrapping\":[516,\"line-wrapping\"],\"fold\":[516],\"lint\":[516],\"colorScheme\":[513,\"color-scheme\"],\"translationLanguage\":[513,\"translation-language\"],\"showCopyButton\":[516,\"show-copy-button\"],\"random\":[32],\"wasCopied\":[32]}]]],[\"limel-dialog\",[[1,\"limel-dialog\",{\"heading\":[1],\"fullscreen\":[516],\"open\":[1540],\"closingActions\":[16]}]]],[\"limel-progress-flow\",[[1,\"limel-progress-flow\",{\"flowItems\":[16],\"disabled\":[4],\"readonly\":[4]}]]],[\"limel-slider\",[[1,\"limel-slider\",{\"disabled\":[516],\"readonly\":[516],\"factor\":[514],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516],\"invalid\":[516],\"displaysPercentageColors\":[516,\"displays-percentage-colors\"],\"unit\":[513],\"value\":[514],\"valuemax\":[514],\"valuemin\":[514],\"step\":[514],\"percentageClass\":[32]}]]],[\"limel-banner\",[[1,\"limel-banner\",{\"message\":[513],\"icon\":[513],\"isOpen\":[32],\"open\":[64],\"close\":[64]}]]],[\"limel-form\",[[1,\"limel-form\",{\"schema\":[16],\"value\":[16],\"disabled\":[4],\"propsFactory\":[16],\"transformErrors\":[16],\"errors\":[16]}]]],[\"limel-menu-item-meta\",[[1,\"limel-menu-item-meta\",{\"commandText\":[1,\"command-text\"],\"badge\":[8],\"showChevron\":[4,\"show-chevron\"]}]]],[\"limel-radio-button-group\",[[0,\"limel-radio-button-group\",{\"items\":[16],\"selectedItem\":[16],\"disabled\":[516],\"badgeIcons\":[516,\"badge-icons\"],\"maxLinesSecondaryText\":[514,\"max-lines-secondary-text\"]}]]],[\"limel-ai-avatar\",[[1,\"limel-ai-avatar\",{\"isThinking\":[516,\"is-thinking\"],\"language\":[513]}]]],[\"limel-config\",[[1,\"limel-config\",{\"config\":[16]}]]],[\"limel-flex-container\",[[1,\"limel-flex-container\",{\"direction\":[513],\"justify\":[513],\"align\":[513],\"reverse\":[516]}]]],[\"limel-grid\",[[1,\"limel-grid\"]]],[\"limel-action-bar-item_2\",[[0,\"limel-action-bar-overflow-menu\",{\"items\":[16],\"openDirection\":[513,\"open-direction\"],\"overFlowIcon\":[16]}],[0,\"limel-action-bar-item\",{\"item\":[16],\"isVisible\":[516,\"is-visible\"],\"selected\":[516]}]]],[\"limel-action-bar_2\",[[1,\"limel-text-editor-link-menu\",{\"link\":[16],\"language\":[513],\"isOpen\":[516,\"is-open\"]}],[1,\"limel-action-bar\",{\"actions\":[16],\"language\":[513],\"accessibleLabel\":[513,\"accessible-label\"],\"layout\":[513],\"collapsible\":[516],\"openDirection\":[513,\"open-direction\"],\"overflowCutoff\":[32],\"actionBarIsShrunk\":[32]}]]],[\"limel-prosemirror-adapter\",[[17,\"limel-prosemirror-adapter\",{\"contentType\":[1,\"content-type\"],\"value\":[1],\"language\":[513],\"disabled\":[516],\"customElements\":[16],\"triggerCharacters\":[16],\"ui\":[1],\"view\":[32],\"actionBarItems\":[32],\"link\":[32],\"isLinkMenuOpen\":[32]}]]],[\"limel-color-picker-palette\",[[17,\"limel-color-picker-palette\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"placeholder\":[513],\"required\":[516],\"invalid\":[516],\"manualInput\":[516,\"manual-input\"],\"columnCount\":[514,\"column-count\"],\"palette\":[16]}]]],[\"limel-dock-button\",[[0,\"limel-dock-button\",{\"item\":[16],\"expanded\":[516],\"useMobileLayout\":[516,\"use-mobile-layout\"],\"isOpen\":[32]}]]],[\"limel-callout\",[[1,\"limel-callout\",{\"heading\":[513],\"icon\":[513],\"type\":[513],\"language\":[1]}]]],[\"limel-header\",[[1,\"limel-header\",{\"icon\":[1],\"heading\":[1],\"subheading\":[1],\"supportingText\":[1,\"supporting-text\"],\"subheadingDivider\":[1,\"subheading-divider\"]}]]],[\"limel-help-content\",[[1,\"limel-help-content\",{\"value\":[1],\"readMoreLink\":[16]}]]],[\"limel-progress-flow-item\",[[0,\"limel-progress-flow-item\",{\"item\":[16],\"disabled\":[4],\"readonly\":[4],\"currentStep\":[4,\"current-step\"]}]]],[\"limel-circular-progress\",[[1,\"limel-circular-progress\",{\"value\":[2],\"maxValue\":[2,\"max-value\"],\"prefix\":[513],\"suffix\":[1],\"displayPercentageColors\":[4,\"display-percentage-colors\"],\"size\":[513]}]]],[\"limel-flatpickr-adapter\",[[1,\"limel-flatpickr-adapter\",{\"value\":[16],\"type\":[1],\"format\":[1],\"isOpen\":[4,\"is-open\"],\"inputElement\":[16],\"language\":[1],\"formatter\":[16]}]]],[\"limel-radio-button\",[[0,\"limel-radio-button\",{\"checked\":[516],\"disabled\":[516],\"id\":[1],\"label\":[1],\"onChange\":[16]}]]],[\"limel-3d-hover-effect-glow\",[[1,\"limel-3d-hover-effect-glow\"]]],[\"limel-icon\",[[1,\"limel-icon\",{\"size\":[513],\"name\":[513],\"badge\":[516]}]]],[\"limel-portal_3\",[[1,\"limel-tooltip\",{\"elementId\":[513,\"element-id\"],\"label\":[513],\"helperLabel\":[513,\"helper-label\"],\"maxlength\":[514],\"openDirection\":[513,\"open-direction\"],\"open\":[32]}],[1,\"limel-tooltip-content\",{\"label\":[513],\"helperLabel\":[513,\"helper-label\"],\"maxlength\":[514]}],[1,\"limel-portal\",{\"openDirection\":[513,\"open-direction\"],\"position\":[513],\"containerId\":[513,\"container-id\"],\"containerStyle\":[16],\"inheritParentWidth\":[516,\"inherit-parent-width\"],\"visible\":[516],\"anchor\":[16]}]]],[\"limel-icon-button\",[[17,\"limel-icon-button\",{\"icon\":[1],\"elevated\":[516],\"label\":[513],\"disabled\":[516]}]]],[\"limel-file-dropzone_2\",[[1,\"limel-file-dropzone\",{\"accept\":[513],\"disabled\":[4],\"text\":[1],\"helperText\":[1,\"helper-text\"],\"hasFileToDrop\":[32]}],[1,\"limel-file-input\",{\"accept\":[513],\"disabled\":[516],\"multiple\":[516]}]]],[\"limel-dynamic-label\",[[1,\"limel-dynamic-label\",{\"value\":[8],\"defaultLabel\":[16],\"labels\":[16]}]]],[\"limel-badge\",[[1,\"limel-badge\",{\"label\":[520]}]]],[\"limel-chip_2\",[[17,\"limel-chip-set\",{\"value\":[16],\"type\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"inputType\":[513,\"input-type\"],\"maxItems\":[514,\"max-items\"],\"required\":[516],\"searchLabel\":[513,\"search-label\"],\"emptyInputOnBlur\":[516,\"empty-input-on-blur\"],\"clearAllButton\":[4,\"clear-all-button\"],\"leadingIcon\":[513,\"leading-icon\"],\"delimiter\":[513],\"autocomplete\":[513],\"language\":[1],\"editMode\":[32],\"textValue\":[32],\"blurred\":[32],\"inputChipIndexSelected\":[32],\"selectedChipIds\":[32],\"getEditMode\":[64],\"setFocus\":[64],\"emptyInput\":[64]}],[17,\"limel-chip\",{\"language\":[513],\"text\":[513],\"icon\":[1],\"image\":[16],\"link\":[16],\"badge\":[520],\"disabled\":[516],\"readonly\":[516],\"selected\":[516],\"invalid\":[516],\"removable\":[516],\"type\":[513],\"loading\":[516],\"progress\":[514],\"identifier\":[520],\"size\":[513],\"menuItems\":[16]}]]],[\"limel-button\",[[17,\"limel-button\",{\"label\":[513],\"primary\":[516],\"outlined\":[516],\"icon\":[513],\"disabled\":[516],\"loading\":[516],\"loadingFailed\":[516,\"loading-failed\"],\"justLoaded\":[32]}]]],[\"limel-linear-progress\",[[1,\"limel-linear-progress\",{\"language\":[513],\"value\":[514],\"indeterminate\":[516],\"accessibleLabel\":[513,\"accessible-label\"]}]]],[\"limel-markdown\",[[1,\"limel-markdown\",{\"value\":[1],\"whitelist\":[16],\"lazyLoadImages\":[516,\"lazy-load-images\"],\"removeEmptyParagraphs\":[516,\"remove-empty-paragraphs\"]}]]],[\"limel-popover_2\",[[1,\"limel-popover\",{\"open\":[4],\"openDirection\":[513,\"open-direction\"]}],[1,\"limel-popover-surface\",{\"contentCollection\":[16]}]]],[\"limel-helper-line_2\",[[4,\"limel-notched-outline\",{\"required\":[516],\"readonly\":[516],\"invalid\":[516],\"disabled\":[516],\"label\":[513],\"labelId\":[513,\"label-id\"],\"hasValue\":[516,\"has-value\"],\"hasLeadingIcon\":[516,\"has-leading-icon\"],\"hasFloatingLabel\":[516,\"has-floating-label\"]}],[1,\"limel-helper-line\",{\"helperText\":[513,\"helper-text\"],\"length\":[514],\"maxLength\":[514,\"max-length\"],\"invalid\":[516],\"helperTextId\":[513,\"helper-text-id\"]}]]],[\"limel-breadcrumbs_7\",[[1,\"limel-menu\",{\"items\":[16],\"disabled\":[516],\"openDirection\":[513,\"open-direction\"],\"surfaceWidth\":[513,\"surface-width\"],\"open\":[1540],\"badgeIcons\":[516,\"badge-icons\"],\"gridLayout\":[516,\"grid-layout\"],\"loading\":[516],\"currentSubMenu\":[1040],\"rootItem\":[16],\"searcher\":[16],\"searchPlaceholder\":[1,\"search-placeholder\"],\"emptyResultMessage\":[1,\"empty-result-message\"],\"loadingSubItems\":[32],\"searchValue\":[32],\"searchResults\":[32]}],[1,\"limel-breadcrumbs\",{\"items\":[16],\"divider\":[1]}],[17,\"limel-menu-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"]}],[17,\"limel-input-field\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"placeholder\":[513],\"helperText\":[513,\"helper-text\"],\"prefix\":[513],\"suffix\":[513],\"required\":[516],\"value\":[513],\"trailingIcon\":[513,\"trailing-icon\"],\"leadingIcon\":[513,\"leading-icon\"],\"pattern\":[513],\"type\":[513],\"formatNumber\":[516,\"format-number\"],\"step\":[520],\"max\":[514],\"min\":[514],\"maxlength\":[514],\"minlength\":[514],\"completions\":[16],\"showLink\":[516,\"show-link\"],\"locale\":[513],\"isFocused\":[32],\"wasInvalid\":[32],\"showCompletions\":[32]}],[1,\"limel-menu-surface\",{\"open\":[4],\"allowClicksElement\":[16]}],[1,\"limel-spinner\",{\"size\":[513],\"limeBranded\":[4,\"lime-branded\"]}],[17,\"limel-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"],\"type\":[1],\"maxLinesSecondaryText\":[2,\"max-lines-secondary-text\"]}]]]]"), options);
 });
 //# sourceMappingURL=lime-elements.js.map

package/dist/esm/limel-chart.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h } from './index-0c4503aa.js'
 import { t as translate } from './translations-694c7c68.js';
 import { c as createRandomString } from './random-string-355331d3.js';
-const chartCss = "@charset \"UTF-8\";:host(limel-chart){--chart-axis-line-color:var(\n      --limel-chart-axis-line-color,\n      rgb(var(--contrast-900))\n  );box-sizing:border-box;isolation:isolate;display:flex;width:100%;height:100%;min-width:0;min-height:0;padding:var(--limel-chart-padding)}table{all:unset;border-collapse:collapse;border-spacing:0;empty-cells:show;position:relative;display:flex;width:100%;height:100%;min-width:0;min-height:0}table colgroup,table thead,table tbody,table tr,table th,table td{all:unset}table caption,table colgroup,table thead,table tfoot,table th,table td{position:absolute;width:0;height:0;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap}*,*:before,*:after{box-sizing:border-box}.chart{position:relative;flex-grow:1;width:100%;height:100%;min-height:0;min-width:0}.chart:has(.item:hover) .item,.chart:has(.item:focus-visible) .item{opacity:0.4}.item{transition:background-color 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease, opacity 0.4s ease;cursor:help}.item:focus{outline:none}.item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.item:focus-visible,.item:hover{opacity:1 !important}.item[role=button]{cursor:pointer}limel-spinner{margin:auto}:host(limel-chart[type=bar]) .chart,:host(limel-chart[type=dot]) .chart,:host(limel-chart[type=line]) .chart,:host(limel-chart[type=area]) .chart{display:flex;background-color:var(--chart-background-color, transparent)}:host(limel-chart[type=bar]) .item,:host(limel-chart[type=dot]) .item,:host(limel-chart[type=line]) .item,:host(limel-chart[type=area]) .item{position:relative;mix-blend-mode:hard-light}:host(limel-chart[type=bar][orientation=landscape]),:host(limel-chart[type=dot][orientation=landscape]),:host(limel-chart[type=line][orientation=landscape]),:host(limel-chart[type=area][orientation=landscape]){--limel-chart-padding:0.5rem 0.5rem 0.5rem 2rem}:host(limel-chart[type=bar][orientation=landscape]) .chart,:host(limel-chart[type=dot][orientation=landscape]) .chart,:host(limel-chart[type=line][orientation=landscape]) .chart,:host(limel-chart[type=area][orientation=landscape]) .chart{flex-direction:row;align-items:flex-end;overflow:auto hidden;padding:0 0.125rem}:host(limel-chart[type=bar][orientation=landscape]) .item,:host(limel-chart[type=dot][orientation=landscape]) .item,:host(limel-chart[type=line][orientation=landscape]) .item,:host(limel-chart[type=area][orientation=landscape]) .item{min-width:0.5rem;width:inherit}:host(limel-chart[type=bar][orientation=portrait]),:host(limel-chart[type=dot][orientation=portrait]),:host(limel-chart[type=line][orientation=portrait]),:host(limel-chart[type=area][orientation=portrait]){--limel-chart-padding:0.5rem 0.5rem 1rem 0.5rem}:host(limel-chart[type=bar][orientation=portrait]) .chart,:host(limel-chart[type=dot][orientation=portrait]) .chart,:host(limel-chart[type=line][orientation=portrait]) .chart,:host(limel-chart[type=area][orientation=portrait]) .chart{flex-direction:column;overflow:hidden auto;padding:0.125rem 0}:host(limel-chart[type=bar][orientation=portrait]) .item,:host(limel-chart[type=dot][orientation=portrait]) .item,:host(limel-chart[type=line][orientation=portrait]) .item,:host(limel-chart[type=area][orientation=portrait]) .item{min-height:0.5rem;height:inherit}:host(limel-chart[display-axis-labels][orientation=portrait]){--limel-chart-padding:0.5rem 0.5rem 2rem\n      1.25rem}:host(limel-chart[display-axis-labels][orientation=landscape]){--limel-chart-padding:0.5rem 0.5rem 1.25rem\n      3rem}:host(limel-chart[display-axis-labels][type=line]) table thead,:host(limel-chart[display-axis-labels][type=line]) table th,:host(limel-chart[display-axis-labels][type=dot]) table thead,:host(limel-chart[display-axis-labels][type=dot]) table th,:host(limel-chart[display-axis-labels][type=area]) table thead,:host(limel-chart[display-axis-labels][type=area]) table th,:host(limel-chart[display-axis-labels][type=bar]) table thead,:host(limel-chart[display-axis-labels][type=bar]) table th{all:unset}:host(limel-chart[display-axis-labels][type=line]) table th,:host(limel-chart[display-axis-labels][type=dot]) table th,:host(limel-chart[display-axis-labels][type=area]) table th,:host(limel-chart[display-axis-labels][type=bar]) table th{position:absolute;font-size:var(--limel-theme-default-small-font-size);max-width:100%;max-height:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(limel-chart[display-axis-labels][orientation=portrait]) table thead th:first-of-type{left:-1.25rem;writing-mode:sideways-lr}:host(limel-chart[display-axis-labels][orientation=portrait]) table thead th:last-of-type{bottom:-2rem;left:50%;transform:translateX(-50%)}:host(limel-chart[display-axis-labels][orientation=landscape]) table thead th:first-of-type{bottom:-1.25rem;left:50%;transform:translateX(-50%)}:host(limel-chart[display-axis-labels][orientation=landscape]) table thead th:last-of-type{left:-3rem;writing-mode:sideways-lr}:host(limel-chart[type=pie]) table,:host(limel-chart[type=doughnut]) table,:host(limel-chart[type=ring]) table{min-height:2rem;min-width:2rem}:host(limel-chart[type=pie]) .chart,:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .chart,:host(limel-chart[type=doughnut]) .item,:host(limel-chart[type=ring]) .chart,:host(limel-chart[type=ring]) .item{aspect-ratio:1;display:flex;margin:auto}:host(limel-chart[type=pie]) .chart,:host(limel-chart[type=doughnut]) .chart,:host(limel-chart[type=ring]) .chart{justify-content:center;align-items:center}:host(limel-chart[type=pie]) .chart:before,:host(limel-chart[type=doughnut]) .chart:before,:host(limel-chart[type=ring]) .chart:before{aspect-ratio:1;content:\"\";position:absolute;z-index:0;inset:0;margin:auto;border-radius:50%;max-width:100%;max-height:100%;background-color:var(--chart-background-color, rgb(var(--contrast-200)))}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item,:host(limel-chart[type=ring]) .item{max-width:100%;max-height:100%;border-radius:50%;position:absolute;inset:0}:host(limel-chart[type=bar]) .chart,:host(limel-chart[type=dot]) .chart{gap:0.5rem}:host(limel-chart[type=bar]) .item,:host(limel-chart[type=dot]) .item{display:flex;align-items:center;justify-content:center;border-radius:var(--chart-item-border-radius, 0.125rem)}:host(limel-chart[type=bar]) .item{background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=dot]) .item:before,:host(limel-chart[type=dot]) .item:after{content:\"\";position:absolute;margin:auto;width:0.5rem;height:0.5rem;border-radius:50%}:host(limel-chart[type=dot]) .item::after{background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=dot]) .item.has-start-value:before{background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=bar][orientation=landscape]) .item,:host(limel-chart[type=dot][orientation=landscape]) .item{height:calc(var(--limel-chart-item-size) * 1%);bottom:calc(var(--limel-chart-item-offset) * 1%)}:host(limel-chart[type=bar][orientation=landscape]) .item.has-negative-value-only,:host(limel-chart[type=dot][orientation=landscape]) .item.has-negative-value-only{height:calc(var(--limel-chart-item-size) * -1%);transform-origin:bottom;transform:rotateX(180deg)}:host(limel-chart[type=dot][orientation=landscape]) .item.has-start-value,:host(limel-chart[type=dot][orientation=landscape]) .item:hover,:host(limel-chart[type=dot][orientation=landscape]) .item:focus-visible{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/1px 100% no-repeat}:host(limel-chart[type=dot][orientation=landscape]) .item:before{inset:auto 0 0 0;transform:translateY(50%)}:host(limel-chart[type=dot][orientation=landscape]) .item::after{inset:0 0 auto 0;transform:translateY(-50%)}:host(limel-chart[type=bar][orientation=portrait]) .item,:host(limel-chart[type=dot][orientation=portrait]) .item{width:calc(var(--limel-chart-item-size) * 1%);left:calc(var(--limel-chart-item-offset) * 1%)}:host(limel-chart[type=bar][orientation=portrait]) .item.has-negative-value-only,:host(limel-chart[type=dot][orientation=portrait]) .item.has-negative-value-only{width:calc(var(--limel-chart-item-size) * -1%);transform-origin:left;transform:rotateY(180deg)}:host(limel-chart[type=dot][orientation=portrait]) .item.has-start-value,:host(limel-chart[type=dot][orientation=portrait]) .item:hover,:host(limel-chart[type=dot][orientation=portrait]) .item:focus-visible{background:linear-gradient(to right, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/100% 1px no-repeat}:host(limel-chart[type=dot][orientation=portrait]) .item:before{inset:0 auto 0 0;transform:translateX(-50%)}:host(limel-chart[type=dot][orientation=portrait]) .item:after{inset:0 0 0 auto;transform:translateX(50%)}:host(limel-chart[type=area]) .item,:host(limel-chart[type=line]) .item{position:relative}:host(limel-chart[type=area]) .item:after,:host(limel-chart[type=line]) .item:after{margin:auto;width:0.5rem;height:0.5rem;border-radius:50%;border:1px solid rgb(var(--contrast-100))}:host(limel-chart[type=area]) .item:before,:host(limel-chart[type=line]) .item:before{inset:0}:host(limel-chart[type=area]) .item:after,:host(limel-chart[type=area]) .item:before,:host(limel-chart[type=line]) .item:after,:host(limel-chart[type=line]) .item:before{transition:border-color 0.2s ease, opacity 0.4s ease;content:\"\";position:absolute;background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=area]) .item:hover:after,:host(limel-chart[type=area]) .item:focus-visible:after,:host(limel-chart[type=line]) .item:hover:after,:host(limel-chart[type=line]) .item:focus-visible:after{border-color:transparent}:host(limel-chart[type=line][orientation=landscape]) .item,:host(limel-chart[type=area][orientation=landscape]) .item{height:100%}:host(limel-chart[type=line][orientation=landscape]) .item:after,:host(limel-chart[type=area][orientation=landscape]) .item:after{transform:translateX(-50%) translateY(50%);left:0;bottom:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[type=line][orientation=landscape]) .item:last-of-type:before,:host(limel-chart[type=area][orientation=landscape]) .item:last-of-type:before{display:none}:host(limel-chart[type=line][orientation=portrait]) .item,:host(limel-chart[type=area][orientation=portrait]) .item{width:100%}:host(limel-chart[type=line][orientation=portrait]) .item:after,:host(limel-chart[type=area][orientation=portrait]) .item:after{transform:translateX(-50%) translateY(-50%);left:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[type=area]) .item:after{opacity:0}:host(limel-chart[type=area]) .item:hover:after,:host(limel-chart[type=area]) .item:focus-visible:after{opacity:1}:host(limel-chart[type=area]) .item:hover:before,:host(limel-chart[type=area]) .item:focus-visible:before{opacity:0.7}:host(limel-chart[type=area][orientation=landscape]){}:host(limel-chart[type=area][orientation=landscape]) .item:before{clip-path:polygon(0 calc((100 - var(--limel-chart-item-offset)) * 1%), 0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1%), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1%), 100% calc((100 - var(--limel-chart-next-item-offset)) * 1%))}:host(limel-chart[type=area][orientation=portrait]){}:host(limel-chart[type=area][orientation=portrait]) .item:before{clip-path:polygon(calc(var(--limel-chart-item-offset) * 1%) 0, calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%) 0, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1%) 100%, calc(var(--limel-chart-next-item-offset) * 1%) 100%)}:host(limel-chart[type=line]){--limel-chart-line-thickness:0.125rem}:host(limel-chart[type=line]) .item:hover:before{opacity:0.4}:host(limel-chart[type=line][orientation=landscape]){}:host(limel-chart[type=line][orientation=landscape]) .item:hover{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) left/1px 100% no-repeat}:host(limel-chart[type=line][orientation=landscape]) .item:before{clip-path:polygon(0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1%), 0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1% + var(--limel-chart-line-thickness)), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1% + var(--limel-chart-line-thickness)), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1%))}:host(limel-chart[type=line][orientation=portrait]){}:host(limel-chart[type=line][orientation=portrait]) .item:hover{background:linear-gradient(to right, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) top/100% 1px no-repeat}:host(limel-chart[type=line][orientation=portrait]) .item:before{clip-path:polygon(calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%) 0, calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1% + var(--limel-chart-line-thickness)) 0, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1% + var(--limel-chart-line-thickness)) 100%, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1%) 100%)}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item{background:conic-gradient(transparent 0 calc(var(--limel-chart-item-offset) * 1%), var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8))) calc(var(--limel-chart-item-offset) * 1%) calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%), transparent calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%))}:host(limel-chart[type=pie]) .item:focus,:host(limel-chart[type=pie]) .item:focus-visible,:host(limel-chart[type=doughnut]) .item:focus,:host(limel-chart[type=doughnut]) .item:focus-visible{outline:none}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item{pointer-events:none}:host(limel-chart[type=doughnut]) .chart:after{aspect-ratio:1;content:\"\";position:absolute;inset:0;margin:auto;max-width:60%;max-height:60%;border-radius:50%;background-color:rgb(var(--contrast-100))}:host(limel-chart[type=ring]) .chart:after{content:\"\";position:absolute;inset:0;aspect-ratio:1;border-radius:50%;max-height:calc(100% - var(--limel-chart-number-of-items) * 100% / (var(--limel-chart-number-of-items) + 1));max-width:calc(100% - var(--limel-chart-number-of-items) * 100% / (var(--limel-chart-number-of-items) + 1));background-color:var(--limel-chart-background-color, rgb(var(--contrast-200)))}:host(limel-chart[type=ring]) .chart:has(.item:hover) .item,:host(limel-chart[type=ring]) .chart:has(.item:focus-visible) .item{opacity:1;filter:grayscale(1)}:host(limel-chart[type=ring]) .chart:after,:host(limel-chart[type=ring]) .item{margin:auto;border:1px solid var(--limel-chart-background-color, rgb(var(--contrast-400)))}:host(limel-chart[type=ring]) .item{background:conic-gradient(var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8))) 0 calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%), var(--chart-background-color, rgb(var(--contrast-200))) calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%));max-width:calc(100% - var(--limel-chart-item-index) * 100% / (var(--limel-chart-number-of-items) + 1));max-height:calc(100% - var(--limel-chart-item-index) * 100% / (var(--limel-chart-number-of-items) + 1))}:host(limel-chart[type=ring]) .item:focus-visible,:host(limel-chart[type=ring]) .item:hover{filter:grayscale(0) !important}:host(limel-chart[type=stacked-bar]) .chart{display:flex;border-radius:0.25rem;overflow:hidden;background-color:var(--chart-background-color, rgb(var(--contrast-800), 0.2))}:host(limel-chart[type=stacked-bar]) .item{display:flex;border-radius:var(--chart-item-border-radius, 0);background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=stacked-bar]) .item:last-of-type:not(:focus-visible){box-shadow:none !important}:host(limel-chart[type=stacked-bar][orientation=landscape]) .chart{flex-direction:row}:host(limel-chart[type=stacked-bar][orientation=landscape]) .item{min-height:0.5rem;width:calc(var(--limel-chart-item-size) * 1%)}:host(limel-chart[type=stacked-bar][orientation=landscape]) .item:not(:focus-visible){box-shadow:-1px 0 0 0 var(--chart-item-divider-color, rgb(var(--color-white), 0.6)) inset}:host(limel-chart[type=stacked-bar][orientation=portrait]) .chart{flex-direction:column-reverse}:host(limel-chart[type=stacked-bar][orientation=portrait]) .item{min-width:0.5rem;height:calc(var(--limel-chart-item-size) * 1%)}:host(limel-chart[type=stacked-bar][orientation=portrait]) .item:not(:focus-visible){box-shadow:0 -1px 0 0 rgb(var(--color-white), 0.6) inset}:host(limel-chart[type=nps]){--limel-chart-nps-gauge-angel:220deg}:host(limel-chart[type=nps]) table{min-height:4rem;min-width:4rem}:host(limel-chart[type=nps]) .chart{position:relative;display:flex;justify-content:center;align-items:center;aspect-ratio:1;margin:auto;width:unset;height:unset;max-width:100%;max-height:100%;rotate:calc(var(--limel-chart-nps-gauge-angel) / 2 * -1);transform:translate(-15%, -5%)}:host(limel-chart[type=nps]) .chart:before,:host(limel-chart[type=nps]) .chart:after{content:\"\";aspect-ratio:1;position:absolute;border-radius:50%;z-index:-1;min-height:0;min-width:0}:host(limel-chart[type=nps]) .chart:before{height:100%;max-height:100%;background:conic-gradient(rgb(var(--color-coral-default)) 0deg calc(var(--limel-chart-nps-gauge-angel) / 2), rgb(var(--color-amber-light)) calc(var(--limel-chart-nps-gauge-angel) / 2) calc(var(--limel-chart-nps-gauge-angel) * 0.65), rgb(var(--color-lime-light)) calc(var(--limel-chart-nps-gauge-angel) * 0.65) calc(var(--limel-chart-nps-gauge-angel) * 0.85), rgb(var(--color-lime-default)) calc(var(--limel-chart-nps-gauge-angel) * 0.85) var(--limel-chart-nps-gauge-angel), transparent var(--limel-chart-nps-gauge-angel))}:host(limel-chart[type=nps]) .chart:after{height:calc(100% - min(3rem, 20%) * 2);max-height:calc(100% - min(3rem, 20%) * 2);background:conic-gradient(var(--chart-background-color, rgb(var(--contrast-100))) 0deg var(--limel-chart-nps-gauge-angel), transparent var(--limel-chart-nps-gauge-angel))}:host(limel-chart[type=nps]) .item{display:flex;align-items:flex-start;justify-content:center;border-radius:0.5rem;position:absolute;height:calc(50% - min(3rem, 20%) + 0.5rem);width:0.5rem;transform:translateY(-50%) rotate(calc((var(--limel-chart-item-value) + 100) / 200 * var(--limel-chart-nps-gauge-angel)));transform-origin:bottom}:host(limel-chart[type=nps]) .item:hover,:host(limel-chart[type=nps]) .item:focus-visible{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/1px 100% no-repeat}:host(limel-chart[type=nps]) .item:before,:host(limel-chart[type=nps]) .item:after{content:\"\";position:absolute}:host(limel-chart[type=nps]) .item:before{transform:translateY(-60%);width:0.4rem;border-radius:1rem;border-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)));border-style:solid;border-bottom-width:1.75rem;border-right-color:transparent;border-left-color:transparent;border-top-color:transparent}:host(limel-chart[type=nps]) .item:after{border-radius:50%;background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)));aspect-ratio:1;height:clamp(0.75rem, 10%, 1.25rem);border:0.125rem solid rgb(var(--contrast-100), 0.8);box-shadow:var(--shadow-depth-8)}.axises{position:absolute;display:flex;justify-content:space-between;min-height:100%;min-width:100%;height:100%;width:100%}.axis-line{transition:opacity 0.4s ease;position:relative;opacity:0.2;font-size:0.625rem;border-color:var(--limel-chart-axis-line-color)}.axis-line:hover{opacity:0.6;transition-duration:0.2s}.axis-line.zero-line{opacity:0.6;z-index:1}.axis-line limel-badge{--badge-background-color:transparent;--badge-text-color:currentColor;position:absolute;text-align:right;min-width:2rem}:host(limel-chart[orientation=landscape]) .axises{flex-direction:column-reverse}:host(limel-chart[orientation=landscape]) .axis-line{border-bottom:1px solid;transform:translateY(50%)}:host(limel-chart[orientation=landscape]) .axis-line limel-badge{bottom:0;left:-2rem;transform:translateY(50%)}:host(limel-chart[orientation=portrait]) .axises{flex-direction:row}:host(limel-chart[orientation=portrait]) .axis-line{border-left:1px solid;transform:translateX(-50%)}:host(limel-chart[orientation=portrait]) .axis-line limel-badge{bottom:-1rem;right:-1rem}";
+const chartCss = "@charset \"UTF-8\";:host(limel-chart){--chart-axis-line-color:var(\n      --limel-chart-axis-line-color,\n      rgb(var(--contrast-900))\n  );box-sizing:border-box;isolation:isolate;display:flex;width:100%;height:100%;min-width:0;min-height:0;padding:var(--limel-chart-padding)}table{all:unset;border-collapse:collapse;border-spacing:0;empty-cells:show;position:relative;display:flex;width:100%;height:100%;min-width:0;min-height:0}table colgroup,table thead,table tbody,table tr,table th,table td{all:unset}table caption,table colgroup,table thead,table tfoot,table th,table td{position:absolute;width:0;height:0;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap}*,*:before,*:after{box-sizing:border-box}.chart{position:relative;flex-grow:1;width:100%;height:100%;min-height:0;min-width:0}.chart:has(.item:hover) .item,.chart:has(.item:focus-visible) .item{opacity:0.4}.item{transition:background-color 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease, opacity 0.4s ease;cursor:help}.item:focus{outline:none}.item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.item:focus-visible,.item:hover{opacity:1 !important}.item[role=button]{cursor:pointer}limel-spinner{margin:auto}:host(limel-chart[type=bar]) .chart,:host(limel-chart[type=dot]) .chart,:host(limel-chart[type=line]) .chart,:host(limel-chart[type=area]) .chart{display:flex;background-color:var(--chart-background-color, transparent)}:host(limel-chart[type=bar]) .item,:host(limel-chart[type=dot]) .item,:host(limel-chart[type=line]) .item,:host(limel-chart[type=area]) .item{position:relative;mix-blend-mode:hard-light}:host(limel-chart[type=bar][orientation=landscape]),:host(limel-chart[type=dot][orientation=landscape]),:host(limel-chart[type=line][orientation=landscape]),:host(limel-chart[type=area][orientation=landscape]){--limel-chart-padding:0.5rem 0.5rem 0.5rem 2rem}:host(limel-chart[type=bar][orientation=landscape]) .chart,:host(limel-chart[type=dot][orientation=landscape]) .chart,:host(limel-chart[type=line][orientation=landscape]) .chart,:host(limel-chart[type=area][orientation=landscape]) .chart{flex-direction:row;align-items:flex-end;overflow:auto hidden;padding:0 0.125rem}:host(limel-chart[type=bar][orientation=landscape]) .item,:host(limel-chart[type=dot][orientation=landscape]) .item,:host(limel-chart[type=line][orientation=landscape]) .item,:host(limel-chart[type=area][orientation=landscape]) .item{min-width:0.5rem;width:inherit}:host(limel-chart[type=bar][orientation=portrait]),:host(limel-chart[type=dot][orientation=portrait]),:host(limel-chart[type=line][orientation=portrait]),:host(limel-chart[type=area][orientation=portrait]){--limel-chart-padding:0.5rem 0.5rem 1rem 0.5rem}:host(limel-chart[type=bar][orientation=portrait]) .chart,:host(limel-chart[type=dot][orientation=portrait]) .chart,:host(limel-chart[type=line][orientation=portrait]) .chart,:host(limel-chart[type=area][orientation=portrait]) .chart{flex-direction:column;overflow:hidden auto;padding:0.125rem 0}:host(limel-chart[type=bar][orientation=portrait]) .item,:host(limel-chart[type=dot][orientation=portrait]) .item,:host(limel-chart[type=line][orientation=portrait]) .item,:host(limel-chart[type=area][orientation=portrait]) .item{min-height:0.5rem;height:inherit}:host(limel-chart[display-axis-labels][orientation=portrait]){--limel-chart-padding:0.5rem 0.5rem 2rem\n      1.25rem}:host(limel-chart[display-axis-labels][orientation=landscape]){--limel-chart-padding:0.5rem 0.5rem 1.25rem\n      3rem}:host(limel-chart[display-axis-labels][type=line]) table thead,:host(limel-chart[display-axis-labels][type=line]) table th,:host(limel-chart[display-axis-labels][type=dot]) table thead,:host(limel-chart[display-axis-labels][type=dot]) table th,:host(limel-chart[display-axis-labels][type=area]) table thead,:host(limel-chart[display-axis-labels][type=area]) table th,:host(limel-chart[display-axis-labels][type=bar]) table thead,:host(limel-chart[display-axis-labels][type=bar]) table th{all:unset}:host(limel-chart[display-axis-labels][type=line]) table th,:host(limel-chart[display-axis-labels][type=dot]) table th,:host(limel-chart[display-axis-labels][type=area]) table th,:host(limel-chart[display-axis-labels][type=bar]) table th{position:absolute;font-size:var(--limel-theme-default-small-font-size);max-width:100%;max-height:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(limel-chart[display-axis-labels][orientation=portrait]) table thead th:first-of-type{left:-1.25rem;writing-mode:sideways-lr}:host(limel-chart[display-axis-labels][orientation=portrait]) table thead th:last-of-type{bottom:-2rem;left:50%;transform:translateX(-50%)}:host(limel-chart[display-axis-labels][orientation=landscape]) table thead th:first-of-type{bottom:-1.25rem;left:50%;transform:translateX(-50%)}:host(limel-chart[display-axis-labels][orientation=landscape]) table thead th:last-of-type{left:-3rem;writing-mode:sideways-lr}:host(limel-chart[display-item-text][type=line]) td.text,:host(limel-chart[display-item-text][type=area]) td.text,:host(limel-chart[display-item-text][type=dot]) td.text,:host(limel-chart[display-item-text][type=bar]) td.text{all:unset;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;position:absolute;font-size:0.75rem;max-width:max(5rem, 100%);mix-blend-mode:difference}:host(limel-chart[display-item-value][type=line]) td.value,:host(limel-chart[display-item-value][type=area]) td.value,:host(limel-chart[display-item-value][type=dot]) td.value,:host(limel-chart[display-item-value][type=bar]) td.value{all:unset;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;position:absolute;font-size:0.75rem;max-width:max(5rem, 100%);border-radius:9rem;padding:0 0.25rem;background-color:rgb(var(--contrast-100), 0.7);box-shadow:var(--shadow-brighten-edges-outside)}:host(limel-chart[display-item-value][type=line]) .item.has-value-zero td.value,:host(limel-chart[display-item-value][type=area]) .item.has-value-zero td.value,:host(limel-chart[display-item-value][type=dot]) .item.has-value-zero td.value,:host(limel-chart[display-item-value][type=bar]) .item.has-value-zero td.value{opacity:0}:host(limel-chart[display-item-text][orientation=landscape]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-text][orientation=landscape]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=landscape]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-value][orientation=landscape]) .item.has-negative-value-only td.value{transform:rotateX(180deg)}:host(limel-chart[display-item-text][orientation=landscape]) .item.has-value-zero td.text,:host(limel-chart[display-item-value][orientation=landscape]) .item.has-value-zero td.text{transform:translateY(-50%)}:host(limel-chart[display-item-text][orientation=portrait]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-text][orientation=portrait]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=portrait]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-value][orientation=portrait]) .item.has-negative-value-only td.value{transform:rotateY(180deg)}:host(limel-chart[display-item-text][orientation=landscape][type=bar]) td.value,:host(limel-chart[display-item-value][orientation=landscape][type=bar]) td.value{top:0;transform:translateY(-50%)}:host(limel-chart[display-item-text][orientation=landscape][type=bar]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=landscape][type=bar]) .item.has-negative-value-only td.value{transform:rotateX(180deg) translateY(50%)}:host(limel-chart[display-item-text][orientation=portrait][type=bar]) td.value,:host(limel-chart[display-item-value][orientation=portrait][type=bar]) td.value{right:0;transform:translateX(50%)}:host(limel-chart[display-item-text][orientation=portrait][type=bar]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=portrait][type=bar]) .item.has-negative-value-only td.value{transform:rotateY(180deg) translateX(-50%)}:host(limel-chart[display-item-text][orientation=portrait][type=bar]) .item.has-value-zero td.text,:host(limel-chart[display-item-value][orientation=portrait][type=bar]) .item.has-value-zero td.text{transform:translateX(50%)}:host(limel-chart[display-item-text][orientation=landscape][type=dot]) td.value,:host(limel-chart[display-item-value][orientation=landscape][type=dot]) td.value{top:1rem}:host(limel-chart[display-item-text][orientation=landscape][type=dot]) td.text,:host(limel-chart[display-item-value][orientation=landscape][type=dot]) td.text{top:0}:host(limel-chart[display-item-text][orientation=landscape][type=dot]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=landscape][type=dot]) .item.has-negative-value-only td.value{transform:rotateX(180deg)}:host(limel-chart[display-item-text][orientation=landscape][type=dot]) .item.has-value-zero td.text,:host(limel-chart[display-item-value][orientation=landscape][type=dot]) .item.has-value-zero td.text{transform:translateY(-100%)}:host(limel-chart[display-item-text][orientation=portrait][type=dot]) td.value,:host(limel-chart[display-item-value][orientation=portrait][type=dot]) td.value{right:-0.25rem;transform:translateX(100%)}:host(limel-chart[display-item-text][orientation=portrait][type=dot]) td.text,:host(limel-chart[display-item-value][orientation=portrait][type=dot]) td.text{right:0.5rem}:host(limel-chart[display-item-text][orientation=portrait][type=dot]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=portrait][type=dot]) .item.has-negative-value-only td.value{transform:rotateY(180deg) translateX(-100%)}:host(limel-chart[display-item-text][orientation=landscape][type=line]) td.text,:host(limel-chart[display-item-text][orientation=landscape][type=line]) td.value,:host(limel-chart[display-item-value][orientation=landscape][type=line]) td.text,:host(limel-chart[display-item-value][orientation=landscape][type=line]) td.value,:host(limel-chart[display-item-text][orientation=landscape][type=area]) td.text,:host(limel-chart[display-item-text][orientation=landscape][type=area]) td.value,:host(limel-chart[display-item-value][orientation=landscape][type=area]) td.text,:host(limel-chart[display-item-value][orientation=landscape][type=area]) td.value{left:0.5rem;bottom:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[display-item-text][orientation=landscape][type=line]) td.text,:host(limel-chart[display-item-value][orientation=landscape][type=line]) td.text,:host(limel-chart[display-item-text][orientation=landscape][type=area]) td.text,:host(limel-chart[display-item-value][orientation=landscape][type=area]) td.text{transform:translateY(150%)}:host(limel-chart[display-item-text][orientation=landscape][type=line]) td.value,:host(limel-chart[display-item-value][orientation=landscape][type=line]) td.value,:host(limel-chart[display-item-text][orientation=landscape][type=area]) td.value,:host(limel-chart[display-item-value][orientation=landscape][type=area]) td.value{transform:translateY(50%)}:host(limel-chart[display-item-text][orientation=landscape][type=line]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-value][orientation=landscape][type=line]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-text][orientation=landscape][type=area]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-value][orientation=landscape][type=area]) .item.has-negative-value-only td.text{transform:translateY(50%)}:host(limel-chart[display-item-text][orientation=landscape][type=line]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=landscape][type=line]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-text][orientation=landscape][type=area]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=landscape][type=area]) .item.has-negative-value-only td.value{transform:translateY(150%)}:host(limel-chart[display-item-text][orientation=portrait][type=line]) td.text,:host(limel-chart[display-item-text][orientation=portrait][type=line]) td.value,:host(limel-chart[display-item-value][orientation=portrait][type=line]) td.text,:host(limel-chart[display-item-value][orientation=portrait][type=line]) td.value,:host(limel-chart[display-item-text][orientation=portrait][type=area]) td.text,:host(limel-chart[display-item-text][orientation=portrait][type=area]) td.value,:host(limel-chart[display-item-value][orientation=portrait][type=area]) td.text,:host(limel-chart[display-item-value][orientation=portrait][type=area]) td.value{left:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[display-item-text][orientation=portrait][type=line]) td.text,:host(limel-chart[display-item-value][orientation=portrait][type=line]) td.text,:host(limel-chart[display-item-text][orientation=portrait][type=area]) td.text,:host(limel-chart[display-item-value][orientation=portrait][type=area]) td.text{transform:translateX(-100%)}:host(limel-chart[display-item-text][orientation=portrait][type=line]) td.value,:host(limel-chart[display-item-value][orientation=portrait][type=line]) td.value,:host(limel-chart[display-item-text][orientation=portrait][type=area]) td.value,:host(limel-chart[display-item-value][orientation=portrait][type=area]) td.value{transform:translateX(0)}:host(limel-chart[display-item-text][orientation=portrait][type=line]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-value][orientation=portrait][type=line]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-text][orientation=portrait][type=area]) .item.has-negative-value-only td.text,:host(limel-chart[display-item-value][orientation=portrait][type=area]) .item.has-negative-value-only td.text{transform:translateX(0)}:host(limel-chart[display-item-text][orientation=portrait][type=line]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=portrait][type=line]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-text][orientation=portrait][type=area]) .item.has-negative-value-only td.value,:host(limel-chart[display-item-value][orientation=portrait][type=area]) .item.has-negative-value-only td.value{transform:translateX(-100%)}:host(limel-chart[type=pie]) table,:host(limel-chart[type=doughnut]) table,:host(limel-chart[type=ring]) table{min-height:2rem;min-width:2rem}:host(limel-chart[type=pie]) .chart,:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .chart,:host(limel-chart[type=doughnut]) .item,:host(limel-chart[type=ring]) .chart,:host(limel-chart[type=ring]) .item{aspect-ratio:1;display:flex;margin:auto}:host(limel-chart[type=pie]) .chart,:host(limel-chart[type=doughnut]) .chart,:host(limel-chart[type=ring]) .chart{justify-content:center;align-items:center}:host(limel-chart[type=pie]) .chart:before,:host(limel-chart[type=doughnut]) .chart:before,:host(limel-chart[type=ring]) .chart:before{aspect-ratio:1;content:\"\";position:absolute;z-index:0;inset:0;margin:auto;border-radius:50%;max-width:100%;max-height:100%;background-color:var(--chart-background-color, rgb(var(--contrast-200)))}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item,:host(limel-chart[type=ring]) .item{max-width:100%;max-height:100%;border-radius:50%;position:absolute;inset:0}:host(limel-chart[type=bar]) .chart,:host(limel-chart[type=dot]) .chart{gap:0.5rem}:host(limel-chart[type=bar]) .item,:host(limel-chart[type=dot]) .item{display:flex;align-items:center;justify-content:center;border-radius:var(--chart-item-border-radius, 0.125rem)}:host(limel-chart[type=bar]) .item{background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=dot]) .item:before,:host(limel-chart[type=dot]) .item:after{content:\"\";position:absolute;margin:auto;width:0.5rem;height:0.5rem;border-radius:50%}:host(limel-chart[type=dot]) .item::after{background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=dot]) .item.has-start-value:before{background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=bar][orientation=landscape]) .item,:host(limel-chart[type=dot][orientation=landscape]) .item{height:calc(var(--limel-chart-item-size) * 1%);bottom:calc(var(--limel-chart-item-offset) * 1%)}:host(limel-chart[type=bar][orientation=landscape]) .item.has-negative-value-only,:host(limel-chart[type=dot][orientation=landscape]) .item.has-negative-value-only{height:calc(var(--limel-chart-item-size) * -1%);transform-origin:bottom;transform:rotateX(180deg)}:host(limel-chart[type=dot][orientation=landscape]) .item.has-start-value,:host(limel-chart[type=dot][orientation=landscape]) .item:hover,:host(limel-chart[type=dot][orientation=landscape]) .item:focus-visible{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/1px 100% no-repeat}:host(limel-chart[type=dot][orientation=landscape]) .item:before{inset:auto 0 0 0;transform:translateY(50%)}:host(limel-chart[type=dot][orientation=landscape]) .item::after{inset:0 0 auto 0;transform:translateY(-50%)}:host(limel-chart[type=bar][orientation=portrait]) .item,:host(limel-chart[type=dot][orientation=portrait]) .item{width:calc(var(--limel-chart-item-size) * 1%);left:calc(var(--limel-chart-item-offset) * 1%)}:host(limel-chart[type=bar][orientation=portrait]) .item.has-negative-value-only,:host(limel-chart[type=dot][orientation=portrait]) .item.has-negative-value-only{width:calc(var(--limel-chart-item-size) * -1%);transform-origin:left;transform:rotateY(180deg)}:host(limel-chart[type=dot][orientation=portrait]) .item.has-start-value,:host(limel-chart[type=dot][orientation=portrait]) .item:hover,:host(limel-chart[type=dot][orientation=portrait]) .item:focus-visible{background:linear-gradient(to right, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/100% 1px no-repeat}:host(limel-chart[type=dot][orientation=portrait]) .item:before{inset:0 auto 0 0;transform:translateX(-50%)}:host(limel-chart[type=dot][orientation=portrait]) .item:after{inset:0 0 0 auto;transform:translateX(50%)}:host(limel-chart[type=area]) .item,:host(limel-chart[type=line]) .item{position:relative}:host(limel-chart[type=area]) .item:after,:host(limel-chart[type=line]) .item:after{margin:auto;width:0.5rem;height:0.5rem;border-radius:50%;border:1px solid rgb(var(--contrast-100))}:host(limel-chart[type=area]) .item:before,:host(limel-chart[type=line]) .item:before{inset:0}:host(limel-chart[type=area]) .item:after,:host(limel-chart[type=area]) .item:before,:host(limel-chart[type=line]) .item:after,:host(limel-chart[type=line]) .item:before{transition:border-color 0.2s ease, opacity 0.4s ease;content:\"\";position:absolute;background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=area]) .item:hover:after,:host(limel-chart[type=area]) .item:focus-visible:after,:host(limel-chart[type=line]) .item:hover:after,:host(limel-chart[type=line]) .item:focus-visible:after{border-color:transparent}:host(limel-chart[type=line][orientation=landscape]) .item,:host(limel-chart[type=area][orientation=landscape]) .item{height:100%}:host(limel-chart[type=line][orientation=landscape]) .item:after,:host(limel-chart[type=area][orientation=landscape]) .item:after{transform:translateX(-50%) translateY(50%);left:0;bottom:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[type=line][orientation=landscape]) .item:last-of-type:before,:host(limel-chart[type=area][orientation=landscape]) .item:last-of-type:before{display:none}:host(limel-chart[type=line][orientation=portrait]) .item,:host(limel-chart[type=area][orientation=portrait]) .item{width:100%}:host(limel-chart[type=line][orientation=portrait]) .item:after,:host(limel-chart[type=area][orientation=portrait]) .item:after{transform:translateX(-50%) translateY(-50%);left:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[type=area]) .item:after{opacity:0}:host(limel-chart[type=area]) .item:hover:after,:host(limel-chart[type=area]) .item:focus-visible:after{opacity:1}:host(limel-chart[type=area]) .item:hover:before,:host(limel-chart[type=area]) .item:focus-visible:before{opacity:0.7}:host(limel-chart[type=area][orientation=landscape]){}:host(limel-chart[type=area][orientation=landscape]) .item:before{clip-path:polygon(0 calc((100 - var(--limel-chart-item-offset)) * 1%), 0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1%), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1%), 100% calc((100 - var(--limel-chart-next-item-offset)) * 1%))}:host(limel-chart[type=area][orientation=portrait]){}:host(limel-chart[type=area][orientation=portrait]) .item:before{clip-path:polygon(calc(var(--limel-chart-item-offset) * 1%) 0, calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%) 0, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1%) 100%, calc(var(--limel-chart-next-item-offset) * 1%) 100%)}:host(limel-chart[type=line]){--limel-chart-line-thickness:0.125rem}:host(limel-chart[type=line]) .item:hover:before{opacity:0.4}:host(limel-chart[type=line][orientation=landscape]){}:host(limel-chart[type=line][orientation=landscape]) .item:hover{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) left/1px 100% no-repeat}:host(limel-chart[type=line][orientation=landscape]) .item:before{clip-path:polygon(0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1%), 0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1% + var(--limel-chart-line-thickness)), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1% + var(--limel-chart-line-thickness)), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1%))}:host(limel-chart[type=line][orientation=portrait]){}:host(limel-chart[type=line][orientation=portrait]) .item:hover{background:linear-gradient(to right, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) top/100% 1px no-repeat}:host(limel-chart[type=line][orientation=portrait]) .item:before{clip-path:polygon(calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%) 0, calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1% + var(--limel-chart-line-thickness)) 0, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1% + var(--limel-chart-line-thickness)) 100%, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1%) 100%)}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item{background:conic-gradient(transparent 0 calc(var(--limel-chart-item-offset) * 1%), var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8))) calc(var(--limel-chart-item-offset) * 1%) calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%), transparent calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%))}:host(limel-chart[type=pie]) .item:focus,:host(limel-chart[type=pie]) .item:focus-visible,:host(limel-chart[type=doughnut]) .item:focus,:host(limel-chart[type=doughnut]) .item:focus-visible{outline:none}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item{pointer-events:none}:host(limel-chart[type=doughnut]) .chart:after{aspect-ratio:1;content:\"\";position:absolute;inset:0;margin:auto;max-width:60%;max-height:60%;border-radius:50%;background-color:rgb(var(--contrast-100))}:host(limel-chart[type=ring]) .chart:after{content:\"\";position:absolute;inset:0;aspect-ratio:1;border-radius:50%;max-height:calc(100% - var(--limel-chart-number-of-items) * 100% / (var(--limel-chart-number-of-items) + 1));max-width:calc(100% - var(--limel-chart-number-of-items) * 100% / (var(--limel-chart-number-of-items) + 1));background-color:var(--limel-chart-background-color, rgb(var(--contrast-200)))}:host(limel-chart[type=ring]) .chart:has(.item:hover) .item,:host(limel-chart[type=ring]) .chart:has(.item:focus-visible) .item{opacity:1;filter:grayscale(1)}:host(limel-chart[type=ring]) .chart:after,:host(limel-chart[type=ring]) .item{margin:auto;border:1px solid var(--limel-chart-background-color, rgb(var(--contrast-400)))}:host(limel-chart[type=ring]) .item{background:conic-gradient(var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8))) 0 calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%), var(--chart-background-color, rgb(var(--contrast-200))) calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%));max-width:calc(100% - var(--limel-chart-item-index) * 100% / (var(--limel-chart-number-of-items) + 1));max-height:calc(100% - var(--limel-chart-item-index) * 100% / (var(--limel-chart-number-of-items) + 1))}:host(limel-chart[type=ring]) .item:focus-visible,:host(limel-chart[type=ring]) .item:hover{filter:grayscale(0) !important}:host(limel-chart[type=stacked-bar]) .chart{display:flex;border-radius:0.25rem;overflow:hidden;background-color:var(--chart-background-color, rgb(var(--contrast-800), 0.2))}:host(limel-chart[type=stacked-bar]) .item{display:flex;border-radius:var(--chart-item-border-radius, 0);background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=stacked-bar]) .item:last-of-type:not(:focus-visible){box-shadow:none !important}:host(limel-chart[type=stacked-bar][orientation=landscape]) .chart{flex-direction:row}:host(limel-chart[type=stacked-bar][orientation=landscape]) .item{min-height:0.5rem;width:calc(var(--limel-chart-item-size) * 1%)}:host(limel-chart[type=stacked-bar][orientation=landscape]) .item:not(:focus-visible){box-shadow:-1px 0 0 0 var(--chart-item-divider-color, rgb(var(--color-white), 0.6)) inset}:host(limel-chart[type=stacked-bar][orientation=portrait]) .chart{flex-direction:column-reverse}:host(limel-chart[type=stacked-bar][orientation=portrait]) .item{min-width:0.5rem;height:calc(var(--limel-chart-item-size) * 1%)}:host(limel-chart[type=stacked-bar][orientation=portrait]) .item:not(:focus-visible){box-shadow:0 -1px 0 0 rgb(var(--color-white), 0.6) inset}:host(limel-chart[type=nps]){--limel-chart-nps-gauge-angel:220deg}:host(limel-chart[type=nps]) table{min-height:4rem;min-width:4rem}:host(limel-chart[type=nps]) .chart{position:relative;display:flex;justify-content:center;align-items:center;aspect-ratio:1;margin:auto;width:unset;height:unset;max-width:100%;max-height:100%;rotate:calc(var(--limel-chart-nps-gauge-angel) / 2 * -1);transform:translate(-15%, -5%)}:host(limel-chart[type=nps]) .chart:before,:host(limel-chart[type=nps]) .chart:after{content:\"\";aspect-ratio:1;position:absolute;border-radius:50%;z-index:-1;min-height:0;min-width:0}:host(limel-chart[type=nps]) .chart:before{height:100%;max-height:100%;background:conic-gradient(rgb(var(--color-coral-default)) 0deg calc(var(--limel-chart-nps-gauge-angel) / 2), rgb(var(--color-amber-light)) calc(var(--limel-chart-nps-gauge-angel) / 2) calc(var(--limel-chart-nps-gauge-angel) * 0.65), rgb(var(--color-lime-light)) calc(var(--limel-chart-nps-gauge-angel) * 0.65) calc(var(--limel-chart-nps-gauge-angel) * 0.85), rgb(var(--color-lime-default)) calc(var(--limel-chart-nps-gauge-angel) * 0.85) var(--limel-chart-nps-gauge-angel), transparent var(--limel-chart-nps-gauge-angel))}:host(limel-chart[type=nps]) .chart:after{height:calc(100% - min(3rem, 20%) * 2);max-height:calc(100% - min(3rem, 20%) * 2);background:conic-gradient(var(--chart-background-color, rgb(var(--contrast-100))) 0deg var(--limel-chart-nps-gauge-angel), transparent var(--limel-chart-nps-gauge-angel))}:host(limel-chart[type=nps]) .item{display:flex;align-items:flex-start;justify-content:center;border-radius:0.5rem;position:absolute;height:calc(50% - min(3rem, 20%) + 0.5rem);width:0.5rem;transform:translateY(-50%) rotate(calc((var(--limel-chart-item-value) + 100) / 200 * var(--limel-chart-nps-gauge-angel)));transform-origin:bottom}:host(limel-chart[type=nps]) .item:hover,:host(limel-chart[type=nps]) .item:focus-visible{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/1px 100% no-repeat}:host(limel-chart[type=nps]) .item:before,:host(limel-chart[type=nps]) .item:after{content:\"\";position:absolute}:host(limel-chart[type=nps]) .item:before{transform:translateY(-60%);width:0.4rem;border-radius:1rem;border-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)));border-style:solid;border-bottom-width:1.75rem;border-right-color:transparent;border-left-color:transparent;border-top-color:transparent}:host(limel-chart[type=nps]) .item:after{border-radius:50%;background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)));aspect-ratio:1;height:clamp(0.75rem, 10%, 1.25rem);border:0.125rem solid rgb(var(--contrast-100), 0.8);box-shadow:var(--shadow-depth-8)}.axises{position:absolute;display:flex;justify-content:space-between;min-height:100%;min-width:100%;height:100%;width:100%}.axis-line{transition:opacity 0.4s ease;position:relative;opacity:0.2;font-size:0.625rem;border-color:var(--limel-chart-axis-line-color)}.axis-line:hover{opacity:0.6;transition-duration:0.2s}.axis-line.zero-line{opacity:0.6;z-index:1}.axis-line limel-badge{--badge-background-color:transparent;--badge-text-color:currentColor;position:absolute;text-align:right;min-width:2rem}:host(limel-chart[orientation=landscape]) .axises{flex-direction:column-reverse}:host(limel-chart[orientation=landscape]) .axis-line{border-bottom:1px solid;transform:translateY(50%)}:host(limel-chart[orientation=landscape]) .axis-line limel-badge{bottom:0;left:-2rem;transform:translateY(50%)}:host(limel-chart[orientation=portrait]) .axises{flex-direction:row}:host(limel-chart[orientation=portrait]) .axis-line{border-left:1px solid;transform:translateX(-50%)}:host(limel-chart[orientation=portrait]) .axis-line limel-badge{bottom:-1rem;right:-1rem}";
 const PERCENT = 100;
 const DEFAULT_INCREMENT_SIZE = 10;
@@ -34,6 +34,8 @@ const Chart = class {
     this.accessibleItemsLabel = undefined;
     this.accessibleValuesLabel = undefined;
     this.displayAxisLabels = false;
+    this.displayItemText = false;
+    this.displayItemValue = false;
     this.items = undefined;
     this.type = 'stacked-bar';
     this.orientation = 'landscape';
@@ -93,7 +95,7 @@ const Chart = class {
         offset = cumulativeOffset;
         cumulativeOffset += size;
       }
-      return (h("tr", { style: this.getItemStyle(item, index, size, offset), class: this.getItemClass(item), key: itemId, id: itemId, "data-index": index, tabIndex: 0, role: item.clickable ? 'button' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("td", null, this.getItemText(item)), h("td", null, this.getFormattedValue(item)), this.renderTooltip(item, itemId, size)));
+      return (h("tr", { style: this.getItemStyle(item, index, size, offset), class: this.getItemClass(item), key: itemId, id: itemId, "data-index": index, tabIndex: 0, role: item.clickable ? 'button' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("td", { class: "text" }, this.getItemText(item)), h("td", { class: "value" }, this.getFormattedValue(item)), this.renderTooltip(item, itemId, size)));
     });
   }
   getItemStyle(item, index, size, offset) {
@@ -118,6 +120,7 @@ const Chart = class {
       item: true,
       'has-start-value': Array.isArray(item.value),
       'has-negative-value-only': this.getMaximumValue(item) < 0 && !this.isRangeItem(item),
+      'has-value-zero': this.getMaximumValue(item) === 0,
     };
   }
   calculateSizeAndOffset(item) {

package/dist/esm/limel-chart.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"limel-chart.entry.js","mappings":"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","names":[],"sources":["./src/components/chart/chart.scss?tag=limel-chart&encapsulation=shadow","./src/components/chart/chart.tsx"],"sourcesContent":["@use '../../style/mixins';\n$min-item-size: 0.5rem;\n$default-item-color: var(--chart-item-color, rgb(var(--contrast-1100), 0.8));\n\n/*\n @prop --chart-background-color: Defines the background color of the chart. Defaults to `transparent` for _most_ chart types.\n* @prop --chart-item-color: If no color is defined for chart items, this color will be use. Defaults to `rgb(var(--contrast-1100), 0.8)`.\n* @prop --chart-item-divider-color: Defines the color that visually separates items in some charts, such as `stacked-bar` chart items. Defaults to `rgb(var(--color-white), 0.6)`.\n* @prop --chart-axis-line-color: Defines color of the axis lines. Defaults to `--contrast-900`. Note that lines have opacity as well, and get opaque on hover.\n* @prop --chart-item-border-radius: Defines the roundness of corners of items in a chart. Defaults to different values depending on the chart type. Does not have any effect on `pie` and `doughnut` types.\n/\n\n:host(limel-chart) {\n --chart-axis-line-color: var(\n --limel-chart-axis-line-color,\n rgb(var(--contrast-900))\n );\n box-sizing: border-box;\n isolation: isolate;\n\n display: flex;\n width: 100%;\n height: 100%;\n min-width: 0;\n min-height: 0;\n padding: var(--limel-chart-padding);\n}\n\ntable {\n // Since these are mainly \"resets\", no styles should be before them.\n all: unset;\n border-collapse: collapse;\n border-spacing: 0;\n empty-cells: show;\n\n position: relative;\n display: flex;\n width: 100%;\n height: 100%;\n min-width: 0;\n min-height: 0;\n\n colgroup,\n thead,\n tbody,\n tr,\n th,\n td {\n all: unset;\n }\n\n caption,\n colgroup,\n thead,\n tfoot,\n th,\n td {\n @include mixins.visually-hidden;\n }\n}\n\n,\n:before,\n:after {\n box-sizing: border-box;\n}\n\n.chart {\n position: relative;\n flex-grow: 1;\n width: 100%;\n height: 100%;\n min-height: 0;\n min-width: 0;\n\n &:has(.item:hover),\n &:has(.item:focus-visible) {\n .item {\n opacity: 0.4;\n }\n }\n}\n\n.item {\n @include mixins.visualize-keyboard-focus;\n transition:\n background-color 0.2s ease,\n box-shadow 0.2s ease,\n filter 0.2s ease,\n opacity 0.4s ease;\n cursor: help;\n\n &:focus-visible,\n &:hover {\n opacity: 1 !important;\n }\n\n &[role='button'] {\n cursor: pointer;\n }\n}\n\nlimel-spinner {\n margin: auto;\n}\n\n@mixin line(\n $direction: vertical,\n $color: rgb(var(--contrast-800), 0.4),\n $position: center\n) {\n @if $direction == vertical {\n background: linear-gradient(to bottom, $color 0%, $color 100%)\n $position/1px\n 100%\n no-repeat;\n } @else if $direction == horizontal {\n background: linear-gradient(to right, $color 0%, $color 100%)\n $position/100%\n 1px\n no-repeat;\n }\n}\n\n@import './partial-styles/_layout-for-charts-with-x-y-axises';\n@import './partial-styles/_layout-for-charts-with-circular-shape';\n@import './partial-styles/_bar-gantt-dot';\n@import './partial-styles/_area_line';\n@import './partial-styles/_pie-doughnut';\n@import './partial-styles/_ring';\n@import './partial-styles/_stacked-bar';\n@import './partial-styles/_nps';\n@import './partial-styles/_axises';\n","import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\nimport { Languages } from '../date-picker/date.types';\nimport translate from '../../global/translations';\nimport { createRandomString } from '../../util/random-string';\nimport { ChartItem } from './chart.types';\n\nconst PERCENT = 100;\nconst DEFAULT_INCREMENT_SIZE = 10;\n\n/*\n A chart is a graphical representation of data, in which\n * visual symbols such as such bars, dots, lines, or slices, represent\n * each data point, in comparison to others.\n \n @exampleComponent limel-example-chart-stacked-bar\n * @exampleComponent limel-example-chart-orientation\n * @exampleComponent limel-example-chart-max-value\n * @exampleComponent limel-example-chart-type-bar\n * @exampleComponent limel-example-chart-type-dot\n * @exampleComponent limel-example-chart-type-area\n * @exampleComponent limel-example-chart-type-line\n * @exampleComponent limel-example-chart-type-pie\n * @exampleComponent limel-example-chart-type-doughnut\n * @exampleComponent limel-example-chart-type-ring\n * @exampleComponent limel-example-chart-type-gantt\n * @exampleComponent limel-example-chart-type-nps\n * @exampleComponent limel-example-chart-multi-axis\n * @exampleComponent limel-example-chart-multi-axis-with-negative-start-values\n * @exampleComponent limel-example-chart-multi-axis-area-with-negative-start-values\n * @exampleComponent limel-example-chart-axis-increment\n * @exampleComponent limel-example-chart-clickable-items\n * @exampleComponent limel-example-chart-accessibility\n * @exampleComponent limel-example-chart-axis-labels\n * @exampleComponent limel-example-chart-styling\n * @exampleComponent limel-example-chart-creative-styling\n * @beta\n /\n\n@Component({\n tag: 'limel-chart',\n shadow: true,\n styleUrl: 'chart.scss',\n})\nexport class Chart {\n /\n Defines the language for translations.\n * Will translate the translatable strings on the components.\n /\n @Prop({ reflect: true })\n public language: Languages = 'en';\n\n /\n Helps users of assistive technologies to understand\n * the context of the chart, and what is being displayed.\n /\n @Prop({ reflect: true })\n public accessibleLabel?: string;\n\n /\n Helps users of assistive technologies to understand\n * what the items in the chart represent.\n * Defaults to the translation for \"items\" in the current language.\n /\n @Prop({ reflect: true })\n public accessibleItemsLabel?: string;\n\n /\n Helps users of assistive technologies to understand\n * what the values in the chart represent.\n * Defaults to the translation for \"value\" in the current language.\n /\n @Prop({ reflect: true })\n public accessibleValuesLabel?: string;\n\n /\n When set to true, renders visible labels for X and Y axes.\n * Only affects chart types with X and Y axes, such as area, bar, and line charts.\n /\n\n @Prop({ reflect: true })\n public displayAxisLabels = false;\n\n /\n List of items in the chart,\n * each representing a data point.\n /\n @Prop()\n public items!: ChartItem[];\n\n /\n Defines how items are visualized in the chart.\n /\n @Prop({ reflect: true })\n public type?:\n \| 'area'\n \| 'bar'\n \| 'doughnut'\n \| 'line'\n \| 'nps'\n \| 'pie'\n \| 'ring'\n \| 'dot'\n \| 'stacked-bar' = 'stacked-bar';\n\n /\n Defines whether the chart is intended to be displayed wide or tall.\n * Does not have any effect on chart types which generate circular forms.\n /\n @Prop({ reflect: true })\n public orientation?: 'landscape' \| 'portrait' = 'landscape';\n\n /\n Specifies the range that items' values could be in.\n * This is used in calculation of the size of the items in the chart.\n * When not provided, the sum of all values in the items will be considered as the range.\n /\n @Prop({ reflect: true })\n public maxValue?: number;\n\n /\n Specifies the increment for the axis lines.\n /\n @Prop({ reflect: true })\n public axisIncrement?: number;\n\n /\n Indicates whether the chart is in a loading state.\n /\n @Prop({ reflect: true })\n public loading: boolean = false;\n\n private range: {\n minValue: number;\n maxValue: number;\n totalRange: number;\n };\n\n /\n Fired when a chart item with `clickable` set to `true` is clicked\n /\n @Event()\n public interact: EventEmitter<ChartItem>;\n\n public componentWillLoad() {\n this.recalculateRangeData();\n }\n\n public render() {\n if (this.loading) {\n return <limel-spinner limeBranded={false} />;\n }\n\n return (\n <table\n aria-busy={this.loading ? 'true' : 'false'}\n aria-live=\"polite\"\n style={{\n '--limel-chart-number-of-items':\n this.items.length.toString(),\n }}\n >\n {this.renderCaption()}\n {this.renderTableHeader()}\n {this.renderAxises()}\n <tbody class=\"chart\">{this.renderItems()}</tbody>\n </table>\n );\n }\n\n private renderCaption() {\n if (!this.accessibleLabel) {\n return;\n }\n\n return <caption>{this.accessibleLabel}</caption>;\n }\n\n private renderTableHeader() {\n return (\n <thead>\n <tr>\n <th scope=\"col\">\n {this.accessibleItemsLabel ??\n translate.get('items', this.language)}\n </th>\n <th scope=\"col\">\n {this.accessibleValuesLabel ??\n translate.get('value', this.language)}\n </th>\n </tr>\n </thead>\n );\n }\n\n private renderAxises() {\n if (!['bar', 'dot', 'area', 'line'].includes(this.type)) {\n return;\n }\n\n const { minValue, maxValue } = this.range;\n const lines = [];\n const adjustedMinRange =\n Math.floor(minValue / this.axisIncrement) this.axisIncrement;\n const adjustedMaxRange =\n Math.ceil(maxValue / this.axisIncrement) * this.axisIncrement;\n\n for (\n let value = adjustedMinRange;\n value <= adjustedMaxRange;\n value += this.axisIncrement\n ) {\n lines.push(\n <div\n class={{\n 'axis-line': true,\n 'zero-line': value === 0,\n }}\n role=\"presentation\"\n >\n <limel-badge label={value} />\n </div>\n );\n }\n\n return (\n <div class=\"axises\" role=\"presentation\">\n {lines}\n </div>\n );\n }\n\n private renderItems() {\n if (!this.items?.length) {\n return;\n }\n\n let cumulativeOffset = 0;\n\n return this.items.map((item, index) => {\n const itemId = createRandomString();\n const sizeAndOffset = this.calculateSizeAndOffset(item);\n const size = sizeAndOffset.size;\n let offset = sizeAndOffset.offset;\n\n if (this.type === 'pie' \|\| this.type === 'doughnut') {\n offset = cumulativeOffset;\n cumulativeOffset += size;\n }\n\n return (\n <tr\n style={this.getItemStyle(item, index, size, offset)}\n class={this.getItemClass(item)}\n key={itemId}\n id={itemId}\n data-index={index}\n tabIndex={0}\n role={item.clickable ? 'button' : null}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n >\n <td>{this.getItemText(item)}</td>\n <td>{this.getFormattedValue(item)}</td>\n {this.renderTooltip(item, itemId, size)}\n </tr>\n );\n });\n }\n\n private getItemStyle(\n item: ChartItem,\n index: number,\n size: number,\n offset: number\n ): Record<string, string> {\n const style: Record<string, string> = {\n '--limel-chart-item-offset': `${offset}`,\n '--limel-chart-item-size': `${size}`,\n '--limel-chart-item-index': `${index}`,\n '--limel-chart-item-value': `${item.value}`,\n };\n\n if (item.color) {\n style['--limel-chart-item-color'] = item.color;\n }\n\n if (this.type === 'line' \|\| this.type === 'area') {\n const nextItem = this.calculateSizeAndOffset(this.items[index + 1]);\n\n style['--limel-chart-next-item-size'] = `${nextItem.size}`;\n style['--limel-chart-next-item-offset'] = `${nextItem.offset}`;\n }\n\n return style;\n }\n\n private getItemClass(item: ChartItem) {\n return {\n item: true,\n 'has-start-value': Array.isArray(item.value),\n 'has-negative-value-only':\n this.getMaximumValue(item) < 0 && !this.isRangeItem(item),\n };\n }\n\n private calculateSizeAndOffset(item?: ChartItem) {\n const { minValue, totalRange } = this.range;\n if (!item) {\n return {\n size: 0,\n offset: 0,\n };\n }\n\n let startValue = 0;\n if (this.isRangeItem(item)) {\n startValue = this.getMinimumValue(item);\n }\n\n const normalizedStart =\n ((startValue - minValue) / totalRange) * PERCENT;\n const normalizedEnd =\n ((this.getMaximumValue(item) - minValue) / totalRange) * PERCENT;\n\n return {\n size: normalizedEnd - normalizedStart,\n offset: normalizedStart,\n };\n }\n\n private getFormattedValue(item: ChartItem): string {\n const { value, formattedValue } = item;\n\n if (formattedValue) {\n return formattedValue;\n }\n\n if (Array.isArray(value)) {\n return `${value[0]} — ${value[1]}`;\n }\n\n return `${value}`;\n }\n\n private getItemText(item: ChartItem): string {\n return item.text;\n }\n\n private renderTooltip(item: ChartItem, itemId: string, size: number) {\n const text = this.getItemText(item);\n const PERCENT_DECIMAL = 2;\n const formattedValue = this.getFormattedValue(item);\n\n const tooltipProps: any = {\n label: text,\n helperLabel: formattedValue,\n elementId: itemId,\n };\n\n if (this.type !== 'bar' && this.type !== 'dot' && this.type !== 'nps') {\n tooltipProps.label = `${text} (${size.toFixed(PERCENT_DECIMAL)}%)`;\n }\n\n return (\n <limel-tooltip\n {...tooltipProps}\n openDirection={\n this.orientation === 'portrait' ? 'right' : 'top'\n }\n />\n );\n }\n\n private calculateRange() {\n if (this.range) {\n return this.range;\n }\n\n const minRange = Math.min(0, ...this.items.map(this.getMinimumValue));\n const maxRange = Math.max(...this.items.map(this.getMaximumValue));\n const totalSum = this.items.reduce(\n (sum, item) => sum + this.getMaximumValue(item),\n 0\n );\n\n let finalMaxRange = this.maxValue ?? maxRange;\n if (\n (this.type === 'pie' \|\| this.type === 'doughnut') &&\n !this.maxValue\n ) {\n finalMaxRange = totalSum;\n }\n\n if (!this.axisIncrement) {\n this.axisIncrement = this.calculateAxisIncrement(this.items);\n }\n\n const visualMaxValue =\n Math.ceil(finalMaxRange / this.axisIncrement) * this.axisIncrement;\n const visualMinValue =\n Math.floor(minRange / this.axisIncrement) * this.axisIncrement;\n const totalRange = visualMaxValue - visualMinValue;\n\n return {\n minValue: visualMinValue,\n maxValue: visualMaxValue,\n totalRange: totalRange,\n };\n }\n\n private calculateAxisIncrement(\n items: ChartItem[],\n steps: number = DEFAULT_INCREMENT_SIZE\n ) {\n const maxValue = Math.max(\n ...items.map((item) => {\n const value = item.value;\n if (Array.isArray(value)) {\n return Math.max(...value);\n }\n\n return value;\n })\n );\n\n const roughStep = maxValue / steps;\n\n const magnitude = 10 ** Math.floor(Math.log10(roughStep));\n\n return Math.ceil(roughStep / magnitude) * magnitude;\n }\n\n private getMinimumValue(item: ChartItem): number {\n const value = item.value;\n\n return Array.isArray(value) ? Math.min(...value) : value;\n }\n\n private getMaximumValue(item: ChartItem): number {\n const value = item.value;\n\n return Array.isArray(value) ? Math.max(...value) : value;\n }\n\n private isRangeItem(item: ChartItem): item is ChartItem<[number, number]> {\n return Array.isArray(item.value);\n }\n\n @Watch('items')\n @Watch('axisIncrement')\n @Watch('maxValue')\n handleChange() {\n this.range = null;\n this.recalculateRangeData();\n }\n\n private recalculateRangeData() {\n this.range = this.calculateRange();\n }\n\n private getClickableItem(target: HTMLElement): ChartItem \| undefined {\n const index = target.dataset.index;\n if (index === undefined) {\n return;\n }\n\n const item = this.items[Number(index)];\n if (!item.clickable) {\n return;\n }\n\n return item;\n }\n\n private readonly handleClick = (event: MouseEvent) => {\n const item = this.getClickableItem(event.currentTarget as HTMLElement);\n if (!item) {\n return;\n }\n\n event.stopPropagation();\n this.interact.emit(item);\n };\n\n private readonly handleKeyDown = (event: KeyboardEvent) => {\n if (event.key !== 'Enter' && event.key !== ' ') {\n return;\n }\n\n const item = this.getClickableItem(event.currentTarget as HTMLElement);\n if (!item) {\n return;\n }\n\n event.preventDefault();\n this.interact.emit(item);\n };\n}\n"],"version":3}
1	+ {"file":"limel-chart.entry.js","mappings":"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","names":[],"sources":["./src/components/chart/chart.scss?tag=limel-chart&encapsulation=shadow","./src/components/chart/chart.tsx"],"sourcesContent":["@use '../../style/mixins';\n$min-item-size: 0.5rem;\n$default-item-color: var(--chart-item-color, rgb(var(--contrast-1100), 0.8));\n\n/*\n @prop --chart-background-color: Defines the background color of the chart. Defaults to `transparent` for _most_ chart types.\n* @prop --chart-item-color: If no color is defined for chart items, this color will be use. Defaults to `rgb(var(--contrast-1100), 0.8)`.\n* @prop --chart-item-divider-color: Defines the color that visually separates items in some charts, such as `stacked-bar` chart items. Defaults to `rgb(var(--color-white), 0.6)`.\n* @prop --chart-axis-line-color: Defines color of the axis lines. Defaults to `--contrast-900`. Note that lines have opacity as well, and get opaque on hover.\n* @prop --chart-item-border-radius: Defines the roundness of corners of items in a chart. Defaults to different values depending on the chart type. Does not have any effect on `pie` and `doughnut` types.\n/\n\n:host(limel-chart) {\n --chart-axis-line-color: var(\n --limel-chart-axis-line-color,\n rgb(var(--contrast-900))\n );\n box-sizing: border-box;\n isolation: isolate;\n\n display: flex;\n width: 100%;\n height: 100%;\n min-width: 0;\n min-height: 0;\n padding: var(--limel-chart-padding);\n}\n\ntable {\n // Since these are mainly \"resets\", no styles should be before them.\n all: unset;\n border-collapse: collapse;\n border-spacing: 0;\n empty-cells: show;\n\n position: relative;\n display: flex;\n width: 100%;\n height: 100%;\n min-width: 0;\n min-height: 0;\n\n colgroup,\n thead,\n tbody,\n tr,\n th,\n td {\n all: unset;\n }\n\n caption,\n colgroup,\n thead,\n tfoot,\n th,\n td {\n @include mixins.visually-hidden;\n }\n}\n\n,\n:before,\n:after {\n box-sizing: border-box;\n}\n\n.chart {\n position: relative;\n flex-grow: 1;\n width: 100%;\n height: 100%;\n min-height: 0;\n min-width: 0;\n\n &:has(.item:hover),\n &:has(.item:focus-visible) {\n .item {\n opacity: 0.4;\n }\n }\n}\n\n.item {\n @include mixins.visualize-keyboard-focus;\n transition:\n background-color 0.2s ease,\n box-shadow 0.2s ease,\n filter 0.2s ease,\n opacity 0.4s ease;\n cursor: help;\n\n &:focus-visible,\n &:hover {\n opacity: 1 !important;\n }\n\n &[role='button'] {\n cursor: pointer;\n }\n}\n\nlimel-spinner {\n margin: auto;\n}\n\n@mixin line(\n $direction: vertical,\n $color: rgb(var(--contrast-800), 0.4),\n $position: center\n) {\n @if $direction == vertical {\n background: linear-gradient(to bottom, $color 0%, $color 100%)\n $position/1px\n 100%\n no-repeat;\n } @else if $direction == horizontal {\n background: linear-gradient(to right, $color 0%, $color 100%)\n $position/100%\n 1px\n no-repeat;\n }\n}\n\n@import './partial-styles/_layout-for-charts-with-x-y-axises';\n@import './partial-styles/_display-item-text';\n@import './partial-styles/_layout-for-charts-with-circular-shape';\n@import './partial-styles/_bar-gantt-dot';\n@import './partial-styles/_area_line';\n@import './partial-styles/_pie-doughnut';\n@import './partial-styles/_ring';\n@import './partial-styles/_stacked-bar';\n@import './partial-styles/_nps';\n@import './partial-styles/_axises';\n","import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\nimport { Languages } from '../date-picker/date.types';\nimport translate from '../../global/translations';\nimport { createRandomString } from '../../util/random-string';\nimport { ChartItem } from './chart.types';\n\nconst PERCENT = 100;\nconst DEFAULT_INCREMENT_SIZE = 10;\n\n/*\n A chart is a graphical representation of data, in which\n * visual symbols such as such bars, dots, lines, or slices, represent\n * each data point, in comparison to others.\n \n @exampleComponent limel-example-chart-stacked-bar\n * @exampleComponent limel-example-chart-orientation\n * @exampleComponent limel-example-chart-max-value\n * @exampleComponent limel-example-chart-type-bar\n * @exampleComponent limel-example-chart-type-dot\n * @exampleComponent limel-example-chart-type-area\n * @exampleComponent limel-example-chart-type-line\n * @exampleComponent limel-example-chart-type-pie\n * @exampleComponent limel-example-chart-type-doughnut\n * @exampleComponent limel-example-chart-type-ring\n * @exampleComponent limel-example-chart-type-gantt\n * @exampleComponent limel-example-chart-type-nps\n * @exampleComponent limel-example-chart-multi-axis\n * @exampleComponent limel-example-chart-multi-axis-with-negative-start-values\n * @exampleComponent limel-example-chart-multi-axis-area-with-negative-start-values\n * @exampleComponent limel-example-chart-axis-increment\n * @exampleComponent limel-example-chart-clickable-items\n * @exampleComponent limel-example-chart-accessibility\n * @exampleComponent limel-example-chart-axis-labels\n * @exampleComponent limel-example-chart-styling\n * @exampleComponent limel-example-chart-creative-styling\n * @beta\n /\n\n@Component({\n tag: 'limel-chart',\n shadow: true,\n styleUrl: 'chart.scss',\n})\nexport class Chart {\n /\n Defines the language for translations.\n * Will translate the translatable strings on the components.\n /\n @Prop({ reflect: true })\n public language: Languages = 'en';\n\n /\n Helps users of assistive technologies to understand\n * the context of the chart, and what is being displayed.\n /\n @Prop({ reflect: true })\n public accessibleLabel?: string;\n\n /\n Helps users of assistive technologies to understand\n * what the items in the chart represent.\n * Defaults to the translation for \"items\" in the current language.\n /\n @Prop({ reflect: true })\n public accessibleItemsLabel?: string;\n\n /\n Helps users of assistive technologies to understand\n * what the values in the chart represent.\n * Defaults to the translation for \"value\" in the current language.\n /\n @Prop({ reflect: true })\n public accessibleValuesLabel?: string;\n\n /\n When set to true, renders visible labels for X and Y axes.\n * Only affects chart types with X and Y axes, such as area, bar, and line charts.\n /\n\n @Prop({ reflect: true })\n public displayAxisLabels = false;\n\n /\n Makes the `text` of chart items constantly visible,\n * By default, item texts are displayed in a tooltip,\n * when the item is hovered or focused.\n * Only affects chart types with X and Y axes, such as area, bar, and line charts.\n /\n @Prop({ reflect: true })\n public displayItemText = false;\n\n /\n Makes the `value` (or `formattedValue`) of chart items constantly visible,\n * By default, item values are displayed in a tooltip,\n * when the item is hovered or focused.\n * Only affects chart types with X and Y axes, such as area, bar, and line charts.\n /\n @Prop({ reflect: true })\n public displayItemValue = false;\n\n /\n List of items in the chart,\n * each representing a data point.\n /\n @Prop()\n public items!: ChartItem[];\n\n /\n Defines how items are visualized in the chart.\n /\n @Prop({ reflect: true })\n public type?:\n \| 'area'\n \| 'bar'\n \| 'doughnut'\n \| 'line'\n \| 'nps'\n \| 'pie'\n \| 'ring'\n \| 'dot'\n \| 'stacked-bar' = 'stacked-bar';\n\n /\n Defines whether the chart is intended to be displayed wide or tall.\n * Does not have any effect on chart types which generate circular forms.\n /\n @Prop({ reflect: true })\n public orientation?: 'landscape' \| 'portrait' = 'landscape';\n\n /\n Specifies the range that items' values could be in.\n * This is used in calculation of the size of the items in the chart.\n * When not provided, the sum of all values in the items will be considered as the range.\n /\n @Prop({ reflect: true })\n public maxValue?: number;\n\n /\n Specifies the increment for the axis lines.\n /\n @Prop({ reflect: true })\n public axisIncrement?: number;\n\n /\n Indicates whether the chart is in a loading state.\n /\n @Prop({ reflect: true })\n public loading: boolean = false;\n\n private range: {\n minValue: number;\n maxValue: number;\n totalRange: number;\n };\n\n /\n Fired when a chart item with `clickable` set to `true` is clicked\n /\n @Event()\n public interact: EventEmitter<ChartItem>;\n\n public componentWillLoad() {\n this.recalculateRangeData();\n }\n\n public render() {\n if (this.loading) {\n return <limel-spinner limeBranded={false} />;\n }\n\n return (\n <table\n aria-busy={this.loading ? 'true' : 'false'}\n aria-live=\"polite\"\n style={{\n '--limel-chart-number-of-items':\n this.items.length.toString(),\n }}\n >\n {this.renderCaption()}\n {this.renderTableHeader()}\n {this.renderAxises()}\n <tbody class=\"chart\">{this.renderItems()}</tbody>\n </table>\n );\n }\n\n private renderCaption() {\n if (!this.accessibleLabel) {\n return;\n }\n\n return <caption>{this.accessibleLabel}</caption>;\n }\n\n private renderTableHeader() {\n return (\n <thead>\n <tr>\n <th scope=\"col\">\n {this.accessibleItemsLabel ??\n translate.get('items', this.language)}\n </th>\n <th scope=\"col\">\n {this.accessibleValuesLabel ??\n translate.get('value', this.language)}\n </th>\n </tr>\n </thead>\n );\n }\n\n private renderAxises() {\n if (!['bar', 'dot', 'area', 'line'].includes(this.type)) {\n return;\n }\n\n const { minValue, maxValue } = this.range;\n const lines = [];\n const adjustedMinRange =\n Math.floor(minValue / this.axisIncrement) this.axisIncrement;\n const adjustedMaxRange =\n Math.ceil(maxValue / this.axisIncrement) * this.axisIncrement;\n\n for (\n let value = adjustedMinRange;\n value <= adjustedMaxRange;\n value += this.axisIncrement\n ) {\n lines.push(\n <div\n class={{\n 'axis-line': true,\n 'zero-line': value === 0,\n }}\n role=\"presentation\"\n >\n <limel-badge label={value} />\n </div>\n );\n }\n\n return (\n <div class=\"axises\" role=\"presentation\">\n {lines}\n </div>\n );\n }\n\n private renderItems() {\n if (!this.items?.length) {\n return;\n }\n\n let cumulativeOffset = 0;\n\n return this.items.map((item, index) => {\n const itemId = createRandomString();\n const sizeAndOffset = this.calculateSizeAndOffset(item);\n const size = sizeAndOffset.size;\n let offset = sizeAndOffset.offset;\n\n if (this.type === 'pie' \|\| this.type === 'doughnut') {\n offset = cumulativeOffset;\n cumulativeOffset += size;\n }\n\n return (\n <tr\n style={this.getItemStyle(item, index, size, offset)}\n class={this.getItemClass(item)}\n key={itemId}\n id={itemId}\n data-index={index}\n tabIndex={0}\n role={item.clickable ? 'button' : null}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n >\n <td class=\"text\">{this.getItemText(item)}</td>\n <td class=\"value\">{this.getFormattedValue(item)}</td>\n {this.renderTooltip(item, itemId, size)}\n </tr>\n );\n });\n }\n\n private getItemStyle(\n item: ChartItem,\n index: number,\n size: number,\n offset: number\n ): Record<string, string> {\n const style: Record<string, string> = {\n '--limel-chart-item-offset': `${offset}`,\n '--limel-chart-item-size': `${size}`,\n '--limel-chart-item-index': `${index}`,\n '--limel-chart-item-value': `${item.value}`,\n };\n\n if (item.color) {\n style['--limel-chart-item-color'] = item.color;\n }\n\n if (this.type === 'line' \|\| this.type === 'area') {\n const nextItem = this.calculateSizeAndOffset(this.items[index + 1]);\n\n style['--limel-chart-next-item-size'] = `${nextItem.size}`;\n style['--limel-chart-next-item-offset'] = `${nextItem.offset}`;\n }\n\n return style;\n }\n\n private getItemClass(item: ChartItem) {\n return {\n item: true,\n 'has-start-value': Array.isArray(item.value),\n 'has-negative-value-only':\n this.getMaximumValue(item) < 0 && !this.isRangeItem(item),\n 'has-value-zero': this.getMaximumValue(item) === 0,\n };\n }\n\n private calculateSizeAndOffset(item?: ChartItem) {\n const { minValue, totalRange } = this.range;\n if (!item) {\n return {\n size: 0,\n offset: 0,\n };\n }\n\n let startValue = 0;\n if (this.isRangeItem(item)) {\n startValue = this.getMinimumValue(item);\n }\n\n const normalizedStart =\n ((startValue - minValue) / totalRange) * PERCENT;\n const normalizedEnd =\n ((this.getMaximumValue(item) - minValue) / totalRange) * PERCENT;\n\n return {\n size: normalizedEnd - normalizedStart,\n offset: normalizedStart,\n };\n }\n\n private getFormattedValue(item: ChartItem): string {\n const { value, formattedValue } = item;\n\n if (formattedValue) {\n return formattedValue;\n }\n\n if (Array.isArray(value)) {\n return `${value[0]} — ${value[1]}`;\n }\n\n return `${value}`;\n }\n\n private getItemText(item: ChartItem): string {\n return item.text;\n }\n\n private renderTooltip(item: ChartItem, itemId: string, size: number) {\n const text = this.getItemText(item);\n const PERCENT_DECIMAL = 2;\n const formattedValue = this.getFormattedValue(item);\n\n const tooltipProps: any = {\n label: text,\n helperLabel: formattedValue,\n elementId: itemId,\n };\n\n if (this.type !== 'bar' && this.type !== 'dot' && this.type !== 'nps') {\n tooltipProps.label = `${text} (${size.toFixed(PERCENT_DECIMAL)}%)`;\n }\n\n return (\n <limel-tooltip\n {...tooltipProps}\n openDirection={\n this.orientation === 'portrait' ? 'right' : 'top'\n }\n />\n );\n }\n\n private calculateRange() {\n if (this.range) {\n return this.range;\n }\n\n const minRange = Math.min(0, ...this.items.map(this.getMinimumValue));\n const maxRange = Math.max(...this.items.map(this.getMaximumValue));\n const totalSum = this.items.reduce(\n (sum, item) => sum + this.getMaximumValue(item),\n 0\n );\n\n let finalMaxRange = this.maxValue ?? maxRange;\n if (\n (this.type === 'pie' \|\| this.type === 'doughnut') &&\n !this.maxValue\n ) {\n finalMaxRange = totalSum;\n }\n\n if (!this.axisIncrement) {\n this.axisIncrement = this.calculateAxisIncrement(this.items);\n }\n\n const visualMaxValue =\n Math.ceil(finalMaxRange / this.axisIncrement) * this.axisIncrement;\n const visualMinValue =\n Math.floor(minRange / this.axisIncrement) * this.axisIncrement;\n const totalRange = visualMaxValue - visualMinValue;\n\n return {\n minValue: visualMinValue,\n maxValue: visualMaxValue,\n totalRange: totalRange,\n };\n }\n\n private calculateAxisIncrement(\n items: ChartItem[],\n steps: number = DEFAULT_INCREMENT_SIZE\n ) {\n const maxValue = Math.max(\n ...items.map((item) => {\n const value = item.value;\n if (Array.isArray(value)) {\n return Math.max(...value);\n }\n\n return value;\n })\n );\n\n const roughStep = maxValue / steps;\n\n const magnitude = 10 ** Math.floor(Math.log10(roughStep));\n\n return Math.ceil(roughStep / magnitude) * magnitude;\n }\n\n private getMinimumValue(item: ChartItem): number {\n const value = item.value;\n\n return Array.isArray(value) ? Math.min(...value) : value;\n }\n\n private getMaximumValue(item: ChartItem): number {\n const value = item.value;\n\n return Array.isArray(value) ? Math.max(...value) : value;\n }\n\n private isRangeItem(item: ChartItem): item is ChartItem<[number, number]> {\n return Array.isArray(item.value);\n }\n\n @Watch('items')\n @Watch('axisIncrement')\n @Watch('maxValue')\n handleChange() {\n this.range = null;\n this.recalculateRangeData();\n }\n\n private recalculateRangeData() {\n this.range = this.calculateRange();\n }\n\n private getClickableItem(target: HTMLElement): ChartItem \| undefined {\n const index = target.dataset.index;\n if (index === undefined) {\n return;\n }\n\n const item = this.items[Number(index)];\n if (!item.clickable) {\n return;\n }\n\n return item;\n }\n\n private readonly handleClick = (event: MouseEvent) => {\n const item = this.getClickableItem(event.currentTarget as HTMLElement);\n if (!item) {\n return;\n }\n\n event.stopPropagation();\n this.interact.emit(item);\n };\n\n private readonly handleKeyDown = (event: KeyboardEvent) => {\n if (event.key !== 'Enter' && event.key !== ' ') {\n return;\n }\n\n const item = this.getClickableItem(event.currentTarget as HTMLElement);\n if (!item) {\n return;\n }\n\n event.preventDefault();\n this.interact.emit(item);\n };\n}\n"],"version":3}

package/dist/esm/limel-slider.entry.js CHANGED Viewed

@@ -1480,6 +1480,7 @@ const Slider = class {
     this.getContainerClassList = () => {
       return {
         [this.percentageClass]: true,
+        'displays-percentage-colors': this.displaysPercentageColors,
         disabled: this.disabled || this.readonly,
         readonly: this.readonly,
       };
@@ -1544,6 +1545,7 @@ const Slider = class {
     this.helperText = undefined;
     this.required = false;
     this.invalid = false;
+    this.displaysPercentageColors = false;
     this.unit = '';
     this.value = undefined;
     this.valuemax = DEFAULT_MAX_VALUE;