@limetech/lime-elements 36.0.0-next.8 → 36.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (113) hide show
  1. package/dist/cjs/{dateFormatter-05d80b12.js → dateFormatter-d7a8d40d.js} +1 -1
  2. package/dist/cjs/lime-elements.cjs.js +1 -1
  3. package/dist/cjs/limel-button.cjs.entry.js +1 -1
  4. package/dist/cjs/limel-chip-set.cjs.entry.js +19 -11
  5. package/dist/cjs/limel-code-editor.cjs.entry.js +1596 -2
  6. package/dist/cjs/limel-collapsible-section.cjs.entry.js +1 -1
  7. package/dist/cjs/limel-date-picker.cjs.entry.js +3 -3
  8. package/dist/cjs/limel-dock-button.cjs.entry.js +32 -6
  9. package/dist/cjs/limel-dock.cjs.entry.js +6 -7
  10. package/dist/cjs/limel-flatpickr-adapter.cjs.entry.js +2 -2
  11. package/dist/cjs/limel-form.cjs.entry.js +1 -1
  12. package/dist/cjs/limel-input-field.cjs.entry.js +13 -6
  13. package/dist/cjs/limel-menu-list.cjs.entry.js +2 -3
  14. package/dist/cjs/limel-menu.cjs.entry.js +3 -14
  15. package/dist/cjs/limel-popover_4.cjs.entry.js +1 -1
  16. package/dist/cjs/limel-progress-flow-item.cjs.entry.js +1 -1
  17. package/dist/cjs/limel-select.cjs.entry.js +4 -5
  18. package/dist/cjs/limel-table.cjs.entry.js +17 -5
  19. package/dist/cjs/loader.cjs.js +1 -1
  20. package/dist/cjs/{moment-5cfac5cd.js → moment-d1e35cdc.js} +2 -2
  21. package/dist/collection/components/button/button.css +11 -7
  22. package/dist/collection/components/chip-set/chip-set.css +6 -2
  23. package/dist/collection/components/chip-set/chip-set.js +21 -13
  24. package/dist/collection/components/code-editor/code-editor.css +153 -1
  25. package/dist/collection/components/code-editor/code-editor.js +90 -2
  26. package/dist/collection/components/collapsible-section/collapsible-section.css +8 -7
  27. package/dist/collection/components/date-picker/date-picker.js +18 -1
  28. package/dist/collection/components/dock/dock-button/dock-button.css +15 -9
  29. package/dist/collection/components/dock/dock-button/dock-button.js +61 -24
  30. package/dist/collection/components/dock/dock.css +7 -3
  31. package/dist/collection/components/dock/dock.js +53 -7
  32. package/dist/collection/components/input-field/input-field.js +32 -7
  33. package/dist/collection/components/menu/menu.js +3 -14
  34. package/dist/collection/components/menu-list/menu-list.js +5 -25
  35. package/dist/collection/components/popover-surface/popover-surface.css +5 -4
  36. package/dist/collection/components/progress-flow/progress-flow-item/progress-flow-item.css +21 -8
  37. package/dist/collection/components/select/select.css +10 -11
  38. package/dist/collection/components/select/select.template.js +3 -4
  39. package/dist/collection/components/table/columns.js +1 -0
  40. package/dist/collection/components/table/layout.js +8 -0
  41. package/dist/collection/components/table/table.css +89 -61
  42. package/dist/collection/components/table/table.js +46 -15
  43. package/dist/collection/style/internal/codemirror-tooltip.scss +19 -0
  44. package/dist/collection/style/mixins.scss +11 -0
  45. package/dist/esm/{dateFormatter-2cad0292.js → dateFormatter-784c3334.js} +1 -1
  46. package/dist/esm/lime-elements.js +1 -1
  47. package/dist/esm/limel-button.entry.js +1 -1
  48. package/dist/esm/limel-chip-set.entry.js +19 -11
  49. package/dist/esm/limel-code-editor.entry.js +1596 -2
  50. package/dist/esm/limel-collapsible-section.entry.js +1 -1
  51. package/dist/esm/limel-date-picker.entry.js +3 -3
  52. package/dist/esm/limel-dock-button.entry.js +32 -6
  53. package/dist/esm/limel-dock.entry.js +6 -7
  54. package/dist/esm/limel-flatpickr-adapter.entry.js +2 -2
  55. package/dist/esm/limel-form.entry.js +1 -1
  56. package/dist/esm/limel-input-field.entry.js +13 -6
  57. package/dist/esm/limel-menu-list.entry.js +2 -3
  58. package/dist/esm/limel-menu.entry.js +3 -14
  59. package/dist/esm/limel-popover_4.entry.js +1 -1
  60. package/dist/esm/limel-progress-flow-item.entry.js +1 -1
  61. package/dist/esm/limel-select.entry.js +4 -5
  62. package/dist/esm/limel-table.entry.js +18 -6
  63. package/dist/esm/loader.js +1 -1
  64. package/dist/esm/{moment-367e51c5.js → moment-faa8a4a8.js} +2 -2
  65. package/dist/lime-elements/lime-elements.css +1 -1
  66. package/dist/lime-elements/lime-elements.esm.js +1 -1
  67. package/dist/lime-elements/{p-7e571ec6.entry.js → p-0ba0c38a.entry.js} +1 -1
  68. package/dist/lime-elements/p-104c89e8.entry.js +1 -0
  69. package/dist/lime-elements/p-1390fdcb.entry.js +126 -0
  70. package/dist/lime-elements/{p-1dfccbc5.entry.js → p-2fc4f4ff.entry.js} +1 -1
  71. package/dist/lime-elements/p-3cf4aae0.entry.js +1 -0
  72. package/dist/lime-elements/p-4dc07252.entry.js +82 -0
  73. package/dist/lime-elements/p-5ef52589.entry.js +1 -0
  74. package/dist/lime-elements/p-653faf47.entry.js +1 -0
  75. package/dist/lime-elements/{p-d76f896d.js → p-73df4d83.js} +1 -1
  76. package/dist/lime-elements/p-93f42a32.entry.js +1 -0
  77. package/dist/lime-elements/p-945afca2.js +3 -0
  78. package/dist/lime-elements/p-b0e54dc2.entry.js +1 -0
  79. package/dist/lime-elements/p-c15da26d.entry.js +1 -0
  80. package/dist/lime-elements/{p-af0ec482.entry.js → p-c544c05b.entry.js} +1 -1
  81. package/dist/lime-elements/p-c59cbd68.entry.js +1 -0
  82. package/dist/lime-elements/p-cb8db8c2.entry.js +37 -0
  83. package/dist/lime-elements/p-f41567a1.entry.js +1 -0
  84. package/dist/lime-elements/p-f5df4d4f.entry.js +1 -0
  85. package/dist/lime-elements/style/internal/codemirror-tooltip.scss +19 -0
  86. package/dist/lime-elements/style/mixins.scss +11 -0
  87. package/dist/types/components/chip-set/chip-set.d.ts +3 -2
  88. package/dist/types/components/code-editor/code-editor.d.ts +14 -0
  89. package/dist/types/components/date-picker/date-picker.d.ts +4 -0
  90. package/dist/types/components/dock/dock-button/dock-button.d.ts +21 -5
  91. package/dist/types/components/dock/dock.d.ts +15 -3
  92. package/dist/types/components/input-field/input-field.d.ts +6 -0
  93. package/dist/types/components/menu/menu.d.ts +1 -2
  94. package/dist/types/components/menu-list/menu-list.d.ts +2 -7
  95. package/dist/types/components/table/layout.d.ts +2 -0
  96. package/dist/types/components/table/table.d.ts +16 -1
  97. package/dist/types/components/table/table.types.d.ts +4 -0
  98. package/dist/types/components.d.ts +71 -15
  99. package/package.json +5 -4
  100. package/dist/lime-elements/p-1a2ffe75.entry.js +0 -82
  101. package/dist/lime-elements/p-1e59114e.entry.js +0 -1
  102. package/dist/lime-elements/p-3af5f9ad.js +0 -3
  103. package/dist/lime-elements/p-5ad60e14.entry.js +0 -126
  104. package/dist/lime-elements/p-64f068a8.entry.js +0 -1
  105. package/dist/lime-elements/p-6966b5df.entry.js +0 -1
  106. package/dist/lime-elements/p-722d32e0.entry.js +0 -1
  107. package/dist/lime-elements/p-75152d89.entry.js +0 -1
  108. package/dist/lime-elements/p-7ee4b825.entry.js +0 -1
  109. package/dist/lime-elements/p-97d6c4a6.entry.js +0 -1
  110. package/dist/lime-elements/p-b18cf477.entry.js +0 -1
  111. package/dist/lime-elements/p-b95e80c9.entry.js +0 -1
  112. package/dist/lime-elements/p-bd098a11.entry.js +0 -1
  113. package/dist/lime-elements/p-d1ee4501.entry.js +0 -37
