@felleslosninger/minid-elements 0.0.105 → 0.0.107

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 (52) hide show
  1. package/dist/components/checkbox.js.map +1 -1
  2. package/dist/components/code-input.component.d.ts.map +1 -1
  3. package/dist/components/code-input.js.map +1 -1
  4. package/dist/components/combobox.component.d.ts +9 -9
  5. package/dist/components/combobox.component.d.ts.map +1 -1
  6. package/dist/components/combobox.js +52 -55
  7. package/dist/components/combobox.js.map +1 -1
  8. package/dist/components/dropdown.component.d.ts.map +1 -1
  9. package/dist/components/dropdown.js +13 -5
  10. package/dist/components/dropdown.js.map +1 -1
  11. package/dist/components/icon/icon.component.d.ts.map +1 -1
  12. package/dist/components/icon/icon.js.map +1 -1
  13. package/dist/components/phone-input.component.d.ts +12 -2
  14. package/dist/components/phone-input.component.d.ts.map +1 -1
  15. package/dist/components/phone-input.js +40 -9
  16. package/dist/components/phone-input.js.map +1 -1
  17. package/dist/components/popup.js +1 -1
  18. package/dist/components/radio-group.component.d.ts.map +1 -1
  19. package/dist/components/radio-group.js.map +1 -1
  20. package/dist/components/step-indicator.component.d.ts.map +1 -1
  21. package/dist/components/step-indicator.js +14 -5
  22. package/dist/components/step-indicator.js.map +1 -1
  23. package/dist/components/validation-message.component.d.ts +12 -0
  24. package/dist/components/validation-message.component.d.ts.map +1 -0
  25. package/dist/components/validation-message.js +32 -0
  26. package/dist/components/validation-message.js.map +1 -0
  27. package/dist/designsystemet-tailwind.css +13 -13
  28. package/dist/events/events.d.ts +2 -0
  29. package/dist/events/events.d.ts.map +1 -1
  30. package/dist/events/mid-invalid-hide.d.ts +9 -0
  31. package/dist/events/mid-invalid-hide.d.ts.map +1 -0
  32. package/dist/events/mid-invalid-show.d.ts +9 -0
  33. package/dist/events/mid-invalid-show.d.ts.map +1 -0
  34. package/dist/index.d.ts +1 -0
  35. package/dist/index.d.ts.map +1 -1
  36. package/dist/index.js +3 -1
  37. package/dist/index.js.map +1 -1
  38. package/dist/internal/string-converter.d.ts.map +1 -1
  39. package/dist/internal/string-converter.js.map +1 -1
  40. package/dist/mixins/form-control.mixin.d.ts.map +1 -1
  41. package/dist/mixins/form-control.mixin.js.map +1 -1
  42. package/dist/mixins/form-controller.mixin.d.ts.map +1 -1
  43. package/dist/mixins/form-controller.mixin.js.map +1 -1
  44. package/dist/mixins/validators.d.ts.map +1 -1
  45. package/dist/mixins/validators.js.map +1 -1
  46. package/dist/types/form-control.d.ts.map +1 -1
  47. package/dist/types/validator.type.d.ts.map +1 -1
  48. package/dist/utilities/animation-registry.d.ts.map +1 -1
  49. package/dist/utilities/animation-registry.js.map +1 -1
  50. package/dist/utilities/country-labels-no.d.ts.map +1 -1
  51. package/dist/utilities/country-labels-no.js.map +1 -1
  52. package/package.json +7 -4
