@limetech/lime-elements 38.0.0 → 38.1.1

package/dist/lime-elements/p-0eef63d5.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["chartCss","PERCENT","DEFAULT_INCREMENT_SIZE","Chart","componentWillLoad","this","recalculateRangeData","render","loading","h","limeBranded","style","items","length","toString","renderCaption","renderTableHeader","renderAxises","class","renderItems","accessibleLabel","scope","accessibleItemsLabel","translate","get","language","includes","type","minValue","maxValue","range","lines","adjustedMinRange","Math","floor","axisIncrement","adjustedMaxRange","ceil","value","push","role","label","_a","cumulativeOffset","map","item","index","itemId","createRandomString","sizeAndOffset","calculateSizeAndOffset","size","offset","getItemStyle","getItemClass","key","id","tabIndex","getItemText","getFormattedValue","renderTooltip","color","nextItem","Array","isArray","getMaximumValue","isRangeItem","totalRange","startValue","getMinimumValue","normalizedStart","normalizedEnd","formattedValue","text","PERCENT_DECIMAL","tooltipProps","helperLabel","elementId","toFixed","Object","assign","openDirection","orientation","calculateRange","minRange","min","maxRange","max","totalSum","reduce","sum","finalMaxRange","calculateAxisIncrement","visualMaxValue","visualMinValue","steps","roughStep","magnitude","log10","handleChange"],"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    transition:\n        background-color 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\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, 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-accessibility\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     */\n    @Prop({ reflect: true })\n    public accessibleItemsLabel?: string;\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    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\">{this.accessibleItemsLabel}</th>\n                    <th scope=\"col\">{translate.get('value', this.language)}</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                    tabIndex={0}\n                >\n                    <th>{this.getItemText(item)}</th>\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        // eslint-disable-next-line no-magic-numbers\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"],"mappings":"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"}