package/dist/cjs/limel-collapsible-section.cjs.entry.js CHANGED
@@ -6,7 +6,7 @@ const index = require('./index-2a28697b.js');
6
6
  const dispatchResizeEvent = require('./dispatch-resize-event-4462d78f.js');
7
7
  const keycodes = require('./keycodes-3949f425.js');
8
8
 
9
- const collapsibleSectionCss = ":host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n var(--lime-text-primary-on-background-color)\n )}:host{--border-radius-of-header:0.75rem;display:block}:host([hidden]){display:none}:host([disabled]){pointer-events:none}.section__header{transition:background-color 0.4s ease, border-radius 0.1s ease;cursor:pointer;align-items:center;display:flex;justify-content:space-between;padding-left:0.625rem;padding-right:0.625rem;height:3.75rem;background-color:var(--closed-header-background-color, rgb(var(--contrast-200)));border-radius:var(--border-radius-of-header)}section.open .section__header{background-color:var(--open-header-background-color, rgb(var(--contrast-100)));border-radius:var(--border-radius-of-header) var(--border-radius-of-header) 0 0}section.open .section__header:hover{background-color:var(--open-header-background-color, rgb(var(--contrast-300)))}.section__header:hover{background-color:var(--open-header-background-color, rgb(var(--contrast-300)))}.section__header:focus{outline:none}.section__header:focus-visible{box-shadow:var(--shadow-depth-8-focused)}.section__header__title{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-headline2-font-size, 1rem);line-height:0.875rem;line-height:var(--mdc-typography-headline2-line-height, 0.875rem);font-weight:300;font-weight:var(--mdc-typography-headline2-font-weight, 300);letter-spacing:-0.0083333333em;letter-spacing:var(--mdc-typography-headline2-letter-spacing, -0.0083333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline2-text-transform, inherit);justify-self:flex-start;padding-right:0.75rem;user-select:none;padding-right:0.5rem;height:auto;max-height:3rem;line-height:1.2rem;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.section__header__divider-line{transition:opacity 0.3s ease 0.3s;flex-grow:1;height:0.125rem;border-radius:0.0625rem;background-color:var(--header-stroke-color, rgb(var(--contrast-900)));margin-right:0.5rem;opacity:0}section.open .section__header__divider-line{opacity:0.16}.section__header__actions{justify-self:flex-end;flex-shrink:0}@keyframes fade-in-section__body{0%{opacity:0}100%{opacity:1}}.section__body{animation:fade-in-section__body 0.3s ease-in forwards;background-color:var(--body-background-color, var(--contrast-100));padding-left:var(--body-padding, 1.25rem);padding-right:var(--body-padding, 1.25rem);margin-bottom:1.5rem;border-radius:0 0 var(--border-radius-of-header) var(--border-radius-of-header);display:none;opacity:0}section.open .section__body{display:block}.section__body:before,.section__body:after{content:\" \";display:table}.section__body:after{clear:both}.section__header__expand-icon{position:relative;height:1.875rem;margin:0 1rem 0 0.5rem;width:0.75rem;flex-shrink:0}.expand-icon__line{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:100%;border-radius:1rem;height:0.125rem;background-color:var(--header-stroke-color, rgb(var(--contrast-900)))}.expand-icon__line:first-of-type,.expand-icon__line:last-of-type{transition:opacity 0.2s ease 0.1s, transform 0.4s ease 0.3s}.expand-icon__line:first-of-type{transform:rotate3d(0, 0, 1, 90deg)}.expand-icon__line:last-of-type{transform:rotate3d(0, 0, 1, -90deg)}.expand-icon__line:nth-of-type(2),.expand-icon__line:nth-of-type(3){transition:opacity 0.2s ease, transform 0.18s ease}.section__header:hover .expand-icon__line:first-of-type{transform:rotate3d(0, 0, 1, 0deg)}.section__header:hover .expand-icon__line:last-of-type{transform:rotate3d(0, 0, 1, 0deg)}.section__header:hover .expand-icon__line:nth-of-type(2),.section__header:hover .expand-icon__line:nth-of-type(3){transition:opacity 0.5s ease 0.4s, transform 0.7s cubic-bezier(0.85, 0.11, 0.14, 1.35) 0.2s}.section__header:hover .expand-icon__line:nth-of-type(2){transform:translate3d(0, -0.5rem, 0);opacity:0.4}.section__header:hover .expand-icon__line:nth-of-type(3){transform:translate3d(0, 0.5rem, 0);opacity:0.4}section.open .section__header .expand-icon__line:first-of-type,section.open .section__header .expand-icon__line:last-of-type{transition:opacity 0.2s ease 0.1s, transform 0.4s ease 0.3s}section.open .section__header .expand-icon__line:first-of-type{transform:rotate3d(0, 0, 1, 0deg)}section.open .section__header .expand-icon__line:last-of-type{transform:rotate3d(0, 0, 1, 0deg)}section.open .section__header .expand-icon__line:nth-of-type(2),section.open .section__header .expand-icon__line:nth-of-type(3){transition:opacity 1s ease, transform 0.4s ease}section.open .section__header .expand-icon__line:nth-of-type(2){transform:translate3d(0, -1rem, 0);opacity:0}section.open .section__header .expand-icon__line:nth-of-type(3){transform:translate3d(0, 1rem, 0);opacity:0}section.open .section__header:hover .expand-icon__line:first-of-type,section.open .section__header:hover .expand-icon__line:last-of-type{transition:opacity 0.2s ease 0.4s, transform 0.4s cubic-bezier(0.85, 0.11, 0.14, 1.35) 0.2s}section.open .section__header:hover .expand-icon__line:first-of-type{transform:rotate3d(0, 0, 1, 45deg)}section.open .section__header:hover .expand-icon__line:last-of-type{transform:rotate3d(0, 0, 1, -45deg)}";
9
+ const collapsibleSectionCss = ":host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n var(--lime-text-primary-on-background-color)\n )}:host{--border-radius-of-header:0.75rem;display:block}:host([hidden]){display:none}:host([disabled]){pointer-events:none}.section__header{transition:background-color 0.4s ease, border-radius 0.1s ease;cursor:pointer;align-items:center;display:flex;justify-content:space-between;padding-left:0.625rem;padding-right:0.625rem;height:3.75rem;background-color:var(--closed-header-background-color, rgb(var(--contrast-200)));border-radius:var(--border-radius-of-header)}.section__header:focus{outline:none}.section__header:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}section.open .section__header{background-color:var(--open-header-background-color, rgb(var(--contrast-100)));border-radius:var(--border-radius-of-header) var(--border-radius-of-header) 0 0}section.open .section__header:hover{background-color:var(--open-header-background-color, rgb(var(--contrast-300)))}.section__header:hover{background-color:var(--open-header-background-color, rgb(var(--contrast-300)))}.section__header__title{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-headline2-font-size, 1rem);line-height:0.875rem;line-height:var(--mdc-typography-headline2-line-height, 0.875rem);font-weight:300;font-weight:var(--mdc-typography-headline2-font-weight, 300);letter-spacing:-0.0083333333em;letter-spacing:var(--mdc-typography-headline2-letter-spacing, -0.0083333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline2-text-transform, inherit);justify-self:flex-start;padding-right:0.75rem;user-select:none;padding-right:0.5rem;height:auto;max-height:3rem;line-height:1.2rem;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.section__header__divider-line{transition:opacity 0.3s ease 0.3s;flex-grow:1;height:0.125rem;border-radius:0.0625rem;background-color:var(--header-stroke-color, rgb(var(--contrast-900)));margin-right:0.5rem;opacity:0}section.open .section__header__divider-line{opacity:0.16}.section__header__actions{justify-self:flex-end;flex-shrink:0}@keyframes fade-in-section__body{0%{opacity:0}100%{opacity:1}}.section__body{animation:fade-in-section__body 0.3s ease-in forwards;background-color:var(--body-background-color, var(--contrast-100));padding-left:var(--body-padding, 1.25rem);padding-right:var(--body-padding, 1.25rem);margin-bottom:1.5rem;border-radius:0 0 var(--border-radius-of-header) var(--border-radius-of-header);display:none;opacity:0}section.open .section__body{display:block}.section__body:before,.section__body:after{content:\" \";display:table}.section__body:after{clear:both}.section__header__expand-icon{position:relative;height:1.875rem;margin:0 1rem 0 0.5rem;width:0.75rem;flex-shrink:0}.expand-icon__line{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:100%;border-radius:1rem;height:0.125rem;background-color:var(--header-stroke-color, rgb(var(--contrast-900)))}.expand-icon__line:first-of-type,.expand-icon__line:last-of-type{transition:opacity 0.2s ease 0.1s, transform 0.4s ease 0.3s}.expand-icon__line:first-of-type{transform:rotate3d(0, 0, 1, 90deg)}.expand-icon__line:last-of-type{transform:rotate3d(0, 0, 1, -90deg)}.expand-icon__line:nth-of-type(2),.expand-icon__line:nth-of-type(3){transition:opacity 0.2s ease, transform 0.18s ease}.section__header:hover .expand-icon__line:first-of-type{transform:rotate3d(0, 0, 1, 0deg)}.section__header:hover .expand-icon__line:last-of-type{transform:rotate3d(0, 0, 1, 0deg)}.section__header:hover .expand-icon__line:nth-of-type(2),.section__header:hover .expand-icon__line:nth-of-type(3){transition:opacity 0.5s ease 0.4s, transform 0.7s cubic-bezier(0.85, 0.11, 0.14, 1.35) 0.2s}.section__header:hover .expand-icon__line:nth-of-type(2){transform:translate3d(0, -0.5rem, 0);opacity:0.4}.section__header:hover .expand-icon__line:nth-of-type(3){transform:translate3d(0, 0.5rem, 0);opacity:0.4}section.open .section__header .expand-icon__line:first-of-type,section.open .section__header .expand-icon__line:last-of-type{transition:opacity 0.2s ease 0.1s, transform 0.4s ease 0.3s}section.open .section__header .expand-icon__line:first-of-type{transform:rotate3d(0, 0, 1, 0deg)}section.open .section__header .expand-icon__line:last-of-type{transform:rotate3d(0, 0, 1, 0deg)}section.open .section__header .expand-icon__line:nth-of-type(2),section.open .section__header .expand-icon__line:nth-of-type(3){transition:opacity 1s ease, transform 0.4s ease}section.open .section__header .expand-icon__line:nth-of-type(2){transform:translate3d(0, -1rem, 0);opacity:0}section.open .section__header .expand-icon__line:nth-of-type(3){transform:translate3d(0, 1rem, 0);opacity:0}section.open .section__header:hover .expand-icon__line:first-of-type,section.open .section__header:hover .expand-icon__line:last-of-type{transition:opacity 0.2s ease 0.4s, transform 0.4s cubic-bezier(0.85, 0.11, 0.14, 1.35) 0.2s}section.open .section__header:hover .expand-icon__line:first-of-type{transform:rotate3d(0, 0, 1, 45deg)}section.open .section__header:hover .expand-icon__line:last-of-type{transform:rotate3d(0, 0, 1, -45deg)}";
10
10
 
