@limetech/lime-elements 38.6.0 → 38.7.1

package/CHANGELOG.md

@@ -1,3 +1,24 @@
+## [38.7.1](https://github.com/Lundalogik/lime-elements/compare/v38.7.0...v38.7.1) (2025-04-01)
+
+
+### Bug Fixes
+
+
+* **action-bar:** show expand button only when more than one action exists ([0aace07](https://github.com/Lundalogik/lime-elements/commit/0aace07b6a20f4bded4f8e8837a2c2c386139456))
+
+## [38.7.0](https://github.com/Lundalogik/lime-elements/compare/v38.6.0...v38.7.0) (2025-03-31)
+
+
+### Features
+
+
+* **action-bar:** add collapsible functionality ([b2b33ed](https://github.com/Lundalogik/lime-elements/commit/b2b33ed1d69e861e39a9affafeedf7e82cc1386a))
+
+### Bug Fixes
+
+
+* **index:** set default language to English ([c794547](https://github.com/Lundalogik/lime-elements/commit/c7945476264c66abd71ae908c7cc61dfdb3ad143))
+
 ## [38.6.0](https://github.com/Lundalogik/lime-elements/compare/v38.5.0...v38.6.0) (2025-03-25)
 
 

package/dist/cjs/lime-elements.cjs.js

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

package/dist/cjs/limel-action-bar-item_2.cjs.entry.js

@@ -99,7 +99,13 @@ const ActionBarOverflowMenu = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.select = index.createEvent(this, "select", 7);
-    this.countOverflowedItems = () => {
+    this.getOverflowTriggerContent = () => {
+      if (this.overFlowIcon) {
+        const { color, name, title } = this.overFlowIcon;
+        return (index.h("limel-icon", { style: {
+            color: color,
+          }, name: name, "aria-label": title }));
+      }
       return `+${this.numberOfMenuItems}`;
     };
     this.handleSelect = (event) => {
@@ -108,10 +114,11 @@ const ActionBarOverflowMenu = class {
     };
     this.items = undefined;
     this.openDirection = 'bottom-end';
+    this.overFlowIcon = undefined;
   }
   render() {
     return [
-      index.h("limel-menu", { openDirection: this.openDirection, items: this.items, onSelect: this.handleSelect }, index.h("button", { slot: "trigger" }, this.countOverflowedItems())),
+      index.h("limel-menu", { openDirection: this.openDirection, items: this.items, onSelect: this.handleSelect }, index.h("button", { slot: "trigger" }, this.getOverflowTriggerContent())),
     ];
   }
   get numberOfMenuItems() {

package/dist/cjs/limel-action-bar-item_2.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"limel-action-bar-item.limel-action-bar-overflow-menu.entry.cjs.js","mappings":"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","names":["createRandomString","makeEnterClickable","removeEnterClickable","h","getIconName","getIconColor","getIconTitle"],"sources":["./src/components/action-bar/action-bar-item/action-bar-item.scss?tag=limel-action-bar-item","./src/components/action-bar/action-bar-item/action-bar-item.tsx","./src/components/action-bar/action-bar-item/action-bar-overflow-menu.tsx"],"sourcesContent":["@use '../../../style/mixins';\n@use '../../../style/functions';\n\nlimel-action-bar-item {\n    transition: opacity 0.2s ease-in-out;\n    position: relative;\n    display: flex;\n    align-items: center;\n\n    &:not([is-visible]) {\n        opacity: 0;\n        pointer-events: none;\n    }\n}\n\nbutton {\n    all: unset;\n\n    &:not([disabled]) {\n        @include mixins.is-flat-inset-clickable(\n            $color: var(--limel-action-bar-item-text-color),\n            $color--hovered: var(--limel-action-bar-item-text-color),\n            $background-color: var(--action-bar-background-color),\n            $background-color--hovered: var(--action-bar-background-color),\n            $background-color--inset: var(--action-bar-background-color)\n        );\n        @include mixins.visualize-keyboard-focus;\n    }\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 0.25rem;\n\n    width: 100%;\n    min-width: var(--action-bar-item-height);\n    max-width: var(--action-bar-item-max-width, 10rem);\n    height: var(--action-bar-item-height);\n    color: var(--limel-action-bar-item-text-color);\n\n    border-radius: var(--action-bar-item-height);\n    font-size: functions.pxToRem(14);\n    padding: 0 0.25rem;\n\n    &:has(.text) {\n        padding: 0 0.5rem;\n    }\n\n    &[disabled] {\n        opacity: 0.4;\n    }\n\n    &.is-selected {\n        &:not(:hover) {\n            box-shadow: var(--button-shadow-inset);\n        }\n        color: var(--mdc-theme-primary) !important;\n    }\n}\n\n.text {\n    @include mixins.truncate-text();\n    padding: 0 0.25rem;\n}\n\nlimel-icon {\n    flex-shrink: 0;\n    width: calc(var(--action-bar-item-height) - 0.75rem);\n    height: calc(var(--action-bar-item-height) - 0.75rem);\n    color: var(\n        --action-bar-item-icon-color,\n        var(--limel-action-bar-item-text-color)\n    );\n}\n\nhr {\n    all: unset;\n    width: 1px;\n    height: 1.5rem;\n    border-radius: var(--action-bar-item-height);\n    background-color: var(--limel-action-bar-item-text-color);\n    opacity: 0.2;\n\n    @media (pointer: fine) {\n        margin-right: 0.5rem;\n        margin-left: 0.5rem;\n    }\n}\n\n// 👇 Overflow menu\n\nlimel-menu {\n    --notification-badge-background-color: rgb(var(--contrast-600));\n    --notification-badge-text-color: rgb(var(--contrast-1200));\n\n    &[open] {\n        button {\n            box-shadow: var(--button-shadow-inset);\n        }\n    }\n}\n\nbutton[slot='trigger'] {\n    animation: fade-in ease-out 0.25s;\n    font-size: 0.75rem;\n    font-weight: bold;\n    transform: translate3d(0, 0, 0);\n}\n\n@keyframes fade-in {\n    0% {\n        scale: 0.8;\n        opacity: 0;\n    }\n    100% {\n        scale: 1;\n        opacity: 1;\n    }\n}\n","import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Prop,\n} from '@stencil/core';\nimport { ActionBarItem } from '../../action-bar/action-bar.types';\nimport { ListSeparator } from '../../list/list-item.types';\nimport { createRandomString } from '../../../util/random-string';\nimport {\n    makeEnterClickable,\n    removeEnterClickable,\n} from '../../../util/make-enter-clickable';\nimport {\n    getIconColor,\n    getIconName,\n    getIconTitle,\n} from '../../icon/get-icon-props';\n\n/**\n * @private\n */\n@Component({\n    tag: 'limel-action-bar-item',\n    shadow: false,\n    styleUrl: 'action-bar-item.scss',\n})\nexport class ActionBarButton {\n    /**\n     * Item that is placed in the action bar.\n     */\n    @Prop()\n    public item!: ActionBarItem | ListSeparator;\n\n    /**\n     * Fired when a action bar item has been clicked.\n     * @public\n     */\n    @Event()\n    public select: EventEmitter<ActionBarItem | ListSeparator>;\n\n    /**\n     * When the item is displayed in the available width,\n     * this will be `false`.\n     */\n    @Prop({ reflect: true })\n    public isVisible: boolean = true;\n\n    /**\n     * When the item is selected, this will be `true`.\n     */\n    @Prop({ reflect: true })\n    public selected: boolean = false;\n\n    @Element()\n    private readonly host: HTMLLimelActionBarItemElement;\n\n    /**\n     * Used to attach the right tooltip to the right button\n     */\n    private readonly tooltipId: string;\n\n    constructor() {\n        this.tooltipId = createRandomString();\n    }\n\n    public componentWillLoad() {\n        makeEnterClickable(this.host);\n    }\n\n    public componentDidLoad() {\n        this.triggerIconColorWarning();\n    }\n\n    public disconnectedCallback() {\n        removeEnterClickable(this.host);\n    }\n\n    public render() {\n        if (!this.isItem(this.item) && this.item.separator) {\n            return <hr />;\n        }\n\n        return (\n            <button\n                id={this.tooltipId}\n                type=\"button\"\n                onClick={this.handleClick}\n                disabled={this.isDisabled()}\n                class={{\n                    'is-selected': this.isItem(this.item) && this.item.selected,\n                }}\n            >\n                {this.renderIcon()}\n                {this.renderLabel()}\n                {this.renderTooltip()}\n            </button>\n        );\n    }\n\n    private readonly handleClick = (event: MouseEvent) => {\n        event.stopPropagation();\n        this.select.emit(this.item);\n    };\n\n    private isItem(item: ActionBarItem | ListSeparator): item is ActionBarItem {\n        return !('separator' in item);\n    }\n\n    private isDisabled() {\n        if (this.isItem(this.item) && this.item.disabled) {\n            return true;\n        }\n\n        if (!this.isVisible) {\n            return true;\n        }\n    }\n\n    private renderIcon() {\n        if (this.isItem(this.item) && !this.item.icon) {\n            return;\n        }\n\n        if ('icon' in this.item) {\n            const name = getIconName(this.item.icon);\n            // eslint-disable-next-line sonarjs/deprecation\n            const color = getIconColor(this.item.icon, this.item.iconColor);\n            const title = getIconTitle(this.item.icon);\n\n            return (\n                <limel-icon\n                    name={name}\n                    aria-label={title}\n                    aria-hidden={title ? null : 'true'}\n                    style={{\n                        '--action-bar-item-icon-color': `${color}`,\n                    }}\n                />\n            );\n        }\n    }\n\n    private renderLabel() {\n        if (!this.isItem(this.item) || this.item.iconOnly) {\n            return;\n        }\n\n        return <span class=\"text\">{this.item.text}</span>;\n    }\n\n    private renderTooltip() {\n        if (!this.isItem(this.item)) {\n            return;\n        }\n\n        return (\n            <limel-tooltip\n                elementId={this.tooltipId}\n                label={this.getTooltipLabel(this.item)}\n                helperLabel={this.item.commandText}\n            />\n        );\n    }\n\n    private getTooltipLabel(item: ActionBarItem): string {\n        const iconTitle = getIconTitle(item.icon);\n        const tooltipLabel = item.text;\n\n        if (iconTitle && tooltipLabel) {\n            return `${iconTitle} ${tooltipLabel}`;\n        }\n\n        return tooltipLabel;\n    }\n\n    private triggerIconColorWarning() {\n        // eslint-disable-next-line sonarjs/deprecation\n        if (this.isItem(this.item) && this.item.iconColor) {\n            /* eslint-disable-next-line no-console */\n            console.warn(\n                \"The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.\",\n            );\n        }\n    }\n}\n","import { Component, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { ActionBarItem } from '../../action-bar/action-bar.types';\nimport { ListSeparator } from '../../list/list-item.types';\nimport { MenuItem, OpenDirection } from '../../menu/menu.types';\nimport { LimelMenuCustomEvent } from '../../../components';\n\n/**\n * @private\n */\n@Component({\n    tag: 'limel-action-bar-overflow-menu',\n    shadow: false,\n})\nexport class ActionBarOverflowMenu {\n    /**\n     * List of the items that should be rendered in the overflow menu.\n     */\n    @Prop()\n    public items: Array<MenuItem | ListSeparator>;\n\n    /**\n     * Defines the location that the content of the overflow menu\n     * appears, in relation to its trigger.\n     * It defaults to `bottom-end`, since in normal scenarios\n     * (for example when the action bar is not floating at the bottom of the screen)\n     * this menu is the right-most item in the user interface of the component.\n     */\n    @Prop({ reflect: true })\n    public openDirection: OpenDirection = 'bottom-end';\n\n    /**\n     * Fired when an item in the action bar overflow menu has been clicked.\n     * @public\n     */\n    @Event()\n    public select: EventEmitter<ActionBarItem>;\n\n    public render() {\n        return [\n            <limel-menu\n                openDirection={this.openDirection}\n                items={this.items}\n                onSelect={this.handleSelect}\n            >\n                <button slot=\"trigger\">{this.countOverflowedItems()}</button>\n            </limel-menu>,\n        ];\n    }\n\n    private countOverflowedItems = () => {\n        return `+${this.numberOfMenuItems}`;\n    };\n\n    private handleSelect = (event: LimelMenuCustomEvent<MenuItem>) => {\n        event.stopPropagation();\n        this.select.emit(event.detail);\n    };\n\n    private get numberOfMenuItems() {\n        return this.items.filter((item) => this.isMenuItem(item)).length;\n    }\n\n    private isMenuItem(item: MenuItem | ListSeparator): item is MenuItem {\n        return !('separator' in item);\n    }\n}\n"],"version":3}
+{"file":"limel-action-bar-item.limel-action-bar-overflow-menu.entry.cjs.js","mappings":"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","names":["createRandomString","makeEnterClickable","removeEnterClickable","h","getIconName","getIconColor","getIconTitle"],"sources":["./src/components/action-bar/action-bar-item/action-bar-item.scss?tag=limel-action-bar-item","./src/components/action-bar/action-bar-item/action-bar-item.tsx","./src/components/action-bar/action-bar-item/action-bar-overflow-menu.tsx"],"sourcesContent":["@use '../../../style/mixins';\n@use '../../../style/functions';\n\nlimel-action-bar-item {\n    transition: opacity 0.2s ease-in-out;\n    position: relative;\n    display: flex;\n    align-items: center;\n\n    &:not([is-visible]) {\n        opacity: 0;\n        pointer-events: none;\n    }\n}\n\nbutton {\n    all: unset;\n\n    &:not([disabled]) {\n        @include mixins.is-flat-inset-clickable(\n            $color: var(--limel-action-bar-item-text-color),\n            $color--hovered: var(--limel-action-bar-item-text-color),\n            $background-color: var(--action-bar-background-color),\n            $background-color--hovered: var(--action-bar-background-color),\n            $background-color--inset: var(--action-bar-background-color)\n        );\n        @include mixins.visualize-keyboard-focus;\n    }\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 0.25rem;\n\n    width: 100%;\n    min-width: var(--action-bar-item-height);\n    max-width: var(--action-bar-item-max-width, 10rem);\n    height: var(--action-bar-item-height);\n    color: var(--limel-action-bar-item-text-color);\n\n    border-radius: var(--action-bar-item-height);\n    font-size: functions.pxToRem(14);\n    padding: 0 0.25rem;\n\n    &:has(.text) {\n        padding: 0 0.5rem;\n    }\n\n    &[disabled] {\n        opacity: 0.4;\n    }\n\n    &.is-selected {\n        &:not(:hover) {\n            box-shadow: var(--button-shadow-inset);\n        }\n        color: var(--mdc-theme-primary) !important;\n    }\n}\n\n.text {\n    @include mixins.truncate-text();\n    padding: 0 0.25rem;\n}\n\nlimel-icon {\n    flex-shrink: 0;\n    width: calc(var(--action-bar-item-height) - 0.75rem);\n    height: calc(var(--action-bar-item-height) - 0.75rem);\n    color: var(\n        --action-bar-item-icon-color,\n        var(--limel-action-bar-item-text-color)\n    );\n}\n\nhr {\n    all: unset;\n    width: 1px;\n    height: 1.5rem;\n    border-radius: var(--action-bar-item-height);\n    background-color: var(--limel-action-bar-item-text-color);\n    opacity: 0.2;\n\n    @media (pointer: fine) {\n        margin-right: 0.5rem;\n        margin-left: 0.5rem;\n    }\n}\n\n// 👇 Overflow menu\n\nlimel-menu {\n    --notification-badge-background-color: rgb(var(--contrast-600));\n    --notification-badge-text-color: rgb(var(--contrast-1200));\n\n    &[open] {\n        button {\n            box-shadow: var(--button-shadow-inset);\n        }\n    }\n}\n\nbutton[slot='trigger'] {\n    animation: fade-in ease-out 0.25s;\n    font-size: 0.75rem;\n    font-weight: bold;\n    transform: translate3d(0, 0, 0);\n}\n\n@keyframes fade-in {\n    0% {\n        scale: 0.8;\n        opacity: 0;\n    }\n    100% {\n        scale: 1;\n        opacity: 1;\n    }\n}\n","import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Prop,\n} from '@stencil/core';\nimport { ActionBarItem } from '../../action-bar/action-bar.types';\nimport { ListSeparator } from '../../list/list-item.types';\nimport { createRandomString } from '../../../util/random-string';\nimport {\n    makeEnterClickable,\n    removeEnterClickable,\n} from '../../../util/make-enter-clickable';\nimport {\n    getIconColor,\n    getIconName,\n    getIconTitle,\n} from '../../icon/get-icon-props';\n\n/**\n * @private\n */\n@Component({\n    tag: 'limel-action-bar-item',\n    shadow: false,\n    styleUrl: 'action-bar-item.scss',\n})\nexport class ActionBarButton {\n    /**\n     * Item that is placed in the action bar.\n     */\n    @Prop()\n    public item!: ActionBarItem | ListSeparator;\n\n    /**\n     * Fired when a action bar item has been clicked.\n     * @public\n     */\n    @Event()\n    public select: EventEmitter<ActionBarItem | ListSeparator>;\n\n    /**\n     * When the item is displayed in the available width,\n     * this will be `false`.\n     */\n    @Prop({ reflect: true })\n    public isVisible: boolean = true;\n\n    /**\n     * When the item is selected, this will be `true`.\n     */\n    @Prop({ reflect: true })\n    public selected: boolean = false;\n\n    @Element()\n    private readonly host: HTMLLimelActionBarItemElement;\n\n    /**\n     * Used to attach the right tooltip to the right button\n     */\n    private readonly tooltipId: string;\n\n    constructor() {\n        this.tooltipId = createRandomString();\n    }\n\n    public componentWillLoad() {\n        makeEnterClickable(this.host);\n    }\n\n    public componentDidLoad() {\n        this.triggerIconColorWarning();\n    }\n\n    public disconnectedCallback() {\n        removeEnterClickable(this.host);\n    }\n\n    public render() {\n        if (!this.isItem(this.item) && this.item.separator) {\n            return <hr />;\n        }\n\n        return (\n            <button\n                id={this.tooltipId}\n                type=\"button\"\n                onClick={this.handleClick}\n                disabled={this.isDisabled()}\n                class={{\n                    'is-selected': this.isItem(this.item) && this.item.selected,\n                }}\n            >\n                {this.renderIcon()}\n                {this.renderLabel()}\n                {this.renderTooltip()}\n            </button>\n        );\n    }\n\n    private readonly handleClick = (event: MouseEvent) => {\n        event.stopPropagation();\n        this.select.emit(this.item);\n    };\n\n    private isItem(item: ActionBarItem | ListSeparator): item is ActionBarItem {\n        return !('separator' in item);\n    }\n\n    private isDisabled() {\n        if (this.isItem(this.item) && this.item.disabled) {\n            return true;\n        }\n\n        if (!this.isVisible) {\n            return true;\n        }\n    }\n\n    private renderIcon() {\n        if (this.isItem(this.item) && !this.item.icon) {\n            return;\n        }\n\n        if ('icon' in this.item) {\n            const name = getIconName(this.item.icon);\n            // eslint-disable-next-line sonarjs/deprecation\n            const color = getIconColor(this.item.icon, this.item.iconColor);\n            const title = getIconTitle(this.item.icon);\n\n            return (\n                <limel-icon\n                    name={name}\n                    aria-label={title}\n                    aria-hidden={title ? null : 'true'}\n                    style={{\n                        '--action-bar-item-icon-color': `${color}`,\n                    }}\n                />\n            );\n        }\n    }\n\n    private renderLabel() {\n        if (!this.isItem(this.item) || this.item.iconOnly) {\n            return;\n        }\n\n        return <span class=\"text\">{this.item.text}</span>;\n    }\n\n    private renderTooltip() {\n        if (!this.isItem(this.item)) {\n            return;\n        }\n\n        return (\n            <limel-tooltip\n                elementId={this.tooltipId}\n                label={this.getTooltipLabel(this.item)}\n                helperLabel={this.item.commandText}\n            />\n        );\n    }\n\n    private getTooltipLabel(item: ActionBarItem): string {\n        const iconTitle = getIconTitle(item.icon);\n        const tooltipLabel = item.text;\n\n        if (iconTitle && tooltipLabel) {\n            return `${iconTitle} ${tooltipLabel}`;\n        }\n\n        return tooltipLabel;\n    }\n\n    private triggerIconColorWarning() {\n        // eslint-disable-next-line sonarjs/deprecation\n        if (this.isItem(this.item) && this.item.iconColor) {\n            /* eslint-disable-next-line no-console */\n            console.warn(\n                \"The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.\",\n            );\n        }\n    }\n}\n","import { Component, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { ActionBarItem } from '../../action-bar/action-bar.types';\nimport { ListSeparator } from '../../list/list-item.types';\nimport { MenuItem, OpenDirection } from '../../menu/menu.types';\nimport { LimelMenuCustomEvent } from '../../../components';\nimport { Icon } from '../../../global/shared-types/icon.types';\n\n/**\n * @private\n */\n@Component({\n    tag: 'limel-action-bar-overflow-menu',\n    shadow: false,\n})\nexport class ActionBarOverflowMenu {\n    /**\n     * List of the items that should be rendered in the overflow menu.\n     */\n    @Prop()\n    public items: Array<MenuItem | ListSeparator>;\n\n    /**\n     * Defines the location that the content of the overflow menu\n     * appears, in relation to its trigger.\n     * It defaults to `bottom-end`, since in normal scenarios\n     * (for example when the action bar is not floating at the bottom of the screen)\n     * this menu is the right-most item in the user interface of the component.\n     */\n    @Prop({ reflect: true })\n    public openDirection: OpenDirection = 'bottom-end';\n\n    /**\n     * Icon to display in the overflow menu trigger.\n     * If not provided, the number of items in the overflow menu will be displayed.\n     */\n    @Prop()\n    public overFlowIcon?: Icon;\n\n    /**\n     * Fired when an item in the action bar overflow menu has been clicked.\n     * @public\n     */\n    @Event()\n    public select: EventEmitter<ActionBarItem>;\n\n    public render() {\n        return [\n            <limel-menu\n                openDirection={this.openDirection}\n                items={this.items}\n                onSelect={this.handleSelect}\n            >\n                <button slot=\"trigger\">\n                    {this.getOverflowTriggerContent()}\n                </button>\n            </limel-menu>,\n        ];\n    }\n\n    private getOverflowTriggerContent = () => {\n        if (this.overFlowIcon) {\n            const { color, name, title } = this.overFlowIcon;\n\n            return (\n                <limel-icon\n                    style={{\n                        color: color,\n                    }}\n                    name={name}\n                    aria-label={title}\n                />\n            );\n        }\n\n        return `+${this.numberOfMenuItems}`;\n    };\n\n    private handleSelect = (event: LimelMenuCustomEvent<MenuItem>) => {\n        event.stopPropagation();\n        this.select.emit(event.detail);\n    };\n\n    private get numberOfMenuItems() {\n        return this.items.filter((item) => this.isMenuItem(item)).length;\n    }\n\n    private isMenuItem(item: MenuItem | ListSeparator): item is MenuItem {\n        return !('separator' in item);\n    }\n}\n"],"version":3}

package/dist/cjs/limel-action-bar_2.cjs.entry.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d1052409.js');
+const translations = require('./translations-15b2de28.js');
 const isItem = require('./isItem-3f8ad629.js');
-const translations = require('./translations-b5da5dcd.js');
 const keycodes = require('./keycodes-8e70d9e0.js');
 
-const actionBarCss = ":host(limel-action-bar){--action-bar-item-height:2rem;--limel-action-bar-item-text-color:var(\n      --action-bar-item-text-color,\n      rgb(var(--contrast-1100))\n  );box-sizing:border-box;display:inline-flex;align-items:center;padding:0.125rem 0.25rem;max-width:100%;border-radius:var(--action-bar-border-radius);background-color:var(--action-bar-background-color, rgb(var(--contrast-100)))}:host(limel-action-bar),.items{gap:0.25rem}@media (pointer: coarse){:host(limel-action-bar),.items{gap:0.5rem}}.items{display:inline-flex;max-width:100%;min-width:0}:host(limel-action-bar.is-full-width){width:100%}:host(limel-action-bar.is-floating){--action-bar-border-radius:100vw;border:1px solid rgb(var(--contrast-400));padding-right:0.125rem;padding-left:0.125rem;max-width:calc(100% - 2rem);box-shadow:var(--shadow-depth-16), var(--shadow-depth-8)}";
+const actionBarCss = "@charset \"UTF-8\";:host(limel-action-bar){--action-bar-item-height:2rem;--limel-action-bar-item-text-color:var(\n      --action-bar-item-text-color,\n      rgb(var(--contrast-1100))\n  );box-sizing:border-box;display:inline-flex;align-items:center;padding:0.125rem 0.25rem;max-width:100%;border-radius:var(--action-bar-border-radius);background-color:var(--action-bar-background-color, rgb(var(--contrast-100)));transition:max-width 0.3s ease}:host(limel-action-bar),.items{gap:0.25rem}@media (pointer: coarse){:host(limel-action-bar),.items{gap:0.5rem}}.items{display:inline-flex;max-width:100%;min-width:0}:host(limel-action-bar.is-shrunk) .items{opacity:0}:host(limel-action-bar:not(.is-shrunk)) .items{opacity:1}:host(limel-action-bar.is-full-width){width:100%}:host(limel-action-bar.is-floating){--action-bar-border-radius:100vw;border:1px solid rgb(var(--contrast-400));padding-right:0.125rem;padding-left:0.125rem;max-width:calc(100% - 2rem);box-shadow:var(--shadow-depth-16), var(--shadow-depth-8)}:host(limel-action-bar.is-shrunk){max-width:5rem;transition:max-width 0.3s ease-in-out}:host(limel-action-bar.is-shrunk) .expand-shrink{transition:transform 0.3s ease;transform:rotateY(180deg)}:host(limel-action-bar:not(.is-shrunk)){max-width:100%;transition:max-width 0.3s ease-in-out}:host(limel-action-bar:not(.is-shrunk)) .expand-shrink{transition:transform 0.3s ease;transform:rotateY(0deg)}:host(limel-action-bar.can-be-shrunk.is-full-width) .expand-shrink{margin-left:auto}.expand-shrink{all:unset;box-sizing:border-box;border-radius:50%;transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--mdc-theme-on-surface);background-color:transparent;display:flex;justify-content:center;align-items:center}.expand-shrink:hover,.expand-shrink:focus,.expand-shrink:focus-visible{will-change:color, background-color, box-shadow, transform}.expand-shrink:hover{transform:translate3d(0, 0.01rem, 0);color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}.expand-shrink:active{--limel-clickable-transform-timing-function:cubic-bezier(\n      0.83,\n      -0.15,\n      0.49,\n      1.16\n  );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}.expand-shrink:hover,.expand-shrink:active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}.expand-shrink:focus{outline:none}.expand-shrink:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.expand-shrink limel-icon{width:1.5rem;height:1.5rem;padding:0.125rem;color:var(--action-bar-shrink-icon-color, rgb(var(--contrast-1000)))}";
 
 const ActionBar = class {
   constructor(hostRef) {
@@ -23,7 +23,15 @@ const ActionBar = class {
       if (!(this.actions.length - this.overflowCutoff)) {
         return;
       }
-      return (index.h("limel-action-bar-overflow-menu", { openDirection: this.openDirection, items: items, onSelect: this.handleSelect, role: "gridcell" }));
+      const shrunkOverFlowIcon = {
+        name: 'more',
+        color: 'rgb(var(--contrast-1000))',
+        title: this.getTranslation('action-bar.actions'),
+      };
+      return (index.h("limel-action-bar-overflow-menu", { openDirection: this.openDirection, items: items, onSelect: this.handleSelect, role: "gridcell", overFlowIcon: this.actionBarIsShrunk ? shrunkOverFlowIcon : undefined }));
+    };
+    this.handleCollapseExpandClick = () => {
+      this.actionBarIsShrunk = !this.actionBarIsShrunk;
     };
     this.handleSelect = (event) => {
       event.stopPropagation();
@@ -31,6 +39,9 @@ const ActionBar = class {
         this.itemSelected.emit(event.detail);
       }
     };
+    this.getTranslation = (key) => {
+      return translations.translate.get(key, this.language);
+    };
     this.handleIntersection = (entries) => {
       const intersectingItems = entries.filter((entry) => entry.isIntersecting);
       const notIntersectingItems = entries.filter((entry) => !entry.isIntersecting);
@@ -46,10 +57,13 @@ const ActionBar = class {
       this.isFirstIntersectionCheck = false;
     };
     this.actions = [];
+    this.language = document.documentElement.lang;
     this.accessibleLabel = undefined;
     this.layout = undefined;
+    this.collapsible = false;
     this.openDirection = undefined;
     this.overflowCutoff = this.actions.length;
+    this.actionBarIsShrunk = false;
   }
   connectedCallback() {
     if (this.hasRendered) {
@@ -78,11 +92,28 @@ const ActionBar = class {
     return (index.h(index.Host, { "aria-label": this.accessibleLabel, class: {
         'is-full-width': this.layout === 'fullWidth',
         'is-floating': this.layout === 'floating',
-      }, role: "grid" }, index.h("div", { class: "items", role: "rowgroup" }, this.actions.map(this.renderActionBarItem)), this.renderOverflowMenu(overflowActions)));
+        'is-shrunk': this.actionBarIsShrunk && this.collapsible,
+        'can-be-shrunk': !!this.collapsible,
+      }, role: "grid" }, index.h("div", { class: "items", role: "rowgroup" }, this.actions.map(this.renderActionBarItem)), this.renderOverflowMenu(overflowActions), this.renderCollapseExpandButton()));
+  }
+  renderCollapseExpandButton() {
+    if (!this.collapsible || this.actions.length <= 1) {
+      return;
+    }
+    return (index.h("button", { class: {
+        'expand-shrink': true,
+      }, "aria-label": this.tooltipLabel, type: "button", onClick: this.handleCollapseExpandClick }, index.h("limel-icon", { name: "double_left", id: "tooltip-expand-shrink-button" }), index.h("limel-tooltip", { label: this.tooltipLabel, elementId: "tooltip-expand-shrink-button" })));
   }
   isVisible(index) {
     return index < this.overflowCutoff;
   }
+  get tooltipLabel() {
+    let key = 'action-bar.collapse';
+    if (this.actionBarIsShrunk) {
+      key = 'action-bar.expand';
+    }
+    return this.getTranslation(key);
+  }
   createIntersectionObserver() {
     const options = {
       root: this.host.shadowRoot.querySelector('.items'),

package/dist/cjs/limel-action-bar_2.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"limel-action-bar.limel-text-editor-link-menu.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,YAAY,GAAG,m1BAAm1B;;MC+C31B,SAAS;;;;IAkDV,gBAAW,GAAG,KAAK,CAAC;IAEpB,6BAAwB,GAAG,IAAI,CAAC;IAChC,mBAAc,GAAoC,EAAE,CAAC;IA6C5C,wBAAmB,GAAG,CACnC,IAAmB,EACnBA,OAAa;MAEb,QACIC,mCACI,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,SAAS,EAAE,IAAI,CAAC,SAAS,CAACD,OAAK,CAAC,EAChC,IAAI,EAAC,UAAU,GACjB,EACJ;KACL,CAAC;IAEe,uBAAkB,GAAG,CAClC,KAAsC;MAEtC,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,cAAc,CAAC,EAAE;QAC9C,OAAO;OACV;MAED,QACIC,4CACI,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,IAAI,EAAC,UAAU,GACjB,EACJ;KACL,CAAC;IAMe,iBAAY,GAAG,CAC5B,KAAiD;MAEjD,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAIC,aAAM,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;QACtB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;OACxC;KACJ,CAAC;IAEe,uBAAkB,GAAG,CAClC,OAAoC;MAEpC,MAAM,iBAAiB,GAAG,OAAO,CAAC,MAAM,CACpC,CAAC,KAAK,KAAK,KAAK,CAAC,cAAc,CAClC,CAAC;MAEF,MAAM,oBAAoB,GAAG,OAAO,CAAC,MAAM,CACvC,CAAC,KAAK,KAAK,CAAC,KAAK,CAAC,cAAc,CACnC,CAAC;MAEF,IAAI,IAAI,CAAC,wBAAwB,EAAE;QAC/B,IAAI,CAAC,cAAc,GAAG,iBAAiB,CAAC,MAAM,CAAC;OAClD;WAAM;QACH,IAAI,CAAC,cAAc;UACf,IAAI,CAAC,cAAc;YACnB,iBAAiB,CAAC,MAAM;YACxB,oBAAoB,CAAC,MAAM,CAAC;OACnC;MAED,IAAI,CAAC,wBAAwB,GAAG,KAAK,CAAC;KACzC,CAAC;mBA7JqD,EAAE;;;;0BA0CxB,IAAI,CAAC,OAAO,CAAC,MAAM;;EAO7C,iBAAiB;IACpB,IAAI,IAAI,CAAC,WAAW,EAAE;MAClB,IAAI,CAAC,0BAA0B,EAAE,CAAC;KACrC;GACJ;EAEM,kBAAkB;;IACrB,IAAI,IAAI,CAAC,gBAAgB,EAAE,EAAE;MACzB,MAAA,IAAI,CAAC,oBAAoB,0CAAE,UAAU,EAAE,CAAC;MACxC,IAAI,CAAC,0BAA0B,EAAE,CAAC;KACrC;GACJ;EAEM,oBAAoB;;IACvB,MAAA,IAAI,CAAC,oBAAoB,0CAAE,UAAU,EAAE,CAAC;IACxC,IAAI,CAAC,oBAAoB,GAAG,SAAS,CAAC;IACtC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;GAC5B;EAEM,MAAM;IACT,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;IACxB,IAAI,eAAe,GAAoC,EAAE,CAAC;IAC1D,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;MACrB,eAAe,GAAG,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;KAC7D;IAED,QACID,QAACE,UAAI,kBACW,IAAI,CAAC,eAAe,EAChC,KAAK,EAAE;QACH,eAAe,EAAE,IAAI,CAAC,MAAM,KAAK,WAAW;QAC5C,aAAa,EAAE,IAAI,CAAC,MAAM,KAAK,UAAU;OAC5C,EACD,IAAI,EAAC,MAAM,IAEXF,iBAAK,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,UAAU,IAC7B,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,mBAAmB,CAAC,CACzC,EACL,IAAI,CAAC,kBAAkB,CAAC,eAAe,CAAC,CACtC,EACT;GACL;EAiCO,SAAS,CAAC,KAAa;IAC3B,OAAO,KAAK,GAAG,IAAI,CAAC,cAAc,CAAC;GACtC;EAkCO,0BAA0B;IAC9B,MAAM,OAAO,GAAG;MACZ,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC;MAClD,UAAU,EAAE,KAAK;MACjB,SAAS,EAAE,GAAG;KACjB,CAAC;IAEF,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC1C,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC;IAErC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;IAEzB,IAAI,CAAC,oBAAoB,GAAG,IAAI,oBAAoB,CAChD,IAAI,CAAC,kBAAkB,EACvB,OAAO,CACV,CAAC;IAEF,IAAI,CAAC,IAAI,CAAC,UAAU;OACf,gBAAgB,CAAC,uBAAuB,CAAC;OACzC,OAAO,CAAC,CAAC,aAAa;MACnB,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;KAC/B,CAAC,CAAC;GACV;EAEO,OAAO,CAAC,aAA4C;IACxD,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IACjD,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;GAC3C;EAEO,gBAAgB;IACpB,MAAM,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAC5C,CAAC,aAA4C,KACzC,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,aAAa,CAAC,CACpD,CAAC;IAEF,MAAM,aAAa,GAAG,KAAK,CAAC,IAAI,CAC5B,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CACjE,CAAC,IAAI,CACF,CAAC,aAA4C,KACzC,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,aAAa,CAAC,CACnD,CAAC;IAEF,OAAO,eAAe,IAAI,aAAa,CAAC;GAC3C;;;;;AC/PL,MAAM,iBAAiB,GAAG,2aAA2a;;MCkBxb,kBAAkB;;;;;;IAsHnB,mBAAc,GAAG,CAAC,GAAW;MACjC,OAAOG,sBAAS,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;KAC5C,CAAC;IAEM,YAAO,GAAG,CAAC,IAAY;MAC3B,IAAI;QACA,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC;OACjB;MAAC,WAAM;QACJ,OAAO,KAAK,CAAC;OAChB;MAED,OAAO,IAAI,CAAC;KACf,CAAC;IAEM,kBAAa,GAAG,CAAC,KAAoB;;MACzC,IAAI,KAAK,CAAC,GAAG,KAAKC,cAAK,EAAE;QACrB,OAAO;OACV;MAED,IAAI,IAAI,CAAC,UAAU,EAAE;QACjB,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;OAC3B;MAED,KAAK,CAAC,cAAc,EAAE,CAAC;MACvB,IAAI,IAAI,CAAC,OAAO,CAAC,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,CAAC,EAAE;QAC/B,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;OAC1B;KACJ,CAAC;IAEM,iBAAY,GAAG,CAAC,KAAiC;MACrD,IAAI,KAAK,YAAY,aAAa,IAAI,KAAK,CAAC,GAAG,KAAKC,eAAM,EAAE;QACxD,OAAO;OACV;MAED,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,KAAK,CAAC,cAAc,EAAE,CAAC;MACvB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;KACtB,CAAC;IAEM,eAAU,GAAG,CAAC,KAAiC;MACnD,KAAK,CAAC,eAAe,EAAE,CAAC;MAExB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;KACpB,CAAC;IAEM,0BAAqB,GAAG,CAC5B,KAAuC;MAEvC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;MACtC,KAAK,CAAC,eAAe,EAAE,CAAC;KAC3B,CAAC;IAEM,0BAAqB,GAAG,CAAC,KAA0B;;MACvD,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,MAAM,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,CAAC,CAAC;KACtD,CAAC;IAEM,0BAAqB,GAAG,CAAC,KAA0B;;MACvD,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC;MAE1B,IAAI,CAAC,cAAc,CAAC,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,EAAE,IAAI,CAAC,CAAC;KAC9C,CAAC;IAEM,mBAAc,GAAG,CAAC,IAAY,EAAE,IAAY;MAChD,MAAM,OAAO,GAAmB;QAC5B,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;OACb,CAAC;MAEF,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACjC,CAAC;;oBAhL2B,IAAI;kBAMR,KAAK;;EAwBvB,iBAAiB;IACpB,IAAI,CAAC,mBAAmB,EAAE,CAAC;GAC9B;EAEM,oBAAoB;IACvB,IAAI,CAAC,sBAAsB,EAAE,CAAC;GACjC;EAEO,mBAAmB;IACvB,IAAI,IAAI,CAAC,MAAM,EAAE;MACb,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;KACzD;GACJ;EAEO,sBAAsB;IAC1B,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;GAC5D;EAEM,gBAAgB;IACnB,IAAI,CAAC,gBAAgB,EAAE,CAAC;GAC3B;EAEO,gBAAgB;IACpB,IAAI,IAAI,CAAC,SAAS,EAAE;MAChB,MAAM,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;MACpE,IAAI,UAAU,EAAE;QACZ,qBAAqB,CAAC;UAClB,UAAU,CAAC,KAAK,EAAE,CAAC;SACtB,CAAC,CAAC;OACN;KACJ;GACJ;EAEM,MAAM;;IACT,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAE7C,OAAO;MACHL,+BACI,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,uBAAuB,CAAC,EACnD,KAAK,EAAE,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,KAAI,EAAE,EAC5B,WAAW,EAAC,aAAa,EACzB,QAAQ,EAAE,IAAI,CAAC,qBAAqB,EACpC,SAAS,EAAE,IAAI,CAAC,aAAa,EAC7B,GAAG,EAAE,CAAC,EAAE,MACH,IAAI,CAAC,SAAS,GAAG,EAAgC,CAAC,GAEzD;MACFA,+BACI,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,uBAAuB,CAAC,EACnD,KAAK,EAAE,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,KAAI,EAAE,EAC5B,IAAI,EAAC,MAAM,EACX,WAAW,EAAC,iBAAiB,EAC7B,YAAY,EAAC,eAAe,EAC5B,OAAO,EAAE,CAAC,OAAO,EACjB,QAAQ,EAAE,IAAI,CAAC,qBAAqB,EACpC,QAAQ,EAAE,IAAI,CAAC,qBAAqB,EACpC,SAAS,EAAE,IAAI,CAAC,aAAa,GAC/B;MACFA,iBAAK,KAAK,EAAC,SAAS,IAChBA,0BACI,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,EACpC,OAAO,EAAE,IAAI,CAAC,YAAY,GAC5B,EACFA,0BACI,OAAO,EAAE,IAAI,EACb,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAClC,QAAQ,EAAE,CAAC,OAAO,EAClB,OAAO,EAAE,IAAI,CAAC,UAAU,EACxB,GAAG,EAAE,CAAC,EAAE,MACH,IAAI,CAAC,UAAU,GAAG,EAA4B,CAAC,EAEpD,IAAI,EAAC,QAAQ,GACf,CACA;KACT,CAAC;GACL;;;;;;;","names":["index","h","isItem","Host","translate","ENTER","ESCAPE"],"sources":["./src/components/action-bar/action-bar.scss?tag=limel-action-bar&encapsulation=shadow","./src/components/action-bar/action-bar.tsx","./src/components/text-editor/link-menu/editor-link-menu.scss?tag=limel-text-editor-link-menu&encapsulation=shadow","./src/components/text-editor/link-menu/editor-link-menu.tsx"],"sourcesContent":["/**\n* @prop --action-bar-item-text-color: Text color of action bar items, defaults to `--contrast-1100`.\n* @prop --action-bar-item-icon-color: Color of the icons displayed on each action bar item. Defaults to the text color. To specify a color for an individual item, use the `iconColor` prop instead.\n* @prop --action-bar-item-max-width: Maximum width of a button in the action bar. Defaults to `10rem`. Keep in mind that the buttons should not appear too big.\n* @prop --action-bar-border-radius: Defines the roundness of the corners of the action bar. Defaults to `0`.\n* @prop --action-bar-background-color: Background color of the whole component. Defaults to `--contrast-100`.\n*/\n\n:host(limel-action-bar) {\n    --action-bar-item-height: 2rem;\n\n    --limel-action-bar-item-text-color: var(\n        --action-bar-item-text-color,\n        rgb(var(--contrast-1100))\n    );\n\n    box-sizing: border-box;\n\n    display: inline-flex;\n    align-items: center;\n    padding: 0.125rem 0.25rem;\n    max-width: 100%;\n    border-radius: var(--action-bar-border-radius);\n\n    background-color: var(\n        --action-bar-background-color,\n        rgb(var(--contrast-100))\n    );\n}\n\n:host(limel-action-bar),\n.items {\n    gap: 0.25rem;\n    @media (pointer: coarse) {\n        gap: 0.5rem;\n    }\n}\n\n.items {\n    display: inline-flex;\n    max-width: 100%;\n    min-width: 0;\n}\n\n:host(limel-action-bar.is-full-width) {\n    width: 100%;\n}\n\n:host(limel-action-bar.is-floating) {\n    --action-bar-border-radius: 100vw;\n    border: 1px solid rgb(var(--contrast-400));\n\n    padding-right: 0.125rem;\n    padding-left: 0.125rem;\n\n    max-width: calc(100% - 2rem);\n    box-shadow: var(--shadow-depth-16), var(--shadow-depth-8);\n}\n","import {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n    State,\n    Element,\n} from '@stencil/core';\nimport { ListSeparator } from '../list/list-item.types';\nimport { MenuItem, OpenDirection } from '../menu/menu.types';\nimport { ActionBarItem } from './action-bar.types';\nimport { isItem } from './isItem';\n\n/**\n * An action bar is a user interface element commonly found in software applications and websites.\n * It typically appears at the top of the screen or within a specific section\n * and serves as a centralized hub for accessing various actions and commands\n * relevant to the current context or page.\n *\n * The action bar often contains a set of clickable icons or buttons (icons + labels)\n * that represent specific actions, such as saving, deleting, editing, sharing,\n * or bulk operations for selected items.\n *\n * The purpose of an action bar is to provide quick and convenient access to\n * frequently used functionalities, enabling users to perform common tasks efficiently.\n * It enhances usability by organizing important actions in a visually prominent and easily accessible location.\n *\n * The action bar's design and layout can vary based on the platform or application,\n * but its primary goal remains consistent—to\n * empower users to interact with the software and perform desired actions effortlessly.\n *\n * @exampleComponent limel-example-action-bar-basic\n * @exampleComponent limel-example-action-bar-overflow-menu\n * @exampleComponent limel-example-action-bar-selected-item\n * @exampleComponent limel-example-action-bar-colors\n * @exampleComponent limel-example-action-bar-floating\n * @exampleComponent limel-example-action-bar-styling\n * @exampleComponent limel-example-action-bar-as-primary-component\n * @exampleComponent limel-example-action-bar-icon-title\n */\n@Component({\n    tag: 'limel-action-bar',\n    shadow: true,\n    styleUrl: 'action-bar.scss',\n})\nexport class ActionBar {\n    /**\n     * Items that are placed in the action bar.\n     * These represent primary actions.\n     */\n    @Prop()\n    public actions: Array<ActionBarItem | ListSeparator> = [];\n\n    /**\n     * A label used to describe the purpose of the element to users\n     * of assistive technologies, like screen readers.\n     * Example value: \"toolbar\"\n     */\n    @Prop({ reflect: true })\n    public accessibleLabel?: string;\n\n    /**\n     * - When set to `fullWidth`, the component will take the\n     * entire width of its container.\n     * - When set to `floating`, the component will get basic stylings\n     * to visualize the floating state.\n     * :::note\n     * You should still properly position the component\n     * according to the structure of your user interface.\n     * For example, use an `absolute` or `fixed` position.\n     * :::\n     */\n    @Prop({ reflect: true })\n    public layout?: 'fullWidth' | 'floating';\n\n    /**\n     * Defines the location that the content of the overflow menu\n     * appears, in relation to its trigger.\n     */\n    @Prop({ reflect: true })\n    public openDirection: OpenDirection;\n\n    /**\n     * Fired when a action bar item has been clicked.\n     * @public\n     */\n    @Event()\n    public itemSelected: EventEmitter<ActionBarItem>;\n\n    @Element()\n    private readonly host: HTMLElement;\n\n    @State()\n    private overflowCutoff: number = this.actions.length;\n\n    private hasRendered = false;\n    private intersectionObserver: IntersectionObserver;\n    private isFirstIntersectionCheck = true;\n    private actionBarItems: HTMLLimelActionBarItemElement[] = [];\n\n    public connectedCallback() {\n        if (this.hasRendered) {\n            this.createIntersectionObserver();\n        }\n    }\n\n    public componentDidRender() {\n        if (this.haveItemsChanged()) {\n            this.intersectionObserver?.disconnect();\n            this.createIntersectionObserver();\n        }\n    }\n\n    public disconnectedCallback() {\n        this.intersectionObserver?.disconnect();\n        this.intersectionObserver = undefined;\n        this.actionBarItems = [];\n    }\n\n    public render() {\n        this.hasRendered = true;\n        let overflowActions: Array<MenuItem | ListSeparator> = [];\n        if (this.actions.length) {\n            overflowActions = this.actions.slice(this.overflowCutoff);\n        }\n\n        return (\n            <Host\n                aria-label={this.accessibleLabel}\n                class={{\n                    'is-full-width': this.layout === 'fullWidth',\n                    'is-floating': this.layout === 'floating',\n                }}\n                role=\"grid\"\n            >\n                <div class=\"items\" role=\"rowgroup\">\n                    {this.actions.map(this.renderActionBarItem)}\n                </div>\n                {this.renderOverflowMenu(overflowActions)}\n            </Host>\n        );\n    }\n\n    private readonly renderActionBarItem = (\n        item: ActionBarItem,\n        index: number,\n    ) => {\n        return (\n            <limel-action-bar-item\n                item={item}\n                onSelect={this.handleSelect}\n                isVisible={this.isVisible(index)}\n                role=\"gridcell\"\n            />\n        );\n    };\n\n    private readonly renderOverflowMenu = (\n        items: Array<MenuItem | ListSeparator>,\n    ) => {\n        if (!(this.actions.length - this.overflowCutoff)) {\n            return;\n        }\n\n        return (\n            <limel-action-bar-overflow-menu\n                openDirection={this.openDirection}\n                items={items}\n                onSelect={this.handleSelect}\n                role=\"gridcell\"\n            />\n        );\n    };\n\n    private isVisible(index: number) {\n        return index < this.overflowCutoff;\n    }\n\n    private readonly handleSelect = (\n        event: CustomEvent<ActionBarItem | ListSeparator>,\n    ) => {\n        event.stopPropagation();\n        if (isItem(event.detail)) {\n            this.itemSelected.emit(event.detail);\n        }\n    };\n\n    private readonly handleIntersection = (\n        entries: IntersectionObserverEntry[],\n    ) => {\n        const intersectingItems = entries.filter(\n            (entry) => entry.isIntersecting,\n        );\n\n        const notIntersectingItems = entries.filter(\n            (entry) => !entry.isIntersecting,\n        );\n\n        if (this.isFirstIntersectionCheck) {\n            this.overflowCutoff = intersectingItems.length;\n        } else {\n            this.overflowCutoff =\n                this.overflowCutoff +\n                intersectingItems.length -\n                notIntersectingItems.length;\n        }\n\n        this.isFirstIntersectionCheck = false;\n    };\n\n    private createIntersectionObserver() {\n        const options = {\n            root: this.host.shadowRoot.querySelector('.items'),\n            rootMargin: '0px',\n            threshold: 1.0,\n        };\n\n        this.overflowCutoff = this.actions.length;\n        this.isFirstIntersectionCheck = true;\n\n        this.actionBarItems = [];\n\n        this.intersectionObserver = new IntersectionObserver(\n            this.handleIntersection,\n            options,\n        );\n\n        this.host.shadowRoot\n            .querySelectorAll('limel-action-bar-item')\n            .forEach((actionBarItem) => {\n                this.observe(actionBarItem);\n            });\n    }\n\n    private observe(actionBarItem: HTMLLimelActionBarItemElement) {\n        this.intersectionObserver.observe(actionBarItem);\n        this.actionBarItems.push(actionBarItem);\n    }\n\n    private haveItemsChanged() {\n        const someItemRemoved = this.actionBarItems.some(\n            (actionBarItem: HTMLLimelActionBarItemElement) =>\n                !this.host.shadowRoot.contains(actionBarItem),\n        );\n\n        const someItemAdded = Array.from(\n            this.host.shadowRoot.querySelectorAll('limel-action-bar-item'),\n        ).some(\n            (actionBarItem: HTMLLimelActionBarItemElement) =>\n                !this.actionBarItems.includes(actionBarItem),\n        );\n\n        return someItemRemoved || someItemAdded;\n    }\n}\n",":host(limel-text-editor-link-menu) {\n    animation: fade 0.2s ease forwards;\n    animation-delay: 0.1s; // prevents the visual glitch when the link opens\n    opacity: 0;\n\n    display: flex;\n    flex-direction: column;\n    gap: 0.5rem;\n    padding: 0.5rem;\n    max-width: calc(100vw - 2rem);\n    border-radius: 0.5rem;\n    background-color: var(--lime-elevated-surface-background-color);\n    box-shadow: var(--shadow-depth-16);\n}\n\n.actions {\n    display: flex;\n    justify-content: end;\n    gap: 0.5rem;\n}\n\n@keyframes fade {\n    0% {\n        scale: 0.86;\n        opacity: 0;\n    }\n    100% {\n        scale: 1;\n        opacity: 1;\n    }\n}\n","import { Component, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { EditorTextLink } from '../prosemirror-adapter/menu/types';\nimport { Languages } from '../../date-picker/date.types';\nimport translate from '../../../global/translations';\nimport { LimelInputFieldCustomEvent } from '../../../components';\nimport { ENTER, ESCAPE } from '../../../util/keycodes';\n\n/**\n * This component is a menu for editing a link in the text editor.\n * It allows the user to input the text and url for the link.\n * @beta\n * @private\n */\n@Component({\n    tag: 'limel-text-editor-link-menu',\n    shadow: true,\n    styleUrl: 'editor-link-menu.scss',\n})\nexport class TextEditorLinkMenu {\n    /**\n     * The link\n     */\n    @Prop({ reflect: true })\n    public link: EditorTextLink;\n\n    /**\n     * Defines the language for translations.\n     */\n    @Prop({ reflect: true })\n    public language: Languages = 'en';\n\n    /**\n     * Open state of the link-menu dialog\n     */\n    @Prop({ reflect: true })\n    public isOpen: boolean = false;\n\n    /**\n     * Emitted when the menu is closed from inside the component.\n     * (*Not* emitted when the consumer sets the `open`-property to `false`.)\n     */\n    @Event()\n    private cancel: EventEmitter<void>;\n\n    /**\n     * Emitted when the menu is saved from inside the component.\n     */\n    @Event()\n    private save: EventEmitter<void>;\n\n    /**\n     * Emitted when the user inputs new values for the link\n     */\n    @Event()\n    private linkChange: EventEmitter<EditorTextLink>;\n\n    private textInput: HTMLLimelInputFieldElement;\n    private saveButton: HTMLLimelButtonElement;\n\n    public connectedCallback() {\n        this.setupGlobalHandlers();\n    }\n\n    public disconnectedCallback() {\n        this.teardownGlobalHandlers();\n    }\n\n    private setupGlobalHandlers() {\n        if (this.isOpen) {\n            document.addEventListener('keyup', this.handleCancel);\n        }\n    }\n\n    private teardownGlobalHandlers() {\n        document.removeEventListener('keyup', this.handleCancel);\n    }\n\n    public componentDidLoad() {\n        this.focusOnTextInput();\n    }\n\n    private focusOnTextInput() {\n        if (this.textInput) {\n            const inputField = this.textInput.shadowRoot.querySelector('input');\n            if (inputField) {\n                requestAnimationFrame(() => {\n                    inputField.focus();\n                });\n            }\n        }\n    }\n\n    public render() {\n        const isValid = this.isValid(this.link.href);\n\n        return [\n            <limel-input-field\n                label={this.getTranslation('editor-link-menu.text')}\n                value={this.link?.text || ''}\n                leadingIcon=\"text_cursor\"\n                onChange={this.handleLinkTitleChange}\n                onKeyDown={this.handleKeyDown}\n                ref={(el) =>\n                    (this.textInput = el as HTMLLimelInputFieldElement)\n                }\n            />,\n            <limel-input-field\n                label={this.getTranslation('editor-link-menu.link')}\n                value={this.link?.href || ''}\n                type=\"text\"\n                leadingIcon=\"-lime-text-link\"\n                trailingIcon=\"external_link\"\n                invalid={!isValid}\n                onChange={this.handleLinkValueChange}\n                onAction={this.handleLinkInputAction}\n                onKeyDown={this.handleKeyDown}\n            />,\n            <div class=\"actions\">\n                <limel-button\n                    label={this.getTranslation('cancel')}\n                    onClick={this.handleCancel}\n                />\n                <limel-button\n                    primary={true}\n                    label={this.getTranslation('save')}\n                    disabled={!isValid}\n                    onClick={this.handleSave}\n                    ref={(el) =>\n                        (this.saveButton = el as HTMLLimelButtonElement)\n                    }\n                    slot=\"button\"\n                />\n            </div>,\n        ];\n    }\n\n    private getTranslation = (key: string) => {\n        return translate.get(key, this.language);\n    };\n\n    private isValid = (href: string): boolean => {\n        try {\n            new URL(href);\n        } catch {\n            return false;\n        }\n\n        return true;\n    };\n\n    private handleKeyDown = (event: KeyboardEvent) => {\n        if (event.key !== ENTER) {\n            return;\n        }\n\n        if (this.saveButton) {\n            this.saveButton.focus();\n        }\n\n        event.preventDefault();\n        if (this.isValid(this.link?.href)) {\n            this.handleSave(event);\n        }\n    };\n\n    private handleCancel = (event: MouseEvent | KeyboardEvent) => {\n        if (event instanceof KeyboardEvent && event.key !== ESCAPE) {\n            return;\n        }\n\n        event.stopPropagation();\n        event.preventDefault();\n        this.cancel.emit();\n    };\n\n    private handleSave = (event: MouseEvent | KeyboardEvent) => {\n        event.stopPropagation();\n\n        this.save.emit();\n    };\n\n    private handleLinkInputAction = (\n        event: LimelInputFieldCustomEvent<void>,\n    ) => {\n        window.open(this.link.href, '_blank');\n        event.stopPropagation();\n    };\n\n    private handleLinkTitleChange = (event: CustomEvent<string>) => {\n        this.emitLinkChange(event.detail, this.link?.href);\n    };\n\n    private handleLinkValueChange = (event: CustomEvent<string>) => {\n        const href = event.detail;\n\n        this.emitLinkChange(this.link?.text, href);\n    };\n\n    private emitLinkChange = (text: string, href: string) => {\n        const newLink: EditorTextLink = {\n            text: text,\n            href: href,\n        };\n\n        this.linkChange.emit(newLink);\n    };\n}\n"],"version":3}
+{"file":"limel-action-bar.limel-text-editor-link-menu.entry.cjs.js","mappings":"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","names":["index","h","isItem","translate","Host","ENTER","ESCAPE"],"sources":["./src/components/action-bar/action-bar.scss?tag=limel-action-bar&encapsulation=shadow","./src/components/action-bar/action-bar.tsx","./src/components/text-editor/link-menu/editor-link-menu.scss?tag=limel-text-editor-link-menu&encapsulation=shadow","./src/components/text-editor/link-menu/editor-link-menu.tsx"],"sourcesContent":["/**\n* @prop --action-bar-item-text-color: Text color of action bar items, defaults to `--contrast-1100`.\n* @prop --action-bar-item-icon-color: Color of the icons displayed on each action bar item. Defaults to the text color. To specify a color for an individual item, use the `iconColor` prop instead.\n* @prop --action-bar-item-max-width: Maximum width of a button in the action bar. Defaults to `10rem`. Keep in mind that the buttons should not appear too big.\n* @prop --action-bar-border-radius: Defines the roundness of the corners of the action bar. Defaults to `0`.\n* @prop --action-bar-background-color: Background color of the whole component. Defaults to `--contrast-100`.\n* @prop --action-bar-shrink-icon-color: Color of the shrink icon. Defaults to `--contrast-1000`.\n\n*/\n\n@use '../../style/mixins';\n\n:host(limel-action-bar) {\n    --action-bar-item-height: 2rem;\n\n    --limel-action-bar-item-text-color: var(\n        --action-bar-item-text-color,\n        rgb(var(--contrast-1100))\n    );\n\n    box-sizing: border-box;\n\n    display: inline-flex;\n    align-items: center;\n    padding: 0.125rem 0.25rem;\n    max-width: 100%;\n    border-radius: var(--action-bar-border-radius);\n\n    background-color: var(\n        --action-bar-background-color,\n        rgb(var(--contrast-100))\n    );\n\n    transition: max-width 0.3s ease;\n}\n\n:host(limel-action-bar),\n.items {\n    gap: 0.25rem;\n    @media (pointer: coarse) {\n        gap: 0.5rem;\n    }\n}\n\n.items {\n    display: inline-flex;\n    max-width: 100%;\n    min-width: 0;\n}\n\n:host(limel-action-bar.is-shrunk) .items {\n    opacity: 0;\n}\n\n:host(limel-action-bar:not(.is-shrunk)) .items {\n    opacity: 1;\n}\n\n:host(limel-action-bar.is-full-width) {\n    width: 100%;\n}\n\n:host(limel-action-bar.is-floating) {\n    --action-bar-border-radius: 100vw;\n    border: 1px solid rgb(var(--contrast-400));\n\n    padding-right: 0.125rem;\n    padding-left: 0.125rem;\n\n    max-width: calc(100% - 2rem);\n    box-shadow: var(--shadow-depth-16), var(--shadow-depth-8);\n}\n\n:host(limel-action-bar.is-shrunk) {\n    max-width: 5rem;\n    transition: max-width 0.3s ease-in-out;\n\n    .expand-shrink {\n        transition: transform 0.3s ease;\n        transform: rotateY(180deg);\n    }\n}\n\n:host(limel-action-bar:not(.is-shrunk)) {\n    max-width: 100%;\n    transition: max-width 0.3s ease-in-out;\n\n    .expand-shrink {\n        transition: transform 0.3s ease;\n        transform: rotateY(0deg);\n    }\n}\n\n:host(limel-action-bar.can-be-shrunk.is-full-width) {\n    .expand-shrink {\n        margin-left: auto;\n    }\n}\n\n.expand-shrink {\n    all: unset;\n    box-sizing: border-box;\n    border-radius: 50%;\n\n    @include mixins.is-flat-clickable();\n    @include mixins.visualize-keyboard-focus;\n\n    display: flex;\n    justify-content: center;\n    align-items: center;\n\n    limel-icon {\n        width: 1.5rem;\n        height: 1.5rem;\n        padding: 0.125rem;\n        color: var(--action-bar-shrink-icon-color, rgb(var(--contrast-1000)));\n    }\n}\n","import {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n    State,\n    Element,\n} from '@stencil/core';\nimport { ListSeparator } from '../list/list-item.types';\nimport { MenuItem, OpenDirection } from '../menu/menu.types';\nimport { ActionBarItem } from './action-bar.types';\nimport { Languages } from './../date-picker/date.types';\nimport translate from './../../global/translations';\nimport { isItem } from './isItem';\nimport { Icon } from '../../global/shared-types/icon.types';\n\n/**\n * An action bar is a user interface element commonly found in software applications and websites.\n * It typically appears at the top of the screen or within a specific section\n * and serves as a centralized hub for accessing various actions and commands\n * relevant to the current context or page.\n *\n * The action bar often contains a set of clickable icons or buttons (icons + labels)\n * that represent specific actions, such as saving, deleting, editing, sharing,\n * or bulk operations for selected items.\n *\n * The purpose of an action bar is to provide quick and convenient access to\n * frequently used functionalities, enabling users to perform common tasks efficiently.\n * It enhances usability by organizing important actions in a visually prominent and easily accessible location.\n *\n * The action bar's design and layout can vary based on the platform or application,\n * but its primary goal remains consistent—to\n * empower users to interact with the software and perform desired actions effortlessly.\n *\n * @exampleComponent limel-example-action-bar-basic\n * @exampleComponent limel-example-action-bar-overflow-menu\n * @exampleComponent limel-example-action-bar-selected-item\n * @exampleComponent limel-example-action-bar-colors\n * @exampleComponent limel-example-action-bar-floating\n * @exampleComponent limel-example-action-bar-floating-expand\n * @exampleComponent limel-example-action-bar-styling\n * @exampleComponent limel-example-action-bar-as-primary-component\n * @exampleComponent limel-example-action-bar-icon-title\n */\n@Component({\n    tag: 'limel-action-bar',\n    shadow: true,\n    styleUrl: 'action-bar.scss',\n})\nexport class ActionBar {\n    /**\n     * Items that are placed in the action bar.\n     * These represent primary actions.\n     */\n    @Prop()\n    public actions: Array<ActionBarItem | ListSeparator> = [];\n\n    /**\n     * Defines the language for translations.\n     */\n    @Prop({ reflect: true })\n    public language: Languages = document.documentElement.lang as Languages;\n\n    /**\n     * A label used to describe the purpose of the element to users\n     * of assistive technologies, like screen readers.\n     * Example value: \"toolbar\"\n     */\n    @Prop({ reflect: true })\n    public accessibleLabel?: string;\n\n    /**\n     * - When set to `fullWidth`, the component will take the\n     * entire width of its container.\n     * - When set to `floating`, the component will get basic stylings\n     * to visualize the floating state.\n     * :::note\n     * You should still properly position the component\n     * according to the structure of your user interface.\n     * For example, use an `absolute` or `fixed` position.\n     * :::\n     */\n    @Prop({ reflect: true })\n    public layout?: 'fullWidth' | 'floating';\n\n    /**\n     * When set to `true`, the action bar will be collapsible.\n     */\n    @Prop({ reflect: true })\n    public collapsible = false;\n\n    /**\n     * Defines the location that the content of the overflow menu\n     * appears, in relation to its trigger.\n     */\n    @Prop({ reflect: true })\n    public openDirection: OpenDirection;\n\n    /**\n     * Fired when a action bar item has been clicked.\n     * @public\n     */\n    @Event()\n    public itemSelected: EventEmitter<ActionBarItem>;\n\n    @Element()\n    private readonly host: HTMLElement;\n\n    @State()\n    private overflowCutoff: number = this.actions.length;\n\n    /**\n     * Indicates whether the action bar is currently in a collapsed state.\n     */\n    @State()\n    private actionBarIsShrunk = false;\n\n    private hasRendered = false;\n    private intersectionObserver: IntersectionObserver;\n    private isFirstIntersectionCheck = true;\n    private actionBarItems: HTMLLimelActionBarItemElement[] = [];\n\n    public connectedCallback() {\n        if (this.hasRendered) {\n            this.createIntersectionObserver();\n        }\n    }\n\n    public componentDidRender() {\n        if (this.haveItemsChanged()) {\n            this.intersectionObserver?.disconnect();\n            this.createIntersectionObserver();\n        }\n    }\n\n    public disconnectedCallback() {\n        this.intersectionObserver?.disconnect();\n        this.intersectionObserver = undefined;\n        this.actionBarItems = [];\n    }\n\n    public render() {\n        this.hasRendered = true;\n        let overflowActions: Array<MenuItem | ListSeparator> = [];\n        if (this.actions.length) {\n            overflowActions = this.actions.slice(this.overflowCutoff);\n        }\n\n        return (\n            <Host\n                aria-label={this.accessibleLabel}\n                class={{\n                    'is-full-width': this.layout === 'fullWidth',\n                    'is-floating': this.layout === 'floating',\n                    'is-shrunk': this.actionBarIsShrunk && this.collapsible,\n                    'can-be-shrunk': !!this.collapsible,\n                }}\n                role=\"grid\"\n            >\n                <div class=\"items\" role=\"rowgroup\">\n                    {this.actions.map(this.renderActionBarItem)}\n                </div>\n                {this.renderOverflowMenu(overflowActions)}\n                {this.renderCollapseExpandButton()}\n            </Host>\n        );\n    }\n\n    private readonly renderActionBarItem = (\n        item: ActionBarItem,\n        index: number,\n    ) => {\n        return (\n            <limel-action-bar-item\n                item={item}\n                onSelect={this.handleSelect}\n                isVisible={this.isVisible(index)}\n                role=\"gridcell\"\n            />\n        );\n    };\n\n    private readonly renderOverflowMenu = (\n        items: Array<MenuItem | ListSeparator>,\n    ) => {\n        if (!(this.actions.length - this.overflowCutoff)) {\n            return;\n        }\n\n        const shrunkOverFlowIcon: Icon = {\n            name: 'more',\n            color: 'rgb(var(--contrast-1000))',\n            title: this.getTranslation('action-bar.actions'),\n        };\n\n        return (\n            <limel-action-bar-overflow-menu\n                openDirection={this.openDirection}\n                items={items}\n                onSelect={this.handleSelect}\n                role=\"gridcell\"\n                overFlowIcon={\n                    this.actionBarIsShrunk ? shrunkOverFlowIcon : undefined\n                }\n            />\n        );\n    };\n\n    private renderCollapseExpandButton() {\n        if (!this.collapsible || this.actions.length <= 1) {\n            return;\n        }\n\n        return (\n            <button\n                class={{\n                    'expand-shrink': true,\n                }}\n                aria-label={this.tooltipLabel}\n                type=\"button\"\n                onClick={this.handleCollapseExpandClick}\n            >\n                <limel-icon\n                    name=\"double_left\"\n                    id=\"tooltip-expand-shrink-button\"\n                />\n                <limel-tooltip\n                    label={this.tooltipLabel}\n                    elementId=\"tooltip-expand-shrink-button\"\n                />\n            </button>\n        );\n    }\n\n    private handleCollapseExpandClick = () => {\n        this.actionBarIsShrunk = !this.actionBarIsShrunk;\n    };\n\n    private isVisible(index: number) {\n        return index < this.overflowCutoff;\n    }\n\n    private readonly handleSelect = (\n        event: CustomEvent<ActionBarItem | ListSeparator>,\n    ) => {\n        event.stopPropagation();\n        if (isItem(event.detail)) {\n            this.itemSelected.emit(event.detail);\n        }\n    };\n\n    private get tooltipLabel() {\n        let key = 'action-bar.collapse';\n        if (this.actionBarIsShrunk) {\n            key = 'action-bar.expand';\n        }\n\n        return this.getTranslation(key);\n    }\n\n    private getTranslation = (key: string) => {\n        return translate.get(key, this.language);\n    };\n\n    private readonly handleIntersection = (\n        entries: IntersectionObserverEntry[],\n    ) => {\n        const intersectingItems = entries.filter(\n            (entry) => entry.isIntersecting,\n        );\n\n        const notIntersectingItems = entries.filter(\n            (entry) => !entry.isIntersecting,\n        );\n\n        if (this.isFirstIntersectionCheck) {\n            this.overflowCutoff = intersectingItems.length;\n        } else {\n            this.overflowCutoff =\n                this.overflowCutoff +\n                intersectingItems.length -\n                notIntersectingItems.length;\n        }\n\n        this.isFirstIntersectionCheck = false;\n    };\n\n    private createIntersectionObserver() {\n        const options = {\n            root: this.host.shadowRoot.querySelector('.items'),\n            rootMargin: '0px',\n            threshold: 1.0,\n        };\n\n        this.overflowCutoff = this.actions.length;\n        this.isFirstIntersectionCheck = true;\n\n        this.actionBarItems = [];\n\n        this.intersectionObserver = new IntersectionObserver(\n            this.handleIntersection,\n            options,\n        );\n\n        this.host.shadowRoot\n            .querySelectorAll('limel-action-bar-item')\n            .forEach((actionBarItem) => {\n                this.observe(actionBarItem);\n            });\n    }\n\n    private observe(actionBarItem: HTMLLimelActionBarItemElement) {\n        this.intersectionObserver.observe(actionBarItem);\n        this.actionBarItems.push(actionBarItem);\n    }\n\n    private haveItemsChanged() {\n        const someItemRemoved = this.actionBarItems.some(\n            (actionBarItem: HTMLLimelActionBarItemElement) =>\n                !this.host.shadowRoot.contains(actionBarItem),\n        );\n\n        const someItemAdded = Array.from(\n            this.host.shadowRoot.querySelectorAll('limel-action-bar-item'),\n        ).some(\n            (actionBarItem: HTMLLimelActionBarItemElement) =>\n                !this.actionBarItems.includes(actionBarItem),\n        );\n\n        return someItemRemoved || someItemAdded;\n    }\n}\n",":host(limel-text-editor-link-menu) {\n    animation: fade 0.2s ease forwards;\n    animation-delay: 0.1s; // prevents the visual glitch when the link opens\n    opacity: 0;\n\n    display: flex;\n    flex-direction: column;\n    gap: 0.5rem;\n    padding: 0.5rem;\n    max-width: calc(100vw - 2rem);\n    border-radius: 0.5rem;\n    background-color: var(--lime-elevated-surface-background-color);\n    box-shadow: var(--shadow-depth-16);\n}\n\n.actions {\n    display: flex;\n    justify-content: end;\n    gap: 0.5rem;\n}\n\n@keyframes fade {\n    0% {\n        scale: 0.86;\n        opacity: 0;\n    }\n    100% {\n        scale: 1;\n        opacity: 1;\n    }\n}\n","import { Component, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { EditorTextLink } from '../prosemirror-adapter/menu/types';\nimport { Languages } from '../../date-picker/date.types';\nimport translate from '../../../global/translations';\nimport { LimelInputFieldCustomEvent } from '../../../components';\nimport { ENTER, ESCAPE } from '../../../util/keycodes';\n\n/**\n * This component is a menu for editing a link in the text editor.\n * It allows the user to input the text and url for the link.\n * @beta\n * @private\n */\n@Component({\n    tag: 'limel-text-editor-link-menu',\n    shadow: true,\n    styleUrl: 'editor-link-menu.scss',\n})\nexport class TextEditorLinkMenu {\n    /**\n     * The link\n     */\n    @Prop({ reflect: true })\n    public link: EditorTextLink;\n\n    /**\n     * Defines the language for translations.\n     */\n    @Prop({ reflect: true })\n    public language: Languages = 'en';\n\n    /**\n     * Open state of the link-menu dialog\n     */\n    @Prop({ reflect: true })\n    public isOpen: boolean = false;\n\n    /**\n     * Emitted when the menu is closed from inside the component.\n     * (*Not* emitted when the consumer sets the `open`-property to `false`.)\n     */\n    @Event()\n    private cancel: EventEmitter<void>;\n\n    /**\n     * Emitted when the menu is saved from inside the component.\n     */\n    @Event()\n    private save: EventEmitter<void>;\n\n    /**\n     * Emitted when the user inputs new values for the link\n     */\n    @Event()\n    private linkChange: EventEmitter<EditorTextLink>;\n\n    private textInput: HTMLLimelInputFieldElement;\n    private saveButton: HTMLLimelButtonElement;\n\n    public connectedCallback() {\n        this.setupGlobalHandlers();\n    }\n\n    public disconnectedCallback() {\n        this.teardownGlobalHandlers();\n    }\n\n    private setupGlobalHandlers() {\n        if (this.isOpen) {\n            document.addEventListener('keyup', this.handleCancel);\n        }\n    }\n\n    private teardownGlobalHandlers() {\n        document.removeEventListener('keyup', this.handleCancel);\n    }\n\n    public componentDidLoad() {\n        this.focusOnTextInput();\n    }\n\n    private focusOnTextInput() {\n        if (this.textInput) {\n            const inputField = this.textInput.shadowRoot.querySelector('input');\n            if (inputField) {\n                requestAnimationFrame(() => {\n                    inputField.focus();\n                });\n            }\n        }\n    }\n\n    public render() {\n        const isValid = this.isValid(this.link.href);\n\n        return [\n            <limel-input-field\n                label={this.getTranslation('editor-link-menu.text')}\n                value={this.link?.text || ''}\n                leadingIcon=\"text_cursor\"\n                onChange={this.handleLinkTitleChange}\n                onKeyDown={this.handleKeyDown}\n                ref={(el) =>\n                    (this.textInput = el as HTMLLimelInputFieldElement)\n                }\n            />,\n            <limel-input-field\n                label={this.getTranslation('editor-link-menu.link')}\n                value={this.link?.href || ''}\n                type=\"text\"\n                leadingIcon=\"-lime-text-link\"\n                trailingIcon=\"external_link\"\n                invalid={!isValid}\n                onChange={this.handleLinkValueChange}\n                onAction={this.handleLinkInputAction}\n                onKeyDown={this.handleKeyDown}\n            />,\n            <div class=\"actions\">\n                <limel-button\n                    label={this.getTranslation('cancel')}\n                    onClick={this.handleCancel}\n                />\n                <limel-button\n                    primary={true}\n                    label={this.getTranslation('save')}\n                    disabled={!isValid}\n                    onClick={this.handleSave}\n                    ref={(el) =>\n                        (this.saveButton = el as HTMLLimelButtonElement)\n                    }\n                    slot=\"button\"\n                />\n            </div>,\n        ];\n    }\n\n    private getTranslation = (key: string) => {\n        return translate.get(key, this.language);\n    };\n\n    private isValid = (href: string): boolean => {\n        try {\n            new URL(href);\n        } catch {\n            return false;\n        }\n\n        return true;\n    };\n\n    private handleKeyDown = (event: KeyboardEvent) => {\n        if (event.key !== ENTER) {\n            return;\n        }\n\n        if (this.saveButton) {\n            this.saveButton.focus();\n        }\n\n        event.preventDefault();\n        if (this.isValid(this.link?.href)) {\n            this.handleSave(event);\n        }\n    };\n\n    private handleCancel = (event: MouseEvent | KeyboardEvent) => {\n        if (event instanceof KeyboardEvent && event.key !== ESCAPE) {\n            return;\n        }\n\n        event.stopPropagation();\n        event.preventDefault();\n        this.cancel.emit();\n    };\n\n    private handleSave = (event: MouseEvent | KeyboardEvent) => {\n        event.stopPropagation();\n\n        this.save.emit();\n    };\n\n    private handleLinkInputAction = (\n        event: LimelInputFieldCustomEvent<void>,\n    ) => {\n        window.open(this.link.href, '_blank');\n        event.stopPropagation();\n    };\n\n    private handleLinkTitleChange = (event: CustomEvent<string>) => {\n        this.emitLinkChange(event.detail, this.link?.href);\n    };\n\n    private handleLinkValueChange = (event: CustomEvent<string>) => {\n        const href = event.detail;\n\n        this.emitLinkChange(this.link?.text, href);\n    };\n\n    private emitLinkChange = (text: string, href: string) => {\n        const newLink: EditorTextLink = {\n            text: text,\n            href: href,\n        };\n\n        this.linkChange.emit(newLink);\n    };\n}\n"],"version":3}

package/dist/cjs/limel-callout.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d1052409.js');
-const translations = require('./translations-b5da5dcd.js');
+const translations = require('./translations-15b2de28.js');
 
 const calloutIcons = {
   note: 'info',

package/dist/cjs/limel-chart.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d1052409.js');
-const translations = require('./translations-b5da5dcd.js');
+const translations = require('./translations-15b2de28.js');
 const randomString = require('./random-string-e8ad4419.js');
 
 const chartCss = "@charset \"UTF-8\";:host(limel-chart){--chart-axis-line-color:var(\n      --limel-chart-axis-line-color,\n      rgb(var(--contrast-900))\n  );box-sizing:border-box;isolation:isolate;display:flex;width:100%;height:100%;min-width:0;min-height:0;padding:var(--limel-chart-padding)}table{all:unset;border-collapse:collapse;border-spacing:0;empty-cells:show;position:relative;display:flex;width:100%;height:100%;min-width:0;min-height:0}table colgroup,table thead,table tbody,table tr,table th,table td{all:unset}table caption,table colgroup,table thead,table tfoot,table th,table td{position:absolute;width:0;height:0;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap}*,*:before,*:after{box-sizing:border-box}.chart{position:relative;flex-grow:1;width:100%;height:100%;min-height:0;min-width:0}.chart:has(.item:hover) .item,.chart:has(.item:focus-visible) .item{opacity:0.4}.item{transition:background-color 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease, opacity 0.4s ease;cursor:help}.item:focus{outline:none}.item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.item:focus-visible,.item:hover{opacity:1 !important}.item[role=button]{cursor:pointer}limel-spinner{margin:auto}:host(limel-chart[type=bar]) .chart,:host(limel-chart[type=dot]) .chart,:host(limel-chart[type=line]) .chart,:host(limel-chart[type=area]) .chart{display:flex;background-color:var(--chart-background-color, transparent)}:host(limel-chart[type=bar]) .item,:host(limel-chart[type=dot]) .item,:host(limel-chart[type=line]) .item,:host(limel-chart[type=area]) .item{position:relative;mix-blend-mode:hard-light}:host(limel-chart[type=bar][orientation=landscape]),:host(limel-chart[type=dot][orientation=landscape]),:host(limel-chart[type=line][orientation=landscape]),:host(limel-chart[type=area][orientation=landscape]){--limel-chart-padding:0.5rem 0.5rem 0.5rem 2rem}:host(limel-chart[type=bar][orientation=landscape]) .chart,:host(limel-chart[type=dot][orientation=landscape]) .chart,:host(limel-chart[type=line][orientation=landscape]) .chart,:host(limel-chart[type=area][orientation=landscape]) .chart{flex-direction:row;align-items:flex-end;overflow:auto hidden;padding:0 0.125rem}:host(limel-chart[type=bar][orientation=landscape]) .item,:host(limel-chart[type=dot][orientation=landscape]) .item,:host(limel-chart[type=line][orientation=landscape]) .item,:host(limel-chart[type=area][orientation=landscape]) .item{min-width:0.5rem;width:inherit}:host(limel-chart[type=bar][orientation=portrait]),:host(limel-chart[type=dot][orientation=portrait]),:host(limel-chart[type=line][orientation=portrait]),:host(limel-chart[type=area][orientation=portrait]){--limel-chart-padding:0.5rem 0.5rem 1rem 0.5rem}:host(limel-chart[type=bar][orientation=portrait]) .chart,:host(limel-chart[type=dot][orientation=portrait]) .chart,:host(limel-chart[type=line][orientation=portrait]) .chart,:host(limel-chart[type=area][orientation=portrait]) .chart{flex-direction:column;overflow:hidden auto;padding:0.125rem 0}:host(limel-chart[type=bar][orientation=portrait]) .item,:host(limel-chart[type=dot][orientation=portrait]) .item,:host(limel-chart[type=line][orientation=portrait]) .item,:host(limel-chart[type=area][orientation=portrait]) .item{min-height:0.5rem;height:inherit}:host(limel-chart[type=pie]) table,:host(limel-chart[type=doughnut]) table,:host(limel-chart[type=ring]) table{min-height:2rem;min-width:2rem}:host(limel-chart[type=pie]) .chart,:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .chart,:host(limel-chart[type=doughnut]) .item,:host(limel-chart[type=ring]) .chart,:host(limel-chart[type=ring]) .item{aspect-ratio:1;display:flex;margin:auto}:host(limel-chart[type=pie]) .chart,:host(limel-chart[type=doughnut]) .chart,:host(limel-chart[type=ring]) .chart{justify-content:center;align-items:center}:host(limel-chart[type=pie]) .chart:before,:host(limel-chart[type=doughnut]) .chart:before,:host(limel-chart[type=ring]) .chart:before{aspect-ratio:1;content:\"\";position:absolute;z-index:0;inset:0;margin:auto;border-radius:50%;max-width:100%;max-height:100%;background-color:var(--chart-background-color, rgb(var(--contrast-200)))}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item,:host(limel-chart[type=ring]) .item{max-width:100%;max-height:100%;border-radius:50%;position:absolute;inset:0}:host(limel-chart[type=bar]) .chart,:host(limel-chart[type=dot]) .chart{gap:0.5rem}:host(limel-chart[type=bar]) .item,:host(limel-chart[type=dot]) .item{display:flex;align-items:center;justify-content:center;border-radius:var(--chart-item-border-radius, 0.125rem)}:host(limel-chart[type=bar]) .item{background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=dot]) .item:before,:host(limel-chart[type=dot]) .item:after{content:\"\";position:absolute;margin:auto;width:0.5rem;height:0.5rem;border-radius:50%}:host(limel-chart[type=dot]) .item::after{background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=dot]) .item.has-start-value:before{background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=bar][orientation=landscape]) .item,:host(limel-chart[type=dot][orientation=landscape]) .item{height:calc(var(--limel-chart-item-size) * 1%);bottom:calc(var(--limel-chart-item-offset) * 1%)}:host(limel-chart[type=bar][orientation=landscape]) .item.has-negative-value-only,:host(limel-chart[type=dot][orientation=landscape]) .item.has-negative-value-only{height:calc(var(--limel-chart-item-size) * -1%);transform-origin:bottom;transform:rotateX(180deg)}:host(limel-chart[type=dot][orientation=landscape]) .item.has-start-value,:host(limel-chart[type=dot][orientation=landscape]) .item:hover,:host(limel-chart[type=dot][orientation=landscape]) .item:focus-visible{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/1px 100% no-repeat}:host(limel-chart[type=dot][orientation=landscape]) .item:before{inset:auto 0 0 0;transform:translateY(50%)}:host(limel-chart[type=dot][orientation=landscape]) .item::after{inset:0 0 auto 0;transform:translateY(-50%)}:host(limel-chart[type=bar][orientation=portrait]) .item,:host(limel-chart[type=dot][orientation=portrait]) .item{width:calc(var(--limel-chart-item-size) * 1%);left:calc(var(--limel-chart-item-offset) * 1%)}:host(limel-chart[type=bar][orientation=portrait]) .item.has-negative-value-only,:host(limel-chart[type=dot][orientation=portrait]) .item.has-negative-value-only{width:calc(var(--limel-chart-item-size) * -1%);transform-origin:left;transform:rotateY(180deg)}:host(limel-chart[type=dot][orientation=portrait]) .item.has-start-value,:host(limel-chart[type=dot][orientation=portrait]) .item:hover,:host(limel-chart[type=dot][orientation=portrait]) .item:focus-visible{background:linear-gradient(to right, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/100% 1px no-repeat}:host(limel-chart[type=dot][orientation=portrait]) .item:before{inset:0 auto 0 0;transform:translateX(-50%)}:host(limel-chart[type=dot][orientation=portrait]) .item:after{inset:0 0 0 auto;transform:translateX(50%)}:host(limel-chart[type=area]) .item,:host(limel-chart[type=line]) .item{position:relative}:host(limel-chart[type=area]) .item:after,:host(limel-chart[type=line]) .item:after{margin:auto;width:0.5rem;height:0.5rem;border-radius:50%;border:1px solid rgb(var(--contrast-100))}:host(limel-chart[type=area]) .item:before,:host(limel-chart[type=line]) .item:before{inset:0}:host(limel-chart[type=area]) .item:after,:host(limel-chart[type=area]) .item:before,:host(limel-chart[type=line]) .item:after,:host(limel-chart[type=line]) .item:before{transition:border-color 0.2s ease, opacity 0.4s ease;content:\"\";position:absolute;background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=area]) .item:hover:after,:host(limel-chart[type=area]) .item:focus-visible:after,:host(limel-chart[type=line]) .item:hover:after,:host(limel-chart[type=line]) .item:focus-visible:after{border-color:transparent}:host(limel-chart[type=line][orientation=landscape]) .item,:host(limel-chart[type=area][orientation=landscape]) .item{height:100%}:host(limel-chart[type=line][orientation=landscape]) .item:after,:host(limel-chart[type=area][orientation=landscape]) .item:after{transform:translateX(-50%) translateY(50%);left:0;bottom:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[type=line][orientation=portrait]) .item,:host(limel-chart[type=area][orientation=portrait]) .item{width:100%}:host(limel-chart[type=line][orientation=portrait]) .item:after,:host(limel-chart[type=area][orientation=portrait]) .item:after{transform:translateX(-50%) translateY(-50%);left:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[type=area]) .item:after{opacity:0}:host(limel-chart[type=area]) .item:hover:after,:host(limel-chart[type=area]) .item:focus-visible:after{opacity:1}:host(limel-chart[type=area]) .item:hover:before,:host(limel-chart[type=area]) .item:focus-visible:before{opacity:0.7}:host(limel-chart[type=area][orientation=landscape]){}:host(limel-chart[type=area][orientation=landscape]) .item:before{clip-path:polygon(0 calc((100 - var(--limel-chart-item-offset)) * 1%), 0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1%), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1%), 100% calc((100 - var(--limel-chart-next-item-offset)) * 1%))}:host(limel-chart[type=area][orientation=portrait]){}:host(limel-chart[type=area][orientation=portrait]) .item:before{clip-path:polygon(calc(var(--limel-chart-item-offset) * 1%) 0, calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%) 0, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1%) 100%, calc(var(--limel-chart-next-item-offset) * 1%) 100%)}:host(limel-chart[type=line]){--limel-chart-line-thickness:0.125rem}:host(limel-chart[type=line]) .item:hover:before{opacity:0.4}:host(limel-chart[type=line][orientation=landscape]){}:host(limel-chart[type=line][orientation=landscape]) .item:hover{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) left/1px 100% no-repeat}:host(limel-chart[type=line][orientation=landscape]) .item:before{clip-path:polygon(0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1%), 0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1% + var(--limel-chart-line-thickness)), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1% + var(--limel-chart-line-thickness)), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1%))}:host(limel-chart[type=line][orientation=portrait]){}:host(limel-chart[type=line][orientation=portrait]) .item:hover{background:linear-gradient(to right, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) top/100% 1px no-repeat}:host(limel-chart[type=line][orientation=portrait]) .item:before{clip-path:polygon(calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%) 0, calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1% + var(--limel-chart-line-thickness)) 0, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1% + var(--limel-chart-line-thickness)) 100%, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1%) 100%)}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item{background:conic-gradient(transparent 0 calc(var(--limel-chart-item-offset) * 1%), var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8))) calc(var(--limel-chart-item-offset) * 1%) calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%), transparent calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%))}:host(limel-chart[type=pie]) .item:focus,:host(limel-chart[type=pie]) .item:focus-visible,:host(limel-chart[type=doughnut]) .item:focus,:host(limel-chart[type=doughnut]) .item:focus-visible{outline:none}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item{pointer-events:none}:host(limel-chart[type=doughnut]) .chart:after{aspect-ratio:1;content:\"\";position:absolute;inset:0;margin:auto;max-width:60%;max-height:60%;border-radius:50%;background-color:rgb(var(--contrast-100))}:host(limel-chart[type=ring]) .chart:after{content:\"\";position:absolute;inset:0;aspect-ratio:1;border-radius:50%;max-height:calc(100% - var(--limel-chart-number-of-items) * 100% / (var(--limel-chart-number-of-items) + 1));max-width:calc(100% - var(--limel-chart-number-of-items) * 100% / (var(--limel-chart-number-of-items) + 1));background-color:var(--limel-chart-background-color, rgb(var(--contrast-200)))}:host(limel-chart[type=ring]) .chart:has(.item:hover) .item,:host(limel-chart[type=ring]) .chart:has(.item:focus-visible) .item{opacity:1;filter:grayscale(1)}:host(limel-chart[type=ring]) .chart:after,:host(limel-chart[type=ring]) .item{margin:auto;border:1px solid var(--limel-chart-background-color, rgb(var(--contrast-400)))}:host(limel-chart[type=ring]) .item{background:conic-gradient(var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8))) 0 calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%), var(--chart-background-color, rgb(var(--contrast-200))) calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%));max-width:calc(100% - var(--limel-chart-item-index) * 100% / (var(--limel-chart-number-of-items) + 1));max-height:calc(100% - var(--limel-chart-item-index) * 100% / (var(--limel-chart-number-of-items) + 1))}:host(limel-chart[type=ring]) .item:focus-visible,:host(limel-chart[type=ring]) .item:hover{filter:grayscale(0) !important}:host(limel-chart[type=stacked-bar]) .chart{display:flex;border-radius:0.25rem;overflow:hidden;background-color:var(--chart-background-color, rgb(var(--contrast-800), 0.2))}:host(limel-chart[type=stacked-bar]) .item{display:flex;border-radius:var(--chart-item-border-radius, 0);background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=stacked-bar]) .item:last-of-type:not(:focus-visible){box-shadow:none !important}:host(limel-chart[type=stacked-bar][orientation=landscape]) .chart{flex-direction:row}:host(limel-chart[type=stacked-bar][orientation=landscape]) .item{min-height:0.5rem;width:calc(var(--limel-chart-item-size) * 1%)}:host(limel-chart[type=stacked-bar][orientation=landscape]) .item:not(:focus-visible){box-shadow:-1px 0 0 0 var(--chart-item-divider-color, rgb(var(--color-white), 0.6)) inset}:host(limel-chart[type=stacked-bar][orientation=portrait]) .chart{flex-direction:column-reverse}:host(limel-chart[type=stacked-bar][orientation=portrait]) .item{min-width:0.5rem;height:calc(var(--limel-chart-item-size) * 1%)}:host(limel-chart[type=stacked-bar][orientation=portrait]) .item:not(:focus-visible){box-shadow:0 -1px 0 0 rgb(var(--color-white), 0.6) inset}:host(limel-chart[type=nps]){--limel-chart-nps-gauge-angel:220deg}:host(limel-chart[type=nps]) table{min-height:4rem;min-width:4rem}:host(limel-chart[type=nps]) .chart{position:relative;display:flex;justify-content:center;align-items:center;aspect-ratio:1;margin:auto;width:unset;height:unset;max-width:100%;max-height:100%;rotate:calc(var(--limel-chart-nps-gauge-angel) / 2 * -1);transform:translate(-15%, -5%)}:host(limel-chart[type=nps]) .chart:before,:host(limel-chart[type=nps]) .chart:after{content:\"\";aspect-ratio:1;position:absolute;border-radius:50%;z-index:-1;min-height:0;min-width:0}:host(limel-chart[type=nps]) .chart:before{height:100%;max-height:100%;background:conic-gradient(rgb(var(--color-coral-default)) 0deg calc(var(--limel-chart-nps-gauge-angel) / 2), rgb(var(--color-amber-light)) calc(var(--limel-chart-nps-gauge-angel) / 2) calc(var(--limel-chart-nps-gauge-angel) * 0.65), rgb(var(--color-lime-light)) calc(var(--limel-chart-nps-gauge-angel) * 0.65) calc(var(--limel-chart-nps-gauge-angel) * 0.85), rgb(var(--color-lime-default)) calc(var(--limel-chart-nps-gauge-angel) * 0.85) var(--limel-chart-nps-gauge-angel), transparent var(--limel-chart-nps-gauge-angel))}:host(limel-chart[type=nps]) .chart:after{height:calc(100% - min(3rem, 20%) * 2);max-height:calc(100% - min(3rem, 20%) * 2);background:conic-gradient(var(--chart-background-color, rgb(var(--contrast-100))) 0deg var(--limel-chart-nps-gauge-angel), transparent var(--limel-chart-nps-gauge-angel))}:host(limel-chart[type=nps]) .item{display:flex;align-items:flex-start;justify-content:center;border-radius:0.5rem;position:absolute;height:calc(50% - min(3rem, 20%) + 0.5rem);width:0.5rem;transform:translateY(-50%) rotate(calc((var(--limel-chart-item-value) + 100) / 200 * var(--limel-chart-nps-gauge-angel)));transform-origin:bottom}:host(limel-chart[type=nps]) .item:hover,:host(limel-chart[type=nps]) .item:focus-visible{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/1px 100% no-repeat}:host(limel-chart[type=nps]) .item:before,:host(limel-chart[type=nps]) .item:after{content:\"\";position:absolute}:host(limel-chart[type=nps]) .item:before{transform:translateY(-60%);width:0.4rem;border-radius:1rem;border-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)));border-style:solid;border-bottom-width:1.75rem;border-right-color:transparent;border-left-color:transparent;border-top-color:transparent}:host(limel-chart[type=nps]) .item:after{border-radius:50%;background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)));aspect-ratio:1;height:clamp(0.75rem, 10%, 1.25rem);border:0.125rem solid rgb(var(--contrast-100), 0.8);box-shadow:var(--shadow-depth-8)}.axises{position:absolute;display:flex;justify-content:space-between;min-height:100%;min-width:100%;height:100%;width:100%}.axis-line{transition:opacity 0.4s ease;position:relative;opacity:0.2;font-size:0.625rem;border-color:var(--limel-chart-axis-line-color)}.axis-line:hover{opacity:0.6;transition-duration:0.2s}.axis-line.zero-line{opacity:0.6;z-index:1}.axis-line limel-badge{--badge-background-color:transparent;--badge-text-color:currentColor;position:absolute;text-align:right;min-width:2rem}:host(limel-chart[orientation=landscape]) .axises{flex-direction:column-reverse}:host(limel-chart[orientation=landscape]) .axis-line{border-bottom:1px solid;transform:translateY(50%)}:host(limel-chart[orientation=landscape]) .axis-line limel-badge{bottom:0;left:-2rem;transform:translateY(50%)}:host(limel-chart[orientation=portrait]) .axises{flex-direction:row}:host(limel-chart[orientation=portrait]) .axis-line{border-left:1px solid;transform:translateX(-50%)}:host(limel-chart[orientation=portrait]) .axis-line limel-badge{bottom:-1rem;right:-1rem}";

package/dist/cjs/limel-chip_2.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-d1052409.js');
 const getIconProps = require('./get-icon-props-65f39e40.js');
 const makeEnterClickable = require('./make-enter-clickable-c116ac4f.js');
-const translations = require('./translations-b5da5dcd.js');
+const translations = require('./translations-15b2de28.js');
 const keycodes = require('./keycodes-8e70d9e0.js');
 const isEmpty = require('./isEmpty-a8de2cef.js');
 const linkHelper = require('./link-helper-14629490.js');

package/dist/cjs/limel-file-viewer.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d1052409.js');
-const translations = require('./translations-b5da5dcd.js');
+const translations = require('./translations-15b2de28.js');
 
 function detectExtension(fileName, url) {
   const pathLike = fileName || url;

package/dist/cjs/limel-file.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d1052409.js');
-const translations = require('./translations-b5da5dcd.js');
+const translations = require('./translations-15b2de28.js');
 const fileMetadata = require('./file-metadata-e309a7a4.js');
 require('./get-icon-props-65f39e40.js');
 

package/dist/cjs/limel-flatpickr-adapter.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d1052409.js');
-const translations = require('./translations-b5da5dcd.js');
+const translations = require('./translations-15b2de28.js');
 const _commonjsHelpers = require('./_commonjsHelpers-0c557e26.js');
 require('./sv-1f9a8edc.js');
 const moment = require('./moment-6b5ef9b3.js');

package/dist/cjs/limel-linear-progress.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d1052409.js');
-const translations = require('./translations-b5da5dcd.js');
+const translations = require('./translations-15b2de28.js');
 
 const linearProgressCss = ":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  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\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      rgb(var(--contrast-1500))\n  )}:host(limel-linear-progress){isolation:isolate;position:relative;overflow:hidden;display:flex;width:100%;height:0.25rem;border-radius:0.25rem;background-color:var(--background-color, rgb(var(--contrast-800), 0.5))}.progress{height:100%;width:var(--percentage, 0%);border-radius:0.25rem;background-color:var(--mdc-theme-primary)}:host(limel-linear-progress[indeterminate]) .progress{background-color:transparent;width:100%}:host(limel-linear-progress[indeterminate]) .progress:before,:host(limel-linear-progress[indeterminate]) .progress:after{will-change:left, right, opacity;content:\"\";position:absolute;inset:0;height:100%;border-radius:0.25rem;opacity:0;background-color:var(--mdc-theme-primary)}:host(limel-linear-progress[indeterminate]) .progress:before{animation:indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite}:host(limel-linear-progress[indeterminate]) .progress:after{animation:indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite 1.15s}@keyframes indeterminate{0%{left:-35%;right:100%;opacity:0}10%,80%{opacity:1}60%{left:100%;right:-90%}100%{left:100%;right:-90%;opacity:0}}@keyframes indeterminate-short{0%{left:-200%;right:100%;opacity:0}10%,80%{opacity:1}60%{left:107%;right:-8%}100%{left:107%;right:-8%;opacity:0}}";
 

package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js

@@ -14,7 +14,7 @@ const isArray = require('./isArray-d188a04f.js');
 const isObjectLike = require('./isObjectLike-3e3f0cba.js');
 const markdownParser = require('./markdown-parser-89b425cf.js');
 const textEditor_types = require('./text-editor.types-5e5567e2.js');
-const translations = require('./translations-b5da5dcd.js');
+const translations = require('./translations-15b2de28.js');
 const randomString = require('./random-string-e8ad4419.js');
 const isItem = require('./isItem-3f8ad629.js');
 const files = require('./files-c08d24d4.js');

package/dist/cjs/limel-snackbar.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d1052409.js');
-const translations = require('./translations-b5da5dcd.js');
+const translations = require('./translations-15b2de28.js');
 const randomString = require('./random-string-e8ad4419.js');
 
 /**