package/dist/components/dropdown.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown.js","sources":["../../src/components/dropdown.component.ts"],"sourcesContent":["import { css, html, LitElement } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styled } from '../mixins/tailwind.mixin.ts';\nimport './popup.component';\nimport {\n getAnimation,\n setDefaultAnimation,\n} from '../utilities/animation-registry.ts';\nimport { waitForEvent } from '../internal/event.ts';\nimport { MinidPopup } from './popup.component';\nimport { watch } from '../internal/watch.ts';\nimport { animateTo, stopAnimations } from '../internal/animate.ts';\nimport { getTabbableBoundary } from '../internal/tabbable.ts';\nimport { MinidButton } from '../components/button.component.ts';\nimport { MidSelectEvent } from '../events/mid-select.ts';\nimport { MinidMenu } from '../components/menu.component.ts';\nimport { MinidMenuItem } from 'src/components/menu-item.component.ts';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'mid-dropdown': MinidDropdown;\n }\n}\n\nlet nextUniqueId = 0;\n\nconst styles = [\n css`\n :host {\n display: inline-flex;\n }\n `,\n];\n\n/**\n * @slot -- Default slot for content of the dropdown panel\n * @slot trigger - Used for the button element that will be used to open the dropdown menu\n * @part panel - Select the dropdown panel host element\n */\n@customElement('mid-dropdown')\nexport class MinidDropdown extends styled(LitElement, styles) {\n private readonly popupId = `mid-dropdown-${nextUniqueId++}`;\n private closeWatcher?: CloseWatcher | null;\n\n @query('.popup')\n popup!: MinidPopup;\n\n @query('.trigger')\n trigger!: HTMLSlotElement;\n\n @query('.panel')\n panel!: HTMLSlotElement;\n\n @property({ type: Boolean, reflect: true })\n open = false;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\n * dropdowns that allow for multiple interactions.\n */\n @property({ type: Boolean, reflect: true })\n stayopenonselect = false;\n\n @property()\n size: 'sm' | 'md' | 'lg' = 'md';\n\n @property({ reflect: true })\n placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end' = 'bottom-end';\n\n /**\n * Sync the dropdown panel size with the trigger element\n */\n @property({ reflect: true })\n sync?: 'width' | 'height' | 'both';\n\n /**\n * Distance between trigger and dropdown panel\n */\n @property({ type: Number })\n distance = 4;\n\n /**\n * Nudge the dropdown panel position. Accepts a negative or positive number.\n */\n @property({ type: Number })\n skidding = 0;\n\n @property({ type: Boolean })\n arrow = false;\n\n /**\n * Choose if position is `fixed` or `absolute`. `absolute` is more performant,\n * but `fixed` can solve issues with overflow clipping\n */\n @property({ type: Boolean })\n hoist = false;\n\n /**\n * The dropdown will close when the user interacts outside of this element (e.g. clicking). Useful for composing other\n * components that use a dropdown internally.\n */\n @property({ attribute: false })\n containingElement?: HTMLElement;\n\n connectedCallback() {\n super.connectedCallback();\n\n if (!this.containingElement) {\n this.containingElement = this;\n }\n }\n\n firstUpdated() {\n this.panel.hidden = !this.open;\n\n // If the dropdown is visible on init, update its position\n if (this.open) {\n this.addOpenListeners();\n this.popup.active = true;\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeOpenListeners();\n this.hide();\n }\n\n focusOnTrigger() {\n const trigger = this.trigger.assignedElements({ flatten: true })[0] as\n | HTMLElement\n | undefined;\n if (typeof trigger?.focus === 'function') {\n trigger.focus();\n }\n }\n\n getMenu() {\n return this.panel\n .assignedElements({ flatten: true })\n .find((el) => el.tagName.toLowerCase() === 'mid-menu') as\n | MinidMenu\n | undefined;\n }\n\n private handleKeyDown = (event: KeyboardEvent) => {\n // Close when escape is pressed inside an open dropdown. We need to listen on the panel itself and stop propagation\n // in case any ancestors are also listening for this key.\n if (this.open && event.key === 'Escape') {\n event.stopPropagation();\n this.hide();\n this.focusOnTrigger();\n }\n };\n\n private handleDocumentKeyDown = (event: KeyboardEvent) => {\n // Close when escape or tab is pressed\n if (event.key === 'Escape' && this.open && !this.closeWatcher) {\n event.stopPropagation();\n this.focusOnTrigger();\n this.hide();\n return;\n }\n\n // Handle tabbing\n if (event.key === 'Tab') {\n const composedPath = event.composedPath();\n const tabbedIsMenuItem = composedPath.some(\n (e): e is MinidMenuItem =>\n (e as HTMLElement).tagName?.toLowerCase() === 'mid-menu-item'\n );\n\n // Tabbing within an open menu should close the dropdown and refocus the trigger\n if (this.open && tabbedIsMenuItem) {\n event.preventDefault();\n this.hide();\n this.focusOnTrigger();\n return;\n }\n\n // Tabbing outside of the containing element closes the panel\n //\n // If the dropdown is used within a shadow DOM, we need to obtain the activeElement within that shadowRoot,\n // otherwise `document.activeElement` will only return the name of the parent shadow DOM element.\n setTimeout(() => {\n if (composedPath.every((target) => target !== this.containingElement)) {\n this.hide();\n }\n });\n }\n };\n\n private handleDocumentMouseDown = (event: MouseEvent) => {\n // Close when clicking outside of the containing element\n const path = event.composedPath();\n\n if (this.containingElement && !path.includes(this.containingElement)) {\n this.hide();\n }\n };\n\n private handlePanelSelect = (event: MidSelectEvent) => {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (!this.stayopenonselect && target.tagName.toLowerCase() === 'mid-menu') {\n this.hide();\n this.focusOnTrigger();\n }\n };\n\n handleTriggerClick() {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n this.focusOnTrigger();\n }\n }\n\n async handleTriggerKeyDown(event: KeyboardEvent) {\n // When spacebar/enter is pressed, show the panel but don't focus on the menu. This let's the user press the same\n // key again to hide the menu in case they don't want to make a selection.\n if ([' ', 'Enter'].includes(event.key)) {\n event.preventDefault();\n this.handleTriggerClick();\n return;\n }\n\n const menu = this.getMenu();\n\n if (menu) {\n const menuItems = menu.getAllSelectableItems();\n const firstMenuItem = menuItems[0];\n const lastMenuItem = menuItems[menuItems.length - 1];\n\n // When up/down is pressed, we make the assumption that the user is familiar with the menu and plans to make a\n // selection. Rather than toggle the panel, we focus on the menu (if one exists) and activate the first item for\n // faster navigation.\n if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n event.preventDefault();\n\n // Show the menu if it's not already open\n if (!this.open) {\n this.show();\n\n // Wait for the dropdown to open before focusing, but not the animation\n await this.updateComplete;\n }\n\n if (menuItems.length > 0) {\n // Focus on the first/last menu item after showing\n this.updateComplete.then(() => {\n if (event.key === 'ArrowDown' || event.key === 'Home') {\n menu.setCurrentItem(firstMenuItem);\n firstMenuItem.focus();\n }\n\n if (event.key === 'ArrowUp' || event.key === 'End') {\n menu.setCurrentItem(lastMenuItem);\n lastMenuItem.focus();\n }\n });\n }\n }\n }\n }\n\n handleTriggerKeyUp(event: KeyboardEvent) {\n // Prevent space from triggering a click event in Firefox\n if (event.key === ' ') {\n event.preventDefault();\n }\n }\n\n handleTriggerSlotChange() {\n this.updateAccessibleTrigger();\n }\n\n updateAccessibleTrigger() {\n const assignedElements = this.trigger.assignedElements({\n flatten: true,\n }) as HTMLElement[];\n const accessibleTrigger = assignedElements.find(\n (el) => getTabbableBoundary(el).start\n );\n let target: HTMLElement;\n if (accessibleTrigger) {\n if (accessibleTrigger.tagName.toLowerCase() === 'mid-button') {\n target = (accessibleTrigger as MinidButton).button;\n } else {\n target = accessibleTrigger;\n }\n\n target.setAttribute('aria-haspopup', 'true');\n target.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n }\n }\n\n /**\n * Shows the dropdown panel.\n */\n async show() {\n if (this.open) {\n return undefined;\n }\n\n this.open = true;\n return waitForEvent(this, 'mid-after-show');\n }\n\n /**\n * Hides the dropdown panel\n */\n async hide() {\n if (!this.open) {\n return undefined;\n }\n\n this.open = false;\n return waitForEvent(this, 'mid-after-hide');\n }\n\n /**\n * Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu\n * is activated.\n */\n reposition() {\n this.popup.reposition();\n }\n\n addOpenListeners() {\n this.panel.addEventListener('mid-select', this.handlePanelSelect);\n if ('CloseWatcher' in window) {\n this.closeWatcher?.destroy();\n this.closeWatcher = new CloseWatcher();\n this.closeWatcher.onclose = () => {\n this.hide();\n this.focusOnTrigger();\n };\n } else {\n this.panel.addEventListener('keydown', this.handleKeyDown);\n }\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n }\n\n removeOpenListeners() {\n if (this.panel) {\n this.panel.removeEventListener('mid-select', this.handlePanelSelect);\n this.panel.removeEventListener('keydown', this.handleKeyDown);\n }\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n this.closeWatcher?.destroy();\n }\n\n @watch('open', { waitUntilFirstUpdate: true })\n async handleOpenChange() {\n if (this.disabled) {\n this.open = false;\n return;\n }\n\n this.updateAccessibleTrigger();\n\n if (this.open) {\n // Show\n this.dispatchEvent(new Event('mid-show'));\n this.addOpenListeners();\n\n await stopAnimations(this);\n this.panel.hidden = false;\n this.popup.active = true;\n const { keyframes, options } = getAnimation(this, 'dropdown.show');\n await animateTo(this.popup.popup, keyframes, options);\n\n this.dispatchEvent(new Event('mid-after-show'));\n } else {\n // Hide\n this.dispatchEvent(new Event('mid-hide'));\n this.removeOpenListeners();\n\n await stopAnimations(this);\n const { keyframes, options } = getAnimation(this, 'dropdown.hide');\n await animateTo(this.popup.popup, keyframes, options);\n this.panel.hidden = true;\n this.popup.active = false;\n\n this.dispatchEvent(new Event('mid-after-hide'));\n }\n }\n\n override render() {\n return html`\n <mid-popup\n id=\"${this.popupId}\"\n class=\"${classMap({\n 'text-body-sm': this.size === 'sm',\n 'text-body-md': this.size === 'md',\n 'text-body-lg': this.size === 'lg',\n })} popup [--arrow-border-color:var(--border-color-neutral-subtle)] [--arrow-size:8px]\"\n distance=${this.distance}\n placement=\"${this.placement}\"\n skidding=${this.skidding}\n strategy=${this.hoist ? 'fixed' : 'absolute'}\n flip\n shift\n auto-size=\"vertical\"\n auto-size-padding=\"10\"\n sync=${ifDefined(this.sync)}\n ?arrow=${this.arrow}\n >\n <slot\n slot=\"anchor\"\n name=\"trigger\"\n class=\"trigger\"\n @click=${this.handleTriggerClick}\n @keydown=${this.handleTriggerKeyDown}\n @keyup=${this.handleTriggerKeyUp}\n @slotchange=${this.handleTriggerSlotChange}\n >\n </slot>\n <div\n class=\"bg-accent min-w-68\"\n aria-hidden=${this.open ? 'false' : 'true'}\n aria-labelledby=\"${this.popupId}\"\n >\n <slot part=\"panel\" class=\"panel\"></slot>\n </div>\n </mid-popup>\n `;\n }\n}\n\nsetDefaultAnimation('dropdown.show', {\n keyframes: [\n { opacity: 0, scale: 0.9 },\n { opacity: 1, scale: 1 },\n ],\n options: { duration: 100, easing: 'ease' },\n});\n\nsetDefaultAnimation('dropdown.hide', {\n keyframes: [\n { opacity: 1, scale: 1 },\n { opacity: 0, scale: 0.9 },\n ],\n options: { duration: 100, easing: 'ease' },\n});\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"dropdown.js","sources":["../../src/components/dropdown.component.ts"],"sourcesContent":["import { css, html, LitElement } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styled } from '../mixins/tailwind.mixin.ts';\nimport './popup.component';\nimport {\n getAnimation,\n setDefaultAnimation,\n} from '../utilities/animation-registry.ts';\nimport { waitForEvent } from '../internal/event.ts';\nimport { MinidPopup } from './popup.component';\nimport { watch } from '../internal/watch.ts';\nimport { animateTo, stopAnimations } from '../internal/animate.ts';\nimport { getTabbableBoundary } from '../internal/tabbable.ts';\nimport { MinidButton } from '../components/button.component.ts';\nimport type { MidSelectEvent } from '../events/mid-select.ts';\nimport { MinidMenu } from '../components/menu.component.ts';\nimport { MinidMenuItem } from '../components/menu-item.component.ts';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'mid-dropdown': MinidDropdown;\n }\n}\n\nlet nextUniqueId = 0;\n\nconst styles = [\n css`\n :host {\n display: inline-flex;\n }\n `,\n];\n\n/**\n * @slot -- Default slot for content of the dropdown panel\n * @slot trigger - Used for the button element that will be used to open the dropdown menu\n * @part panel - Select the dropdown panel host element\n */\n@customElement('mid-dropdown')\nexport class MinidDropdown extends styled(LitElement, styles) {\n private readonly popupId = `mid-dropdown-${nextUniqueId++}`;\n private closeWatcher?: CloseWatcher | null;\n\n @query('.popup')\n popup!: MinidPopup;\n\n @query('.trigger')\n trigger!: HTMLSlotElement;\n\n @query('.panel')\n panel!: HTMLSlotElement;\n\n @property({ type: Boolean, reflect: true })\n open = false;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\n * dropdowns that allow for multiple interactions.\n */\n @property({ type: Boolean, reflect: true })\n stayopenonselect = false;\n\n @property()\n size: 'sm' | 'md' | 'lg' = 'md';\n\n @property({ reflect: true })\n placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end' = 'bottom-end';\n\n /**\n * Sync the dropdown panel size with the trigger element\n */\n @property({ reflect: true })\n sync?: 'width' | 'height' | 'both';\n\n /**\n * Distance between trigger and dropdown panel\n */\n @property({ type: Number })\n distance = 4;\n\n /**\n * Nudge the dropdown panel position. Accepts a negative or positive number.\n */\n @property({ type: Number })\n skidding = 0;\n\n @property({ type: Boolean })\n arrow = false;\n\n /**\n * Choose if position is `fixed` or `absolute`. `absolute` is more performant,\n * but `fixed` can solve issues with overflow clipping\n */\n @property({ type: Boolean })\n hoist = false;\n\n /**\n * The dropdown will close when the user interacts outside of this element (e.g. clicking). Useful for composing other\n * components that use a dropdown internally.\n */\n @property({ attribute: false })\n containingElement?: HTMLElement;\n\n connectedCallback() {\n super.connectedCallback();\n\n if (!this.containingElement) {\n this.containingElement = this;\n }\n }\n\n firstUpdated() {\n this.panel.hidden = !this.open;\n\n // If the dropdown is visible on init, update its position\n if (this.open) {\n this.addOpenListeners();\n this.popup.active = true;\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeOpenListeners();\n this.hide();\n }\n\n focusOnTrigger() {\n const trigger = this.trigger.assignedElements({ flatten: true })[0] as\n | HTMLElement\n | undefined;\n if (typeof trigger?.focus === 'function') {\n trigger.focus();\n }\n }\n\n getMenu() {\n return this.panel\n .assignedElements({ flatten: true })\n .find((el) => el.tagName.toLowerCase() === 'mid-menu') as\n | MinidMenu\n | undefined;\n }\n\n private handleKeyDown = (event: KeyboardEvent) => {\n // Close when escape is pressed inside an open dropdown. We need to listen on the panel itself and stop propagation\n // in case any ancestors are also listening for this key.\n if (this.open && event.key === 'Escape') {\n event.stopPropagation();\n this.hide();\n this.focusOnTrigger();\n }\n };\n\n private handleDocumentKeyDown = (event: KeyboardEvent) => {\n // Close when escape or tab is pressed\n if (event.key === 'Escape' && this.open && !this.closeWatcher) {\n event.stopPropagation();\n this.focusOnTrigger();\n this.hide();\n return;\n }\n\n // Handle tabbing\n if (event.key === 'Tab') {\n const composedPath = event.composedPath();\n const tabbedIsMenuItem = composedPath.some(\n (e): e is MinidMenuItem =>\n (e as HTMLElement).tagName?.toLowerCase() === 'mid-menu-item'\n );\n\n // Tabbing within an open menu should close the dropdown and refocus the trigger\n if (this.open && tabbedIsMenuItem) {\n event.preventDefault();\n this.hide();\n this.focusOnTrigger();\n return;\n }\n\n // Tabbing outside of the containing element closes the panel\n //\n // If the dropdown is used within a shadow DOM, we need to obtain the activeElement within that shadowRoot,\n // otherwise `document.activeElement` will only return the name of the parent shadow DOM element.\n setTimeout(() => {\n if (composedPath.every((target) => target !== this.containingElement)) {\n this.hide();\n }\n });\n }\n };\n\n private handleDocumentMouseDown = (event: MouseEvent) => {\n // Close when clicking outside of the containing element\n const path = event.composedPath();\n\n if (this.containingElement && !path.includes(this.containingElement)) {\n this.hide();\n }\n };\n\n private handlePanelSelect = (event: MidSelectEvent) => {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (!this.stayopenonselect && target.tagName.toLowerCase() === 'mid-menu') {\n this.hide();\n this.focusOnTrigger();\n }\n };\n\n handleTriggerClick() {\n if (this.open) {\n this.hide();\n } else {\n this.show();\n this.focusOnTrigger();\n }\n }\n\n async handleTriggerKeyDown(event: KeyboardEvent) {\n // When spacebar/enter is pressed, show the panel but don't focus on the menu. This let's the user press the same\n // key again to hide the menu in case they don't want to make a selection.\n if ([' ', 'Enter'].includes(event.key)) {\n event.preventDefault();\n this.handleTriggerClick();\n return;\n }\n\n const menu = this.getMenu();\n\n if (menu) {\n const menuItems = menu.getAllSelectableItems();\n const firstMenuItem = menuItems[0];\n const lastMenuItem = menuItems[menuItems.length - 1];\n\n // When up/down is pressed, we make the assumption that the user is familiar with the menu and plans to make a\n // selection. Rather than toggle the panel, we focus on the menu (if one exists) and activate the first item for\n // faster navigation.\n if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) {\n event.preventDefault();\n\n // Show the menu if it's not already open\n if (!this.open) {\n this.show();\n\n // Wait for the dropdown to open before focusing, but not the animation\n await this.updateComplete;\n }\n\n if (menuItems.length > 0) {\n // Focus on the first/last menu item after showing\n this.updateComplete.then(() => {\n if (event.key === 'ArrowDown' || event.key === 'Home') {\n menu.setCurrentItem(firstMenuItem);\n firstMenuItem.focus();\n }\n\n if (event.key === 'ArrowUp' || event.key === 'End') {\n menu.setCurrentItem(lastMenuItem);\n lastMenuItem.focus();\n }\n });\n }\n }\n }\n }\n\n handleTriggerKeyUp(event: KeyboardEvent) {\n // Prevent space from triggering a click event in Firefox\n if (event.key === ' ') {\n event.preventDefault();\n }\n }\n\n handleTriggerSlotChange() {\n this.updateAccessibleTrigger();\n }\n\n updateAccessibleTrigger() {\n const assignedElements = this.trigger.assignedElements({\n flatten: true,\n }) as HTMLElement[];\n const accessibleTrigger = assignedElements.find(\n (el) => getTabbableBoundary(el).start\n );\n let target: HTMLElement;\n if (accessibleTrigger) {\n if (accessibleTrigger.tagName.toLowerCase() === 'mid-button') {\n target = (accessibleTrigger as MinidButton).button;\n } else {\n target = accessibleTrigger;\n }\n\n target.setAttribute('aria-haspopup', 'true');\n target.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n }\n }\n\n /**\n * Shows the dropdown panel.\n */\n async show() {\n if (this.open) {\n return undefined;\n }\n\n this.open = true;\n return waitForEvent(this, 'mid-after-show');\n }\n\n /**\n * Hides the dropdown panel\n */\n async hide() {\n if (!this.open) {\n return undefined;\n }\n\n this.open = false;\n return waitForEvent(this, 'mid-after-hide');\n }\n\n /**\n * Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu\n * is activated.\n */\n reposition() {\n this.popup.reposition();\n }\n\n addOpenListeners() {\n this.panel.addEventListener('mid-select', this.handlePanelSelect);\n if ('CloseWatcher' in window) {\n this.closeWatcher?.destroy();\n this.closeWatcher = new CloseWatcher();\n this.closeWatcher.onclose = () => {\n this.hide();\n this.focusOnTrigger();\n };\n } else {\n this.panel.addEventListener('keydown', this.handleKeyDown);\n }\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n }\n\n removeOpenListeners() {\n if (this.panel) {\n this.panel.removeEventListener('mid-select', this.handlePanelSelect);\n this.panel.removeEventListener('keydown', this.handleKeyDown);\n }\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n this.closeWatcher?.destroy();\n }\n\n @watch('open', { waitUntilFirstUpdate: true })\n async handleOpenChange() {\n if (this.disabled) {\n this.open = false;\n return;\n }\n\n this.updateAccessibleTrigger();\n\n if (this.open) {\n // Show\n this.dispatchEvent(\n new Event('mid-show', { bubbles: true, composed: true })\n );\n this.addOpenListeners();\n\n await stopAnimations(this);\n this.panel.hidden = false;\n this.popup.active = true;\n const { keyframes, options } = getAnimation(this, 'dropdown.show');\n await animateTo(this.popup.popup, keyframes, options);\n\n this.dispatchEvent(\n new Event('mid-after-show', { bubbles: true, composed: true })\n );\n } else {\n // Hide\n this.dispatchEvent(\n new Event('mid-hide', { bubbles: true, composed: true })\n );\n this.removeOpenListeners();\n\n await stopAnimations(this);\n const { keyframes, options } = getAnimation(this, 'dropdown.hide');\n await animateTo(this.popup.popup, keyframes, options);\n this.panel.hidden = true;\n this.popup.active = false;\n\n this.dispatchEvent(\n new Event('mid-after-hide', { bubbles: true, composed: true })\n );\n }\n }\n\n override render() {\n return html`\n <mid-popup\n id=\"${this.popupId}\"\n class=\"${classMap({\n 'text-body-sm': this.size === 'sm',\n 'text-body-md': this.size === 'md',\n 'text-body-lg': this.size === 'lg',\n })} popup [--arrow-border-color:var(--border-color-neutral-subtle)] [--arrow-size:8px]\"\n distance=${this.distance}\n placement=\"${this.placement}\"\n skidding=${this.skidding}\n strategy=${this.hoist ? 'fixed' : 'absolute'}\n flip\n shift\n auto-size=\"vertical\"\n auto-size-padding=\"10\"\n sync=${ifDefined(this.sync)}\n ?arrow=${this.arrow}\n >\n <slot\n class=\"trigger\"\n slot=\"anchor\"\n name=\"trigger\"\n @click=${this.handleTriggerClick}\n @keydown=${this.handleTriggerKeyDown}\n @keyup=${this.handleTriggerKeyUp}\n @slotchange=${this.handleTriggerSlotChange}\n >\n </slot>\n <div\n class=\"bg-accent min-w-68\"\n aria-hidden=${this.open ? 'false' : 'true'}\n aria-labelledby=\"${this.popupId}\"\n >\n <slot part=\"panel\" class=\"panel\"></slot>\n </div>\n </mid-popup>\n `;\n }\n}\n\nsetDefaultAnimation('dropdown.show', {\n keyframes: [\n { opacity: 0, scale: 0.9 },\n { opacity: 1, scale: 1 },\n ],\n options: { duration: 100, easing: 'ease' },\n});\n\nsetDefaultAnimation('dropdown.hide', {\n keyframes: [\n { opacity: 1, scale: 1 },\n { opacity: 0, scale: 0.9 },\n ],\n options: { duration: 100, easing: 'ease' },\n});\n"],"names":[],"mappings":"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"}
package/dist/components/icon/icon.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"icon.component.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAI1D,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAGpD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,SAAS,CAAC;KACvB;CACF;;AA8BD;;;;;;GAMG;AACH,qBACa,SAAU,SAAQ,cAA0B;IAEvD,OAAO,CAAC,GAAG,CAAgD;IAE3D;;;;OAIG;IAEH,IAAI,CAAC,EAAE,WAAW,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEnC;;;OAGG;IAEH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;OAGG;IAEH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;OAGG;IAEH,OAAO,EAAE,QAAQ,GAAG,SAAS,GAAG,WAAW,CAAe;IAE1D,OAAO,CAAC,WAAW,CAAS;IAE5B;;OAEG;YACW,WAAW;IA8CzB,YAAY;IAMZ,iBAAiB;IAaX,OAAO;IAsEb,SAAS,CAAC,MAAM;CAGjB"}
1
+ {"version":3,"file":"icon.component.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAI/D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAGzD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,SAAS,CAAC;KACvB;CACF;;AA8BD;;;;;;GAMG;AACH,qBACa,SAAU,SAAQ,cAA0B;IAEvD,OAAO,CAAC,GAAG,CAAgD;IAE3D;;;;OAIG;IAEH,IAAI,CAAC,EAAE,WAAW,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEnC;;;OAGG;IAEH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;OAGG;IAEH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;OAGG;IAEH,OAAO,EAAE,QAAQ,GAAG,SAAS,GAAG,WAAW,CAAe;IAE1D,OAAO,CAAC,WAAW,CAAS;IAE5B;;OAEG;YACW,WAAW;IA8CzB,YAAY;IAMZ,iBAAiB;IAaX,OAAO;IAsEb,SAAS,CAAC,MAAM;CAGjB"}
package/dist/components/icon/icon.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"icon.js","sources":["../../../src/components/icon/system.icon-library.ts","../../../src/components/icon/icon.component.ts"],"sourcesContent":["//\n// System icons are a separate library to ensure they're always available, regardless of how the default icon library is\n// configured or if its icons resolve properly.\n//\n// All MinID components must use the system library instead of the default library. For visual consistency, system\n// icons are a subset of Nav Aksel Icons.\n//\nexport const systemIcons = {\n 'circle-broken': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 3.75C7.44365 3.75 3.75 7.44365 3.75 12C3.75 15.5909 6.04464 18.6478 9.24993 19.7808C10.1091 20.0844 11.0344 20.25 12 20.25C12.4142 20.25 12.75 20.5858 12.75 21C12.75 21.4142 12.4142 21.75 12 21.75C10.8618 21.75 9.76756 21.5546 8.75007 21.195C4.9642 19.8569 2.25 16.2464 2.25 12C2.25 6.61522 6.61522 2.25 12 2.25C16.2464 2.25 19.8569 4.9642 21.195 8.75007C21.5546 9.76756 21.75 10.8618 21.75 12C21.75 12.4142 21.4142 12.75 21 12.75C20.5858 12.75 20.25 12.4142 20.25 12C20.25 11.0344 20.0844 10.1091 19.7808 9.24993C18.6478 6.04464 15.5909 3.75 12 3.75Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'magnifying-glass': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M10.5 3.25C6.49594 3.25 3.25 6.49594 3.25 10.5C3.25 14.5041 6.49594 17.75 10.5 17.75C12.2319 17.75 13.8219 17.1427 15.0689 16.1295L20.4801 21.5407C20.773 21.8336 21.2478 21.8336 21.5407 21.5407C21.8336 21.2478 21.8336 20.773 21.5407 20.4801L16.1295 15.0689C17.1427 13.8219 17.75 12.2319 17.75 10.5C17.75 6.49594 14.5041 3.25 10.5 3.25ZM4.75 10.5C4.75 7.32436 7.32436 4.75 10.5 4.75C13.6756 4.75 16.25 7.32436 16.25 10.5C16.25 13.6756 13.6756 16.25 10.5 16.25C7.32436 16.25 4.75 13.6756 4.75 10.5Z\" fill=\"currentColor\"/>\n </svg>\n\n `,\n 'questionmark-circle-fill': `\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n <path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0Zm0 16a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm0-11c2.205 0 4 1.657 4 3.693 0 .986-.416 1.914-1.172 2.612l-.593.54-.294.28c-.477.466-.869.94-.936 1.417l-.01.144v.814h-1.991v-.814c0-1.254.84-2.214 1.675-3.002l.74-.68c.38-.35.59-.816.59-1.31 0-1.024-.901-1.856-2.01-1.856-1.054 0-1.922.755-2.002 1.71l-.006.145H8C8 6.657 9.794 5 12 5Z\" clip-rule=\"evenodd\"/>\n </svg>\n `,\n 'questionmark-circle': `\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n <path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0Zm0 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2Zm0 14a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm0-11c2.205 0 4 1.657 4 3.693 0 .986-.416 1.914-1.172 2.612l-.593.54-.294.28c-.477.466-.869.94-.936 1.417l-.01.144v.814h-1.991v-.814c0-1.254.84-2.214 1.675-3.002l.74-.68c.38-.35.59-.816.59-1.31 0-1.024-.901-1.856-2.01-1.856-1.054 0-1.922.755-2.002 1.71l-.006.145H8C8 6.657 9.794 5 12 5Z\" clip-rule=\"evenodd\"/>\n </svg>\n `,\n 'xmark-octagon-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.74175 2.46967C7.8824 2.32902 8.07317 2.25 8.27208 2.25L15.7279 2.25C15.9268 2.25 16.1176 2.32902 16.2583 2.46967L21.5303 7.74175C21.671 7.8824 21.75 8.07317 21.75 8.27208V15.7279C21.75 15.9268 21.671 16.1176 21.5303 16.2583L16.2583 21.5303C16.1176 21.671 15.9268 21.75 15.7279 21.75H8.27208C8.07316 21.75 7.8824 21.671 7.74175 21.5303L2.46967 16.2583C2.32902 16.1176 2.25 15.9268 2.25 15.7279L2.25 8.27208C2.25 8.07317 2.32902 7.8824 2.46967 7.74175L7.74175 2.46967ZM9.03033 7.96967C8.73744 7.67678 8.26256 7.67678 7.96967 7.96967C7.67678 8.26256 7.67678 8.73744 7.96967 9.03033L10.9393 12L7.96967 14.9697C7.67678 15.2626 7.67678 15.7374 7.96967 16.0303C8.26256 16.3232 8.73744 16.3232 9.03033 16.0303L12 13.0607L14.9697 16.0303C15.2626 16.3232 15.7374 16.3232 16.0303 16.0303C16.3232 15.7374 16.3232 15.2626 16.0303 14.9697L13.0607 12L16.0303 9.03033C16.3232 8.73744 16.3232 8.26256 16.0303 7.96967C15.7374 7.67678 15.2626 7.67678 14.9697 7.96967L12 10.9393L9.03033 7.96967Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'exclamationmark-triangle-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M11.9999 2.25C12.273 2.25 12.5244 2.3984 12.6565 2.63743L22.1827 19.8874C22.311 20.1198 22.307 20.4026 22.1721 20.6312C22.0372 20.8597 21.7916 21 21.5262 21H2.47363C2.20823 21 1.96259 20.8597 1.82771 20.6312C1.69283 20.4026 1.68879 20.1198 1.8171 19.8874L11.3434 2.63743C11.4754 2.3984 11.7269 2.25 11.9999 2.25ZM12.001 8.75C12.4152 8.75 12.751 9.08579 12.751 9.5V13.5C12.751 13.9142 12.4152 14.25 12.001 14.25C11.5868 14.25 11.251 13.9142 11.251 13.5V9.5C11.251 9.08579 11.5868 8.75 12.001 8.75ZM11.001 16.5C11.001 15.9477 11.4487 15.5 12.001 15.5C12.5533 15.5 13.001 15.9477 13.001 16.5C13.001 17.0523 12.5533 17.5 12.001 17.5C11.4487 17.5 11.001 17.0523 11.001 16.5Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'checkmark-circle-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 21.75C17.3848 21.75 21.75 17.3848 21.75 12C21.75 6.61522 17.3848 2.25 12 2.25C6.61522 2.25 2.25 6.61522 2.25 12C2.25 17.3848 6.61522 21.75 12 21.75ZM16.9536 9.27485C17.2434 8.93229 17.2007 8.41962 16.8582 8.12977C16.5156 7.83991 16.0029 7.88263 15.7131 8.22519L10.3251 14.5928L7.69952 11.9672C7.38222 11.6499 6.86778 11.6499 6.55048 11.9672C6.23317 12.2845 6.23317 12.7989 6.55048 13.1162L9.80048 16.3662C9.96114 16.5269 10.1817 16.6129 10.4088 16.6035C10.6358 16.594 10.8485 16.49 10.9953 16.3165L16.9536 9.27485Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'eye-slash': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M21.0303 5.03033C21.3232 4.73744 21.3232 4.26256 21.0303 3.96967C20.7374 3.67678 20.2626 3.67678 19.9697 3.96967L16.659 7.28033C15.3593 6.67264 13.8043 6.25 12 6.25C8.77743 6.25 6.36338 7.59591 4.76986 8.92384C3.97354 9.58744 3.37644 10.2507 2.97685 10.7502C2.77672 11.0004 2.62518 11.2107 2.52208 11.361C2.4705 11.4362 2.43096 11.4966 2.40345 11.5396C2.38969 11.5611 2.37894 11.5782 2.37118 11.5908L2.36178 11.606L2.35877 11.611L2.35768 11.6128C2.35768 11.6128 2.35688 11.6141 3 12L2.35688 11.6141C2.21437 11.8517 2.21437 12.1484 2.35688 12.3859L2.35826 12.3882L2.36033 12.3916L2.36653 12.4017L2.38715 12.4348C2.40456 12.4624 2.42932 12.5009 2.46141 12.5492C2.52559 12.6457 2.61927 12.7814 2.74252 12.9466C2.98876 13.2768 3.35458 13.7273 3.84068 14.2208C4.64096 15.0333 5.77932 15.9744 7.25858 16.6808L3.96967 19.9697C3.67678 20.2626 3.67678 20.7374 3.96967 21.0303C4.26256 21.3232 4.73744 21.3232 5.03033 21.0303L10.5954 15.4653C10.6007 15.4601 10.6061 15.4549 10.6113 15.4495L10.6165 15.4441L15.4441 10.6165C15.4514 10.6096 15.4584 10.6025 15.4653 10.5954L21.0303 5.03033ZM13.914 10.0254L10.0254 13.914C9.91032 13.7953 9.80586 13.6661 9.71346 13.5278C9.47911 13.1771 9.32859 12.7772 9.27353 12.3589C9.21847 11.9407 9.26035 11.5155 9.39594 11.116C9.53153 10.7166 9.75719 10.3537 10.0555 10.0555C10.3537 9.75719 10.7166 9.53153 11.116 9.39594C11.5155 9.26035 11.9407 9.21847 12.3589 9.27353C12.7772 9.32859 13.1771 9.47911 13.5278 9.71346C13.6661 9.80586 13.7953 9.91033 13.914 10.0254ZM14.3612 8.46626C14.5814 8.61342 14.7867 8.78038 14.9747 8.96462L15.5189 8.42045C14.5061 8.01586 13.3343 7.75 12 7.75C9.22257 7.75 7.13662 8.9041 5.73014 10.0762C5.02646 10.6626 4.49856 11.2493 4.14815 11.6873C4.05539 11.8032 3.97534 11.9084 3.90802 12L3.94498 12.0499C4.15707 12.3343 4.47875 12.7311 4.90932 13.1682C5.71064 13.9817 6.8738 14.9197 8.39477 15.5446L8.96462 14.9747C8.78038 14.7867 8.61342 14.5814 8.46625 14.3612C8.10408 13.8191 7.87145 13.2011 7.78636 12.5547C7.70127 11.9084 7.766 11.2512 7.97555 10.6339C8.18509 10.0166 8.53384 9.45576 8.9948 8.9948C9.45576 8.53384 10.0166 8.18509 10.6339 7.97555C11.2512 7.766 11.9084 7.70127 12.5547 7.78636C13.2011 7.87145 13.8191 8.10408 14.3612 8.46626ZM19.5988 9.24339C19.2909 8.96625 18.8167 8.99114 18.5396 9.29898C18.2624 9.60682 18.2873 10.081 18.5952 10.3582C18.7178 10.4686 18.8341 10.5782 18.9442 10.6859C19.4237 11.1555 19.7822 11.589 20.0189 11.9022C20.0448 11.9364 20.0691 11.9691 20.092 12.0002C20.0247 12.0918 19.9446 12.197 19.8518 12.3129C19.5014 12.7509 18.9735 13.3376 18.2699 13.924C16.8634 15.0961 14.7774 16.2502 12 16.2502C11.5858 16.2502 11.25 16.586 11.25 17.0002C11.25 17.4144 11.5858 17.7502 12 17.7502C15.2226 17.7502 17.6366 16.4043 19.2301 15.0764C20.0265 14.4128 20.6236 13.7495 21.0232 13.25C21.2233 12.9998 21.3748 12.7895 21.4779 12.6392C21.5295 12.564 21.569 12.5036 21.5965 12.4606C21.6023 12.4516 21.6076 12.4433 21.6123 12.4359C21.6188 12.4255 21.6243 12.4167 21.6288 12.4094L21.6382 12.3942L21.6412 12.3892L21.6428 12.3867C21.7853 12.1492 21.7856 11.8518 21.6431 11.6143L21 12.0002C21.6431 11.6143 21.6425 11.6134 21.6425 11.6133L21.6416 11.6119L21.6394 11.6082L21.6326 11.5971L21.6099 11.5607C21.5907 11.5303 21.5633 11.4878 21.5277 11.4346C21.4565 11.3283 21.3525 11.1789 21.2155 10.9977C20.9419 10.6357 20.5349 10.1442 19.9937 9.61422C19.8692 9.49235 19.7376 9.36837 19.5988 9.24339ZM21 12.0002L21.6428 12.3867C21.6429 12.3864 21.6431 12.3861 21 12.0002Z\" fill=\"currentColor\"/>\n </svg>\n `,\n eye: `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4.14838 12.3172C4.0542 12.1994 3.97317 12.0926 3.90533 12C3.97317 11.9074 4.0542 11.8006 4.14838 11.6828C4.49853 11.2446 5.02627 10.6584 5.72985 10.0727C7.13607 8.90197 9.22211 7.75 12 7.75C9.65279 7.75 7.75 9.65279 7.75 12C7.75 14.3472 9.65279 16.25 12 16.25C9.22211 16.25 7.13607 15.098 5.72985 13.9273C5.02627 13.3416 4.49853 12.7554 4.14838 12.3172ZM12 16.25C14.3472 16.25 16.25 14.3472 16.25 12C16.25 9.65279 14.3472 7.75 12 7.75C14.7779 7.75 16.8639 8.90197 18.2701 10.0727C18.9737 10.6584 19.5015 11.2446 19.8516 11.6828C19.9458 11.8006 20.0268 11.9074 20.0947 12C20.0268 12.0926 19.9458 12.1994 19.8516 12.3172C19.5015 12.7554 18.9737 13.3416 18.2701 13.9273C16.8639 15.098 14.7779 16.25 12 16.25ZM12 6.25C8.77789 6.25 6.36393 7.59303 4.77014 8.91985C3.97373 9.58286 3.37647 10.246 2.97662 10.7463C2.77639 10.9968 2.6246 11.2079 2.52109 11.3596C2.46936 11.4354 2.42935 11.4969 2.4011 11.5416C2.38707 11.5638 2.37537 11.5828 2.36621 11.598C2.36186 11.6052 2.35682 11.6137 2.35187 11.6223C2.34981 11.6259 2.34523 11.6339 2.33994 11.6438C2.33787 11.6476 2.33154 11.6594 2.32419 11.6747C2.32003 11.6835 2.30949 11.7072 2.30329 11.7223C2.29144 11.7541 2.2578 11.8921 2.25 12C2.2578 12.1079 2.29144 12.2459 2.30329 12.2777C2.30949 12.2928 2.32003 12.3165 2.32419 12.3253C2.33154 12.3406 2.33787 12.3524 2.33994 12.3562C2.34523 12.3661 2.34981 12.3741 2.35187 12.3777C2.35682 12.3863 2.36186 12.3948 2.36621 12.402C2.37537 12.4172 2.38707 12.4362 2.4011 12.4584C2.42935 12.5031 2.46936 12.5646 2.52109 12.6404C2.6246 12.7921 2.77639 13.0032 2.97662 13.2537C3.37647 13.754 3.97373 14.4171 4.77015 15.0802C6.36393 16.407 8.77789 17.75 12 17.75C15.2221 17.75 17.6361 16.407 19.2299 15.0802C20.0263 14.4171 20.6235 13.754 21.0234 13.2537C21.2236 13.0032 21.3754 12.7921 21.4789 12.6404C21.5306 12.5646 21.5706 12.5031 21.5989 12.4584C21.6129 12.4362 21.6246 12.4172 21.6338 12.402L21.6391 12.3931L21.6481 12.3777C21.6502 12.3741 21.6548 12.3661 21.6601 12.3562C21.6621 12.3524 21.6685 12.3406 21.6758 12.3253C21.68 12.3165 21.6905 12.2928 21.6967 12.2777C21.7086 12.2459 21.7422 12.1079 21.75 12C21.7422 11.8921 21.7086 11.7541 21.6967 11.7223C21.6905 11.7072 21.68 11.6835 21.6758 11.6747C21.6685 11.6594 21.6621 11.6476 21.6601 11.6438C21.6548 11.6339 21.6502 11.6259 21.6481 11.6223C21.6457 11.6181 21.6433 11.614 21.6409 11.61C21.6384 11.6058 21.636 11.6017 21.6338 11.598C21.6246 11.5828 21.6129 11.5638 21.5989 11.5416C21.5706 11.4969 21.5306 11.4354 21.4789 11.3596C21.3754 11.2079 21.2236 10.9968 21.0234 10.7463C20.6235 10.246 20.0263 9.58286 19.2299 8.91985C17.6361 7.59303 15.2221 6.25 12 6.25ZM9.25 12C9.25 10.4812 10.4812 9.25 12 9.25C13.5188 9.25 14.75 10.4812 14.75 12C14.75 13.5188 13.5188 14.75 12 14.75C10.4812 14.75 9.25 13.5188 9.25 12Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'information-square-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M3.25 4C3.25 3.58579 3.58579 3.25 4 3.25H20C20.4142 3.25 20.75 3.58579 20.75 4V20C20.75 20.4142 20.4142 20.75 20 20.75H4C3.58579 20.75 3.25 20.4142 3.25 20V4ZM11 7.75C11 7.19772 11.4477 6.75 12 6.75C12.5523 6.75 13 7.19772 13 7.75C13 8.30228 12.5523 8.75 12 8.75C11.4477 8.75 11 8.30228 11 7.75ZM9.75 10.75C9.75 10.3358 10.0858 10 10.5 10H12C12.4142 10 12.75 10.3358 12.75 10.75V15.5H13.5C13.9142 15.5 14.25 15.8358 14.25 16.25C14.25 16.6642 13.9142 17 13.5 17H12H10.5C10.0858 17 9.75 16.6642 9.75 16.25C9.75 15.8358 10.0858 15.5 10.5 15.5H11.25V11.5H10.5C10.0858 11.5 9.75 11.1642 9.75 10.75Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'padlock-locked-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 2.25C9.37665 2.25 7.25 4.37665 7.25 7V9.25H7C6.0335 9.25 5.25 10.0335 5.25 11V20C5.25 20.4142 5.58579 20.75 6 20.75H18C18.4142 20.75 18.75 20.4142 18.75 20V11C18.75 10.0335 17.9665 9.25 17 9.25H16.75V7C16.75 4.37665 14.6234 2.25 12 2.25ZM15.25 9.25V7C15.25 5.20507 13.7949 3.75 12 3.75C10.2051 3.75 8.75 5.20507 8.75 7V9.25H15.25ZM12 13C11.1716 13 10.5 13.6716 10.5 14.5C10.5 15.0552 10.8016 15.54 11.25 15.7993V17C11.25 17.4142 11.5858 17.75 12 17.75C12.4142 17.75 12.75 17.4142 12.75 17V15.7993C13.1984 15.54 13.5 15.0552 13.5 14.5C13.5 13.6716 12.8284 13 12 13Z\" fill=\"currentColor\"/>\n </svg>\n `,\n xmark: `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6.53033 5.46967C6.23744 5.17678 5.76256 5.17678 5.46967 5.46967C5.17678 5.76256 5.17678 6.23744 5.46967 6.53033L10.9393 12L5.46967 17.4697C5.17678 17.7626 5.17678 18.2374 5.46967 18.5303C5.76256 18.8232 6.23744 18.8232 6.53033 18.5303L12 13.0607L17.4697 18.5303C17.7626 18.8232 18.2374 18.8232 18.5303 18.5303C18.8232 18.2374 18.8232 17.7626 18.5303 17.4697L13.0607 12L18.5303 6.53033C18.8232 6.23744 18.8232 5.76256 18.5303 5.46967C18.2374 5.17678 17.7626 5.17678 17.4697 5.46967L12 10.9393L6.53033 5.46967Z\" fill=\"currentColor\"/>\n </svg>\n `,\n};\n","import { customElement, property, state } from 'lit/decorators.js';\nimport { css, HTMLTemplateResult, LitElement } from 'lit';\nimport { styled } from '../../mixins/tailwind.mixin';\nimport { watch } from '../../internal/watch.ts';\nimport { isTemplateResult } from 'lit/directive-helpers.js';\nimport { MidIconName } from '../../types/icon-name';\nimport { systemIcons } from './system.icon-library.ts';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'mid-icon': MinidIcon;\n }\n}\n\nconst styles = [\n css`\n :host {\n display: inline-flex;\n width: 1em;\n height: 1em;\n box-sizing: content-box !important;\n }\n\n svg {\n width: 100%;\n height: 100%;\n display: block;\n }\n `,\n];\n\nconst CACHEABLE_ERROR = Symbol();\nconst RETRYABLE_ERROR = Symbol();\ntype SVGResult =\n | HTMLTemplateResult\n | SVGSVGElement\n | typeof RETRYABLE_ERROR\n | typeof CACHEABLE_ERROR;\n\nlet parser: DOMParser;\nconst iconCache = new Map<string, Promise<SVGResult>>();\n\n/**\n *\n * Size and color can be adjusted with `font-size` and `color` css properties\n *\n * @event mid-load - Emitted when the icon has loaded\n * @event mid-error - Emitted when the icon fails to load\n */\n@customElement('mid-icon')\nexport class MinidIcon extends styled(LitElement, styles) {\n @state()\n private svg: SVGElement | HTMLTemplateResult | null = null;\n\n /**\n * The name of the icon to draw. Available names depend on the icon library being used.\n * Preview default icons [here](https://aksel.nav.no/ikoner)\n * @type string\n */\n @property({ reflect: true })\n name?: MidIconName | (string & {}); // weird typing makes sure we have both intellisense and ability to input any string\n\n /**\n * An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\n * can result in XSS attacks.\n */\n @property()\n src?: string;\n\n /**\n * An alternate description to use for assistive devices. If omitted, the icon will be considered presentational and\n * ignored by assistive devices.\n */\n @property()\n alt?: string;\n\n /**\n * The name of a registered custom icon library.\n * @default nav-aksel\n */\n @property()\n library: 'system' | 'country' | 'nav-aksel' = 'nav-aksel';\n\n private hasRendered = false;\n\n /**\n * Given a URL, this function returns the resulting SVG element or an appropriate error symbol.\n */\n private async resolveIcon(url: string): Promise<SVGResult> {\n let svgString = '';\n\n if (url.startsWith('data:image/svg+xml')) {\n svgString = decodeURIComponent(url);\n } else {\n let fileData: Response;\n try {\n fileData = await fetch(url, { mode: 'cors' });\n\n if (!fileData.ok) {\n return fileData.status === 410 ? CACHEABLE_ERROR : RETRYABLE_ERROR;\n }\n } catch {\n return RETRYABLE_ERROR;\n }\n svgString = await fileData.text();\n }\n\n try {\n const div = document.createElement('div');\n div.innerHTML = svgString;\n\n const svg = div.firstElementChild;\n if (svg?.tagName?.toLowerCase() !== 'svg') {\n return CACHEABLE_ERROR;\n }\n\n if (!parser) {\n parser = new DOMParser();\n }\n const doc = parser.parseFromString(svg.outerHTML, 'text/html');\n\n const svgEl = doc.body.querySelector('svg');\n if (!svgEl) {\n return CACHEABLE_ERROR;\n }\n\n svgEl.part.add('svg');\n\n return document.adoptNode(svgEl);\n } catch {\n return CACHEABLE_ERROR;\n }\n }\n\n firstUpdated() {\n this.hasRendered = true;\n this.setIcon();\n }\n\n @watch('alt')\n handleLabelChange() {\n if (typeof this.alt === 'string' && this.alt.length > 0) {\n this.setAttribute('role', 'img');\n this.setAttribute('aria-label', this.alt);\n this.removeAttribute('aria-hidden');\n } else {\n this.removeAttribute('role');\n this.removeAttribute('aria-label');\n this.setAttribute('aria-hidden', 'true');\n }\n }\n\n @watch(['name', 'src', 'library'])\n async setIcon() {\n if (!this.library && !this.name && !this.src) {\n this.svg = null;\n return;\n }\n\n let iconResolver = iconCache.get(`${this.library}-${this.name}`);\n const iconKey = `${this.library}-${this.name}`;\n if (!iconResolver) {\n let svgUrl: string;\n if (this.src) {\n iconResolver = this.resolveIcon(this.src);\n iconCache.set(iconKey, iconResolver);\n } else if (this.library === 'nav-aksel') {\n svgUrl = `/icons/${this.name}.svg`;\n iconResolver = this.resolveIcon(svgUrl);\n iconCache.set(iconKey, iconResolver);\n } else if (this.library === 'country') {\n svgUrl = `/flags/${this.name}.svg`;\n iconResolver = this.resolveIcon(svgUrl);\n iconCache.set(iconKey, iconResolver);\n } else if (this.library === 'system') {\n svgUrl = `data:image/svg+xml,${encodeURIComponent(systemIcons[this.name as keyof typeof systemIcons])}`;\n iconResolver = this.resolveIcon(svgUrl);\n iconCache.set(iconKey, iconResolver);\n }\n }\n\n // If we haven't rendered yet, exit early. This avoids unnecessary work due to watching multiple props.\n if (!this.hasRendered) {\n return;\n }\n\n const svg = await iconResolver;\n\n if (!svg) {\n return;\n }\n\n if (svg === RETRYABLE_ERROR) {\n iconCache.delete(iconKey);\n }\n\n if (iconKey !== `${this.library}-${this.name}`) {\n // If the url has changed while fetching the icon, ignore this request\n return;\n }\n\n if (isTemplateResult(svg)) {\n this.svg = svg;\n\n return;\n }\n\n switch (svg) {\n case RETRYABLE_ERROR:\n case CACHEABLE_ERROR:\n this.svg = null;\n this.dispatchEvent(\n new Event('mid-error', { bubbles: true, composed: true })\n );\n break;\n default:\n this.svg = svg.cloneNode(true) as SVGElement;\n this.dispatchEvent(\n new Event('mid-load', { bubbles: true, composed: true })\n );\n }\n }\n\n protected render() {\n return this.svg;\n }\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"icon.js","sources":["../../../src/components/icon/system.icon-library.ts","../../../src/components/icon/icon.component.ts"],"sourcesContent":["//\n// System icons are a separate library to ensure they're always available, regardless of how the default icon library is\n// configured or if its icons resolve properly.\n//\n// All MinID components must use the system library instead of the default library. For visual consistency, system\n// icons are a subset of Nav Aksel Icons.\n//\nexport const systemIcons = {\n 'circle-broken': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 3.75C7.44365 3.75 3.75 7.44365 3.75 12C3.75 15.5909 6.04464 18.6478 9.24993 19.7808C10.1091 20.0844 11.0344 20.25 12 20.25C12.4142 20.25 12.75 20.5858 12.75 21C12.75 21.4142 12.4142 21.75 12 21.75C10.8618 21.75 9.76756 21.5546 8.75007 21.195C4.9642 19.8569 2.25 16.2464 2.25 12C2.25 6.61522 6.61522 2.25 12 2.25C16.2464 2.25 19.8569 4.9642 21.195 8.75007C21.5546 9.76756 21.75 10.8618 21.75 12C21.75 12.4142 21.4142 12.75 21 12.75C20.5858 12.75 20.25 12.4142 20.25 12C20.25 11.0344 20.0844 10.1091 19.7808 9.24993C18.6478 6.04464 15.5909 3.75 12 3.75Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'magnifying-glass': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M10.5 3.25C6.49594 3.25 3.25 6.49594 3.25 10.5C3.25 14.5041 6.49594 17.75 10.5 17.75C12.2319 17.75 13.8219 17.1427 15.0689 16.1295L20.4801 21.5407C20.773 21.8336 21.2478 21.8336 21.5407 21.5407C21.8336 21.2478 21.8336 20.773 21.5407 20.4801L16.1295 15.0689C17.1427 13.8219 17.75 12.2319 17.75 10.5C17.75 6.49594 14.5041 3.25 10.5 3.25ZM4.75 10.5C4.75 7.32436 7.32436 4.75 10.5 4.75C13.6756 4.75 16.25 7.32436 16.25 10.5C16.25 13.6756 13.6756 16.25 10.5 16.25C7.32436 16.25 4.75 13.6756 4.75 10.5Z\" fill=\"currentColor\"/>\n </svg>\n\n `,\n 'questionmark-circle-fill': `\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n <path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0Zm0 16a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm0-11c2.205 0 4 1.657 4 3.693 0 .986-.416 1.914-1.172 2.612l-.593.54-.294.28c-.477.466-.869.94-.936 1.417l-.01.144v.814h-1.991v-.814c0-1.254.84-2.214 1.675-3.002l.74-.68c.38-.35.59-.816.59-1.31 0-1.024-.901-1.856-2.01-1.856-1.054 0-1.922.755-2.002 1.71l-.006.145H8C8 6.657 9.794 5 12 5Z\" clip-rule=\"evenodd\"/>\n </svg>\n `,\n 'questionmark-circle': `\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" fill=\"none\" aria-hidden=\"true\" viewBox=\"0 0 24 24\">\n <path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0Zm0 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2Zm0 14a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm0-11c2.205 0 4 1.657 4 3.693 0 .986-.416 1.914-1.172 2.612l-.593.54-.294.28c-.477.466-.869.94-.936 1.417l-.01.144v.814h-1.991v-.814c0-1.254.84-2.214 1.675-3.002l.74-.68c.38-.35.59-.816.59-1.31 0-1.024-.901-1.856-2.01-1.856-1.054 0-1.922.755-2.002 1.71l-.006.145H8C8 6.657 9.794 5 12 5Z\" clip-rule=\"evenodd\"/>\n </svg>\n `,\n 'xmark-octagon-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.74175 2.46967C7.8824 2.32902 8.07317 2.25 8.27208 2.25L15.7279 2.25C15.9268 2.25 16.1176 2.32902 16.2583 2.46967L21.5303 7.74175C21.671 7.8824 21.75 8.07317 21.75 8.27208V15.7279C21.75 15.9268 21.671 16.1176 21.5303 16.2583L16.2583 21.5303C16.1176 21.671 15.9268 21.75 15.7279 21.75H8.27208C8.07316 21.75 7.8824 21.671 7.74175 21.5303L2.46967 16.2583C2.32902 16.1176 2.25 15.9268 2.25 15.7279L2.25 8.27208C2.25 8.07317 2.32902 7.8824 2.46967 7.74175L7.74175 2.46967ZM9.03033 7.96967C8.73744 7.67678 8.26256 7.67678 7.96967 7.96967C7.67678 8.26256 7.67678 8.73744 7.96967 9.03033L10.9393 12L7.96967 14.9697C7.67678 15.2626 7.67678 15.7374 7.96967 16.0303C8.26256 16.3232 8.73744 16.3232 9.03033 16.0303L12 13.0607L14.9697 16.0303C15.2626 16.3232 15.7374 16.3232 16.0303 16.0303C16.3232 15.7374 16.3232 15.2626 16.0303 14.9697L13.0607 12L16.0303 9.03033C16.3232 8.73744 16.3232 8.26256 16.0303 7.96967C15.7374 7.67678 15.2626 7.67678 14.9697 7.96967L12 10.9393L9.03033 7.96967Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'exclamationmark-triangle-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M11.9999 2.25C12.273 2.25 12.5244 2.3984 12.6565 2.63743L22.1827 19.8874C22.311 20.1198 22.307 20.4026 22.1721 20.6312C22.0372 20.8597 21.7916 21 21.5262 21H2.47363C2.20823 21 1.96259 20.8597 1.82771 20.6312C1.69283 20.4026 1.68879 20.1198 1.8171 19.8874L11.3434 2.63743C11.4754 2.3984 11.7269 2.25 11.9999 2.25ZM12.001 8.75C12.4152 8.75 12.751 9.08579 12.751 9.5V13.5C12.751 13.9142 12.4152 14.25 12.001 14.25C11.5868 14.25 11.251 13.9142 11.251 13.5V9.5C11.251 9.08579 11.5868 8.75 12.001 8.75ZM11.001 16.5C11.001 15.9477 11.4487 15.5 12.001 15.5C12.5533 15.5 13.001 15.9477 13.001 16.5C13.001 17.0523 12.5533 17.5 12.001 17.5C11.4487 17.5 11.001 17.0523 11.001 16.5Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'checkmark-circle-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 21.75C17.3848 21.75 21.75 17.3848 21.75 12C21.75 6.61522 17.3848 2.25 12 2.25C6.61522 2.25 2.25 6.61522 2.25 12C2.25 17.3848 6.61522 21.75 12 21.75ZM16.9536 9.27485C17.2434 8.93229 17.2007 8.41962 16.8582 8.12977C16.5156 7.83991 16.0029 7.88263 15.7131 8.22519L10.3251 14.5928L7.69952 11.9672C7.38222 11.6499 6.86778 11.6499 6.55048 11.9672C6.23317 12.2845 6.23317 12.7989 6.55048 13.1162L9.80048 16.3662C9.96114 16.5269 10.1817 16.6129 10.4088 16.6035C10.6358 16.594 10.8485 16.49 10.9953 16.3165L16.9536 9.27485Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'eye-slash': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M21.0303 5.03033C21.3232 4.73744 21.3232 4.26256 21.0303 3.96967C20.7374 3.67678 20.2626 3.67678 19.9697 3.96967L16.659 7.28033C15.3593 6.67264 13.8043 6.25 12 6.25C8.77743 6.25 6.36338 7.59591 4.76986 8.92384C3.97354 9.58744 3.37644 10.2507 2.97685 10.7502C2.77672 11.0004 2.62518 11.2107 2.52208 11.361C2.4705 11.4362 2.43096 11.4966 2.40345 11.5396C2.38969 11.5611 2.37894 11.5782 2.37118 11.5908L2.36178 11.606L2.35877 11.611L2.35768 11.6128C2.35768 11.6128 2.35688 11.6141 3 12L2.35688 11.6141C2.21437 11.8517 2.21437 12.1484 2.35688 12.3859L2.35826 12.3882L2.36033 12.3916L2.36653 12.4017L2.38715 12.4348C2.40456 12.4624 2.42932 12.5009 2.46141 12.5492C2.52559 12.6457 2.61927 12.7814 2.74252 12.9466C2.98876 13.2768 3.35458 13.7273 3.84068 14.2208C4.64096 15.0333 5.77932 15.9744 7.25858 16.6808L3.96967 19.9697C3.67678 20.2626 3.67678 20.7374 3.96967 21.0303C4.26256 21.3232 4.73744 21.3232 5.03033 21.0303L10.5954 15.4653C10.6007 15.4601 10.6061 15.4549 10.6113 15.4495L10.6165 15.4441L15.4441 10.6165C15.4514 10.6096 15.4584 10.6025 15.4653 10.5954L21.0303 5.03033ZM13.914 10.0254L10.0254 13.914C9.91032 13.7953 9.80586 13.6661 9.71346 13.5278C9.47911 13.1771 9.32859 12.7772 9.27353 12.3589C9.21847 11.9407 9.26035 11.5155 9.39594 11.116C9.53153 10.7166 9.75719 10.3537 10.0555 10.0555C10.3537 9.75719 10.7166 9.53153 11.116 9.39594C11.5155 9.26035 11.9407 9.21847 12.3589 9.27353C12.7772 9.32859 13.1771 9.47911 13.5278 9.71346C13.6661 9.80586 13.7953 9.91033 13.914 10.0254ZM14.3612 8.46626C14.5814 8.61342 14.7867 8.78038 14.9747 8.96462L15.5189 8.42045C14.5061 8.01586 13.3343 7.75 12 7.75C9.22257 7.75 7.13662 8.9041 5.73014 10.0762C5.02646 10.6626 4.49856 11.2493 4.14815 11.6873C4.05539 11.8032 3.97534 11.9084 3.90802 12L3.94498 12.0499C4.15707 12.3343 4.47875 12.7311 4.90932 13.1682C5.71064 13.9817 6.8738 14.9197 8.39477 15.5446L8.96462 14.9747C8.78038 14.7867 8.61342 14.5814 8.46625 14.3612C8.10408 13.8191 7.87145 13.2011 7.78636 12.5547C7.70127 11.9084 7.766 11.2512 7.97555 10.6339C8.18509 10.0166 8.53384 9.45576 8.9948 8.9948C9.45576 8.53384 10.0166 8.18509 10.6339 7.97555C11.2512 7.766 11.9084 7.70127 12.5547 7.78636C13.2011 7.87145 13.8191 8.10408 14.3612 8.46626ZM19.5988 9.24339C19.2909 8.96625 18.8167 8.99114 18.5396 9.29898C18.2624 9.60682 18.2873 10.081 18.5952 10.3582C18.7178 10.4686 18.8341 10.5782 18.9442 10.6859C19.4237 11.1555 19.7822 11.589 20.0189 11.9022C20.0448 11.9364 20.0691 11.9691 20.092 12.0002C20.0247 12.0918 19.9446 12.197 19.8518 12.3129C19.5014 12.7509 18.9735 13.3376 18.2699 13.924C16.8634 15.0961 14.7774 16.2502 12 16.2502C11.5858 16.2502 11.25 16.586 11.25 17.0002C11.25 17.4144 11.5858 17.7502 12 17.7502C15.2226 17.7502 17.6366 16.4043 19.2301 15.0764C20.0265 14.4128 20.6236 13.7495 21.0232 13.25C21.2233 12.9998 21.3748 12.7895 21.4779 12.6392C21.5295 12.564 21.569 12.5036 21.5965 12.4606C21.6023 12.4516 21.6076 12.4433 21.6123 12.4359C21.6188 12.4255 21.6243 12.4167 21.6288 12.4094L21.6382 12.3942L21.6412 12.3892L21.6428 12.3867C21.7853 12.1492 21.7856 11.8518 21.6431 11.6143L21 12.0002C21.6431 11.6143 21.6425 11.6134 21.6425 11.6133L21.6416 11.6119L21.6394 11.6082L21.6326 11.5971L21.6099 11.5607C21.5907 11.5303 21.5633 11.4878 21.5277 11.4346C21.4565 11.3283 21.3525 11.1789 21.2155 10.9977C20.9419 10.6357 20.5349 10.1442 19.9937 9.61422C19.8692 9.49235 19.7376 9.36837 19.5988 9.24339ZM21 12.0002L21.6428 12.3867C21.6429 12.3864 21.6431 12.3861 21 12.0002Z\" fill=\"currentColor\"/>\n </svg>\n `,\n eye: `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4.14838 12.3172C4.0542 12.1994 3.97317 12.0926 3.90533 12C3.97317 11.9074 4.0542 11.8006 4.14838 11.6828C4.49853 11.2446 5.02627 10.6584 5.72985 10.0727C7.13607 8.90197 9.22211 7.75 12 7.75C9.65279 7.75 7.75 9.65279 7.75 12C7.75 14.3472 9.65279 16.25 12 16.25C9.22211 16.25 7.13607 15.098 5.72985 13.9273C5.02627 13.3416 4.49853 12.7554 4.14838 12.3172ZM12 16.25C14.3472 16.25 16.25 14.3472 16.25 12C16.25 9.65279 14.3472 7.75 12 7.75C14.7779 7.75 16.8639 8.90197 18.2701 10.0727C18.9737 10.6584 19.5015 11.2446 19.8516 11.6828C19.9458 11.8006 20.0268 11.9074 20.0947 12C20.0268 12.0926 19.9458 12.1994 19.8516 12.3172C19.5015 12.7554 18.9737 13.3416 18.2701 13.9273C16.8639 15.098 14.7779 16.25 12 16.25ZM12 6.25C8.77789 6.25 6.36393 7.59303 4.77014 8.91985C3.97373 9.58286 3.37647 10.246 2.97662 10.7463C2.77639 10.9968 2.6246 11.2079 2.52109 11.3596C2.46936 11.4354 2.42935 11.4969 2.4011 11.5416C2.38707 11.5638 2.37537 11.5828 2.36621 11.598C2.36186 11.6052 2.35682 11.6137 2.35187 11.6223C2.34981 11.6259 2.34523 11.6339 2.33994 11.6438C2.33787 11.6476 2.33154 11.6594 2.32419 11.6747C2.32003 11.6835 2.30949 11.7072 2.30329 11.7223C2.29144 11.7541 2.2578 11.8921 2.25 12C2.2578 12.1079 2.29144 12.2459 2.30329 12.2777C2.30949 12.2928 2.32003 12.3165 2.32419 12.3253C2.33154 12.3406 2.33787 12.3524 2.33994 12.3562C2.34523 12.3661 2.34981 12.3741 2.35187 12.3777C2.35682 12.3863 2.36186 12.3948 2.36621 12.402C2.37537 12.4172 2.38707 12.4362 2.4011 12.4584C2.42935 12.5031 2.46936 12.5646 2.52109 12.6404C2.6246 12.7921 2.77639 13.0032 2.97662 13.2537C3.37647 13.754 3.97373 14.4171 4.77015 15.0802C6.36393 16.407 8.77789 17.75 12 17.75C15.2221 17.75 17.6361 16.407 19.2299 15.0802C20.0263 14.4171 20.6235 13.754 21.0234 13.2537C21.2236 13.0032 21.3754 12.7921 21.4789 12.6404C21.5306 12.5646 21.5706 12.5031 21.5989 12.4584C21.6129 12.4362 21.6246 12.4172 21.6338 12.402L21.6391 12.3931L21.6481 12.3777C21.6502 12.3741 21.6548 12.3661 21.6601 12.3562C21.6621 12.3524 21.6685 12.3406 21.6758 12.3253C21.68 12.3165 21.6905 12.2928 21.6967 12.2777C21.7086 12.2459 21.7422 12.1079 21.75 12C21.7422 11.8921 21.7086 11.7541 21.6967 11.7223C21.6905 11.7072 21.68 11.6835 21.6758 11.6747C21.6685 11.6594 21.6621 11.6476 21.6601 11.6438C21.6548 11.6339 21.6502 11.6259 21.6481 11.6223C21.6457 11.6181 21.6433 11.614 21.6409 11.61C21.6384 11.6058 21.636 11.6017 21.6338 11.598C21.6246 11.5828 21.6129 11.5638 21.5989 11.5416C21.5706 11.4969 21.5306 11.4354 21.4789 11.3596C21.3754 11.2079 21.2236 10.9968 21.0234 10.7463C20.6235 10.246 20.0263 9.58286 19.2299 8.91985C17.6361 7.59303 15.2221 6.25 12 6.25ZM9.25 12C9.25 10.4812 10.4812 9.25 12 9.25C13.5188 9.25 14.75 10.4812 14.75 12C14.75 13.5188 13.5188 14.75 12 14.75C10.4812 14.75 9.25 13.5188 9.25 12Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'information-square-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M3.25 4C3.25 3.58579 3.58579 3.25 4 3.25H20C20.4142 3.25 20.75 3.58579 20.75 4V20C20.75 20.4142 20.4142 20.75 20 20.75H4C3.58579 20.75 3.25 20.4142 3.25 20V4ZM11 7.75C11 7.19772 11.4477 6.75 12 6.75C12.5523 6.75 13 7.19772 13 7.75C13 8.30228 12.5523 8.75 12 8.75C11.4477 8.75 11 8.30228 11 7.75ZM9.75 10.75C9.75 10.3358 10.0858 10 10.5 10H12C12.4142 10 12.75 10.3358 12.75 10.75V15.5H13.5C13.9142 15.5 14.25 15.8358 14.25 16.25C14.25 16.6642 13.9142 17 13.5 17H12H10.5C10.0858 17 9.75 16.6642 9.75 16.25C9.75 15.8358 10.0858 15.5 10.5 15.5H11.25V11.5H10.5C10.0858 11.5 9.75 11.1642 9.75 10.75Z\" fill=\"currentColor\"/>\n </svg>\n `,\n 'padlock-locked-fill': `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 2.25C9.37665 2.25 7.25 4.37665 7.25 7V9.25H7C6.0335 9.25 5.25 10.0335 5.25 11V20C5.25 20.4142 5.58579 20.75 6 20.75H18C18.4142 20.75 18.75 20.4142 18.75 20V11C18.75 10.0335 17.9665 9.25 17 9.25H16.75V7C16.75 4.37665 14.6234 2.25 12 2.25ZM15.25 9.25V7C15.25 5.20507 13.7949 3.75 12 3.75C10.2051 3.75 8.75 5.20507 8.75 7V9.25H15.25ZM12 13C11.1716 13 10.5 13.6716 10.5 14.5C10.5 15.0552 10.8016 15.54 11.25 15.7993V17C11.25 17.4142 11.5858 17.75 12 17.75C12.4142 17.75 12.75 17.4142 12.75 17V15.7993C13.1984 15.54 13.5 15.0552 13.5 14.5C13.5 13.6716 12.8284 13 12 13Z\" fill=\"currentColor\"/>\n </svg>\n `,\n xmark: `\n <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6.53033 5.46967C6.23744 5.17678 5.76256 5.17678 5.46967 5.46967C5.17678 5.76256 5.17678 6.23744 5.46967 6.53033L10.9393 12L5.46967 17.4697C5.17678 17.7626 5.17678 18.2374 5.46967 18.5303C5.76256 18.8232 6.23744 18.8232 6.53033 18.5303L12 13.0607L17.4697 18.5303C17.7626 18.8232 18.2374 18.8232 18.5303 18.5303C18.8232 18.2374 18.8232 17.7626 18.5303 17.4697L13.0607 12L18.5303 6.53033C18.8232 6.23744 18.8232 5.76256 18.5303 5.46967C18.2374 5.17678 17.7626 5.17678 17.4697 5.46967L12 10.9393L6.53033 5.46967Z\" fill=\"currentColor\"/>\n </svg>\n `,\n};\n","import { customElement, property, state } from 'lit/decorators.js';\nimport { css, type HTMLTemplateResult, LitElement } from 'lit';\nimport { styled } from '../../mixins/tailwind.mixin';\nimport { watch } from '../../internal/watch.ts';\nimport { isTemplateResult } from 'lit/directive-helpers.js';\nimport type { MidIconName } from '../../types/icon-name';\nimport { systemIcons } from './system.icon-library.ts';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'mid-icon': MinidIcon;\n }\n}\n\nconst styles = [\n css`\n :host {\n display: inline-flex;\n width: 1em;\n height: 1em;\n box-sizing: content-box !important;\n }\n\n svg {\n width: 100%;\n height: 100%;\n display: block;\n }\n `,\n];\n\nconst CACHEABLE_ERROR = Symbol();\nconst RETRYABLE_ERROR = Symbol();\ntype SVGResult =\n | HTMLTemplateResult\n | SVGSVGElement\n | typeof RETRYABLE_ERROR\n | typeof CACHEABLE_ERROR;\n\nlet parser: DOMParser;\nconst iconCache = new Map<string, Promise<SVGResult>>();\n\n/**\n *\n * Size and color can be adjusted with `font-size` and `color` css properties\n *\n * @event mid-load - Emitted when the icon has loaded\n * @event mid-error - Emitted when the icon fails to load\n */\n@customElement('mid-icon')\nexport class MinidIcon extends styled(LitElement, styles) {\n @state()\n private svg: SVGElement | HTMLTemplateResult | null = null;\n\n /**\n * The name of the icon to draw. Available names depend on the icon library being used.\n * Preview default icons [here](https://aksel.nav.no/ikoner)\n * @type string\n */\n @property({ reflect: true })\n name?: MidIconName | (string & {}); // weird typing makes sure we have both intellisense and ability to input any string\n\n /**\n * An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\n * can result in XSS attacks.\n */\n @property()\n src?: string;\n\n /**\n * An alternate description to use for assistive devices. If omitted, the icon will be considered presentational and\n * ignored by assistive devices.\n */\n @property()\n alt?: string;\n\n /**\n * The name of a registered custom icon library.\n * @default nav-aksel\n */\n @property()\n library: 'system' | 'country' | 'nav-aksel' = 'nav-aksel';\n\n private hasRendered = false;\n\n /**\n * Given a URL, this function returns the resulting SVG element or an appropriate error symbol.\n */\n private async resolveIcon(url: string): Promise<SVGResult> {\n let svgString = '';\n\n if (url.startsWith('data:image/svg+xml')) {\n svgString = decodeURIComponent(url);\n } else {\n let fileData: Response;\n try {\n fileData = await fetch(url, { mode: 'cors' });\n\n if (!fileData.ok) {\n return fileData.status === 410 ? CACHEABLE_ERROR : RETRYABLE_ERROR;\n }\n } catch {\n return RETRYABLE_ERROR;\n }\n svgString = await fileData.text();\n }\n\n try {\n const div = document.createElement('div');\n div.innerHTML = svgString;\n\n const svg = div.firstElementChild;\n if (svg?.tagName?.toLowerCase() !== 'svg') {\n return CACHEABLE_ERROR;\n }\n\n if (!parser) {\n parser = new DOMParser();\n }\n const doc = parser.parseFromString(svg.outerHTML, 'text/html');\n\n const svgEl = doc.body.querySelector('svg');\n if (!svgEl) {\n return CACHEABLE_ERROR;\n }\n\n svgEl.part.add('svg');\n\n return document.adoptNode(svgEl);\n } catch {\n return CACHEABLE_ERROR;\n }\n }\n\n firstUpdated() {\n this.hasRendered = true;\n this.setIcon();\n }\n\n @watch('alt')\n handleLabelChange() {\n if (typeof this.alt === 'string' && this.alt.length > 0) {\n this.setAttribute('role', 'img');\n this.setAttribute('aria-label', this.alt);\n this.removeAttribute('aria-hidden');\n } else {\n this.removeAttribute('role');\n this.removeAttribute('aria-label');\n this.setAttribute('aria-hidden', 'true');\n }\n }\n\n @watch(['name', 'src', 'library'])\n async setIcon() {\n if (!this.library && !this.name && !this.src) {\n this.svg = null;\n return;\n }\n\n let iconResolver = iconCache.get(`${this.library}-${this.name}`);\n const iconKey = `${this.library}-${this.name}`;\n if (!iconResolver) {\n let svgUrl: string;\n if (this.src) {\n iconResolver = this.resolveIcon(this.src);\n iconCache.set(iconKey, iconResolver);\n } else if (this.library === 'nav-aksel') {\n svgUrl = `/icons/${this.name}.svg`;\n iconResolver = this.resolveIcon(svgUrl);\n iconCache.set(iconKey, iconResolver);\n } else if (this.library === 'country') {\n svgUrl = `/flags/${this.name}.svg`;\n iconResolver = this.resolveIcon(svgUrl);\n iconCache.set(iconKey, iconResolver);\n } else if (this.library === 'system') {\n svgUrl = `data:image/svg+xml,${encodeURIComponent(systemIcons[this.name as keyof typeof systemIcons])}`;\n iconResolver = this.resolveIcon(svgUrl);\n iconCache.set(iconKey, iconResolver);\n }\n }\n\n // If we haven't rendered yet, exit early. This avoids unnecessary work due to watching multiple props.\n if (!this.hasRendered) {\n return;\n }\n\n const svg = await iconResolver;\n\n if (!svg) {\n return;\n }\n\n if (svg === RETRYABLE_ERROR) {\n iconCache.delete(iconKey);\n }\n\n if (iconKey !== `${this.library}-${this.name}`) {\n // If the url has changed while fetching the icon, ignore this request\n return;\n }\n\n if (isTemplateResult(svg)) {\n this.svg = svg;\n\n return;\n }\n\n switch (svg) {\n case RETRYABLE_ERROR:\n case CACHEABLE_ERROR:\n this.svg = null;\n this.dispatchEvent(\n new Event('mid-error', { bubbles: true, composed: true })\n );\n break;\n default:\n this.svg = svg.cloneNode(true) as SVGElement;\n this.dispatchEvent(\n new Event('mid-load', { bubbles: true, composed: true })\n );\n }\n }\n\n protected render() {\n return this.svg;\n }\n}\n"],"names":[],"mappings":"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"}
package/dist/components/phone-input.component.d.ts CHANGED
@@ -5,7 +5,7 @@ declare global {
5
5
  'mid-phone-input': MinidPhoneInput;
6
6
  }
7
7
  }
8
- declare const MinidPhoneInput_base: typeof LitElement & import('../types/mixin-constructor').Constructor<import('../mixins/form-controller.mixin').FormAssociatedMixinInterface>;
8
+ declare const MinidPhoneInput_base: import('../types/mixin-constructor').Constructor<import('../types/form-control').FormControlInterface> & typeof LitElement;
9
9
  /**
10
10
  * @event {Event} mid-country-click - Emitted when the country button is clicked
11
11
  * @event {Event} mid-change - Emitted when the value is modified by the user
@@ -52,7 +52,16 @@ export declare class MinidPhoneInput extends MinidPhoneInput_base {
52
52
  * The country selected. A two letter ISO country code like: `"NO"`
53
53
  */
54
54
  country?: CountryCode;
55
+ /**
56
+ * Activates invalid styling
57
+ */
58
+ invalid: boolean;
59
+ /**
60
+ * Makes the input required
61
+ */
62
+ required: boolean;
55
63
  hasFocus: boolean;
64
+ static get formControlValidators(): import('../types/validator.type').Validator[];
56
65
  handleCountryClick(): void;
57
66
  handleCountryKeyDown(event: KeyboardEvent): void;
58
67
  connectedCallback(): void;
@@ -62,12 +71,13 @@ export declare class MinidPhoneInput extends MinidPhoneInput_base {
62
71
  private handleChange;
63
72
  private handleKeydown;
64
73
  private handleInput;
65
- private setValue;
74
+ private handleNewValue;
66
75
  private valueChangeCallback;
67
76
  private handleFocus;
68
77
  private removePhonePrefix;
69
78
  focus(): void;
70
79
  handleCountryChange(): void;
80
+ handleValueChange(): void;
71
81
  render(): import('lit-html').TemplateResult<1>;
72
82
  }
73
83
  export {};
package/dist/components/phone-input.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"phone-input.component.d.ts","sourceRoot":"","sources":["../../src/components/phone-input.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAE,MAAM,KAAK,CAAC;AAI5C,OAAO,EAIL,KAAK,WAAW,EAEjB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,uBAAuB,CAAC;AAW/B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,eAAe,CAAC;KACpC;CACF;;AAUD;;;;;;;;;;;;GAYG;AACH,qBACa,eAAgB,SAAQ,oBAEpC;IACC,OAAO,CAAC,SAAS,CAAmB;IACpC,OAAO,CAAC,iBAAiB,CAAS;IAClC,OAAO,CAAC,YAAY,CAAiB;IACrC,OAAO,CAAC,eAAe,CAAM;IAC7B,OAAO,CAAC,gBAAgB,CAAwC;IAGhE,KAAK,EAAG,gBAAgB,CAAC;IAEzB;;;OAGG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,cAAc,SAAM;IAEpB;;OAEG;IAEH,WAAW,SAAM;IAEjB;;;OAGG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,OAAO,CAAC,EAAE,WAAW,CAAC;IAGtB,QAAQ,UAAS;IAEjB,kBAAkB;IAMlB,oBAAoB,CAAC,KAAK,EAAE,aAAa;IAQzC,iBAAiB,IAAI,IAAI;IAkBzB,IAAI,aAAa,yCAEhB;IAED,IAAI,cAAc,0CAEjB;IAED,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,QAAQ;IAkBhB,OAAO,CAAC,mBAAmB,CAkBzB;IAEF,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,iBAAiB;IAUzB,KAAK;IAWL,mBAAmB;IAmBV,MAAM;CAiEhB"}
1
+ {"version":3,"file":"phone-input.component.d.ts","sourceRoot":"","sources":["../../src/components/phone-input.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAE,MAAM,KAAK,CAAC;AAI5C,OAAO,EAIL,KAAK,WAAW,EAEjB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,uBAAuB,CAAC;AAY/B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,eAAe,CAAC;KACpC;CACF;;AAUD;;;;;;;;;;;;GAYG;AACH,qBACa,eAAgB,SAAQ,oBAEpC;IACC,OAAO,CAAC,SAAS,CAAmB;IACpC,OAAO,CAAC,iBAAiB,CAAS;IAClC,OAAO,CAAC,YAAY,CAAiB;IACrC,OAAO,CAAC,eAAe,CAAM;IAC7B,OAAO,CAAC,gBAAgB,CAAwC;IAGhE,KAAK,EAAG,gBAAgB,CAAC;IAEzB;;;OAGG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,cAAc,SAAM;IAEpB;;OAEG;IAEH,WAAW,SAAM;IAEjB;;;OAGG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAEjB,MAAM,KAAK,qBAAqB,kDAE/B;IAED,kBAAkB;IAMlB,oBAAoB,CAAC,KAAK,EAAE,aAAa;IAQzC,iBAAiB,IAAI,IAAI;IAkBzB,IAAI,aAAa,yCAEhB;IAED,IAAI,cAAc,0CAEjB;IAED,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,aAAa;IAiCrB,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,cAAc;IAkBtB,OAAO,CAAC,mBAAmB,CAiBzB;IAEF,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,iBAAiB;IAUzB,KAAK;IAWL,mBAAmB;IAoBnB,iBAAiB;IAIR,MAAM;CAsEhB"}
package/dist/components/phone-input.js CHANGED
@@ -6,8 +6,9 @@ import { AsYouType, getCountryCallingCode, formatIncompletePhoneNumber, parsePho
6
6
  import "./icon/icon.js";
7
7
  import { templateParser, templateFormatter, onKeyDown, onChange } from "input-format";
8
8
  import { watch } from "../internal/watch.js";
9
- import { FormControllerMixin } from "../mixins/form-controller.mixin.js";
10
9
  import { HasSlotController } from "../internal/slot.js";
10
+ import { FormControlMixin } from "../mixins/form-control.mixin.js";
11
+ import { requiredValidator } from "../mixins/validators.js";
11
12
  var __defProp = Object.defineProperty;
12
13
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
13
14
  var __decorateClass = (decorators, target, key, kind) => {
@@ -25,7 +26,7 @@ const styles = [
25
26
  }
26
27
  `
27
28
  ];
28
- let MinidPhoneInput = class extends FormControllerMixin(
29
+ let MinidPhoneInput = class extends FormControlMixin(
29
30
  styled(LitElement, styles)
30
31
  ) {
31
32
  constructor() {
@@ -40,6 +41,8 @@ let MinidPhoneInput = class extends FormControllerMixin(
40
41
  this.countrycode = "";
41
42
  this.label = "";
42
43
  this.hidelabel = false;
44
+ this.invalid = false;
45
+ this.required = false;
43
46
  this.hasFocus = false;
44
47
  this.valueChangeCallback = (value) => {
45
48
  const country = value.length < 2 ? void 0 : this.formatter.getCountry() ?? this.country;
@@ -51,9 +54,11 @@ let MinidPhoneInput = class extends FormControllerMixin(
51
54
  this.value = value;
52
55
  this.nationalnumber = this.removePhonePrefix(value);
53
56
  this.dispatchEvent(this.currentEvent);
54
- this.setFormValue(this.value);
55
57
  };
56
58
  }
59
+ static get formControlValidators() {
60
+ return [requiredValidator];
61
+ }
57
62
  handleCountryClick() {
58
63
  this.dispatchEvent(
59
64
  new CustomEvent("mid-country-click", { composed: true, bubbles: true })
@@ -75,8 +80,8 @@ let MinidPhoneInput = class extends FormControllerMixin(
75
80
  this.value ??= this.countrycode;
76
81
  this.nationalnumber = this.removePhonePrefix(this.value);
77
82
  setTimeout(() => {
78
- this.input.value = `${this.countrycode}${this.nationalnumber}`;
79
- }, 0);
83
+ this.input.value = `${this.countrycode} ${this.nationalnumber}`;
84
+ });
80
85
  }
81
86
  get parseTemplate() {
82
87
  return templateParser(this.currentTemplate, parsePhoneNumberCharacter);
@@ -95,13 +100,22 @@ let MinidPhoneInput = class extends FormControllerMixin(
95
100
  bubbles: true,
96
101
  composed: true
97
102
  });
98
- this.setValue(event);
103
+ this.handleNewValue(event);
99
104
  }
100
105
  handleKeydown(event) {
101
106
  if (event.key === "Backspace" && this.input.selectionStart === 1) {
102
107
  event.preventDefault();
103
108
  return;
104
109
  }
110
+ const hasModifier = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;
111
+ if (event.key === "Enter" && !hasModifier) {
112
+ setTimeout(() => {
113
+ if (!event.defaultPrevented && !event.isComposing) {
114
+ this.form.requestSubmit();
115
+ }
116
+ });
117
+ return;
118
+ }
105
119
  onKeyDown(
106
120
  event,
107
121
  this.input,
@@ -115,9 +129,9 @@ let MinidPhoneInput = class extends FormControllerMixin(
115
129
  composed: true,
116
130
  bubbles: true
117
131
  });
118
- this.setValue(event);
132
+ this.handleNewValue(event);
119
133
  }
120
- setValue(event) {
134
+ handleNewValue(event) {
121
135
  this.formatter.reset();
122
136
  if (!this.input.value.startsWith("+")) {
123
137
  this.input.value = `+${this.input.value}`;
@@ -170,6 +184,9 @@ let MinidPhoneInput = class extends FormControllerMixin(
170
184
  this.input.dispatchEvent(new Event("input", { bubbles: true }));
171
185
  this.input.dispatchEvent(new Event("change", { bubbles: true }));
172
186
  }
187
+ handleValueChange() {
188
+ this.setValue(this.value.replaceAll(" ", ""));
189
+ }
173
190
  render() {
174
191
  const lg = false;
175
192
  const md = true;
@@ -216,7 +233,12 @@ let MinidPhoneInput = class extends FormControllerMixin(
216
233
 
217
234
  <input
218
235
  id="input"
219
- class="border-neutral focus-visible:focus-ring grow rounded-r border px-3"
236
+ class="${classMap({
237
+ "border-neutral": !this.invalid,
238
+ "border-danger": this.invalid,
239
+ "border-2": this.invalid,
240
+ border: !this.invalid
241
+ })} focus-visible:focus-ring grow rounded-r px-3"
220
242
  part="phone-number"
221
243
  type="tel"
222
244
  autocomplete="tel"
@@ -253,12 +275,21 @@ __decorateClass([
253
275
  __decorateClass([
254
276
  property({ reflect: true })
255
277
  ], MinidPhoneInput.prototype, "country", 2);
278
+ __decorateClass([
279
+ property({ type: Boolean })
280
+ ], MinidPhoneInput.prototype, "invalid", 2);
281
+ __decorateClass([
282
+ property({ type: Boolean })
283
+ ], MinidPhoneInput.prototype, "required", 2);
256
284
  __decorateClass([
257
285
  state()
258
286
  ], MinidPhoneInput.prototype, "hasFocus", 2);
259
287
  __decorateClass([
260
288
  watch("country", { waitUntilFirstUpdate: true })
261
289
  ], MinidPhoneInput.prototype, "handleCountryChange", 1);
290
+ __decorateClass([
291
+ watch("value")
292
+ ], MinidPhoneInput.prototype, "handleValueChange", 1);
262
293
  MinidPhoneInput = __decorateClass([
263
294
  customElement("mid-phone-input")
264
295
  ], MinidPhoneInput);
package/dist/components/phone-input.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"phone-input.js","sources":["../../src/components/phone-input.component.ts"],"sourcesContent":["import { css, html, LitElement } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styled } from '../mixins/tailwind.mixin';\nimport {\n AsYouType,\n formatIncompletePhoneNumber,\n getCountryCallingCode,\n type CountryCode,\n parsePhoneNumberCharacter,\n} from 'libphonenumber-js';\nimport './icon/icon.component';\nimport {\n onChange,\n onKeyDown,\n templateFormatter,\n templateParser,\n} from 'input-format';\nimport { watch } from '../internal/watch';\nimport { FormControllerMixin } from '../mixins/form-controller.mixin';\nimport { HasSlotController } from '../internal/slot';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'mid-phone-input': MinidPhoneInput;\n }\n}\n\nconst styles = [\n css`\n :host {\n display: block;\n }\n `,\n];\n\n/**\n * @event {Event} mid-country-click - Emitted when the country button is clicked\n * @event {Event} mid-change - Emitted when the value is modified by the user\n * @event {Event} mid-input - Emitted after a new user input\n * @event {Event} mid-blur - Emitted after focus is moved away from input\n * @event {Event} mid-focus - Emitted after input gains focus\n *\n * @part base - Select the container outside the country button and phone number input\n * @part field - Select the container around the label and the inputs\n * @part label - Select the label element\n * @part country-button - Select the country button\n * @part input - Select the phone number input\n */\n@customElement('mid-phone-input')\nexport class MinidPhoneInput extends FormControllerMixin(\n styled(LitElement, styles)\n) {\n private formatter = new AsYouType();\n private skipCountryUpdate = false; // avoids unwanted update loop\n private currentEvent = new Event(''); // the event to be emitted after value is set\n private currentTemplate = '';\n private hasSlotControler = new HasSlotController(this, 'label');\n\n @query('#input')\n input!: HTMLInputElement;\n\n /**\n * The value of the phone number in E.164 format. Example: `\"+4799999999\"`\n *\n */\n @property({ reflect: true })\n value = '';\n\n /**\n * The phone number without the country code prefix. Example: `\"99999999\"`\n */\n @property({ reflect: true })\n nationalnumber = '';\n\n /**\n * The country code of the current phone number value. Example: `\"+47\"`\n */\n @property({ reflect: true })\n countrycode = '';\n\n /**\n * Label for the phone input.\n * Passed label will be encapsulated by a label element.\n */\n @property()\n label = '';\n\n /**\n * Hide label visually. Still available for screen readers\n */\n @property({ type: Boolean })\n hidelabel = false;\n\n /**\n * The country selected. A two letter ISO country code like: `\"NO\"`\n */\n @property({ reflect: true })\n country?: CountryCode;\n\n @state()\n hasFocus = false;\n\n handleCountryClick() {\n this.dispatchEvent(\n new CustomEvent('mid-country-click', { composed: true, bubbles: true })\n );\n }\n\n handleCountryKeyDown(event: KeyboardEvent) {\n if ([' ', 'Enter'].includes(event.key)) {\n this.dispatchEvent(\n new CustomEvent('mid-country-click', { composed: true, bubbles: true })\n );\n }\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n this.formatter.input(this.value);\n this.country = this.formatter.getCountry() ?? this.country;\n this.countrycode = this.country\n ? `+${getCountryCallingCode(this.country)}`\n : '+';\n\n this.value = formatIncompletePhoneNumber(this.value);\n this.value ??= this.countrycode;\n this.nationalnumber = this.removePhonePrefix(this.value);\n\n setTimeout(() => {\n this.input.value = `${this.countrycode}${this.nationalnumber}`;\n }, 0);\n }\n\n get parseTemplate() {\n return templateParser(this.currentTemplate, parsePhoneNumberCharacter);\n }\n\n get formatTemplate() {\n return templateFormatter(this.currentTemplate);\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.dispatchEvent(\n new Event('mid-blur', { bubbles: true, composed: true })\n );\n }\n\n private handleChange(event: Event) {\n // Event is dispatched after value is set\n this.currentEvent = new Event('mid-change', {\n bubbles: true,\n composed: true,\n });\n\n this.setValue(event);\n }\n\n private handleKeydown(event: KeyboardEvent) {\n if (event.key === 'Backspace' && this.input.selectionStart === 1) {\n event.preventDefault();\n return;\n }\n\n onKeyDown(\n event,\n this.input,\n this.parseTemplate,\n this.formatTemplate,\n this.valueChangeCallback\n );\n }\n\n private handleInput(event: InputEvent) {\n // Event is dispatched after value is set\n this.currentEvent = new Event('mid-input', {\n composed: true,\n bubbles: true,\n });\n this.setValue(event);\n }\n\n private setValue(event: Event) {\n this.formatter.reset();\n\n if (!this.input.value.startsWith('+')) {\n this.input.value = `+${this.input.value}`;\n }\n this.formatter.input(this.input.value);\n this.currentTemplate = this.formatter.getTemplate();\n\n onChange(\n event,\n this.input,\n this.parseTemplate,\n this.formatTemplate,\n this.valueChangeCallback\n );\n }\n\n private valueChangeCallback = (value: string) => {\n const country =\n value.length < 2\n ? undefined\n : (this.formatter.getCountry() ?? this.country);\n\n if (country !== this.country) {\n this.country = country;\n this.countrycode = this.country\n ? `+${getCountryCallingCode(this.country)}`\n : '+';\n this.skipCountryUpdate = true;\n }\n\n this.value = value;\n this.nationalnumber = this.removePhonePrefix(value);\n this.dispatchEvent(this.currentEvent);\n this.setFormValue(this.value);\n };\n\n private handleFocus() {\n this.hasFocus = true;\n this.dispatchEvent(\n new Event('mid-focus', { composed: true, bubbles: true })\n );\n }\n\n private removePhonePrefix(value: string) {\n if (this.countrycode) {\n value = value.slice(this.countrycode.length);\n if (value[0] === ' ') {\n value = value.slice(1);\n }\n }\n return value;\n }\n\n focus() {\n this.input.focus();\n setTimeout(() => {\n this.input.setSelectionRange(\n (this.countrycode?.length ?? 0) + 1,\n this.input.value.length\n );\n }, 0);\n }\n\n @watch('country', { waitUntilFirstUpdate: true })\n handleCountryChange() {\n if (this.skipCountryUpdate) {\n this.skipCountryUpdate = false;\n return;\n }\n\n this.formatter = new AsYouType(this.country);\n this.nationalnumber = this.removePhonePrefix(this.input.value);\n\n this.countrycode = this.country\n ? `+${getCountryCallingCode(this.country)}`\n : '+';\n this.input.value = formatIncompletePhoneNumber(\n `${this.countrycode}${this.nationalnumber}`\n );\n this.input.dispatchEvent(new Event('input', { bubbles: true }));\n this.input.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n override render() {\n const lg = false;\n const md = true;\n const sm = false;\n\n const hasLabelSlot = this.hasSlotControler.test('label');\n const hasLabel = !!this.label || !!hasLabelSlot;\n\n return html`\n <div\n part=\"field\"\n class=\"${classMap({\n 'text-body-sm': sm,\n 'text-body-md': md,\n 'text-body-lg': lg,\n })}\"\n >\n <label\n for=\"input\"\n class=\"${classMap({\n 'sr-only': this.hidelabel || !hasLabel,\n })} mb-2 inline-flex items-center gap-1 font-medium\"\n >\n <slot name=\"label\"> ${this.label} </slot>\n </label>\n <div part=\"base\" class=\"flex h-12\">\n <button\n part=\"country-button\"\n class=\"border-neutral focus-visible:focus-ring flex h-full items-center rounded-l border border-r-0 pl-3\"\n iconstyled\n variant=\"tertiary\"\n @click=${this.handleCountryClick}\n @keydown=${this.handleCountryKeyDown}\n >\n ${this.country\n ? html`\n <mid-icon\n class=\"h-4 w-6 overflow-hidden rounded\"\n library=\"country\"\n name=\"${this.country}\"\n ></mid-icon>\n `\n : html`<div\n class=\"bg-neutral-surface-active h-4 w-6 overflow-hidden rounded\"\n ></div>`}\n <mid-icon name=\"chevron-down\"></mid-icon>\n </button>\n\n <input\n id=\"input\"\n class=\"border-neutral focus-visible:focus-ring grow rounded-r border px-3\"\n part=\"phone-number\"\n type=\"tel\"\n autocomplete=\"tel\"\n value=${this.value}\n @input=${this.handleInput}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n @keydown=${this.handleKeydown}\n @change=${this.handleChange}\n />\n </div>\n </div>\n `;\n }\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"phone-input.js","sources":["../../src/components/phone-input.component.ts"],"sourcesContent":["import { css, html, LitElement } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styled } from '../mixins/tailwind.mixin';\nimport {\n AsYouType,\n formatIncompletePhoneNumber,\n getCountryCallingCode,\n type CountryCode,\n parsePhoneNumberCharacter,\n} from 'libphonenumber-js';\nimport './icon/icon.component';\nimport {\n onChange,\n onKeyDown,\n templateFormatter,\n templateParser,\n} from 'input-format';\nimport { watch } from '../internal/watch';\nimport { HasSlotController } from '../internal/slot';\nimport { FormControlMixin } from '../mixins/form-control.mixin';\nimport { requiredValidator } from '../mixins/validators';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'mid-phone-input': MinidPhoneInput;\n }\n}\n\nconst styles = [\n css`\n :host {\n display: block;\n }\n `,\n];\n\n/**\n * @event {Event} mid-country-click - Emitted when the country button is clicked\n * @event {Event} mid-change - Emitted when the value is modified by the user\n * @event {Event} mid-input - Emitted after a new user input\n * @event {Event} mid-blur - Emitted after focus is moved away from input\n * @event {Event} mid-focus - Emitted after input gains focus\n *\n * @part base - Select the container outside the country button and phone number input\n * @part field - Select the container around the label and the inputs\n * @part label - Select the label element\n * @part country-button - Select the country button\n * @part input - Select the phone number input\n */\n@customElement('mid-phone-input')\nexport class MinidPhoneInput extends FormControlMixin(\n styled(LitElement, styles)\n) {\n private formatter = new AsYouType();\n private skipCountryUpdate = false; // avoids unwanted update loop\n private currentEvent = new Event(''); // the event to be emitted after value is set\n private currentTemplate = '';\n private hasSlotControler = new HasSlotController(this, 'label');\n\n @query('#input')\n input!: HTMLInputElement;\n\n /**\n * The value of the phone number in E.164 format. Example: `\"+4799999999\"`\n *\n */\n @property({ reflect: true })\n value = '';\n\n /**\n * The phone number without the country code prefix. Example: `\"99999999\"`\n */\n @property({ reflect: true })\n nationalnumber = '';\n\n /**\n * The country code of the current phone number value. Example: `\"+47\"`\n */\n @property({ reflect: true })\n countrycode = '';\n\n /**\n * Label for the phone input.\n * Passed label will be encapsulated by a label element.\n */\n @property()\n label = '';\n\n /**\n * Hide label visually. Still available for screen readers\n */\n @property({ type: Boolean })\n hidelabel = false;\n\n /**\n * The country selected. A two letter ISO country code like: `\"NO\"`\n */\n @property({ reflect: true })\n country?: CountryCode;\n\n /**\n * Activates invalid styling\n */\n @property({ type: Boolean })\n invalid = false;\n\n /**\n * Makes the input required\n */\n @property({ type: Boolean })\n required = false;\n\n @state()\n hasFocus = false;\n\n static get formControlValidators() {\n return [requiredValidator];\n }\n\n handleCountryClick() {\n this.dispatchEvent(\n new CustomEvent('mid-country-click', { composed: true, bubbles: true })\n );\n }\n\n handleCountryKeyDown(event: KeyboardEvent) {\n if ([' ', 'Enter'].includes(event.key)) {\n this.dispatchEvent(\n new CustomEvent('mid-country-click', { composed: true, bubbles: true })\n );\n }\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n this.formatter.input(this.value);\n this.country = this.formatter.getCountry() ?? this.country;\n this.countrycode = this.country\n ? `+${getCountryCallingCode(this.country)}`\n : '+';\n\n this.value = formatIncompletePhoneNumber(this.value);\n this.value ??= this.countrycode;\n this.nationalnumber = this.removePhonePrefix(this.value);\n\n setTimeout(() => {\n this.input.value = `${this.countrycode} ${this.nationalnumber}`;\n });\n }\n\n get parseTemplate() {\n return templateParser(this.currentTemplate, parsePhoneNumberCharacter);\n }\n\n get formatTemplate() {\n return templateFormatter(this.currentTemplate);\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.dispatchEvent(\n new Event('mid-blur', { bubbles: true, composed: true })\n );\n }\n\n private handleChange(event: Event) {\n // Event is dispatched after value is set\n this.currentEvent = new Event('mid-change', {\n bubbles: true,\n composed: true,\n });\n\n this.handleNewValue(event);\n }\n\n private handleKeydown(event: KeyboardEvent) {\n if (event.key === 'Backspace' && this.input.selectionStart === 1) {\n // don't remove '+' symbol which is the first character\n event.preventDefault();\n return;\n }\n\n const hasModifier =\n event.metaKey || event.ctrlKey || event.shiftKey || event.altKey;\n\n // Pressing enter when focused on an input should submit the form like a native input, but we wait a tick before\n // submitting to allow users to cancel the keydown event if they need to\n if (event.key === 'Enter' && !hasModifier) {\n setTimeout(() => {\n //\n // When using an Input Method Editor (IME), pressing enter will cause the form to submit unexpectedly. One way\n // to check for this is to look at event.isComposing, which will be true when the IME is open.\n if (!event.defaultPrevented && !event.isComposing) {\n this.form.requestSubmit();\n }\n });\n return;\n }\n\n onKeyDown(\n event,\n this.input,\n this.parseTemplate,\n this.formatTemplate,\n this.valueChangeCallback\n );\n }\n\n private handleInput(event: InputEvent) {\n // Event is dispatched after value is set\n this.currentEvent = new Event('mid-input', {\n composed: true,\n bubbles: true,\n });\n this.handleNewValue(event);\n }\n\n private handleNewValue(event: Event) {\n this.formatter.reset();\n\n if (!this.input.value.startsWith('+')) {\n this.input.value = `+${this.input.value}`;\n }\n this.formatter.input(this.input.value);\n this.currentTemplate = this.formatter.getTemplate();\n\n onChange(\n event,\n this.input,\n this.parseTemplate,\n this.formatTemplate,\n this.valueChangeCallback\n );\n }\n\n private valueChangeCallback = (value: string) => {\n const country =\n value.length < 2\n ? undefined\n : (this.formatter.getCountry() ?? this.country);\n\n if (country !== this.country) {\n this.country = country;\n this.countrycode = this.country\n ? `+${getCountryCallingCode(this.country)}`\n : '+';\n this.skipCountryUpdate = true;\n }\n\n this.value = value;\n this.nationalnumber = this.removePhonePrefix(value);\n this.dispatchEvent(this.currentEvent);\n };\n\n private handleFocus() {\n this.hasFocus = true;\n this.dispatchEvent(\n new Event('mid-focus', { composed: true, bubbles: true })\n );\n }\n\n private removePhonePrefix(value: string) {\n if (this.countrycode) {\n value = value.slice(this.countrycode.length);\n if (value[0] === ' ') {\n value = value.slice(1);\n }\n }\n return value;\n }\n\n focus() {\n this.input.focus();\n setTimeout(() => {\n this.input.setSelectionRange(\n (this.countrycode?.length ?? 0) + 1,\n this.input.value.length\n );\n }, 0);\n }\n\n @watch('country', { waitUntilFirstUpdate: true })\n handleCountryChange() {\n if (this.skipCountryUpdate) {\n this.skipCountryUpdate = false;\n return;\n }\n\n this.formatter = new AsYouType(this.country);\n this.nationalnumber = this.removePhonePrefix(this.input.value);\n\n this.countrycode = this.country\n ? `+${getCountryCallingCode(this.country)}`\n : '+';\n this.input.value = formatIncompletePhoneNumber(\n `${this.countrycode}${this.nationalnumber}`\n );\n this.input.dispatchEvent(new Event('input', { bubbles: true }));\n this.input.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n @watch('value')\n handleValueChange() {\n this.setValue(this.value.replaceAll(' ', ''));\n }\n\n override render() {\n const lg = false;\n const md = true;\n const sm = false;\n\n const hasLabelSlot = this.hasSlotControler.test('label');\n const hasLabel = !!this.label || !!hasLabelSlot;\n\n return html`\n <div\n part=\"field\"\n class=\"${classMap({\n 'text-body-sm': sm,\n 'text-body-md': md,\n 'text-body-lg': lg,\n })}\"\n >\n <label\n for=\"input\"\n class=\"${classMap({\n 'sr-only': this.hidelabel || !hasLabel,\n })} mb-2 inline-flex items-center gap-1 font-medium\"\n >\n <slot name=\"label\"> ${this.label} </slot>\n </label>\n <div part=\"base\" class=\"flex h-12\">\n <button\n part=\"country-button\"\n class=\"border-neutral focus-visible:focus-ring flex h-full items-center rounded-l border border-r-0 pl-3\"\n iconstyled\n variant=\"tertiary\"\n @click=${this.handleCountryClick}\n @keydown=${this.handleCountryKeyDown}\n >\n ${this.country\n ? html`\n <mid-icon\n class=\"h-4 w-6 overflow-hidden rounded\"\n library=\"country\"\n name=\"${this.country}\"\n ></mid-icon>\n `\n : html`<div\n class=\"bg-neutral-surface-active h-4 w-6 overflow-hidden rounded\"\n ></div>`}\n <mid-icon name=\"chevron-down\"></mid-icon>\n </button>\n\n <input\n id=\"input\"\n class=\"${classMap({\n 'border-neutral': !this.invalid,\n 'border-danger': this.invalid,\n 'border-2': this.invalid,\n border: !this.invalid,\n })} focus-visible:focus-ring grow rounded-r px-3\"\n part=\"phone-number\"\n type=\"tel\"\n autocomplete=\"tel\"\n value=${this.value}\n @input=${this.handleInput}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n @keydown=${this.handleKeydown}\n @change=${this.handleChange}\n />\n </div>\n </div>\n `;\n }\n}\n"],"names":[],"mappings":"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"}
package/dist/components/popup.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { autoUpdate, offset, size, flip, shift, arrow, platform, computePosition } from "@floating-ui/dom";
2
2
  import { classMap } from "lit/directives/class-map.js";
3
- import { css, html, LitElement } from "lit";
3
+ import { css, LitElement, html } from "lit";
4
4
  import { query, property, customElement } from "lit/decorators.js";
5
5
  import { styled } from "../mixins/tailwind.mixin.js";
6
6
  import { offsetParent } from "composed-offset-position";
package/dist/components/radio-group.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.component.d.ts","sourceRoot":"","sources":["../../src/components/radio-group.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG5D,OAAO,mBAAmB,CAAC;AAO3B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,eAAe,CAAC;KACpC;CACF;;AAcD;;;;;;;;;;GAUG;AACH,qBACa,eAAgB,SAAQ,oBAEpC;IACC;;OAEG;IAEH,IAAI,SAAY;IAEhB;;OAEG;IAEH,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAG5B,KAAK,SAAM;IAGX,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAGhC,WAAW,UAAS;IAGpB,QAAQ,UAAS;IAGjB,OAAO,CAAC,eAAe,CAAS;IAGhC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAQ;IAEnC,SAAS,CAAC,YAAY,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAMhE,SAAS,CAAC,iBAAiB;YAMb,iBAAiB;IA2B/B,OAAO,CAAC,UAAU;IAyBlB,OAAO,CAAC,aAAa;IA2DrB,OAAO,CAAC,YAAY;IAQpB,OAAO,CAAC,kBAAkB;IAO1B,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,gBAAgB;IA4BxB,gBAAgB;IAKhB,iBAAiB;IAOjB,oBAAoB;IAapB;;OAEG;IACI,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY;IAc1B,MAAM;CA4ChB"}
1
+ {"version":3,"file":"radio-group.component.d.ts","sourceRoot":"","sources":["../../src/components/radio-group.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAGjE,OAAO,mBAAmB,CAAC;AAO3B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,eAAe,CAAC;KACpC;CACF;;AAcD;;;;;;;;;;GAUG;AACH,qBACa,eAAgB,SAAQ,oBAEpC;IACC;;OAEG;IAEH,IAAI,SAAY;IAEhB;;OAEG;IAEH,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAG5B,KAAK,SAAM;IAGX,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAGhC,WAAW,UAAS;IAGpB,QAAQ,UAAS;IAGjB,OAAO,CAAC,eAAe,CAAS;IAGhC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAQ;IAEnC,SAAS,CAAC,YAAY,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAMhE,SAAS,CAAC,iBAAiB;YAMb,iBAAiB;IA2B/B,OAAO,CAAC,UAAU;IAyBlB,OAAO,CAAC,aAAa;IA2DrB,OAAO,CAAC,YAAY;IAQpB,OAAO,CAAC,kBAAkB;IAO1B,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,gBAAgB;IA4BxB,gBAAgB;IAKhB,iBAAiB;IAOjB,oBAAoB;IAapB;;OAEG;IACI,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY;IAc1B,MAAM;CA4ChB"}
package/dist/components/radio-group.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.js","sources":["../../src/components/radio-group.component.ts"],"sourcesContent":["import { css, html, LitElement, PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { styled } from '../mixins/tailwind.mixin';\nimport './label.component';\nimport { ConstraintsValidationMixin } from '../mixins/form-controller.mixin';\nimport { MinidRadioButton } from '../components/radio-button.component';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { watch } from '../internal/watch';\nimport { MinidRadio } from '../components/radio.component';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'mid-radio-group': MinidRadioGroup;\n }\n}\n\nconst styles = [\n css`\n :host {\n display: block;\n }\n\n .fds-label {\n margin-bottom: 1rem;\n }\n `,\n];\n\n/**\n *\n * @slot -- The default slot where `<mid-radio>` or `<mid-radio-button>` elements are placed.\n *\n * @event mid-change - Emitted when the selected value changes\n * @event mid-input - Emitted when radio group recieves input\n *\n * @csspart form-control-label - Select the label element\n * @csspart form-control - Select the fieldset containing the radios\n * @csspart base - Select the container around the radios\n */\n@customElement('mid-radio-group')\nexport class MinidRadioGroup extends ConstraintsValidationMixin(\n styled(LitElement, styles)\n) {\n /**\n * The name of the radio group.\n */\n @property()\n name = 'option';\n\n /**\n * The current value of the radio group.\n */\n @property({ reflect: true })\n value: string | null = null;\n\n @property()\n label = '';\n\n @property()\n size: 'sm' | 'md' | 'lg' = 'md';\n\n @property({ type: Boolean })\n labelhidden = false;\n\n @property({ type: Boolean })\n disabled = false;\n\n @state()\n private hasButtonRadios = false;\n\n @state()\n defaultValue: string | null = null;\n\n protected firstUpdated(_changedProperties: PropertyValues): void {\n super.firstUpdated(_changedProperties);\n this.defaultValue = this.value;\n this.setFormValue(this.value);\n }\n\n protected formResetCallback() {\n this.value = this.defaultValue;\n this.setFormValue(this.value);\n this.updateCheckedRadio();\n }\n\n private async syncRadioElements() {\n const radios = this.getAllRadios();\n this.hasButtonRadios = radios.some(\n (radio) => radio.tagName.toLowerCase() === 'mid-radio-button'\n );\n\n await Promise.all(\n // Sync the checked state and size\n radios.map(async (radio) => {\n await radio.updateComplete;\n radio.checked = radio.value === this.value;\n radio.size = this.size;\n })\n );\n\n if (radios.length > 0 && !radios.some((radio) => radio.checked)) {\n if (this.hasButtonRadios) {\n const buttonRadio = radios[0].shadowRoot?.querySelector('button');\n if (buttonRadio) {\n buttonRadio.setAttribute('tabindex', '0');\n }\n } else {\n radios[0].element.setAttribute('tabindex', '0');\n }\n }\n }\n\n private syncRadios() {\n if (\n customElements.get('mid-radio') &&\n customElements.get('mid-radio-button')\n ) {\n this.syncRadioElements();\n return;\n }\n\n if (customElements.get('mid-radio')) {\n this.syncRadioElements();\n } else {\n customElements.whenDefined('mid-radio').then(() => this.syncRadios());\n }\n\n if (customElements.get('mid-radio-button')) {\n this.syncRadioElements();\n } else {\n // Rerun this handler when <mid-radio> or <mid-radio-button> is registered\n customElements\n .whenDefined('mid-radio-button')\n .then(() => this.syncRadios());\n }\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n if (\n !['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', ' '].includes(\n event.key\n )\n ) {\n return;\n }\n\n const radios = this.getAllRadios().filter((radio) => !radio.disabled);\n const checkedRadio = radios.find((radio) => radio.checked) ?? radios[0];\n const incr =\n event.key === ' '\n ? 0\n : ['ArrowUp', 'ArrowLeft'].includes(event.key)\n ? -1\n : 1;\n const oldValue = this.value;\n let index = radios.indexOf(checkedRadio) + incr;\n\n if (index < 0) {\n index = radios.length - 1;\n }\n\n if (index > radios.length - 1) {\n index = 0;\n }\n\n this.getAllRadios().forEach((radio) => {\n radio.checked = false;\n\n if (!this.hasButtonRadios) {\n radio.element.setAttribute('tabindex', '-1');\n }\n });\n\n this.value = radios[index].value;\n radios[index].checked = true;\n this.setFormValue(this.value);\n\n if (!this.hasButtonRadios) {\n radios[index].element.setAttribute('tabindex', '0');\n radios[index].focus();\n } else {\n radios[index].shadowRoot!.querySelector('button')!.focus();\n }\n\n if (this.value !== oldValue) {\n this.dispatchEvent(\n new Event('mid-change', { bubbles: true, composed: true })\n );\n this.dispatchEvent(\n new Event('mid-input', { bubbles: true, composed: true })\n );\n }\n\n event.preventDefault();\n }\n\n private getAllRadios() {\n return Array.from(\n this.querySelectorAll<MinidRadioButton | MinidRadio>(\n 'mid-radio, mid-radio-button'\n )\n );\n }\n\n private updateCheckedRadio() {\n const radios = this.getAllRadios();\n radios.forEach((radio) => {\n radio.checked = radio.value === this.value;\n });\n }\n\n private handleLabelClick() {\n this.focus();\n }\n\n private handleRadioClick(event: MouseEvent) {\n const target = (event.target as HTMLElement).closest<\n MinidRadioButton | MinidRadio\n >('mid-radio, mid-radio-button')!;\n // const radios = this.getAllRadios();\n\n const oldValue = this.value;\n\n if (!target || target.disabled) {\n return;\n }\n\n this.value = target.value;\n this.setFormValue(this.value);\n\n this.updateCheckedRadio();\n\n if (this.value !== oldValue) {\n this.dispatchEvent(\n new Event('mid-change', { bubbles: true, composed: true })\n );\n this.dispatchEvent(\n new Event('mid-input', { bubbles: true, composed: true })\n );\n }\n }\n\n @watch('size', { waitUntilFirstUpdate: true })\n handleSizeChange() {\n this.syncRadios();\n }\n\n @watch('value')\n handleValueChange() {\n if (this.hasUpdated) {\n this.updateCheckedRadio();\n }\n }\n\n @watch('disabled')\n handleDisabledChange() {\n const radios = this.getAllRadios();\n const every = radios.every((radio) => radio.disabled);\n const some = radios.some((radio) => radio.disabled);\n radios.forEach((radio) => {\n if (every === some) {\n radio.disabled = this.disabled;\n } else if (this.disabled) {\n radio.disabled = true;\n }\n });\n }\n\n /**\n * Sets focus on the radio-group.\n */\n public focus(options?: FocusOptions) {\n const radios = this.getAllRadios();\n const checked = radios.find((radio) => radio.checked);\n const firstEnabledRadio = radios.find((radio) => !radio.disabled);\n\n const radioToFocus = checked || firstEnabledRadio;\n\n // Call focus for the checked radio\n // If no radio is checked, focus the first one that is not disabled\n if (radioToFocus) {\n radioToFocus.focus(options);\n }\n }\n\n override render() {\n return html`\n <label\n part=\"form-control-label\"\n id=\"label\"\n class=\"class=${classMap({\n 'fds-label': true,\n 'fds-label--spacing': true,\n 'fds-label--sm': this.size === 'sm',\n 'fds-label--md': this.size === 'md',\n 'fds-label--lg': this.size === 'lg',\n 'sr-only': this.labelhidden,\n })}\"\n @click=${this.handleLabelClick}\n >\n ${this.label}\n </label>\n <fieldset\n class=\"${classMap({\n 'fds-togglegroup': this.hasButtonRadios,\n })} flex\"\n part=\"form-control\"\n role=\"radiogroup\"\n aria-labelledby=\"label\"\n >\n <div\n class=\"${classMap({\n grid: true,\n 'gap-3': true,\n 'fds-togglegroup__content': this.hasButtonRadios,\n })}\"\n part=\"base\"\n role=\"presentation\"\n aria-label=${this.label}\n >\n <slot\n @slotchange=${this.syncRadios}\n @click=${this.handleRadioClick}\n @keydown=${this.handleKeyDown}\n ></slot>\n </div>\n </fieldset>\n `;\n }\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"radio-group.js","sources":["../../src/components/radio-group.component.ts"],"sourcesContent":["import { css, html, LitElement, type PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { styled } from '../mixins/tailwind.mixin';\nimport './label.component';\nimport { ConstraintsValidationMixin } from '../mixins/form-controller.mixin';\nimport { MinidRadioButton } from '../components/radio-button.component';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { watch } from '../internal/watch';\nimport { MinidRadio } from '../components/radio.component';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'mid-radio-group': MinidRadioGroup;\n }\n}\n\nconst styles = [\n css`\n :host {\n display: block;\n }\n\n .fds-label {\n margin-bottom: 1rem;\n }\n `,\n];\n\n/**\n *\n * @slot -- The default slot where `<mid-radio>` or `<mid-radio-button>` elements are placed.\n *\n * @event mid-change - Emitted when the selected value changes\n * @event mid-input - Emitted when radio group recieves input\n *\n * @csspart form-control-label - Select the label element\n * @csspart form-control - Select the fieldset containing the radios\n * @csspart base - Select the container around the radios\n */\n@customElement('mid-radio-group')\nexport class MinidRadioGroup extends ConstraintsValidationMixin(\n styled(LitElement, styles)\n) {\n /**\n * The name of the radio group.\n */\n @property()\n name = 'option';\n\n /**\n * The current value of the radio group.\n */\n @property({ reflect: true })\n value: string | null = null;\n\n @property()\n label = '';\n\n @property()\n size: 'sm' | 'md' | 'lg' = 'md';\n\n @property({ type: Boolean })\n labelhidden = false;\n\n @property({ type: Boolean })\n disabled = false;\n\n @state()\n private hasButtonRadios = false;\n\n @state()\n defaultValue: string | null = null;\n\n protected firstUpdated(_changedProperties: PropertyValues): void {\n super.firstUpdated(_changedProperties);\n this.defaultValue = this.value;\n this.setFormValue(this.value);\n }\n\n protected formResetCallback() {\n this.value = this.defaultValue;\n this.setFormValue(this.value);\n this.updateCheckedRadio();\n }\n\n private async syncRadioElements() {\n const radios = this.getAllRadios();\n this.hasButtonRadios = radios.some(\n (radio) => radio.tagName.toLowerCase() === 'mid-radio-button'\n );\n\n await Promise.all(\n // Sync the checked state and size\n radios.map(async (radio) => {\n await radio.updateComplete;\n radio.checked = radio.value === this.value;\n radio.size = this.size;\n })\n );\n\n if (radios.length > 0 && !radios.some((radio) => radio.checked)) {\n if (this.hasButtonRadios) {\n const buttonRadio = radios[0].shadowRoot?.querySelector('button');\n if (buttonRadio) {\n buttonRadio.setAttribute('tabindex', '0');\n }\n } else {\n radios[0].element.setAttribute('tabindex', '0');\n }\n }\n }\n\n private syncRadios() {\n if (\n customElements.get('mid-radio') &&\n customElements.get('mid-radio-button')\n ) {\n this.syncRadioElements();\n return;\n }\n\n if (customElements.get('mid-radio')) {\n this.syncRadioElements();\n } else {\n customElements.whenDefined('mid-radio').then(() => this.syncRadios());\n }\n\n if (customElements.get('mid-radio-button')) {\n this.syncRadioElements();\n } else {\n // Rerun this handler when <mid-radio> or <mid-radio-button> is registered\n customElements\n .whenDefined('mid-radio-button')\n .then(() => this.syncRadios());\n }\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n if (\n !['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', ' '].includes(\n event.key\n )\n ) {\n return;\n }\n\n const radios = this.getAllRadios().filter((radio) => !radio.disabled);\n const checkedRadio = radios.find((radio) => radio.checked) ?? radios[0];\n const incr =\n event.key === ' '\n ? 0\n : ['ArrowUp', 'ArrowLeft'].includes(event.key)\n ? -1\n : 1;\n const oldValue = this.value;\n let index = radios.indexOf(checkedRadio) + incr;\n\n if (index < 0) {\n index = radios.length - 1;\n }\n\n if (index > radios.length - 1) {\n index = 0;\n }\n\n this.getAllRadios().forEach((radio) => {\n radio.checked = false;\n\n if (!this.hasButtonRadios) {\n radio.element.setAttribute('tabindex', '-1');\n }\n });\n\n this.value = radios[index].value;\n radios[index].checked = true;\n this.setFormValue(this.value);\n\n if (!this.hasButtonRadios) {\n radios[index].element.setAttribute('tabindex', '0');\n radios[index].focus();\n } else {\n radios[index].shadowRoot!.querySelector('button')!.focus();\n }\n\n if (this.value !== oldValue) {\n this.dispatchEvent(\n new Event('mid-change', { bubbles: true, composed: true })\n );\n this.dispatchEvent(\n new Event('mid-input', { bubbles: true, composed: true })\n );\n }\n\n event.preventDefault();\n }\n\n private getAllRadios() {\n return Array.from(\n this.querySelectorAll<MinidRadioButton | MinidRadio>(\n 'mid-radio, mid-radio-button'\n )\n );\n }\n\n private updateCheckedRadio() {\n const radios = this.getAllRadios();\n radios.forEach((radio) => {\n radio.checked = radio.value === this.value;\n });\n }\n\n private handleLabelClick() {\n this.focus();\n }\n\n private handleRadioClick(event: MouseEvent) {\n const target = (event.target as HTMLElement).closest<\n MinidRadioButton | MinidRadio\n >('mid-radio, mid-radio-button')!;\n // const radios = this.getAllRadios();\n\n const oldValue = this.value;\n\n if (!target || target.disabled) {\n return;\n }\n\n this.value = target.value;\n this.setFormValue(this.value);\n\n this.updateCheckedRadio();\n\n if (this.value !== oldValue) {\n this.dispatchEvent(\n new Event('mid-change', { bubbles: true, composed: true })\n );\n this.dispatchEvent(\n new Event('mid-input', { bubbles: true, composed: true })\n );\n }\n }\n\n @watch('size', { waitUntilFirstUpdate: true })\n handleSizeChange() {\n this.syncRadios();\n }\n\n @watch('value')\n handleValueChange() {\n if (this.hasUpdated) {\n this.updateCheckedRadio();\n }\n }\n\n @watch('disabled')\n handleDisabledChange() {\n const radios = this.getAllRadios();\n const every = radios.every((radio) => radio.disabled);\n const some = radios.some((radio) => radio.disabled);\n radios.forEach((radio) => {\n if (every === some) {\n radio.disabled = this.disabled;\n } else if (this.disabled) {\n radio.disabled = true;\n }\n });\n }\n\n /**\n * Sets focus on the radio-group.\n */\n public focus(options?: FocusOptions) {\n const radios = this.getAllRadios();\n const checked = radios.find((radio) => radio.checked);\n const firstEnabledRadio = radios.find((radio) => !radio.disabled);\n\n const radioToFocus = checked || firstEnabledRadio;\n\n // Call focus for the checked radio\n // If no radio is checked, focus the first one that is not disabled\n if (radioToFocus) {\n radioToFocus.focus(options);\n }\n }\n\n override render() {\n return html`\n <label\n part=\"form-control-label\"\n id=\"label\"\n class=\"class=${classMap({\n 'fds-label': true,\n 'fds-label--spacing': true,\n 'fds-label--sm': this.size === 'sm',\n 'fds-label--md': this.size === 'md',\n 'fds-label--lg': this.size === 'lg',\n 'sr-only': this.labelhidden,\n })}\"\n @click=${this.handleLabelClick}\n >\n ${this.label}\n </label>\n <fieldset\n class=\"${classMap({\n 'fds-togglegroup': this.hasButtonRadios,\n })} flex\"\n part=\"form-control\"\n role=\"radiogroup\"\n aria-labelledby=\"label\"\n >\n <div\n class=\"${classMap({\n grid: true,\n 'gap-3': true,\n 'fds-togglegroup__content': this.hasButtonRadios,\n })}\"\n part=\"base\"\n role=\"presentation\"\n aria-label=${this.label}\n >\n <slot\n @slotchange=${this.syncRadios}\n @click=${this.handleRadioClick}\n @keydown=${this.handleKeyDown}\n ></slot>\n </div>\n </fieldset>\n `;\n }\n}\n"],"names":[],"mappings":"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"}
package/dist/components/step-indicator.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"step-indicator.component.d.ts","sourceRoot":"","sources":["../../src/components/step-indicator.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAE,MAAM,KAAK,CAAC;AAK5C,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,kBAAkB,CAAC;KAC1C;CACF;;AAWD,qBACa,kBAAmB,SAAQ,uBAA0B;IAEhE,KAAK,SAAK;IAGV,OAAO,SAAK;IAEH,MAAM;CAgBhB"}
1
+ {"version":3,"file":"step-indicator.component.d.ts","sourceRoot":"","sources":["../../src/components/step-indicator.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAE,MAAM,KAAK,CAAC;AAK5C,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,kBAAkB,CAAC;KAC1C;CACF;;AAWD,qBACa,kBAAmB,SAAQ,uBAA0B;IAEhE,KAAK,SAAK;IAGV,OAAO,SAAK;IAEH,MAAM;CAyBhB"}