11
11
  const CollapsibleSection = class {
12
12
  constructor(hostRef) {
package/dist/cjs/limel-date-picker.cjs.entry.js CHANGED
@@ -5,10 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  const index = require('./index-2a28697b.js');
6
6
  const randomString = require('./random-string-4c3b7f1c.js');
7
7
  const device = require('./device-c5841113.js');
8
- const dateFormatter = require('./dateFormatter-05d80b12.js');
8
+ const dateFormatter = require('./dateFormatter-d7a8d40d.js');
9
9
  const component = require('./component-ae3bfacf.js');
10
10
  require('./_commonjsHelpers-0c557e26.js');
11
- require('./moment-5cfac5cd.js');
11
+ require('./moment-d1e35cdc.js');
12
12
  require('./component-67144c1c.js');
13
13
  require('./component-cf490570.js');
14
14
  require('./ponyfill-98ca4766.js');
@@ -116,7 +116,7 @@ const DatePicker = class {
116
116
  }
117
117
  const dropdownZIndex = getComputedStyle(this.host).getPropertyValue('--dropdown-z-index');
118
118
  return [
119
- index.h("limel-input-field", Object.assign({ disabled: this.disabled, readonly: this.readonly, invalid: this.invalid, label: this.label, helperText: this.helperText, required: this.required, value: this.formattedValue, onFocus: this.showCalendar, onBlur: this.hideCalendar, onClick: this.onInputClick, onChange: this.handleInputElementChange, ref: (el) => (this.textField = el) }, inputProps)),
119
+ index.h("limel-input-field", Object.assign({ disabled: this.disabled, readonly: this.readonly, invalid: this.invalid, label: this.label, placeholder: this.placeholder, helperText: this.helperText, required: this.required, value: this.formattedValue, onFocus: this.showCalendar, onBlur: this.hideCalendar, onClick: this.onInputClick, onChange: this.handleInputElementChange, ref: (el) => (this.textField = el) }, inputProps)),
120
120
  index.h("limel-portal", { containerId: this.portalId, visible: this.showPortal, containerStyle: { 'z-index': dropdownZIndex } }, index.h("limel-flatpickr-adapter", { format: this.internalFormat, language: this.language, type: this.type, value: this.value, ref: (el) => (this.datePickerCalendar = el), isOpen: this.showPortal, onChange: this.handleCalendarChange })),
121
121
  ];
122
122
  }
package/dist/cjs/limel-dock-button.cjs.entry.js CHANGED
@@ -5,25 +5,35 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  const index = require('./index-2a28697b.js');
6
6
  const randomString = require('./random-string-4c3b7f1c.js');
7
7
 
8
- const dockButtonCss = ".button{all:unset;box-sizing:border-box;display:flex;align-items:center;position:relative;width:100%;height:var(--dock-item-height);border-radius:0.375rem;font-size:0.875rem;padding:0 0.5rem;min-width:var(--dock-item-height);color:var(--limel-dock-item-text-color);background-color:var(--dock-background-color)}.button:focus-visible{box-shadow:var(--shadow-depth-8-focused)}.dock-item:not(.selected) .button:not(.disabled){cursor:pointer;transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out}.dock-item:not(.selected) .button:not(.disabled):hover{box-shadow:var(--button-shadow-hovered)}.dock-item:not(.selected) .button:not(.disabled):active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.button:hover{z-index:1}.button.selected{color:var(--limel-dock-item-text-color--selected);background-color:var(--dock-item-background-color--selected, rgb(var(--contrast-200)));box-shadow:var(--button-shadow-inset)}.button.selected .icon{color:var(--limel-dock-item-text--selected)}limel-popover{display:grid}.text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-left:0.5rem;padding-right:0.75rem}.icon{flex-shrink:0;width:calc(var(--dock-item-height) - 1rem);height:calc(var(--dock-item-height) - 1rem);color:var(--dock-item-icon-color, var(--limel-dock-item-text-color))}";
8
+ const dockButtonCss = ".button{all:unset;cursor:pointer;transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;box-sizing:border-box;display:flex;align-items:center;position:relative;width:100%;height:var(--dock-item-height);border-radius:0.375rem;font-size:0.875rem;padding:0 0.5rem;min-width:var(--dock-item-height);color:var(--limel-dock-item-text-color);background-color:var(--dock-background-color)}.button:hover{box-shadow:var(--button-shadow-hovered)}.button:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.button:focus{outline:none}.button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.button:hover{z-index:1}.button.selected{color:var(--limel-dock-item-text-color--selected);background-color:var(--dock-item-background-color--selected, rgb(var(--contrast-200)));box-shadow:var(--button-shadow-inset)}.button.selected:focus-visible{box-shadow:var(--button-shadow-inset), var(--shadow-depth-8-focused)}.button.selected .icon{color:var(--limel-dock-item-text--selected)}limel-popover{display:grid;grid-template-columns:100%}.text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-left:0.5rem;padding-right:0.75rem}.icon{flex-shrink:0;width:calc(var(--dock-item-height) - 1rem);height:calc(var(--dock-item-height) - 1rem);color:var(--dock-item-icon-color, var(--limel-dock-item-text-color))}";
9
9
 
10
10
  const DockButton = class {
11
11
  constructor(hostRef) {
12
12
  index.registerInstance(this, hostRef);
13
- this.interact = index.createEvent(this, "interact", 7);
13
+ this.itemSelected = index.createEvent(this, "itemSelected", 7);
14
+ this.menuOpen = index.createEvent(this, "menuOpen", 7);
14
15
  this.close = index.createEvent(this, "close", 7);
15
16
  /**
16
- * @inheritdoc
17
+ * When the dock is expanded or collapsed, dock items
18
+ * show labels and tooltips as suitable for the layout.
17
19
  */
18
20
  this.expanded = false;
19
21
  /**
20
- * @inheritdoc
22
+ * When dock is using mobile layout, dock items
23
+ * show labels and tooltips as suitable for the layout.
21
24
  */
22
25
  this.useMobileLayout = false;
26
+ /**
27
+ * Indicated whether the popover that renders a component is open.
28
+ */
23
29
  this.isOpen = false;
24
30
  this.openPopover = (event) => {
25
31
  event.stopPropagation();
26
32
  this.isOpen = true;
33
+ this.menuOpen.emit(this.item);
34
+ };
35
+ this.setCustomComponentElement = (element) => {
36
+ this.customComponentElement = element;
27
37
  };
28
38
  this.onPopoverClose = () => {
29
39
  this.isOpen = false;
@@ -31,7 +41,13 @@ const DockButton = class {
31
41
  };
32
42
  this.handleClick = (event) => {
33
43
  event.stopPropagation();
34
- this.interact.emit(this.item);
44
+ this.itemSelected.emit(this.item);
45
+ };
46
+ this.focusCustomComponentElement = () => {
47
+ var _a, _b, _c;
48
+ if ((_b = (_a = this.customComponentElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.delegatesFocus) {
49
+ (_c = this.customComponentElement) === null || _c === void 0 ? void 0 : _c.focus();
50
+ }
35
51
  };
36
52
  this.tooltipId = randomString.createRandomString();
37
53
  }
@@ -42,10 +58,17 @@ const DockButton = class {
42
58
  }
43
59
  return this.renderButton(this.handleClick);
44
60
  }
61
+ openWatcher() {
62
+ if (!this.isOpen) {
63
+ return;
64
+ }
65
+ const observer = new IntersectionObserver(this.focusCustomComponentElement);
66
+ observer.observe(this.customComponentElement);
67
+ }
45
68
  renderPopover() {
46
69
  var _a;
47
70
  const CustomComponent = (_a = this.item) === null || _a === void 0 ? void 0 : _a.dockMenu.componentName;
48
- return (index.h("limel-popover", { openDirection: this.useMobileLayout ? 'top' : 'right', open: this.isOpen || this.item.dockMenu.menuOpen, onClose: this.onPopoverClose }, this.renderButton(this.openPopover, 'trigger'), index.h(CustomComponent, Object.assign({}, (this.item.dockMenu.props || {}), { onClose: this.onPopoverClose }))));
71
+ return (index.h("limel-popover", { openDirection: this.useMobileLayout ? 'top' : 'right', open: this.isOpen || this.item.dockMenu.menuOpen, onClose: this.onPopoverClose }, this.renderButton(this.openPopover, 'trigger'), index.h(CustomComponent, Object.assign({ ref: this.setCustomComponentElement }, (this.item.dockMenu.props || {}), { onClose: this.onPopoverClose }))));
49
72
  }
50
73
  renderButton(handleClick, slot) {
51
74
  var _a;
@@ -73,6 +96,9 @@ const DockButton = class {
73
96
  return (index.h("limel-tooltip", { elementId: this.tooltipId, label: this.item.helperLabel }));
74
97
  }
75
98
  }
99
+ static get watchers() { return {
100
+ "isOpen": ["openWatcher"]
101
+ }; }
76
102
  };
77
103
  DockButton.style = dockButtonCss;
78
104
 
package/dist/cjs/limel-dock.cjs.entry.js CHANGED
@@ -4,13 +4,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-2a28697b.js');
6
6
 
7
- const dockCss = ":host(limel-dock){--dock-item-height:2.75rem;--dock-padding:0.25rem;--dock-expand-shrink-button-height:1rem;--limel-dock-item-text-color:var(\n --dock-item-text-color,\n rgb(var(--contrast-1100))\n );--limel-dock-item-text-color--selected:var(\n --dock-item-text-color--selected,\n rgb(var(--contrast-1300))\n );isolation:isolate;position:relative;display:inline-flex;flex-direction:column;background-color:var(--dock-background-color, rgb(var(--contrast-100)));box-shadow:0.1875rem 0 0.375rem -0.125rem rgba(var(--color-black), 0.15), 0.1875rem 0 0.625rem -0.125rem rgba(var(--color-black), 0.05)}:host(limel-dock:not(.has-mobile-layout)){height:100%;width:calc(var(--dock-padding) * 2 + var(--dock-item-height))}:host(limel-dock.expanded){width:var(--dock-expanded-max-width, max-content)}.footer-separator{margin-top:auto;justify-self:flex-end}nav{box-sizing:border-box;display:inline-flex;flex-direction:column;gap:0.375rem;flex-grow:1;padding:var(--dock-padding);overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}nav::-webkit-scrollbar{display:none}:host(limel-dock.has-mobile-layout) nav{justify-content:space-between;flex-direction:row}.expand-shrink{all:unset;box-sizing:border-box;transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;display:flex;justify-content:center;align-items:center;height:var(--dock-expand-shrink-button-height);padding:0 0.5rem;margin:var(--dock-padding);border-radius:0.375rem}.expand-shrink:hover{box-shadow:var(--button-shadow-hovered)}.expand-shrink:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.expand-shrink.expanded{justify-content:flex-end}.expand-shrink.expanded limel-icon{transform:rotateY(180deg)}.expand-shrink:focus-visible{box-shadow:var(--shadow-depth-8-focused)}.expand-shrink limel-icon{width:calc(var(--dock-expand-shrink-button-height) - 0.25rem);color:var(--dock-item-icon-color, var(--limel-dock-item-text-color))}";
7
+ const dockCss = ":host(limel-dock){--dock-item-height:2.75rem;--dock-padding:0.25rem;--dock-expand-shrink-button-height:1rem;--limel-dock-item-text-color:var(\n --dock-item-text-color,\n rgb(var(--contrast-1100))\n );--limel-dock-item-text-color--selected:var(\n --dock-item-text-color--selected,\n rgb(var(--contrast-1300))\n );isolation:isolate;position:relative;display:inline-flex;flex-direction:column;background-color:var(--dock-background-color, rgb(var(--contrast-100)));box-shadow:0.1875rem 0 0.375rem -0.125rem rgba(var(--color-black), 0.15), 0.1875rem 0 0.625rem -0.125rem rgba(var(--color-black), 0.05)}:host(limel-dock:not(.has-mobile-layout)){height:100%;width:calc(var(--dock-padding) * 2 + var(--dock-item-height))}:host(limel-dock.expanded){width:var(--dock-expanded-max-width, max-content)}.footer-separator{margin-top:auto;justify-self:flex-end}nav{box-sizing:border-box;display:inline-flex;flex-direction:column;gap:0.375rem;flex-grow:1;padding:var(--dock-padding);overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}nav::-webkit-scrollbar{display:none}:host(limel-dock.has-mobile-layout) nav{justify-content:space-between;flex-direction:row}.expand-shrink{all:unset;box-sizing:border-box;transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;display:flex;justify-content:center;align-items:center;height:var(--dock-expand-shrink-button-height);padding:0 0.5rem;margin:var(--dock-padding);border-radius:0.375rem}.expand-shrink:hover{box-shadow:var(--button-shadow-hovered)}.expand-shrink:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.expand-shrink:focus{outline:none}.expand-shrink:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.expand-shrink.expanded{justify-content:flex-end}.expand-shrink.expanded limel-icon{transform:rotateY(180deg)}.expand-shrink limel-icon{width:calc(var(--dock-expand-shrink-button-height) - 0.25rem);color:var(--dock-item-icon-color, var(--limel-dock-item-text-color))}";
8
8
 
9
9
  const DEFAULT_MOBILE_BREAKPOINT = 700;
10
10
  const Dock = class {
11
11
  constructor(hostRef) {
12
12
  index.registerInstance(this, hostRef);
13
13
  this.itemSelected = index.createEvent(this, "itemSelected", 7);
14
+ this.menuOpen = index.createEvent(this, "menuOpen", 7);
15
+ this.close = index.createEvent(this, "close", 7);
16
+ this.dockExpanded = index.createEvent(this, "dockExpanded", 7);
14
17
  /**
15
18
  * Items that are placed in the dock.
16
19
  */
@@ -57,12 +60,7 @@ const Dock = class {
57
60
  return (index.h("limel-dock-button", { class: {
58
61
  'dock-item': true,
59
62
  selected: item.selected,
60
- }, item: item, expanded: this.expanded && !this.useMobileLayout, useMobileLayout: this.useMobileLayout, onInteract: this.handleDockItemClick }));
61
- };
62
- this.handleDockItemClick = (event) => {
63
- if (!event.detail.selected) {
64
- this.itemSelected.emit(event.detail);
65
- }
63
+ }, item: item, expanded: this.expanded && !this.useMobileLayout, useMobileLayout: this.useMobileLayout }));
66
64
  };
67
65
  this.handleResize = () => {
68
66
  if (window.innerWidth <= this.mobileBreakPoint) {
@@ -74,6 +72,7 @@ const Dock = class {
74
72
  };
75
73
  this.toggleDockWidth = () => {
76
74
  this.expanded = !this.expanded;
75
+ this.dockExpanded.emit(this.expanded);
77
76
  };
78
77
  }
79
78
  componentDidLoad() {
package/dist/cjs/limel-flatpickr-adapter.cjs.entry.js CHANGED
@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  const index = require('./index-2a28697b.js');
6
6
  const translations = require('./translations-5a8d7f6c.js');
7
7
  const _commonjsHelpers = require('./_commonjsHelpers-0c557e26.js');
8
- const dateFormatter = require('./dateFormatter-05d80b12.js');
9
- const moment = require('./moment-5cfac5cd.js');
8
+ const dateFormatter = require('./dateFormatter-d7a8d40d.js');
9
+ const moment = require('./moment-d1e35cdc.js');
10
10
  const device = require('./device-c5841113.js');
11
11
  const eq = require('./eq-9a943b00.js');
12
12
  const isArrayLike$1 = require('./isArrayLike-ac53bdac.js');
package/dist/cjs/limel-form.cjs.entry.js CHANGED
@@ -13,7 +13,7 @@ const _assignValue$1 = require('./_assignValue-7c18d8d6.js');
13
13
  const isObject$3 = require('./isObject-e28b7997.js');
14
14
  const isObjectLike$1 = require('./isObjectLike-3e3f0cba.js');
15
15
  const _arrayIncludesWith$1 = require('./_arrayIncludesWith-29083f83.js');
16
- const moment = require('./moment-5cfac5cd.js');
16
+ const moment = require('./moment-d1e35cdc.js');
17
17
  const multiple = require('./multiple-8fab83eb.js');
18
18
  const randomString = require('./random-string-4c3b7f1c.js');
19
19
  require('./eq-9a943b00.js');
package/dist/cjs/limel-input-field.cjs.entry.js CHANGED
@@ -307,6 +307,7 @@ const InputField = class {
307
307
  this.getContainerClassList = () => {
308
308
  const classList = {
309
309
  'mdc-text-field': true,
310
+ 'mdc-text-field--no-label': !this.label,
310
311
  'mdc-text-field--outlined': true,
311
312
  'mdc-text-field--invalid': this.isInvalid(),
312
313
  'mdc-text-field--disabled': this.disabled || this.readonly,
@@ -333,7 +334,7 @@ const InputField = class {
333
334
  return;
334
335
  }
335
336
  const type = this.type === 'urlAsText' ? 'text' : this.type;
336
- return (index.h("input", Object.assign({}, properties, { type: type, pattern: this.pattern, onWheel: this.handleWheel, onKeyDown: this.onKeyDown, value: this.value })));
337
+ return (index.h("input", Object.assign({}, properties, { type: type, pattern: this.pattern, onWheel: this.handleWheel, onKeyDown: this.onKeyDown, value: this.value, placeholder: this.placeholder })));
337
338
  };
338
339
  this.renderTextarea = (properties) => {
339
340
  if (this.type !== 'textarea') {
@@ -455,6 +456,16 @@ const InputField = class {
455
456
  }
456
457
  return this.limelInputField.shadowRoot.querySelector(elementName);
457
458
  };
459
+ this.renderLabel = (labelId) => {
460
+ const labelClassList = {
461
+ 'mdc-floating-label': true,
462
+ 'mdc-floating-label--float-above': !!this.value || this.isFocused || this.readonly,
463
+ };
464
+ if (!this.label) {
465
+ return;
466
+ }
467
+ return (index.h("span", { class: "mdc-notched-outline__notch" }, index.h("span", { class: labelClassList, id: labelId }, this.label)));
468
+ };
458
469
  this.renderLeadingIcon = () => {
459
470
  if (this.type === 'textarea') {
460
471
  return;
@@ -715,12 +726,8 @@ const InputField = class {
715
726
  properties['aria-controls'] = helperTextId;
716
727
  properties['aria-describedby'] = helperTextId;
717
728
  }
718
- const labelClassList = {
719
- 'mdc-floating-label': true,
720
- 'mdc-floating-label--float-above': !!this.value || this.isFocused || this.readonly,
721
- };
722
729
  return [
723
- index.h("label", { class: this.getContainerClassList() }, index.h("span", { class: "mdc-notched-outline", tabindex: "-1" }, index.h("span", { class: "mdc-notched-outline__leading" }), index.h("span", { class: "mdc-notched-outline__notch" }, index.h("span", { class: labelClassList, id: labelId }, this.label)), index.h("span", { class: "mdc-notched-outline__trailing" })), this.renderLeadingIcon(), this.renderEmptyValueForReadonly(), this.renderPrefix(), this.renderInput(properties), this.renderSuffix(), this.renderTextarea(properties), this.renderFormattedNumber(), this.renderTrailingLinkOrButton()),
730
+ index.h("label", { class: this.getContainerClassList() }, index.h("span", { class: "mdc-notched-outline", tabindex: "-1" }, index.h("span", { class: "mdc-notched-outline__leading" }), this.renderLabel(labelId), index.h("span", { class: "mdc-notched-outline__trailing" })), this.renderLeadingIcon(), this.renderEmptyValueForReadonly(), this.renderPrefix(), this.renderInput(properties), this.renderSuffix(), this.renderTextarea(properties), this.renderFormattedNumber(), this.renderTrailingLinkOrButton()),
724
731
  this.renderHelperLine(),
725
732
  this.renderAutocompleteList(),
726
733
  ];
package/dist/cjs/limel-menu-list.cjs.entry.js CHANGED
@@ -769,7 +769,6 @@ const { SELECTED_EVENT } = strings;
769
769
  const MenuList = class {
770
770
  constructor(hostRef) {
771
771
  index.registerInstance(this, hostRef);
772
- this.change = index.createEvent(this, "change", 7);
773
772
  this.select = index.createEvent(this, "select", 7);
774
773
  /**
775
774
  * Size of the icons in the list
@@ -827,10 +826,10 @@ const MenuList = class {
827
826
  return !!item.selected;
828
827
  });
829
828
  if (selectedItem) {
830
- this.change.emit(Object.assign(Object.assign({}, selectedItem), { selected: false }));
829
+ this.select.emit(Object.assign(Object.assign({}, selectedItem), { selected: false }));
831
830
  }
832
831
  if (MenuItems[index] !== selectedItem) {
833
- this.change.emit(Object.assign(Object.assign({}, MenuItems[index]), { selected: false }));
832
+ this.select.emit(Object.assign(Object.assign({}, MenuItems[index]), { selected: false }));
834
833
  }
835
834
  };
836
835
  this.isMenuItem = (item) => {
package/dist/cjs/limel-menu.cjs.entry.js CHANGED
@@ -69,13 +69,8 @@ const Menu = class {
69
69
  }
70
70
  this.open = !this.open;
71
71
  };
72
- this.onListChange = (event) => {
73
- this.items = this.items.map((item) => {
74
- if (item === event.detail) {
75
- return event.detail;
76
- }
77
- return item;
78
- });
72
+ this.handleSelect = (event) => {
73
+ event.stopPropagation();
79
74
  this.select.emit(event.detail);
80
75
  this.open = false;
81
76
  };
@@ -93,12 +88,6 @@ const Menu = class {
93
88
  };
94
89
  this.portalId = randomString.createRandomString();
95
90
  }
96
- componentDidLoad() {
97
- if (!this.host.querySelector('[slot="trigger"]')) {
98
- // eslint-disable-next-line no-console
99
- console.warn('Using limel-menu with the default trigger is deprecated. Please provide your own trigger element.');
100
- }
101
- }
102
91
  openWatcher() {
103
92
  if (!this.open) {
104
93
  return;
@@ -116,7 +105,7 @@ const Menu = class {
116
105
  'has-grid-layout': this.gridLayout,
117
106
  } }, index.h("limel-menu-list", { class: {
118
107
  'has-grid-layout has-interactive-items': this.gridLayout,
119
- }, items: this.items, type: "menu", badgeIcons: this.badgeIcons, onChange: this.onListChange, ref: this.setListElement })))));
108
+ }, items: this.items, type: "menu", badgeIcons: this.badgeIcons, onSelect: this.handleSelect, ref: this.setListElement })))));
120
109
  }
121
110
  componentDidRender() {
122
111
  const slotElement = this.host.shadowRoot.querySelector('slot');
package/dist/cjs/limel-popover_4.cjs.entry.js CHANGED
@@ -115,7 +115,7 @@ const Popover = class {
115
115
  };
116
116
  Popover.style = popoverCss;
117
117
 
118
- const popoverSurfaceCss = ".limel-popover-surface{position:relative;display:flex;flex-direction:column;width:var(--popover-surface-width, auto);max-height:calc(100vh - 2rem);max-width:calc(100vw - 2rem);margin:0 0.25rem;border-radius:var(--popover-border-radius, 0.75rem);box-shadow:var(--shadow-depth-16);backdrop-filter:blur(0.3125rem);-webkit-backdrop-filter:blur(0.3125rem)}.limel-popover-surface:after{transition:opacity 0.4s ease;pointer-events:none;content:\"\";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;opacity:0.75;border-radius:var(--popover-border-radius, 0.75rem);background-color:var(--popover-body-background-color, rgb(var(--contrast-100)))}.limel-popover-surface:focus,.limel-popover-surface:focus-within{outline:none}.limel-popover-surface:focus:after,.limel-popover-surface:focus-within:after{opacity:1}.limel-popover-surface:focus-visible{box-shadow:var(--shadow-depth-16-focused)}";
118
+ const popoverSurfaceCss = ".limel-popover-surface{position:relative;display:flex;flex-direction:column;width:var(--popover-surface-width, auto);max-height:calc(100vh - 2rem);max-width:calc(100vw - 2rem);margin:0 0.25rem;border-radius:var(--popover-border-radius, 0.75rem);box-shadow:var(--shadow-depth-16);backdrop-filter:blur(0.3125rem);-webkit-backdrop-filter:blur(0.3125rem)}.limel-popover-surface:after{transition:opacity 0.4s ease;pointer-events:none;content:\"\";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;opacity:0.75;border-radius:var(--popover-border-radius, 0.75rem);background-color:var(--popover-body-background-color, rgb(var(--contrast-100)))}.limel-popover-surface:focus{outline:none}.limel-popover-surface:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.limel-popover-surface:focus:after,.limel-popover-surface:focus-within:after{opacity:1}";
119
119
 
120
120
  const PopoverSurface = class {
121
121
  constructor(hostRef) {
package/dist/cjs/limel-progress-flow-item.cjs.entry.js CHANGED
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-2a28697b.js');
6
6
 
7
- const progressFlowItemCss = ".flow-item{--step-background:var(\n --progress-flow-step-background-color,\n rgb(var(--contrast-600))\n );--step-background--selected:var(\n --progress-flow-step-background-color--selected,\n var(--mdc-theme-primary)\n );--step-background--passed:var(\n --progress-flow-step-background-color--passed,\n var(--step-background--selected)\n );--step-text:var(\n --progress-flow-step-text-color,\n rgb(var(--contrast-1200))\n );--step-text--selected:var(\n --progress-flow-step-text-color--selected,\n var(--mdc-theme-on-primary)\n );--step-text--passed:var(\n --progress-flow-step-text-color--passed,\n var(--step-text--selected)\n );--step-divider-color:var(\n --progress-flow-step-divider-color,\n rgb(var(--contrast-100))\n );position:relative;width:100%;display:flex;flex-direction:column;align-items:stretch}.flow-item:not(.off-progress-item,.last) .divider:after{content:\"\"}.flow-item.off-progress-item{padding-left:0.5rem}.flow-item.first-off-progress-item{padding-left:1rem}.step{transition:background-color 0.2s ease, box-shadow 0.2s ease;display:flex;justify-content:center;align-items:center;position:relative;width:100%;height:var(--step-height);border:none;font-size:0.875rem}.step.disabled{opacity:0.75;cursor:not-allowed}.step.disabled.readonly{opacity:1;cursor:default}.step:focus{outline:none}.step:focus-visible{box-shadow:var(--shadow-depth-8-focused)}.flow-item:not(.off-progress-item,.first) .step{padding-left:calc(var(--step-height) / 2)}.flow-item:not(.selected) .step:not(.disabled){cursor:pointer}.flow-item:not(.selected) .step:not(.disabled):hover{box-shadow:var(--button-shadow-normal)}.flow-item:not(.selected) .step:not(.disabled):active{box-shadow:var(--button-shadow-pressed)}.off-progress-item .step{border-radius:0.25rem;padding:0 0.75rem}.off-progress-item .step .icon{margin-left:0}.flow-item.first .step{border-top-left-radius:var(--step-height);border-bottom-left-radius:var(--step-height);padding-left:1.25rem}.flow-item.last .step{border-top-right-radius:var(--step-height);border-bottom-right-radius:var(--step-height);padding-right:1.25rem}.divider{display:flex;align-items:center;justify-content:center;width:var(--step-height);height:var(--step-height);position:absolute;z-index:1;right:calc(var(--step-height) / 2 * -1);overflow:hidden}.divider:after{position:absolute;display:block;box-sizing:border-box;transition:background-color 0.2s ease;width:100%;height:100%;right:calc(var(--step-height) / 5);transform:rotate(45deg);border-style:solid;border-width:0.125rem 0.125rem 0 0;border-radius:0 0.5rem 0 0;border-color:var(--step-divider-color)}.flow-item.last .divider{width:0}.text,.secondary-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:var(--max-text-width);z-index:2}.secondary-text{font-size:0.75rem;margin:auto;padding-left:calc(var(--step-height) / 2)}.icon{margin:0 0.5rem 0 0.25rem;z-index:2}.step:after{pointer-events:none;box-sizing:border-box;z-index:2;position:absolute;right:var(--selected-indicator-right);background-color:var(--step-divider-color);width:0.375rem;height:0.375rem;border-radius:50%;opacity:0.7}.last .step:after{right:0.5rem}.flow-item:not(.off-progress-item) .step.selected:after{content:\"\"}.step{color:var(--step-text);background-color:var(--step-background)}.step .icon{color:var(--progress-flow-icon-color--inactive, var(--step-text))}.flow-item.selected .step{color:var(--step-text--selected);background-color:var(--step-background--selected)}.flow-item.selected .step .divider:after{background-color:var(--step-background--selected)}.flow-item.selected .step .icon{color:var(--step-text--selected)}.flow-item.passed .step{color:var(--step-text--passed);background-color:var(--step-background--passed)}.flow-item.passed .step .divider:after{background-color:var(--step-background--passed)}.flow-item.passed .step .icon{color:var(--step-text--passed)}.divider:after{border-color:var(--step-divider-color);background-color:var(--step-background)}";
7
+ const progressFlowItemCss = ".flow-item{--step-background:var(\n --progress-flow-step-background-color,\n rgb(var(--contrast-600))\n );--step-background--selected:var(\n --progress-flow-step-background-color--selected,\n var(--mdc-theme-primary)\n );--step-background--passed:var(\n --progress-flow-step-background-color--passed,\n var(--step-background--selected)\n );--step-text:var(\n --progress-flow-step-text-color,\n rgb(var(--contrast-1200))\n );--step-text--selected:var(\n --progress-flow-step-text-color--selected,\n var(--mdc-theme-on-primary)\n );--step-text--passed:var(\n --progress-flow-step-text-color--passed,\n var(--step-text--selected)\n );--step-divider-color:var(\n --progress-flow-step-divider-color,\n rgb(var(--contrast-100))\n );position:relative;width:100%;display:flex;flex-direction:column;align-items:stretch}.flow-item:not(.off-progress-item,.last) .divider:after{content:\"\"}.flow-item.off-progress-item{padding-left:0.5rem}.flow-item.first-off-progress-item{padding-left:1rem}.step{transition:background-color 0.2s ease, box-shadow 0.2s ease;display:flex;justify-content:center;align-items:center;position:relative;width:100%;height:var(--step-height);border:none;font-size:0.875rem}.step.disabled{cursor:not-allowed}.step.disabled.readonly{opacity:1;cursor:default}.step:focus{outline:none}.step:focus-visible{box-shadow:var(--shadow-depth-8-focused)}.flow-item:not(.off-progress-item,.first) .step{padding-left:calc(var(--step-height) / 2)}.flow-item:not(.selected) .step:not(.disabled){cursor:pointer}.flow-item:not(.selected) .step:not(.disabled):hover{box-shadow:var(--button-shadow-normal)}.flow-item:not(.selected) .step:not(.disabled):active{box-shadow:var(--button-shadow-pressed)}.off-progress-item .step{border-radius:0.25rem;padding:0 0.75rem}.off-progress-item .step .icon{margin-left:0}.flow-item.first .step{border-top-left-radius:var(--step-height);border-bottom-left-radius:var(--step-height);padding-left:1.25rem}.flow-item.last .step{border-top-right-radius:var(--step-height);border-bottom-right-radius:var(--step-height);padding-right:1.25rem}.divider{display:flex;align-items:center;justify-content:center;width:var(--step-height);height:var(--step-height);position:absolute;z-index:1;right:calc(var(--step-height) / 2 * -1);overflow:hidden}.divider:after{position:absolute;display:block;box-sizing:border-box;transition:background-color 0.2s ease;width:100%;height:100%;right:calc(var(--step-height) / 5);transform:rotate(45deg);border-style:solid;border-width:0.125rem 0.125rem 0 0;border-radius:0 0.5rem 0 0;border-color:var(--step-divider-color)}.flow-item.last .divider{width:0}.text,.secondary-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:var(--max-text-width);z-index:2}.secondary-text{font-size:0.75rem;margin:auto;padding-left:calc(var(--step-height) / 2)}.icon{margin:0 0.5rem 0 0.25rem;z-index:2}.step:before,.step:after{pointer-events:none;box-sizing:border-box;z-index:2;position:absolute;right:var(--selected-indicator-right);border-radius:50%}.last .step:before,.last .step:after{right:0.5rem}.flow-item:not(.off-progress-item) .step.selected:before,.flow-item:not(.off-progress-item) .step.selected:after{content:\"\";width:0.375rem;height:0.375rem}.flow-item:not(.off-progress-item) .step.selected:before{background-color:var(--step-divider-color);opacity:0.7}.flow-item:not(.off-progress-item) .step.disabled:before,.flow-item:not(.off-progress-item) .step.disabled:after{width:0.75rem;height:0.75rem}.flow-item:not(.off-progress-item) .step.disabled:after{content:\"\";background-image:url(\"data:image/svg+xml;charset=utf-8, <svg viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg' xml:space='preserve' fill-rule='evenodd' clip-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2'><path fill='rgb(127,127,127)' d='M32.18 13.711c0-2.207-1.793-4-4.002-4H11.821c-2.208 0-4 1.793-4 4V28.29a4 4 0 0 0 4 4h16.357a4.002 4.002 0 0 0 4.001-4V13.711Z'/><path fill='rgb(127,127,127)' d='M11.211 9.758V7.673A7.489 7.489 0 0 1 18.696.188h2.608a7.489 7.489 0 0 1 7.485 7.485v2.085h-3V7.673a4.488 4.488 0 0 0-4.485-4.485h-2.608a4.488 4.488 0 0 0-4.485 4.485v2.085h-3Z'/></svg>\");background-size:90%;background-repeat:no-repeat;background-position:center;mix-blend-mode:multiply}.step{color:var(--step-text);background-color:var(--step-background)}.step .icon{color:var(--progress-flow-icon-color--inactive, var(--step-text))}.flow-item.selected .step{color:var(--step-text--selected);background-color:var(--step-background--selected)}.flow-item.selected .step .divider:after{background-color:var(--step-background--selected)}.flow-item.selected .step .icon{color:var(--step-text--selected)}.flow-item.passed .step{color:var(--step-text--passed);background-color:var(--step-background--passed)}.flow-item.passed .step .divider:after{background-color:var(--step-background--passed)}.flow-item.passed .step .icon{color:var(--step-text--passed)}.divider:after{border-color:var(--step-divider-color);background-color:var(--step-background)}";
8
8
 
9
9
  const ProgressFlowItem = class {
10
10
  constructor(hostRef) {