@folkehelseinstituttet/designsystem 0.42.0 → 0.42.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fhi-modal-dialog.js +1 -1
- package/fhi-modal-dialog.js.map +1 -1
- package/package.json +1 -1
- package/web-types.json +1 -1
package/fhi-modal-dialog.js
CHANGED
|
@@ -15,7 +15,7 @@ var s = "fhi-modal-dialog", c = class extends i {
|
|
|
15
15
|
super.firstUpdated(e), this._toggleFooter();
|
|
16
16
|
}
|
|
17
17
|
show() {
|
|
18
|
-
this._triggerElement = document.activeElement, this._bodyOverflowStyle = document.body.style.overflow,
|
|
18
|
+
this.open ||= (this._triggerElement = document.activeElement, this._bodyOverflowStyle = document.body.style.overflow, !0), document.body.style.overflow = "hidden", this._dialog.showModal(), setTimeout(() => {
|
|
19
19
|
this._focusDialog();
|
|
20
20
|
}, 10), this._dispatchToggleEvent(), this.addEventListener("keydown", this.handleKeyPress.bind(this));
|
|
21
21
|
}
|
package/fhi-modal-dialog.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fhi-modal-dialog.js","names":[],"sources":["../../src/components/fhi-modal-dialog/fhi-modal-dialog.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\n\nimport '../fhi-button/fhi-button.component';\nimport '../icons/fhi-icon-x.component';\nimport '../typography/fhi-headline/fhi-headline.component';\n\nexport const FhiModalDialogSelector = 'fhi-modal-dialog';\n\n/**\n * ## FHI Modal Dialog\n *\n * {@link https://designsystem.fhi.no/?path=/docs/komponenter-modal-dialog--docs}\n *\n * The `fhi-modal-dialog` component is used to display important information or prompt the user for input in a modal window.\n * It overlays the main content and usually requires user interaction before returning to the underlying page.\n *\n * @tag fhi-modal-dialog\n * @element fhi-modal-dialog\n *\n * @slot body - The main content of the dialog. Typically contains text or form elements.\n * @slot footer - The footer content of the dialog, typically containing action buttons.\n */\n@customElement(FhiModalDialogSelector)\nexport class FhiModalDialog extends LitElement {\n /**\n * Decides whether the dialog is open or closed.\n * By setting this property to true, the dialog will be shown. Setting it to false will close the dialog.\n *\n * This property is reflected as an attribute and will therefor also change if the user toggles the dialog or\n * if you use the `show()` and `close()` methods.\n * @reflect\n * @type {boolean}\n */\n @property({ type: Boolean, reflect: true })\n open: boolean = false;\n\n /**\n * Sets the maximum width of the dialog.\n * @type {'small' | 'medium'`}\n */\n @property({ type: String, attribute: 'size', reflect: true })\n size: 'small' | 'medium' = 'medium';\n\n /**\n * Label for the close button.\n * @type {string}\n */\n @property({ type: String, attribute: 'close-button-label' })\n closeButtonLabel: string = '';\n\n /**\n * The heading text of the dialog. This is displayed at the top of the dialog.\n * @type {string}\n */\n @property({ type: String })\n heading: string = '';\n\n @query('dialog')\n private _dialog!: HTMLDialogElement;\n\n @query('footer')\n private _footer!: HTMLElement;\n\n @query('slot[name=\"footer\"]')\n private _footerSlot!: HTMLSlotElement;\n\n private _triggerElement: HTMLElement | null = null;\n private _bodyOverflowStyle: string = '';\n private _mouseDownInsideDialog: boolean = false;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('open')) {\n if (this.open) {\n this.show();\n } else {\n this.close();\n }\n }\n\n // if invalid size is provided, default to 'medium'\n if (changedProperties.has('size')) {\n if (this.size !== 'small' && this.size !== 'medium') {\n this.size = 'medium';\n }\n }\n\n if (changedProperties.has('closeButtonLabel')) {\n if (\n typeof this.closeButtonLabel !== 'string' ||\n this.closeButtonLabel.length === 0\n ) {\n throw new TypeError(\n 'The close-button-label property must be set to a non-empty string. This label must describe the purpose of the close button for accessibility reasons.',\n );\n }\n }\n\n if (changedProperties.has('closeButtonLabel')) {\n if (typeof this.heading !== 'string' || this.heading.length === 0) {\n throw new TypeError(\n 'The heading property must be set to a non-empty string. This heading describes the purpose of the dialog.',\n );\n }\n }\n }\n\n protected firstUpdated(_changedProperties: PropertyValues): void {\n super.firstUpdated(_changedProperties);\n this._toggleFooter();\n }\n\n /**\n * Programmatically opens the dialog.\n * You can also open the dialog by instead setting the `open` property to `true`.\n */\n public show() {\n this._triggerElement = document.activeElement as HTMLElement | null;\n this._bodyOverflowStyle = document.body.style.overflow;\n\n if (!this.open) {\n this.open = true;\n }\n\n document.body.style.overflow = 'hidden';\n\n this._dialog.showModal();\n\n // Delay focus to make sure the windows screen reader properly detects the dialog\n setTimeout(() => {\n this._focusDialog();\n }, 10);\n\n this._dispatchToggleEvent();\n\n this.addEventListener('keydown', this.handleKeyPress.bind(this));\n }\n\n /**\n * Programmatically closes the dialog.\n * You can also close the dialog by instead setting the `open` property to `false`.\n */\n public close() {\n if (this.open) {\n this.open = false;\n }\n\n document.body.style.overflow = this._bodyOverflowStyle;\n\n this._dialog.close();\n\n this._dispatchToggleEvent();\n this._dispatchCloseEvent();\n\n this._triggerElement?.focus();\n\n this.removeEventListener('keydown', this.handleKeyPress.bind(this));\n }\n\n private _focusDialog() {\n this._dialog.focus();\n }\n\n private _dispatchToggleEvent() {\n /**\n * @type {Event} - Standard DOM event with the type `toggle`\n * This event is fired whenever the dialog is opened or closed.\n * */\n this.dispatchEvent(\n new ToggleEvent('toggle', {\n newState: this.open ? 'open' : 'closed',\n oldState: this.open ? 'closed' : 'open',\n }),\n );\n }\n\n private _dispatchCloseEvent() {\n /**\n * @type {Event} - Standard DOM event with the type `close`\n * This event is fired whenever the dialog is closed.\n * */\n this.dispatchEvent(new CloseEvent('close'));\n }\n\n private _handleDialogMouseUp(event: MouseEvent) {\n if (this._mouseDownInsideDialog) {\n this._mouseDownInsideDialog = false;\n return;\n }\n\n if (event.target === this._dialog) {\n this.close();\n }\n\n event.stopPropagation();\n }\n\n private _handleCloseButtonClick() {\n this.close();\n }\n\n private _handleDialogContentMouseDown() {\n this._mouseDownInsideDialog = true;\n }\n\n private _handleFooterSlotChange() {\n this._toggleFooter();\n }\n\n private handleKeyPress(event: KeyboardEvent) {\n if (event.key === 'Escape') {\n event.preventDefault();\n this.close();\n }\n }\n\n private _toggleFooter() {\n const nodes = this._footerSlot.assignedNodes({ flatten: true });\n\n if (nodes.length === 0) {\n this._footer.style.display = 'none';\n } else {\n this._footer.style.display = 'flex';\n }\n }\n\n render() {\n return html` <dialog\n @mouseup=${this._handleDialogMouseUp}\n aria-modal=\"true\"\n aria-labelledby=\"dialog-label\"\n closedby=\"none\"\n role=\"dialog\"\n >\n <section\n class=\"dialog-content\"\n @mousedown=${this._handleDialogContentMouseDown}\n >\n <header>\n <fhi-headline ?hidden=${!this.heading} id=\"dialog-label\" level=\"1\"\n >${this.heading}\n </fhi-headline>\n <fhi-button\n variant=\"text\"\n color=\"neutral\"\n size=\"small\"\n @click=${this._handleCloseButtonClick}\n >\n ${this.closeButtonLabel}\n <fhi-icon-x></fhi-icon-x>\n </fhi-button>\n </header>\n <slot name=\"body\"></slot>\n <footer>\n <slot\n name=\"footer\"\n @slotchange=${this._handleFooterSlotChange}\n ></slot>\n </footer>\n </section>\n </dialog>`;\n }\n\n static styles = css`\n @keyframes fhi-dialog-fade-in {\n from {\n opacity: 0;\n }\n }\n\n :host {\n --dimension-dialog-border-width: var(--fhi-dimension-border-width);\n --dimension-dialog-border-radius: var(--fhi-border-radius-200);\n --dimension-dialog-header-padding: var(--fhi-spacing-500)\n var(--fhi-spacing-500) 0 var(--fhi-spacing-500);\n --dimension-dialog-header-gap: var(--fhi-spacing-050);\n --dimension-dialog-body-padding: var(--fhi-spacing-500);\n --dimension-dialog-footer-padding: 0 var(--fhi-spacing-500)\n var(--fhi-spacing-500) var(--fhi-spacing-500);\n --dimension-dialog-footer-gap: var(--fhi-spacing-050);\n\n --dimension-dialog-width-small: 28rem;\n --dimension-dialog-width-medium: 40rem;\n\n --color-backdrop: var(--fhi-color-neutral-surface-active);\n --color-dialog-border: var(--fhi-color-neutral-border-subtle);\n\n --motion-transition: var(--fhi-motion-duration-quick)\n var(--fhi-motion-ease-default);\n }\n\n :host {\n display: none;\n position: absolute;\n\n dialog {\n display: flex;\n overflow: hidden;\n border: var(--dimension-dialog-border-width) solid\n var(--color-dialog-border);\n border-radius: var(--dimension-dialog-border-radius);\n animation: var(--motion-transition) fhi-dialog-fade-in;\n padding: 0;\n .dialog-content {\n overflow: auto;\n flex: 1;\n }\n header {\n display: flex;\n justify-content: space-between;\n align-items: start;\n gap: var(--dimension-dialog-header-gap);\n padding: var(--dimension-dialog-header-padding);\n }\n slot[name='body'] {\n display: block;\n padding: var(--dimension-dialog-body-padding);\n }\n footer {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n gap: var(--dimension-dialog-footer-gap);\n flex-wrap: wrap;\n padding: var(--dimension-dialog-footer-padding);\n }\n &::backdrop {\n background-color: var(--color-backdrop);\n opacity: var(--fhi-opacity-disabled);\n animation: var(--motion-transition) fhi-dialog-fade-in;\n }\n }\n }\n\n :host([open]) {\n display: block;\n }\n\n :host([size='small']) {\n dialog {\n width: var(--dimension-dialog-width-small);\n }\n }\n\n :host([size='medium']) {\n dialog {\n width: var(--dimension-dialog-width-medium);\n }\n }\n `;\n}\n"],"mappings":";;;;;AAOA,IAAa,IAAyB,oBAiB/B,IAAA,cAA6B,EAAW;;2BAW7B,gBAOW,kCAOA,mBAOT,2BAW4B,gCACT,kCACK;;CAE1C,QAAQ,GAAyC;EAkB/C,IAjBA,MAAM,QAAQ,CAAiB,GAE3B,EAAkB,IAAI,MAAM,MAC1B,KAAK,OACP,KAAK,KAAK,IAEV,KAAK,MAAM,IAKX,EAAkB,IAAI,MAAM,KAC1B,KAAK,SAAS,WAAW,KAAK,SAAS,aACzC,KAAK,OAAO,WAIZ,EAAkB,IAAI,kBAAkB,MAExC,OAAO,KAAK,oBAAqB,YACjC,KAAK,iBAAiB,WAAW,IAEjC,MAAU,UACR,wJACF;EAIJ,IAAI,EAAkB,IAAI,kBAAkB,MACtC,OAAO,KAAK,WAAY,YAAY,KAAK,QAAQ,WAAW,IAC9D,MAAU,UACR,2GACF;CAGN;CAEA,aAAuB,GAA0C;EAE/D,AADA,MAAM,aAAa,CAAkB,GACrC,KAAK,cAAc;CACrB;CAMA,OAAc;EAmBZ,AAlBA,KAAK,kBAAkB,SAAS,eAChC,KAAK,qBAAqB,SAAS,KAAK,MAAM,UAE9C,AACE,KAAK,SAAO,IAGd,SAAS,KAAK,MAAM,WAAW,UAE/B,KAAK,QAAQ,UAAU,GAGvB,iBAAiB;GACf,KAAK,aAAa;EACpB,GAAG,EAAE,GAEL,KAAK,qBAAqB,GAE1B,KAAK,iBAAiB,WAAW,KAAK,eAAe,KAAK,IAAI,CAAC;CACjE;CAMA,QAAe;EAcb,AAbA,AACE,KAAK,SAAO,IAGd,SAAS,KAAK,MAAM,WAAW,KAAK,oBAEpC,KAAK,QAAQ,MAAM,GAEnB,KAAK,qBAAqB,GAC1B,KAAK,oBAAoB,GAEzB,KAAK,iBAAiB,MAAM,GAE5B,KAAK,oBAAoB,WAAW,KAAK,eAAe,KAAK,IAAI,CAAC;CACpE;CAEA,eAAuB;EACrB,KAAK,QAAQ,MAAM;CACrB;CAEA,uBAA+B;EAK7B,KAAK,cACH,IAAI,YAAY,UAAU;GACxB,UAAU,KAAK,OAAO,SAAS;GAC/B,UAAU,KAAK,OAAO,WAAW;EACnC,CAAC,CACH;CACF;CAEA,sBAA8B;EAK5B,KAAK,cAAc,IAAI,WAAW,OAAO,CAAC;CAC5C;CAEA,qBAA6B,GAAmB;EAC9C,IAAI,KAAK,wBAAwB;GAC/B,KAAK,yBAAyB;GAC9B;EACF;EAMA,AAJI,EAAM,WAAW,KAAK,WACxB,KAAK,MAAM,GAGb,EAAM,gBAAgB;CACxB;CAEA,0BAAkC;EAChC,KAAK,MAAM;CACb;CAEA,gCAAwC;EACtC,KAAK,yBAAyB;CAChC;CAEA,0BAAkC;EAChC,KAAK,cAAc;CACrB;CAEA,eAAuB,GAAsB;EAC3C,AAAI,EAAM,QAAQ,aAChB,EAAM,eAAe,GACrB,KAAK,MAAM;CAEf;CAEA,gBAAwB;EAGtB,AAFc,KAAK,YAAY,cAAc,EAAE,SAAS,GAAK,CAEzD,EAAM,WAAW,IACnB,KAAK,QAAQ,MAAM,UAAU,SAE7B,KAAK,QAAQ,MAAM,UAAU;CAEjC;CAEA,SAAS;EACP,OAAO,CAAI;iBACE,KAAK,qBAAqB;;;;;;;;qBAQtB,KAAK,8BAA8B;;;kCAGtB,CAAC,KAAK,QAAQ;eACjC,KAAK,QAAQ;;;;;;qBAMP,KAAK,wBAAwB;;cAEpC,KAAK,iBAAiB;;;;;;;;0BAQV,KAAK,wBAAwB;;;;;CAKrD;;gBAEgB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuFrB;GA9TG,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,MAOzC,EAAS;CAAE,MAAM;CAAQ,WAAW;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,MAO3D,EAAS;CAAE,MAAM;CAAQ,WAAW;AAAqB,CAAC,CAAA,GAAA,EAAA,WAAA,oBAAA,KAAA,CAAA,MAO1D,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,MAGzB,EAAM,QAAQ,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,MAGd,EAAM,QAAQ,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,MAGd,EAAM,uBAAqB,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA,UAzC7B,EAAc,CAAsB,CAAA,GAAA,CAAA"}
|
|
1
|
+
{"version":3,"file":"fhi-modal-dialog.js","names":[],"sources":["../../src/components/fhi-modal-dialog/fhi-modal-dialog.component.ts"],"sourcesContent":["import { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\n\nimport '../fhi-button/fhi-button.component';\nimport '../icons/fhi-icon-x.component';\nimport '../typography/fhi-headline/fhi-headline.component';\n\nexport const FhiModalDialogSelector = 'fhi-modal-dialog';\n\n/**\n * ## FHI Modal Dialog\n *\n * {@link https://designsystem.fhi.no/?path=/docs/komponenter-modal-dialog--docs}\n *\n * The `fhi-modal-dialog` component is used to display important information or prompt the user for input in a modal window.\n * It overlays the main content and usually requires user interaction before returning to the underlying page.\n *\n * @tag fhi-modal-dialog\n * @element fhi-modal-dialog\n *\n * @slot body - The main content of the dialog. Typically contains text or form elements.\n * @slot footer - The footer content of the dialog, typically containing action buttons.\n */\n@customElement(FhiModalDialogSelector)\nexport class FhiModalDialog extends LitElement {\n /**\n * Decides whether the dialog is open or closed.\n * By setting this property to true, the dialog will be shown. Setting it to false will close the dialog.\n *\n * This property is reflected as an attribute and will therefor also change if the user toggles the dialog or\n * if you use the `show()` and `close()` methods.\n * @reflect\n * @type {boolean}\n */\n @property({ type: Boolean, reflect: true })\n open: boolean = false;\n\n /**\n * Sets the maximum width of the dialog.\n * @type {'small' | 'medium'`}\n */\n @property({ type: String, attribute: 'size', reflect: true })\n size: 'small' | 'medium' = 'medium';\n\n /**\n * Label for the close button.\n * @type {string}\n */\n @property({ type: String, attribute: 'close-button-label' })\n closeButtonLabel: string = '';\n\n /**\n * The heading text of the dialog. This is displayed at the top of the dialog.\n * @type {string}\n */\n @property({ type: String })\n heading: string = '';\n\n @query('dialog')\n private _dialog!: HTMLDialogElement;\n\n @query('footer')\n private _footer!: HTMLElement;\n\n @query('slot[name=\"footer\"]')\n private _footerSlot!: HTMLSlotElement;\n\n private _triggerElement: HTMLElement | null = null;\n private _bodyOverflowStyle: string = '';\n private _mouseDownInsideDialog: boolean = false;\n\n updated(changedProperties: PropertyValues<this>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('open')) {\n if (this.open) {\n this.show();\n } else {\n this.close();\n }\n }\n\n // if invalid size is provided, default to 'medium'\n if (changedProperties.has('size')) {\n if (this.size !== 'small' && this.size !== 'medium') {\n this.size = 'medium';\n }\n }\n\n if (changedProperties.has('closeButtonLabel')) {\n if (\n typeof this.closeButtonLabel !== 'string' ||\n this.closeButtonLabel.length === 0\n ) {\n throw new TypeError(\n 'The close-button-label property must be set to a non-empty string. This label must describe the purpose of the close button for accessibility reasons.',\n );\n }\n }\n\n if (changedProperties.has('closeButtonLabel')) {\n if (typeof this.heading !== 'string' || this.heading.length === 0) {\n throw new TypeError(\n 'The heading property must be set to a non-empty string. This heading describes the purpose of the dialog.',\n );\n }\n }\n }\n\n protected firstUpdated(_changedProperties: PropertyValues): void {\n super.firstUpdated(_changedProperties);\n this._toggleFooter();\n }\n\n /**\n * Programmatically opens the dialog.\n * You can also open the dialog by instead setting the `open` property to `true`.\n */\n public show() {\n if (!this.open) {\n this._triggerElement = document.activeElement as HTMLElement | null;\n this._bodyOverflowStyle = document.body.style.overflow;\n this.open = true;\n }\n\n document.body.style.overflow = 'hidden';\n\n this._dialog.showModal();\n\n // Delay focus to make sure the windows screen reader properly detects the dialog\n setTimeout(() => {\n this._focusDialog();\n }, 10);\n\n this._dispatchToggleEvent();\n\n this.addEventListener('keydown', this.handleKeyPress.bind(this));\n }\n\n /**\n * Programmatically closes the dialog.\n * You can also close the dialog by instead setting the `open` property to `false`.\n */\n public close() {\n if (this.open) {\n this.open = false;\n }\n\n document.body.style.overflow = this._bodyOverflowStyle;\n\n this._dialog.close();\n\n this._dispatchToggleEvent();\n this._dispatchCloseEvent();\n\n this._triggerElement?.focus();\n\n this.removeEventListener('keydown', this.handleKeyPress.bind(this));\n }\n\n private _focusDialog() {\n this._dialog.focus();\n }\n\n private _dispatchToggleEvent() {\n /**\n * @type {Event} - Standard DOM event with the type `toggle`\n * This event is fired whenever the dialog is opened or closed.\n * */\n this.dispatchEvent(\n new ToggleEvent('toggle', {\n newState: this.open ? 'open' : 'closed',\n oldState: this.open ? 'closed' : 'open',\n }),\n );\n }\n\n private _dispatchCloseEvent() {\n /**\n * @type {Event} - Standard DOM event with the type `close`\n * This event is fired whenever the dialog is closed.\n * */\n this.dispatchEvent(new CloseEvent('close'));\n }\n\n private _handleDialogMouseUp(event: MouseEvent) {\n if (this._mouseDownInsideDialog) {\n this._mouseDownInsideDialog = false;\n return;\n }\n\n if (event.target === this._dialog) {\n this.close();\n }\n\n event.stopPropagation();\n }\n\n private _handleCloseButtonClick() {\n this.close();\n }\n\n private _handleDialogContentMouseDown() {\n this._mouseDownInsideDialog = true;\n }\n\n private _handleFooterSlotChange() {\n this._toggleFooter();\n }\n\n private handleKeyPress(event: KeyboardEvent) {\n if (event.key === 'Escape') {\n event.preventDefault();\n this.close();\n }\n }\n\n private _toggleFooter() {\n const nodes = this._footerSlot.assignedNodes({ flatten: true });\n\n if (nodes.length === 0) {\n this._footer.style.display = 'none';\n } else {\n this._footer.style.display = 'flex';\n }\n }\n\n render() {\n return html` <dialog\n @mouseup=${this._handleDialogMouseUp}\n aria-modal=\"true\"\n aria-labelledby=\"dialog-label\"\n closedby=\"none\"\n role=\"dialog\"\n >\n <section\n class=\"dialog-content\"\n @mousedown=${this._handleDialogContentMouseDown}\n >\n <header>\n <fhi-headline ?hidden=${!this.heading} id=\"dialog-label\" level=\"1\"\n >${this.heading}\n </fhi-headline>\n <fhi-button\n variant=\"text\"\n color=\"neutral\"\n size=\"small\"\n @click=${this._handleCloseButtonClick}\n >\n ${this.closeButtonLabel}\n <fhi-icon-x></fhi-icon-x>\n </fhi-button>\n </header>\n <slot name=\"body\"></slot>\n <footer>\n <slot\n name=\"footer\"\n @slotchange=${this._handleFooterSlotChange}\n ></slot>\n </footer>\n </section>\n </dialog>`;\n }\n\n static styles = css`\n @keyframes fhi-dialog-fade-in {\n from {\n opacity: 0;\n }\n }\n\n :host {\n --dimension-dialog-border-width: var(--fhi-dimension-border-width);\n --dimension-dialog-border-radius: var(--fhi-border-radius-200);\n --dimension-dialog-header-padding: var(--fhi-spacing-500)\n var(--fhi-spacing-500) 0 var(--fhi-spacing-500);\n --dimension-dialog-header-gap: var(--fhi-spacing-050);\n --dimension-dialog-body-padding: var(--fhi-spacing-500);\n --dimension-dialog-footer-padding: 0 var(--fhi-spacing-500)\n var(--fhi-spacing-500) var(--fhi-spacing-500);\n --dimension-dialog-footer-gap: var(--fhi-spacing-050);\n\n --dimension-dialog-width-small: 28rem;\n --dimension-dialog-width-medium: 40rem;\n\n --color-backdrop: var(--fhi-color-neutral-surface-active);\n --color-dialog-border: var(--fhi-color-neutral-border-subtle);\n\n --motion-transition: var(--fhi-motion-duration-quick)\n var(--fhi-motion-ease-default);\n }\n\n :host {\n display: none;\n position: absolute;\n\n dialog {\n display: flex;\n overflow: hidden;\n border: var(--dimension-dialog-border-width) solid\n var(--color-dialog-border);\n border-radius: var(--dimension-dialog-border-radius);\n animation: var(--motion-transition) fhi-dialog-fade-in;\n padding: 0;\n .dialog-content {\n overflow: auto;\n flex: 1;\n }\n header {\n display: flex;\n justify-content: space-between;\n align-items: start;\n gap: var(--dimension-dialog-header-gap);\n padding: var(--dimension-dialog-header-padding);\n }\n slot[name='body'] {\n display: block;\n padding: var(--dimension-dialog-body-padding);\n }\n footer {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n gap: var(--dimension-dialog-footer-gap);\n flex-wrap: wrap;\n padding: var(--dimension-dialog-footer-padding);\n }\n &::backdrop {\n background-color: var(--color-backdrop);\n opacity: var(--fhi-opacity-disabled);\n animation: var(--motion-transition) fhi-dialog-fade-in;\n }\n }\n }\n\n :host([open]) {\n display: block;\n }\n\n :host([size='small']) {\n dialog {\n width: var(--dimension-dialog-width-small);\n }\n }\n\n :host([size='medium']) {\n dialog {\n width: var(--dimension-dialog-width-medium);\n }\n }\n `;\n}\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"title":"FHI Designsystem","author":"FHI Designsystem team","name":"@folkehelseinstituttet/designsystem","version":"0.42.0","description":"The official design system for the Norwegian Institute of Public Health implemented as web components","keywords":["fhi","folkehelseinstituttet","components","design","system","framework","frontend","web-component","web component","ui"],"customElements":".temp/custom-elements.json","web-types":"./web-types.json","homepage":"https://github.com/FHIDev/Fhi.Designsystem","bugs":{"url":"https://github.com/FHIDev/Fhi.Designsystem/issues"},"repository":{"type":"git","url":"git+https://github.com/FHIDev/Fhi.Designsystem.git"},"license":"MIT","browserslist":["> 0.5%","last 2 versions"],"main":"index.js","type":"module","scripts":{"dev":"vite","build":"pnpm analyze && pnpm build:cdn && pnpm build:npm && pnpm build:github && pnpm clean","build:cdn":"tsc && cross-env DEPLOY_TARGET=cdn vite build","build:npm":"tsc && cross-env DEPLOY_TARGET=npm vite build","build:github":"tsc && cross-env DEPLOY_TARGET=github vite build","storybook":"storybook dev -p 6006","storybook:build":"pnpm analyze && storybook build","generate:icons":"node ./scripts/generate-icon-components.js --input ./src/assets/icons/ --output ./src/components/icons --clean-output-folder","test":"wtr ./**/*.test.ts --node-resolve --playwright --browsers chromium webkit","lint":"pnpm lint:eslint && pnpm lint:prettier","lint:eslint":"eslint \"**/*.{js,ts}\"","lint:prettier":"prettier \"**/*.js\" --check --ignore-path .gitignore","format":"pnpm format:eslint && pnpm format:prettier","format:eslint":"eslint \"**/*.{js,ts}\" --fix","format:prettier":"prettier \"**/*.js\" --write --ignore-path .gitignore","publish:npm":"pnpm build && cd dist/npm && npm publish","changelog:ci":"release-it --ci","analyze":"cem analyze --litelement","clean":"rimraf .temp","build-storybook":"storybook build"},"peerDependencies":{"lit":"~3.2.0"},"devDependencies":{"@custom-elements-manifest/analyzer":"^0.11.0","@esm-bundle/chai":"4.3.4-fix.0","@open-wc/testing":"~4.0.0","@playwright/test":"^1.61.0","@release-it/conventional-changelog":"~11.0.1","@storybook/addon-docs":"^10.4.6","@storybook/web-components-vite":"^10.4.6","@types/mocha":"~10.0.10","@types/node":"~26.0.0","@types/react":"^19.2.17","@wc-toolkit/cem-sorter":"^1.0.1","@wc-toolkit/type-parser":"^1.2.1","@web/dev-server":"~0.4.6","@web/dev-server-esbuild":"~1.0.5","@web/test-runner":"~0.20.2","@web/test-runner-playwright":"~0.11.1","cross-env":"10.1.0","custom-element-jet-brains-integration":"^1.7.0","lit":"~3.3.3","mocha":"~11.7.6","playwright":"^1.61.0","release-it":"~20.2.0","rimraf":"^6.1.3","storybook":"^10.4.6","storybook-design-token":"^5.0.0","svgo":"^4.0.1","vite":"~8.0.16","vite-plugin-static-copy":"~4.1.1"},"dependencies":{"@floating-ui/dom":"^1.7.6"},"pnpm":{"overrides":{"diff@>=6.0.0 <8.0.3":">=8.0.3","serialize-javascript@<=7.0.2":">=7.0.3","yaml@>=2.0.0 <2.8.3":">=2.8.3","serialize-javascript@>=5.0.0 <7.0.5":">=7.0.5","esbuild@>=0.27.3 <0.28.1":">=0.28.1","undici@>=7.23.0 <7.28.0":">=7.28.0","undici@>=7.0.0 <7.28.0":">=7.28.0"}},"exports":{"./fhi-button":{"default":"./fhi-button.js","types":"./fhi-button.d.ts"},"./fhi-callout":{"default":"./fhi-callout.js","types":"./fhi-callout.d.ts"},"./fhi-checkbox":{"default":"./fhi-checkbox.js","types":"./fhi-checkbox.d.ts"},"./fhi-date-input":{"default":"./fhi-date-input.js","types":"./fhi-date-input.d.ts"},"./fhi-flex":{"default":"./fhi-flex.js","types":"./fhi-flex.d.ts"},"./fhi-grid":{"default":"./fhi-grid.js","types":"./fhi-grid.d.ts"},"./fhi-modal-dialog":{"default":"./fhi-modal-dialog.js","types":"./fhi-modal-dialog.d.ts"},"./fhi-radio":{"default":"./fhi-radio.js","types":"./fhi-radio.d.ts"},"./fhi-tag":{"default":"./fhi-tag.js","types":"./fhi-tag.d.ts"},"./fhi-text-input":{"default":"./fhi-text-input.js","types":"./fhi-text-input.d.ts"},"./fhi-tooltip":{"default":"./fhi-tooltip.js","types":"./fhi-tooltip.d.ts"},"./fhi-icon-arrow-down-left":{"default":"./fhi-icon-arrow-down-left.js","types":"./fhi-icon-arrow-down-left.d.ts"},"./fhi-icon-arrow-down-right":{"default":"./fhi-icon-arrow-down-right.js","types":"./fhi-icon-arrow-down-right.d.ts"},"./fhi-icon-arrow-down":{"default":"./fhi-icon-arrow-down.js","types":"./fhi-icon-arrow-down.d.ts"},"./fhi-icon-arrow-left":{"default":"./fhi-icon-arrow-left.js","types":"./fhi-icon-arrow-left.d.ts"},"./fhi-icon-arrow-right-left":{"default":"./fhi-icon-arrow-right-left.js","types":"./fhi-icon-arrow-right-left.d.ts"},"./fhi-icon-arrow-right":{"default":"./fhi-icon-arrow-right.js","types":"./fhi-icon-arrow-right.d.ts"},"./fhi-icon-arrow-up-down":{"default":"./fhi-icon-arrow-up-down.js","types":"./fhi-icon-arrow-up-down.d.ts"},"./fhi-icon-arrow-up-left":{"default":"./fhi-icon-arrow-up-left.js","types":"./fhi-icon-arrow-up-left.d.ts"},"./fhi-icon-arrow-up-right":{"default":"./fhi-icon-arrow-up-right.js","types":"./fhi-icon-arrow-up-right.d.ts"},"./fhi-icon-arrow-up":{"default":"./fhi-icon-arrow-up.js","types":"./fhi-icon-arrow-up.d.ts"},"./fhi-icon-bell":{"default":"./fhi-icon-bell.js","types":"./fhi-icon-bell.d.ts"},"./fhi-icon-calendar-clock":{"default":"./fhi-icon-calendar-clock.js","types":"./fhi-icon-calendar-clock.d.ts"},"./fhi-icon-calendar":{"default":"./fhi-icon-calendar.js","types":"./fhi-icon-calendar.d.ts"},"./fhi-icon-chart-bar-stacked":{"default":"./fhi-icon-chart-bar-stacked.js","types":"./fhi-icon-chart-bar-stacked.d.ts"},"./fhi-icon-chart-bar":{"default":"./fhi-icon-chart-bar.js","types":"./fhi-icon-chart-bar.d.ts"},"./fhi-icon-chart-column-stacked":{"default":"./fhi-icon-chart-column-stacked.js","types":"./fhi-icon-chart-column-stacked.d.ts"},"./fhi-icon-chart-column":{"default":"./fhi-icon-chart-column.js","types":"./fhi-icon-chart-column.d.ts"},"./fhi-icon-chart-line":{"default":"./fhi-icon-chart-line.js","types":"./fhi-icon-chart-line.d.ts"},"./fhi-icon-chart-no-axes-combined":{"default":"./fhi-icon-chart-no-axes-combined.js","types":"./fhi-icon-chart-no-axes-combined.d.ts"},"./fhi-icon-chart-pie":{"default":"./fhi-icon-chart-pie.js","types":"./fhi-icon-chart-pie.d.ts"},"./fhi-icon-check":{"default":"./fhi-icon-check.js","types":"./fhi-icon-check.d.ts"},"./fhi-icon-chevron-down":{"default":"./fhi-icon-chevron-down.js","types":"./fhi-icon-chevron-down.d.ts"},"./fhi-icon-chevron-left":{"default":"./fhi-icon-chevron-left.js","types":"./fhi-icon-chevron-left.d.ts"},"./fhi-icon-chevron-right":{"default":"./fhi-icon-chevron-right.js","types":"./fhi-icon-chevron-right.d.ts"},"./fhi-icon-chevron-up":{"default":"./fhi-icon-chevron-up.js","types":"./fhi-icon-chevron-up.d.ts"},"./fhi-icon-chevrons-down":{"default":"./fhi-icon-chevrons-down.js","types":"./fhi-icon-chevrons-down.d.ts"},"./fhi-icon-chevrons-left":{"default":"./fhi-icon-chevrons-left.js","types":"./fhi-icon-chevrons-left.d.ts"},"./fhi-icon-chevrons-right":{"default":"./fhi-icon-chevrons-right.js","types":"./fhi-icon-chevrons-right.d.ts"},"./fhi-icon-chevrons-up":{"default":"./fhi-icon-chevrons-up.js","types":"./fhi-icon-chevrons-up.d.ts"},"./fhi-icon-circle-arrow-down":{"default":"./fhi-icon-circle-arrow-down.js","types":"./fhi-icon-circle-arrow-down.d.ts"},"./fhi-icon-circle-arrow-left":{"default":"./fhi-icon-circle-arrow-left.js","types":"./fhi-icon-circle-arrow-left.d.ts"},"./fhi-icon-circle-arrow-right":{"default":"./fhi-icon-circle-arrow-right.js","types":"./fhi-icon-circle-arrow-right.d.ts"},"./fhi-icon-circle-arrow-up":{"default":"./fhi-icon-circle-arrow-up.js","types":"./fhi-icon-circle-arrow-up.d.ts"},"./fhi-icon-circle-check-big":{"default":"./fhi-icon-circle-check-big.js","types":"./fhi-icon-circle-check-big.d.ts"},"./fhi-icon-circle-check":{"default":"./fhi-icon-circle-check.js","types":"./fhi-icon-circle-check.d.ts"},"./fhi-icon-circle-chevron-down":{"default":"./fhi-icon-circle-chevron-down.js","types":"./fhi-icon-circle-chevron-down.d.ts"},"./fhi-icon-circle-chevron-left":{"default":"./fhi-icon-circle-chevron-left.js","types":"./fhi-icon-circle-chevron-left.d.ts"},"./fhi-icon-circle-chevron-right":{"default":"./fhi-icon-circle-chevron-right.js","types":"./fhi-icon-circle-chevron-right.d.ts"},"./fhi-icon-circle-chevron-up":{"default":"./fhi-icon-circle-chevron-up.js","types":"./fhi-icon-circle-chevron-up.d.ts"},"./fhi-icon-circle-exclamation":{"default":"./fhi-icon-circle-exclamation.js","types":"./fhi-icon-circle-exclamation.d.ts"},"./fhi-icon-circle-info":{"default":"./fhi-icon-circle-info.js","types":"./fhi-icon-circle-info.d.ts"},"./fhi-icon-circle-minus":{"default":"./fhi-icon-circle-minus.js","types":"./fhi-icon-circle-minus.d.ts"},"./fhi-icon-circle-plus":{"default":"./fhi-icon-circle-plus.js","types":"./fhi-icon-circle-plus.d.ts"},"./fhi-icon-circle-question":{"default":"./fhi-icon-circle-question.js","types":"./fhi-icon-circle-question.d.ts"},"./fhi-icon-circle-x":{"default":"./fhi-icon-circle-x.js","types":"./fhi-icon-circle-x.d.ts"},"./fhi-icon-circle":{"default":"./fhi-icon-circle.js","types":"./fhi-icon-circle.d.ts"},"./fhi-icon-clock":{"default":"./fhi-icon-clock.js","types":"./fhi-icon-clock.d.ts"},"./fhi-icon-copy":{"default":"./fhi-icon-copy.js","types":"./fhi-icon-copy.d.ts"},"./fhi-icon-download":{"default":"./fhi-icon-download.js","types":"./fhi-icon-download.d.ts"},"./fhi-icon-ellipsis-vertical":{"default":"./fhi-icon-ellipsis-vertical.js","types":"./fhi-icon-ellipsis-vertical.d.ts"},"./fhi-icon-ellipsis":{"default":"./fhi-icon-ellipsis.js","types":"./fhi-icon-ellipsis.d.ts"},"./fhi-icon-exclamation":{"default":"./fhi-icon-exclamation.js","types":"./fhi-icon-exclamation.d.ts"},"./fhi-icon-expand":{"default":"./fhi-icon-expand.js","types":"./fhi-icon-expand.d.ts"},"./fhi-icon-external-link":{"default":"./fhi-icon-external-link.js","types":"./fhi-icon-external-link.d.ts"},"./fhi-icon-eye-off":{"default":"./fhi-icon-eye-off.js","types":"./fhi-icon-eye-off.d.ts"},"./fhi-icon-eye":{"default":"./fhi-icon-eye.js","types":"./fhi-icon-eye.d.ts"},"./fhi-icon-file-text":{"default":"./fhi-icon-file-text.js","types":"./fhi-icon-file-text.d.ts"},"./fhi-icon-file":{"default":"./fhi-icon-file.js","types":"./fhi-icon-file.d.ts"},"./fhi-icon-filter":{"default":"./fhi-icon-filter.js","types":"./fhi-icon-filter.d.ts"},"./fhi-icon-folder":{"default":"./fhi-icon-folder.js","types":"./fhi-icon-folder.d.ts"},"./fhi-icon-gear":{"default":"./fhi-icon-gear.js","types":"./fhi-icon-gear.d.ts"},"./fhi-icon-grid-9-dots":{"default":"./fhi-icon-grid-9-dots.js","types":"./fhi-icon-grid-9-dots.d.ts"},"./fhi-icon-grip-horizontal":{"default":"./fhi-icon-grip-horizontal.js","types":"./fhi-icon-grip-horizontal.d.ts"},"./fhi-icon-grip-vertical":{"default":"./fhi-icon-grip-vertical.js","types":"./fhi-icon-grip-vertical.d.ts"},"./fhi-icon-history":{"default":"./fhi-icon-history.js","types":"./fhi-icon-history.d.ts"},"./fhi-icon-info":{"default":"./fhi-icon-info.js","types":"./fhi-icon-info.d.ts"},"./fhi-icon-link-2-off":{"default":"./fhi-icon-link-2-off.js","types":"./fhi-icon-link-2-off.d.ts"},"./fhi-icon-link-2":{"default":"./fhi-icon-link-2.js","types":"./fhi-icon-link-2.d.ts"},"./fhi-icon-link":{"default":"./fhi-icon-link.js","types":"./fhi-icon-link.d.ts"},"./fhi-icon-lock-open":{"default":"./fhi-icon-lock-open.js","types":"./fhi-icon-lock-open.d.ts"},"./fhi-icon-lock":{"default":"./fhi-icon-lock.js","types":"./fhi-icon-lock.d.ts"},"./fhi-icon-log-in":{"default":"./fhi-icon-log-in.js","types":"./fhi-icon-log-in.d.ts"},"./fhi-icon-log-out":{"default":"./fhi-icon-log-out.js","types":"./fhi-icon-log-out.d.ts"},"./fhi-icon-mail":{"default":"./fhi-icon-mail.js","types":"./fhi-icon-mail.d.ts"},"./fhi-icon-map-pin":{"default":"./fhi-icon-map-pin.js","types":"./fhi-icon-map-pin.d.ts"},"./fhi-icon-menu":{"default":"./fhi-icon-menu.js","types":"./fhi-icon-menu.d.ts"},"./fhi-icon-message":{"default":"./fhi-icon-message.js","types":"./fhi-icon-message.d.ts"},"./fhi-icon-minus":{"default":"./fhi-icon-minus.js","types":"./fhi-icon-minus.d.ts"},"./fhi-icon-octagon-alert":{"default":"./fhi-icon-octagon-alert.js","types":"./fhi-icon-octagon-alert.d.ts"},"./fhi-icon-paperclip":{"default":"./fhi-icon-paperclip.js","types":"./fhi-icon-paperclip.d.ts"},"./fhi-icon-pencil":{"default":"./fhi-icon-pencil.js","types":"./fhi-icon-pencil.d.ts"},"./fhi-icon-phone":{"default":"./fhi-icon-phone.js","types":"./fhi-icon-phone.d.ts"},"./fhi-icon-pin-off":{"default":"./fhi-icon-pin-off.js","types":"./fhi-icon-pin-off.d.ts"},"./fhi-icon-pin":{"default":"./fhi-icon-pin.js","types":"./fhi-icon-pin.d.ts"},"./fhi-icon-plus":{"default":"./fhi-icon-plus.js","types":"./fhi-icon-plus.d.ts"},"./fhi-icon-printer":{"default":"./fhi-icon-printer.js","types":"./fhi-icon-printer.d.ts"},"./fhi-icon-question":{"default":"./fhi-icon-question.js","types":"./fhi-icon-question.d.ts"},"./fhi-icon-refresh":{"default":"./fhi-icon-refresh.js","types":"./fhi-icon-refresh.d.ts"},"./fhi-icon-rotate-left":{"default":"./fhi-icon-rotate-left.js","types":"./fhi-icon-rotate-left.d.ts"},"./fhi-icon-rotate-right":{"default":"./fhi-icon-rotate-right.js","types":"./fhi-icon-rotate-right.d.ts"},"./fhi-icon-search":{"default":"./fhi-icon-search.js","types":"./fhi-icon-search.d.ts"},"./fhi-icon-send":{"default":"./fhi-icon-send.js","types":"./fhi-icon-send.d.ts"},"./fhi-icon-share":{"default":"./fhi-icon-share.js","types":"./fhi-icon-share.d.ts"},"./fhi-icon-sheet":{"default":"./fhi-icon-sheet.js","types":"./fhi-icon-sheet.d.ts"},"./fhi-icon-square-check-big":{"default":"./fhi-icon-square-check-big.js","types":"./fhi-icon-square-check-big.d.ts"},"./fhi-icon-square-check":{"default":"./fhi-icon-square-check.js","types":"./fhi-icon-square-check.d.ts"},"./fhi-icon-square-pen":{"default":"./fhi-icon-square-pen.js","types":"./fhi-icon-square-pen.d.ts"},"./fhi-icon-square-x":{"default":"./fhi-icon-square-x.js","types":"./fhi-icon-square-x.d.ts"},"./fhi-icon-square":{"default":"./fhi-icon-square.js","types":"./fhi-icon-square.d.ts"},"./fhi-icon-trash":{"default":"./fhi-icon-trash.js","types":"./fhi-icon-trash.d.ts"},"./fhi-icon-triangle-alert":{"default":"./fhi-icon-triangle-alert.js","types":"./fhi-icon-triangle-alert.d.ts"},"./fhi-icon-upload":{"default":"./fhi-icon-upload.js","types":"./fhi-icon-upload.d.ts"},"./fhi-icon-user":{"default":"./fhi-icon-user.js","types":"./fhi-icon-user.d.ts"},"./fhi-icon-x":{"default":"./fhi-icon-x.js","types":"./fhi-icon-x.d.ts"},"./fhi-data-table":{"default":"./fhi-data-table.js","types":"./fhi-data-table.d.ts"},"./fhi-data-table-cell":{"default":"./fhi-data-table-cell.js","types":"./fhi-data-table-cell.d.ts"},"./fhi-data-table-row":{"default":"./fhi-data-table-row.js","types":"./fhi-data-table-row.d.ts"},"./fhi-select":{"default":"./fhi-select.js","types":"./fhi-select.d.ts"},"./fhi-select-item":{"default":"./fhi-select-item.js","types":"./fhi-select-item.d.ts"},"./fhi-body":{"default":"./fhi-body.js","types":"./fhi-body.d.ts"},"./fhi-display":{"default":"./fhi-display.js","types":"./fhi-display.d.ts"},"./fhi-headline":{"default":"./fhi-headline.js","types":"./fhi-headline.d.ts"},"./fhi-label":{"default":"./fhi-label.js","types":"./fhi-label.d.ts"},"./fhi-title":{"default":"./fhi-title.js","types":"./fhi-title.d.ts"},".":{"default":"./index.js"},"./theme/default.css":{"default":"./theme/default.css","style":"./theme/default.css"},"./custom-elements.json":{"default":"./custom-elements.json"}}}
|
|
1
|
+
{"title":"FHI Designsystem","author":"FHI Designsystem team","name":"@folkehelseinstituttet/designsystem","version":"0.42.1","description":"The official design system for the Norwegian Institute of Public Health implemented as web components","keywords":["fhi","folkehelseinstituttet","components","design","system","framework","frontend","web-component","web component","ui"],"customElements":".temp/custom-elements.json","web-types":"./web-types.json","homepage":"https://github.com/FHIDev/Fhi.Designsystem","bugs":{"url":"https://github.com/FHIDev/Fhi.Designsystem/issues"},"repository":{"type":"git","url":"git+https://github.com/FHIDev/Fhi.Designsystem.git"},"license":"MIT","browserslist":["> 0.5%","last 2 versions"],"main":"index.js","type":"module","scripts":{"dev":"vite","build":"pnpm analyze && pnpm build:cdn && pnpm build:npm && pnpm build:github && pnpm clean","build:cdn":"tsc && cross-env DEPLOY_TARGET=cdn vite build","build:npm":"tsc && cross-env DEPLOY_TARGET=npm vite build","build:github":"tsc && cross-env DEPLOY_TARGET=github vite build","storybook":"storybook dev -p 6006","storybook:build":"pnpm analyze && storybook build","generate:icons":"node ./scripts/generate-icon-components.js --input ./src/assets/icons/ --output ./src/components/icons --clean-output-folder","test":"wtr ./**/*.test.ts --node-resolve --playwright --browsers chromium webkit","lint":"pnpm lint:eslint && pnpm lint:prettier","lint:eslint":"eslint \"**/*.{js,ts}\"","lint:prettier":"prettier \"**/*.js\" --check --ignore-path .gitignore","format":"pnpm format:eslint && pnpm format:prettier","format:eslint":"eslint \"**/*.{js,ts}\" --fix","format:prettier":"prettier \"**/*.js\" --write --ignore-path .gitignore","publish:npm":"pnpm build && cd dist/npm && npm publish","changelog:ci":"release-it --ci","analyze":"cem analyze --litelement","clean":"rimraf .temp","build-storybook":"storybook build"},"peerDependencies":{"lit":"~3.2.0"},"devDependencies":{"@custom-elements-manifest/analyzer":"^0.11.0","@esm-bundle/chai":"4.3.4-fix.0","@open-wc/testing":"~4.0.0","@playwright/test":"^1.61.0","@release-it/conventional-changelog":"~11.0.1","@storybook/addon-docs":"^10.4.6","@storybook/web-components-vite":"^10.4.6","@types/mocha":"~10.0.10","@types/node":"~26.0.0","@types/react":"^19.2.17","@wc-toolkit/cem-sorter":"^1.0.1","@wc-toolkit/type-parser":"^1.2.1","@web/dev-server":"~0.4.6","@web/dev-server-esbuild":"~1.0.5","@web/test-runner":"~0.20.2","@web/test-runner-playwright":"~0.11.1","cross-env":"10.1.0","custom-element-jet-brains-integration":"^1.7.0","lit":"~3.3.3","mocha":"~11.7.6","playwright":"^1.61.0","release-it":"~20.2.0","rimraf":"^6.1.3","storybook":"^10.4.6","storybook-design-token":"^5.0.0","svgo":"^4.0.1","vite":"~8.0.16","vite-plugin-static-copy":"~4.1.1"},"dependencies":{"@floating-ui/dom":"^1.7.6"},"pnpm":{"overrides":{"diff@>=6.0.0 <8.0.3":">=8.0.3","serialize-javascript@<=7.0.2":">=7.0.3","yaml@>=2.0.0 <2.8.3":">=2.8.3","serialize-javascript@>=5.0.0 <7.0.5":">=7.0.5","esbuild@>=0.27.3 <0.28.1":">=0.28.1","undici@>=7.23.0 <7.28.0":">=7.28.0","undici@>=7.0.0 <7.28.0":">=7.28.0"}},"exports":{"./fhi-button":{"default":"./fhi-button.js","types":"./fhi-button.d.ts"},"./fhi-callout":{"default":"./fhi-callout.js","types":"./fhi-callout.d.ts"},"./fhi-checkbox":{"default":"./fhi-checkbox.js","types":"./fhi-checkbox.d.ts"},"./fhi-date-input":{"default":"./fhi-date-input.js","types":"./fhi-date-input.d.ts"},"./fhi-flex":{"default":"./fhi-flex.js","types":"./fhi-flex.d.ts"},"./fhi-grid":{"default":"./fhi-grid.js","types":"./fhi-grid.d.ts"},"./fhi-modal-dialog":{"default":"./fhi-modal-dialog.js","types":"./fhi-modal-dialog.d.ts"},"./fhi-radio":{"default":"./fhi-radio.js","types":"./fhi-radio.d.ts"},"./fhi-tag":{"default":"./fhi-tag.js","types":"./fhi-tag.d.ts"},"./fhi-text-input":{"default":"./fhi-text-input.js","types":"./fhi-text-input.d.ts"},"./fhi-tooltip":{"default":"./fhi-tooltip.js","types":"./fhi-tooltip.d.ts"},"./fhi-icon-arrow-down-left":{"default":"./fhi-icon-arrow-down-left.js","types":"./fhi-icon-arrow-down-left.d.ts"},"./fhi-icon-arrow-down-right":{"default":"./fhi-icon-arrow-down-right.js","types":"./fhi-icon-arrow-down-right.d.ts"},"./fhi-icon-arrow-down":{"default":"./fhi-icon-arrow-down.js","types":"./fhi-icon-arrow-down.d.ts"},"./fhi-icon-arrow-left":{"default":"./fhi-icon-arrow-left.js","types":"./fhi-icon-arrow-left.d.ts"},"./fhi-icon-arrow-right-left":{"default":"./fhi-icon-arrow-right-left.js","types":"./fhi-icon-arrow-right-left.d.ts"},"./fhi-icon-arrow-right":{"default":"./fhi-icon-arrow-right.js","types":"./fhi-icon-arrow-right.d.ts"},"./fhi-icon-arrow-up-down":{"default":"./fhi-icon-arrow-up-down.js","types":"./fhi-icon-arrow-up-down.d.ts"},"./fhi-icon-arrow-up-left":{"default":"./fhi-icon-arrow-up-left.js","types":"./fhi-icon-arrow-up-left.d.ts"},"./fhi-icon-arrow-up-right":{"default":"./fhi-icon-arrow-up-right.js","types":"./fhi-icon-arrow-up-right.d.ts"},"./fhi-icon-arrow-up":{"default":"./fhi-icon-arrow-up.js","types":"./fhi-icon-arrow-up.d.ts"},"./fhi-icon-bell":{"default":"./fhi-icon-bell.js","types":"./fhi-icon-bell.d.ts"},"./fhi-icon-calendar-clock":{"default":"./fhi-icon-calendar-clock.js","types":"./fhi-icon-calendar-clock.d.ts"},"./fhi-icon-calendar":{"default":"./fhi-icon-calendar.js","types":"./fhi-icon-calendar.d.ts"},"./fhi-icon-chart-bar-stacked":{"default":"./fhi-icon-chart-bar-stacked.js","types":"./fhi-icon-chart-bar-stacked.d.ts"},"./fhi-icon-chart-bar":{"default":"./fhi-icon-chart-bar.js","types":"./fhi-icon-chart-bar.d.ts"},"./fhi-icon-chart-column-stacked":{"default":"./fhi-icon-chart-column-stacked.js","types":"./fhi-icon-chart-column-stacked.d.ts"},"./fhi-icon-chart-column":{"default":"./fhi-icon-chart-column.js","types":"./fhi-icon-chart-column.d.ts"},"./fhi-icon-chart-line":{"default":"./fhi-icon-chart-line.js","types":"./fhi-icon-chart-line.d.ts"},"./fhi-icon-chart-no-axes-combined":{"default":"./fhi-icon-chart-no-axes-combined.js","types":"./fhi-icon-chart-no-axes-combined.d.ts"},"./fhi-icon-chart-pie":{"default":"./fhi-icon-chart-pie.js","types":"./fhi-icon-chart-pie.d.ts"},"./fhi-icon-check":{"default":"./fhi-icon-check.js","types":"./fhi-icon-check.d.ts"},"./fhi-icon-chevron-down":{"default":"./fhi-icon-chevron-down.js","types":"./fhi-icon-chevron-down.d.ts"},"./fhi-icon-chevron-left":{"default":"./fhi-icon-chevron-left.js","types":"./fhi-icon-chevron-left.d.ts"},"./fhi-icon-chevron-right":{"default":"./fhi-icon-chevron-right.js","types":"./fhi-icon-chevron-right.d.ts"},"./fhi-icon-chevron-up":{"default":"./fhi-icon-chevron-up.js","types":"./fhi-icon-chevron-up.d.ts"},"./fhi-icon-chevrons-down":{"default":"./fhi-icon-chevrons-down.js","types":"./fhi-icon-chevrons-down.d.ts"},"./fhi-icon-chevrons-left":{"default":"./fhi-icon-chevrons-left.js","types":"./fhi-icon-chevrons-left.d.ts"},"./fhi-icon-chevrons-right":{"default":"./fhi-icon-chevrons-right.js","types":"./fhi-icon-chevrons-right.d.ts"},"./fhi-icon-chevrons-up":{"default":"./fhi-icon-chevrons-up.js","types":"./fhi-icon-chevrons-up.d.ts"},"./fhi-icon-circle-arrow-down":{"default":"./fhi-icon-circle-arrow-down.js","types":"./fhi-icon-circle-arrow-down.d.ts"},"./fhi-icon-circle-arrow-left":{"default":"./fhi-icon-circle-arrow-left.js","types":"./fhi-icon-circle-arrow-left.d.ts"},"./fhi-icon-circle-arrow-right":{"default":"./fhi-icon-circle-arrow-right.js","types":"./fhi-icon-circle-arrow-right.d.ts"},"./fhi-icon-circle-arrow-up":{"default":"./fhi-icon-circle-arrow-up.js","types":"./fhi-icon-circle-arrow-up.d.ts"},"./fhi-icon-circle-check-big":{"default":"./fhi-icon-circle-check-big.js","types":"./fhi-icon-circle-check-big.d.ts"},"./fhi-icon-circle-check":{"default":"./fhi-icon-circle-check.js","types":"./fhi-icon-circle-check.d.ts"},"./fhi-icon-circle-chevron-down":{"default":"./fhi-icon-circle-chevron-down.js","types":"./fhi-icon-circle-chevron-down.d.ts"},"./fhi-icon-circle-chevron-left":{"default":"./fhi-icon-circle-chevron-left.js","types":"./fhi-icon-circle-chevron-left.d.ts"},"./fhi-icon-circle-chevron-right":{"default":"./fhi-icon-circle-chevron-right.js","types":"./fhi-icon-circle-chevron-right.d.ts"},"./fhi-icon-circle-chevron-up":{"default":"./fhi-icon-circle-chevron-up.js","types":"./fhi-icon-circle-chevron-up.d.ts"},"./fhi-icon-circle-exclamation":{"default":"./fhi-icon-circle-exclamation.js","types":"./fhi-icon-circle-exclamation.d.ts"},"./fhi-icon-circle-info":{"default":"./fhi-icon-circle-info.js","types":"./fhi-icon-circle-info.d.ts"},"./fhi-icon-circle-minus":{"default":"./fhi-icon-circle-minus.js","types":"./fhi-icon-circle-minus.d.ts"},"./fhi-icon-circle-plus":{"default":"./fhi-icon-circle-plus.js","types":"./fhi-icon-circle-plus.d.ts"},"./fhi-icon-circle-question":{"default":"./fhi-icon-circle-question.js","types":"./fhi-icon-circle-question.d.ts"},"./fhi-icon-circle-x":{"default":"./fhi-icon-circle-x.js","types":"./fhi-icon-circle-x.d.ts"},"./fhi-icon-circle":{"default":"./fhi-icon-circle.js","types":"./fhi-icon-circle.d.ts"},"./fhi-icon-clock":{"default":"./fhi-icon-clock.js","types":"./fhi-icon-clock.d.ts"},"./fhi-icon-copy":{"default":"./fhi-icon-copy.js","types":"./fhi-icon-copy.d.ts"},"./fhi-icon-download":{"default":"./fhi-icon-download.js","types":"./fhi-icon-download.d.ts"},"./fhi-icon-ellipsis-vertical":{"default":"./fhi-icon-ellipsis-vertical.js","types":"./fhi-icon-ellipsis-vertical.d.ts"},"./fhi-icon-ellipsis":{"default":"./fhi-icon-ellipsis.js","types":"./fhi-icon-ellipsis.d.ts"},"./fhi-icon-exclamation":{"default":"./fhi-icon-exclamation.js","types":"./fhi-icon-exclamation.d.ts"},"./fhi-icon-expand":{"default":"./fhi-icon-expand.js","types":"./fhi-icon-expand.d.ts"},"./fhi-icon-external-link":{"default":"./fhi-icon-external-link.js","types":"./fhi-icon-external-link.d.ts"},"./fhi-icon-eye-off":{"default":"./fhi-icon-eye-off.js","types":"./fhi-icon-eye-off.d.ts"},"./fhi-icon-eye":{"default":"./fhi-icon-eye.js","types":"./fhi-icon-eye.d.ts"},"./fhi-icon-file-text":{"default":"./fhi-icon-file-text.js","types":"./fhi-icon-file-text.d.ts"},"./fhi-icon-file":{"default":"./fhi-icon-file.js","types":"./fhi-icon-file.d.ts"},"./fhi-icon-filter":{"default":"./fhi-icon-filter.js","types":"./fhi-icon-filter.d.ts"},"./fhi-icon-folder":{"default":"./fhi-icon-folder.js","types":"./fhi-icon-folder.d.ts"},"./fhi-icon-gear":{"default":"./fhi-icon-gear.js","types":"./fhi-icon-gear.d.ts"},"./fhi-icon-grid-9-dots":{"default":"./fhi-icon-grid-9-dots.js","types":"./fhi-icon-grid-9-dots.d.ts"},"./fhi-icon-grip-horizontal":{"default":"./fhi-icon-grip-horizontal.js","types":"./fhi-icon-grip-horizontal.d.ts"},"./fhi-icon-grip-vertical":{"default":"./fhi-icon-grip-vertical.js","types":"./fhi-icon-grip-vertical.d.ts"},"./fhi-icon-history":{"default":"./fhi-icon-history.js","types":"./fhi-icon-history.d.ts"},"./fhi-icon-info":{"default":"./fhi-icon-info.js","types":"./fhi-icon-info.d.ts"},"./fhi-icon-link-2-off":{"default":"./fhi-icon-link-2-off.js","types":"./fhi-icon-link-2-off.d.ts"},"./fhi-icon-link-2":{"default":"./fhi-icon-link-2.js","types":"./fhi-icon-link-2.d.ts"},"./fhi-icon-link":{"default":"./fhi-icon-link.js","types":"./fhi-icon-link.d.ts"},"./fhi-icon-lock-open":{"default":"./fhi-icon-lock-open.js","types":"./fhi-icon-lock-open.d.ts"},"./fhi-icon-lock":{"default":"./fhi-icon-lock.js","types":"./fhi-icon-lock.d.ts"},"./fhi-icon-log-in":{"default":"./fhi-icon-log-in.js","types":"./fhi-icon-log-in.d.ts"},"./fhi-icon-log-out":{"default":"./fhi-icon-log-out.js","types":"./fhi-icon-log-out.d.ts"},"./fhi-icon-mail":{"default":"./fhi-icon-mail.js","types":"./fhi-icon-mail.d.ts"},"./fhi-icon-map-pin":{"default":"./fhi-icon-map-pin.js","types":"./fhi-icon-map-pin.d.ts"},"./fhi-icon-menu":{"default":"./fhi-icon-menu.js","types":"./fhi-icon-menu.d.ts"},"./fhi-icon-message":{"default":"./fhi-icon-message.js","types":"./fhi-icon-message.d.ts"},"./fhi-icon-minus":{"default":"./fhi-icon-minus.js","types":"./fhi-icon-minus.d.ts"},"./fhi-icon-octagon-alert":{"default":"./fhi-icon-octagon-alert.js","types":"./fhi-icon-octagon-alert.d.ts"},"./fhi-icon-paperclip":{"default":"./fhi-icon-paperclip.js","types":"./fhi-icon-paperclip.d.ts"},"./fhi-icon-pencil":{"default":"./fhi-icon-pencil.js","types":"./fhi-icon-pencil.d.ts"},"./fhi-icon-phone":{"default":"./fhi-icon-phone.js","types":"./fhi-icon-phone.d.ts"},"./fhi-icon-pin-off":{"default":"./fhi-icon-pin-off.js","types":"./fhi-icon-pin-off.d.ts"},"./fhi-icon-pin":{"default":"./fhi-icon-pin.js","types":"./fhi-icon-pin.d.ts"},"./fhi-icon-plus":{"default":"./fhi-icon-plus.js","types":"./fhi-icon-plus.d.ts"},"./fhi-icon-printer":{"default":"./fhi-icon-printer.js","types":"./fhi-icon-printer.d.ts"},"./fhi-icon-question":{"default":"./fhi-icon-question.js","types":"./fhi-icon-question.d.ts"},"./fhi-icon-refresh":{"default":"./fhi-icon-refresh.js","types":"./fhi-icon-refresh.d.ts"},"./fhi-icon-rotate-left":{"default":"./fhi-icon-rotate-left.js","types":"./fhi-icon-rotate-left.d.ts"},"./fhi-icon-rotate-right":{"default":"./fhi-icon-rotate-right.js","types":"./fhi-icon-rotate-right.d.ts"},"./fhi-icon-search":{"default":"./fhi-icon-search.js","types":"./fhi-icon-search.d.ts"},"./fhi-icon-send":{"default":"./fhi-icon-send.js","types":"./fhi-icon-send.d.ts"},"./fhi-icon-share":{"default":"./fhi-icon-share.js","types":"./fhi-icon-share.d.ts"},"./fhi-icon-sheet":{"default":"./fhi-icon-sheet.js","types":"./fhi-icon-sheet.d.ts"},"./fhi-icon-square-check-big":{"default":"./fhi-icon-square-check-big.js","types":"./fhi-icon-square-check-big.d.ts"},"./fhi-icon-square-check":{"default":"./fhi-icon-square-check.js","types":"./fhi-icon-square-check.d.ts"},"./fhi-icon-square-pen":{"default":"./fhi-icon-square-pen.js","types":"./fhi-icon-square-pen.d.ts"},"./fhi-icon-square-x":{"default":"./fhi-icon-square-x.js","types":"./fhi-icon-square-x.d.ts"},"./fhi-icon-square":{"default":"./fhi-icon-square.js","types":"./fhi-icon-square.d.ts"},"./fhi-icon-trash":{"default":"./fhi-icon-trash.js","types":"./fhi-icon-trash.d.ts"},"./fhi-icon-triangle-alert":{"default":"./fhi-icon-triangle-alert.js","types":"./fhi-icon-triangle-alert.d.ts"},"./fhi-icon-upload":{"default":"./fhi-icon-upload.js","types":"./fhi-icon-upload.d.ts"},"./fhi-icon-user":{"default":"./fhi-icon-user.js","types":"./fhi-icon-user.d.ts"},"./fhi-icon-x":{"default":"./fhi-icon-x.js","types":"./fhi-icon-x.d.ts"},"./fhi-data-table":{"default":"./fhi-data-table.js","types":"./fhi-data-table.d.ts"},"./fhi-data-table-cell":{"default":"./fhi-data-table-cell.js","types":"./fhi-data-table-cell.d.ts"},"./fhi-data-table-row":{"default":"./fhi-data-table-row.js","types":"./fhi-data-table-row.d.ts"},"./fhi-select":{"default":"./fhi-select.js","types":"./fhi-select.d.ts"},"./fhi-select-item":{"default":"./fhi-select-item.js","types":"./fhi-select-item.d.ts"},"./fhi-body":{"default":"./fhi-body.js","types":"./fhi-body.d.ts"},"./fhi-display":{"default":"./fhi-display.js","types":"./fhi-display.d.ts"},"./fhi-headline":{"default":"./fhi-headline.js","types":"./fhi-headline.d.ts"},"./fhi-label":{"default":"./fhi-label.js","types":"./fhi-label.d.ts"},"./fhi-title":{"default":"./fhi-title.js","types":"./fhi-title.d.ts"},".":{"default":"./index.js"},"./theme/default.css":{"default":"./theme/default.css","style":"./theme/default.css"},"./custom-elements.json":{"default":"./custom-elements.json"}}}
|
package/web-types.json
CHANGED