@limetech/lime-elements 37.1.0-next.74 → 37.1.0-next.75

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (29) hide show
  1. package/dist/cjs/lime-elements.cjs.js +1 -1
  2. package/dist/cjs/limel-help-content.cjs.entry.js +33 -0
  3. package/dist/cjs/limel-help-content.cjs.entry.js.map +1 -0
  4. package/dist/cjs/limel-help.cjs.entry.js +38 -0
  5. package/dist/cjs/limel-help.cjs.entry.js.map +1 -0
  6. package/dist/cjs/loader.cjs.js +1 -1
  7. package/dist/collection/collection-manifest.json +2 -0
  8. package/dist/collection/components/help/help-content.js +82 -0
  9. package/dist/collection/components/help/help-content.js.map +1 -0
  10. package/dist/collection/components/help/help.css +84 -0
  11. package/dist/collection/components/help/help.js +145 -0
  12. package/dist/collection/components/help/help.js.map +1 -0
  13. package/dist/collection/components/help/limel-help-content.css +107 -0
  14. package/dist/esm/lime-elements.js +1 -1
  15. package/dist/esm/limel-help-content.entry.js +29 -0
  16. package/dist/esm/limel-help-content.entry.js.map +1 -0
  17. package/dist/esm/limel-help.entry.js +34 -0
  18. package/dist/esm/limel-help.entry.js.map +1 -0
  19. package/dist/esm/loader.js +1 -1
  20. package/dist/lime-elements/lime-elements.esm.js +1 -1
  21. package/dist/lime-elements/lime-elements.esm.js.map +1 -1
  22. package/dist/lime-elements/p-1ca94bcf.entry.js +2 -0
  23. package/dist/lime-elements/p-1ca94bcf.entry.js.map +1 -0
  24. package/dist/lime-elements/p-27f1d404.entry.js +2 -0
  25. package/dist/lime-elements/p-27f1d404.entry.js.map +1 -0
  26. package/dist/types/components/help/help-content.d.ts +15 -0
  27. package/dist/types/components/help/help.d.ts +52 -0
  28. package/dist/types/components.d.ts +166 -0
  29. package/package.json +3 -3
@@ -20,7 +20,7 @@ const patchBrowser = () => {
20
20
  };
21
21
 
22
22
  patchBrowser().then(options => {
23
- return index.bootstrapLazy([["limel-helper-line.cjs",[[1,"limel-helper-line",{"helperText":[513,"helper-text"],"length":[514],"maxLength":[514,"max-length"],"invalid":[516],"helperTextId":[513,"helper-text-id"]}]]],["limel-action-bar.cjs",[[1,"limel-action-bar",{"actions":[16],"accessibleLabel":[513,"accessible-label"],"layout":[513],"openDirection":[513,"open-direction"],"overflowCutoff":[32]}]]],["limel-split-button.cjs",[[1,"limel-split-button",{"label":[513],"primary":[516],"icon":[513],"disabled":[516],"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":[8],"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-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-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],"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-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],"formattedValue":[32],"internalFormat":[32],"showPortal":[32]}]]],["limel-snackbar.cjs",[[1,"limel-snackbar",{"message":[1],"timeout":[2],"actionText":[1,"action-text"],"dismissible":[4],"multiline":[4],"language":[1],"show":[64]}]]],["limel-tab-panel.cjs",[[1,"limel-tab-panel",{"tabs":[1040]}]]],["limel-button-group.cjs",[[1,"limel-button-group",{"value":[16],"disabled":[516],"selectedButtonId":[32]}]]],["limel-collapsible-section.cjs",[[1,"limel-collapsible-section",{"isOpen":[1540,"is-open"],"header":[513],"actions":[16]}]]],["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-file.cjs",[[1,"limel-file",{"value":[16],"label":[513],"required":[516],"disabled":[516],"readonly":[516],"invalid":[516],"accept":[513],"language":[1],"isDraggingOverDropZone":[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-checkbox.cjs",[[1,"limel-checkbox",{"disabled":[516],"readonly":[516],"invalid":[516],"label":[513],"helperText":[513,"helper-text"],"checked":[516],"indeterminate":[516],"required":[516],"modified":[32]}]]],["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-dialog.cjs",[[1,"limel-dialog",{"heading":[1],"fullscreen":[516],"open":[1540],"closingActions":[16]}]]],["limel-progress-flow-item.cjs",[[0,"limel-progress-flow-item",{"item":[16],"disabled":[4],"readonly":[4],"currentStep":[4,"current-step"]}]]],["limel-progress-flow.cjs",[[1,"limel-progress-flow",{"flowItems":[16],"disabled":[4],"readonly":[4]}]]],["limel-shortcut.cjs",[[1,"limel-shortcut",{"icon":[513],"label":[513],"disabled":[516],"badge":[520],"link":[16]}]]],["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-switch.cjs",[[1,"limel-switch",{"label":[513],"disabled":[516],"readonly":[516],"invalid":[516],"value":[516],"helperText":[513,"helper-text"],"fieldId":[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-markdown.cjs",[[1,"limel-markdown",{"value":[1]}]]],["limel-dock-button.cjs",[[0,"limel-dock-button",{"item":[16],"expanded":[516],"useMobileLayout":[516,"use-mobile-layout"],"isOpen":[32]}]]],["limel-color-picker-palette.cjs",[[1,"limel-color-picker-palette",{"value":[513],"label":[513],"helperText":[513,"helper-text"],"required":[516]}]]],["limel-tab-bar.cjs",[[1,"limel-tab-bar",{"tabs":[1040],"canScrollLeft":[32],"canScrollRight":[32]},[[9,"resize","handleWindowResize"]]]]],["limel-header.cjs",[[1,"limel-header",{"icon":[1],"heading":[1],"subheading":[1],"supportingText":[1,"supporting-text"]}]]],["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-icon.cjs",[[1,"limel-icon",{"size":[513],"name":[513],"badge":[516]}]]],["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"]}]]],["limel-chip-set.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],"language":[1],"editMode":[32],"textValue":[32],"blurred":[32],"inputChipIndexSelected":[32],"getEditMode":[64],"setFocus":[64],"emptyInput":[64]}]]],["limel-button.cjs",[[1,"limel-button",{"label":[513],"primary":[516],"outlined":[516],"icon":[513],"disabled":[516],"loading":[516],"loadingFailed":[516,"loading-failed"],"justLoaded":[32]}]]],["limel-circular-progress_2.cjs",[[1,"limel-circular-progress",{"value":[2],"maxValue":[2,"max-value"],"prefix":[513],"suffix":[1],"displayPercentageColors":[4,"display-percentage-colors"],"size":[513]}],[1,"limel-linear-progress",{"value":[514],"indeterminate":[516]}]]],["limel-portal_3.cjs",[[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]}],[1,"limel-portal",{"openDirection":[513,"open-direction"],"position":[513],"containerId":[513,"container-id"],"containerStyle":[16],"parent":[16],"inheritParentWidth":[516,"inherit-parent-width"],"visible":[516],"anchor":[16]}]]],["limel-icon-button.cjs",[[1,"limel-icon-button",{"icon":[513],"elevated":[516],"label":[513],"disabled":[516]}]]],["limel-popover_2.cjs",[[1,"limel-popover",{"open":[4],"openDirection":[513,"open-direction"]}],[1,"limel-popover-surface",{"contentCollection":[16]}]]],["limel-spinner.cjs",[[1,"limel-spinner",{"size":[513],"limeBranded":[4,"lime-branded"]}]]],["limel-badge.cjs",[[1,"limel-badge",{"label":[520]}]]],["limel-input-field_3.cjs",[[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],"isModified":[32],"showCompletions":[32]}],[1,"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-breadcrumbs_3.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],"searcher":[16],"emptyResultMessage":[1,"empty-result-message"],"loadingSubItems":[32],"menuBreadCrumb":[32],"searchValue":[32],"searchResults":[32]}],[1,"limel-breadcrumbs",{"items":[16],"divider":[1]}],[1,"limel-menu-list",{"items":[16],"badgeIcons":[4,"badge-icons"],"iconSize":[1,"icon-size"],"type":[1],"maxLinesSecondaryText":[2,"max-lines-secondary-text"]}]]]], options);
23
+ return index.bootstrapLazy(JSON.parse("[[\"limel-action-bar.cjs\",[[1,\"limel-action-bar\",{\"actions\":[16],\"accessibleLabel\":[513,\"accessible-label\"],\"layout\":[513],\"openDirection\":[513,\"open-direction\"],\"overflowCutoff\":[32]}]]],[\"limel-split-button.cjs\",[[1,\"limel-split-button\",{\"label\":[513],\"primary\":[516],\"icon\":[513],\"disabled\":[516],\"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\":[8],\"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-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-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],\"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-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],\"formattedValue\":[32],\"internalFormat\":[32],\"showPortal\":[32]}]]],[\"limel-snackbar.cjs\",[[1,\"limel-snackbar\",{\"message\":[1],\"timeout\":[2],\"actionText\":[1,\"action-text\"],\"dismissible\":[4],\"multiline\":[4],\"language\":[1],\"show\":[64]}]]],[\"limel-tab-panel.cjs\",[[1,\"limel-tab-panel\",{\"tabs\":[1040]}]]],[\"limel-button-group.cjs\",[[1,\"limel-button-group\",{\"value\":[16],\"disabled\":[516],\"selectedButtonId\":[32]}]]],[\"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-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-file.cjs\",[[1,\"limel-file\",{\"value\":[16],\"label\":[513],\"required\":[516],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"accept\":[513],\"language\":[1],\"isDraggingOverDropZone\":[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-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-shortcut.cjs\",[[1,\"limel-shortcut\",{\"icon\":[513],\"label\":[513],\"disabled\":[516],\"badge\":[520],\"link\":[16]}]]],[\"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-switch.cjs\",[[1,\"limel-switch\",{\"label\":[513],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"value\":[516],\"helperText\":[513,\"helper-text\"],\"fieldId\":[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-dock-button.cjs\",[[0,\"limel-dock-button\",{\"item\":[16],\"expanded\":[516],\"useMobileLayout\":[516,\"use-mobile-layout\"],\"isOpen\":[32]}]]],[\"limel-color-picker-palette.cjs\",[[1,\"limel-color-picker-palette\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516]}]]],[\"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],\"modified\":[32]}]]],[\"limel-header.cjs\",[[1,\"limel-header\",{\"icon\":[1],\"heading\":[1],\"subheading\":[1],\"supportingText\":[1,\"supporting-text\"]}]]],[\"limel-help-content.cjs\",[[1,\"limel-help-content\",{\"value\":[1],\"readMoreLink\":[16]}]]],[\"limel-icon.cjs\",[[1,\"limel-icon\",{\"size\":[513],\"name\":[513],\"badge\":[516]}]]],[\"limel-progress-flow-item.cjs\",[[0,\"limel-progress-flow-item\",{\"item\":[16],\"disabled\":[4],\"readonly\":[4],\"currentStep\":[4,\"current-step\"]}]]],[\"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-helper-line.cjs\",[[1,\"limel-helper-line\",{\"helperText\":[513,\"helper-text\"],\"length\":[514],\"maxLength\":[514,\"max-length\"],\"invalid\":[516],\"helperTextId\":[513,\"helper-text-id\"]}]]],[\"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\"]}]]],[\"limel-chip-set.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],\"language\":[1],\"editMode\":[32],\"textValue\":[32],\"blurred\":[32],\"inputChipIndexSelected\":[32],\"getEditMode\":[64],\"setFocus\":[64],\"emptyInput\":[64]}]]],[\"limel-button.cjs\",[[1,\"limel-button\",{\"label\":[513],\"primary\":[516],\"outlined\":[516],\"icon\":[513],\"disabled\":[516],\"loading\":[516],\"loadingFailed\":[516,\"loading-failed\"],\"justLoaded\":[32]}]]],[\"limel-circular-progress_2.cjs\",[[1,\"limel-circular-progress\",{\"value\":[2],\"maxValue\":[2,\"max-value\"],\"prefix\":[513],\"suffix\":[1],\"displayPercentageColors\":[4,\"display-percentage-colors\"],\"size\":[513]}],[1,\"limel-linear-progress\",{\"value\":[514],\"indeterminate\":[516]}]]],[\"limel-markdown.cjs\",[[1,\"limel-markdown\",{\"value\":[1]}]]],[\"limel-portal_3.cjs\",[[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]}],[1,\"limel-portal\",{\"openDirection\":[513,\"open-direction\"],\"position\":[513],\"containerId\":[513,\"container-id\"],\"containerStyle\":[16],\"parent\":[16],\"inheritParentWidth\":[516,\"inherit-parent-width\"],\"visible\":[516],\"anchor\":[16]}]]],[\"limel-icon-button.cjs\",[[1,\"limel-icon-button\",{\"icon\":[513],\"elevated\":[516],\"label\":[513],\"disabled\":[516]}]]],[\"limel-popover_2.cjs\",[[1,\"limel-popover\",{\"open\":[4],\"openDirection\":[513,\"open-direction\"]}],[1,\"limel-popover-surface\",{\"contentCollection\":[16]}]]],[\"limel-spinner.cjs\",[[1,\"limel-spinner\",{\"size\":[513],\"limeBranded\":[4,\"lime-branded\"]}]]],[\"limel-badge.cjs\",[[1,\"limel-badge\",{\"label\":[520]}]]],[\"limel-input-field_3.cjs\",[[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],\"isModified\":[32],\"showCompletions\":[32]}],[1,\"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-breadcrumbs_3.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],\"searcher\":[16],\"emptyResultMessage\":[1,\"empty-result-message\"],\"loadingSubItems\":[32],\"menuBreadCrumb\":[32],\"searchValue\":[32],\"searchResults\":[32]}],[1,\"limel-breadcrumbs\",{\"items\":[16],\"divider\":[1]}],[1,\"limel-menu-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"],\"type\":[1],\"maxLinesSecondaryText\":[2,\"max-lines-secondary-text\"]}]]]]"), options);
24
24
  });
25
25
 
26
26
  exports.setNonce = index.setNonce;
@@ -0,0 +1,33 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-38eb64b5.js');
6
+
7
+ const limelHelpContentCss = "@charset \"UTF-8\";:host(limel-help-content){display:flex;box-sizing:border-box;flex-direction:column;gap:0.5rem;max-height:30rem}limel-markdown{--limel-overflow-mask-vertical:linear-gradient(\n to bottom,\n transparent 0%,\n black calc(0% + var(--limel-top-edge-fade-height, 1rem)),\n black calc(100% - var(--limel-bottom-edge-fade-height, 1rem)),\n transparent 100%\n );-webkit-mask-image:var(--limel-overflow-mask-vertical);mask-image:var(--limel-overflow-mask-vertical);padding-top:var(--limel-top-edge-fade-height, 1rem);padding-bottom:var(--limel-bottom-edge-fade-height, 1rem);padding-right:1rem;padding-left:1rem;min-height:0;min-width:0;overflow:hidden auto}a{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;position:relative;cursor:pointer;transition:color 0.2s ease;color:rgb(var(--color-blue-default));position:sticky;bottom:0;text-decoration:none;font-size:0.875rem;padding-bottom:0.125rem}a:before{transition:opacity 0.2s ease, transform 0.3s ease-out;content:\"\";position:absolute;inset:auto 0 0 0;width:calc(100% - 0.5rem);margin:auto;height:0.125rem;border-radius:1rem;background-color:currentColor;opacity:0;transform:scale(0.6)}a:hover{color:rgb(var(--color-blue-default))}a:hover:before{opacity:0.3;transform:scale(1)}span{padding:0 1rem 0.5rem 1rem;min-width:0}";
8
+
9
+ const HelpContent = class {
10
+ constructor(hostRef) {
11
+ index.registerInstance(this, hostRef);
12
+ this.renderReadMoreLink = () => {
13
+ var _a, _b, _c, _d;
14
+ if (!this.readMoreLink) {
15
+ return;
16
+ }
17
+ return (index.h("span", null, index.h("a", { href: (_a = this.readMoreLink) === null || _a === void 0 ? void 0 : _a.href, target: (_b = this.readMoreLink) === null || _b === void 0 ? void 0 : _b.target, title: (_c = this.readMoreLink) === null || _c === void 0 ? void 0 : _c.title, tabindex: "0" }, (_d = this.readMoreLink) === null || _d === void 0 ? void 0 : _d.text)));
18
+ };
19
+ this.value = undefined;
20
+ this.readMoreLink = undefined;
21
+ }
22
+ render() {
23
+ return [
24
+ index.h("limel-markdown", { value: this.value }),
25
+ this.renderReadMoreLink(),
26
+ ];
27
+ }
28
+ };
29
+ HelpContent.style = limelHelpContentCss;
30
+
31
+ exports.limel_help_content = HelpContent;
32
+
33
+ //# sourceMappingURL=limel-help-content.cjs.entry.js.map
@@ -0,0 +1 @@
1
+ {"file":"limel-help-content.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,mBAAmB,GAAG,yyCAAyyC;;MCgBxzC,WAAW;;;IAcZ,uBAAkB,GAAG;;MACzB,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;QACpB,OAAO;OACV;MAED,QACIA,sBACIA,eACI,IAAI,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,EAC7B,MAAM,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,MAAM,EACjC,KAAK,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,KAAK,EAC/B,QAAQ,EAAC,GAAG,IAEX,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CACxB,CACD,EACT;KACL,CAAC;;;;EAxBK,MAAM;IACT,OAAO;MACHA,4BAAgB,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI;MACrC,IAAI,CAAC,kBAAkB,EAAE;KAC5B,CAAC;GACL;;;;;;","names":["h"],"sources":["./src/components/help/limel-help-content.scss?tag=limel-help-content&encapsulation=shadow","./src/components/help/help-content.tsx"],"sourcesContent":["@use '../../style/mixins';\n\n:host(limel-help-content) {\n display: flex;\n box-sizing: border-box;\n flex-direction: column;\n gap: 0.5rem;\n\n max-height: 30rem;\n}\n\nlimel-markdown {\n @include mixins.fade-out-overflowed-content-on-edges(vertically);\n\n padding-right: 1rem;\n padding-left: 1rem;\n min-height: 0;\n min-width: 0;\n overflow: hidden auto;\n}\n\na {\n @include mixins.truncate-text;\n @include mixins.hyperlink;\n\n position: sticky;\n bottom: 0;\n\n text-decoration: none;\n font-size: 0.875rem;\n padding-bottom: 0.125rem;\n}\n\nspan {\n padding: 0 1rem 0.5rem 1rem;\n min-width: 0;\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { Link } from '../../interface';\n\n/**\n * Help content\n * This is scrollable content that is placed in the popover of the Help component.\n * Moved here mostly to avoid having inlined styles in the parent component.\n * Since you cannot send styles to the Portal component, we need to have this\n * child component.\n * @private\n */\n@Component({\n tag: 'limel-help-content',\n shadow: true,\n styleUrl: 'limel-help-content.scss',\n})\nexport class HelpContent {\n @Prop()\n public value: string;\n\n @Prop()\n public readMoreLink?: Link;\n\n public render() {\n return [\n <limel-markdown value={this.value} />,\n this.renderReadMoreLink(),\n ];\n }\n\n private renderReadMoreLink = () => {\n if (!this.readMoreLink) {\n return;\n }\n\n return (\n <span>\n <a\n href={this.readMoreLink?.href}\n target={this.readMoreLink?.target}\n title={this.readMoreLink?.title}\n tabindex=\"0\"\n >\n {this.readMoreLink?.text}\n </a>\n </span>\n );\n };\n}\n"],"version":3}
@@ -0,0 +1,38 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-38eb64b5.js');
6
+
7
+ const helpCss = "@charset \"UTF-8\";limel-popover{display:flex;--popover-surface-width:min(calc(100vw - 4rem), 22rem)}button[slot=trigger]{all:unset;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-sizing:border-box;display:flex;align-items:center;justify-content:center;color:rgb(var(--color-sky-default));border-radius:50%;box-shadow:0 0 0 1px rgb(var(--color-sky-lighter), 0.7);width:0.875rem;height:0.875rem;font-size:0.75rem}button[slot=trigger]:hover{color:rgb(var(--color-sky-dark));background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button[slot=trigger]:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}button[slot=trigger]:focus{outline:none}button[slot=trigger]:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}button[slot=trigger].is-open{color:rgb(var(--color-white));background-color:rgb(var(--color-sky-default));box-shadow:var(--button-shadow-inset)}";
8
+
9
+ const Help = class {
10
+ constructor(hostRef) {
11
+ index.registerInstance(this, hostRef);
12
+ this.openPopover = (event) => {
13
+ event.stopPropagation();
14
+ this.isOpen = true;
15
+ };
16
+ this.onPopoverClose = (event) => {
17
+ event.stopPropagation();
18
+ this.isOpen = false;
19
+ };
20
+ this.value = undefined;
21
+ this.trigger = '?';
22
+ this.readMoreLink = undefined;
23
+ this.openDirection = 'top-start';
24
+ this.isOpen = false;
25
+ }
26
+ render() {
27
+ return [
28
+ index.h("limel-popover", { open: this.isOpen, onClose: this.onPopoverClose, openDirection: this.openDirection }, index.h("button", { slot: "trigger", onClick: this.openPopover, class: {
29
+ 'is-open': this.isOpen,
30
+ } }, this.trigger), index.h("limel-help-content", { value: this.value, readMoreLink: this.readMoreLink })),
31
+ ];
32
+ }
33
+ };
34
+ Help.style = helpCss;
35
+
36
+ exports.limel_help = Help;
37
+
38
+ //# sourceMappingURL=limel-help.cjs.entry.js.map
@@ -0,0 +1 @@
1
+ {"file":"limel-help.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,OAAO,GAAG,qmCAAqmC;;MC6BxmC,IAAI;;;IA4DL,gBAAW,GAAG,CAAC,KAAiB;MACpC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;KACtB,CAAC;IAEM,mBAAc,GAAG,CAAC,KAAkB;MACxC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;KACvB,CAAC;;mBArDuB,GAAG;;yBAgBU,WAAW;kBAGhC,KAAK;;EAEf,MAAM;IACT,OAAO;MACHA,2BACI,IAAI,EAAE,IAAI,CAAC,MAAM,EACjB,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,aAAa,EAAE,IAAI,CAAC,aAAa,IAEjCA,oBACI,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE;UACH,SAAS,EAAE,IAAI,CAAC,MAAM;SACzB,IAEA,IAAI,CAAC,OAAO,CACR,EACTA,gCACI,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,YAAY,EAAE,IAAI,CAAC,YAAY,GACjC,CACU;KACnB,CAAC;GACL;;;;;;","names":["h"],"sources":["./src/components/help/help.scss?tag=limel-help&encapsulation=shadow","./src/components/help/help.tsx"],"sourcesContent":["@use '../../style/mixins';\n\nlimel-popover {\n display: flex;\n --popover-surface-width: min(calc(100vw - 4rem), 22rem);\n}\n\nbutton[slot='trigger'] {\n all: unset;\n\n @include mixins.is-flat-clickable(\n $color--hovered: rgb(var(--color-sky-dark)),\n $background-color: var(--lime-elevated-surface-background-color)\n );\n @include mixins.visualize-keyboard-focus;\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n color: rgb(var(--color-sky-default));\n border-radius: 50%;\n box-shadow: 0 0 0 1px rgb(var(--color-sky-lighter), 0.7);\n width: 0.875rem;\n height: 0.875rem;\n font-size: 0.75rem;\n\n &.is-open {\n color: rgb(var(--color-white));\n background-color: rgb(var(--color-sky-default));\n box-shadow: var(--button-shadow-inset);\n }\n}\n","import { Component, h, Prop, State } from '@stencil/core';\nimport { OpenDirection } from '../menu/menu.types';\nimport { Link } from '../../interface';\n\n/**\n * A good design is self-explanatory! However, sometimes concepts are\n * too complex to understand, no matter how well-designed a user interface is.\n * In such cases, contextual help can be a great way to provide users with\n * help precisely where and when users need it.\n *\n * In app interface design, providing contextual help emerges as a viable practice\n * for enhancing user experience and usability.\n * Contextual help serves as a quick-to-access guiding,\n * empowering users to more easily understand and navigate through\n * the intricacies of an application.\n *\n * Using this component designers empower users to grasp the functionality\n * of an app more effortlessly, minimizes the learning curve,\n * transforming complex features into accessible opportunities for exploration.\n * @exampleComponent limel-example-help\n * @exampleComponent limel-example-read-more\n * @exampleComponent limel-example-open-direction\n * @exampleComponent limel-example-placement\n */\n@Component({\n tag: 'limel-help',\n shadow: true,\n styleUrl: 'help.scss',\n})\nexport class Help {\n /**\n * The markdown content that will be displayed in the popover.\n */\n @Prop()\n public value: string;\n\n /**\n * Visualizes the trigger element. Defaults to: **?**\n * :::important\n * Be consistent across the product if you want to change it to a custom character.\n * All instances of the help component should have the same trigger visualization.\n * :::\n */\n @Prop()\n public trigger: string = '?';\n\n /**\n * If supplied, it will render a \"Read more\" link at the bottom of the content.\n * Even though you can add a link anywhere in the content, it is recommended to\n * use the read more link. Because it will always be displayed at the bottom\n * of the popover after the content, does not scroll away with the content,\n * and it will be styled in a consistent way.\n */\n @Prop()\n public readMoreLink?: Link;\n\n /**\n * Decides the popover's location in relation to the trigger.\n */\n @Prop({ reflect: true })\n public openDirection: OpenDirection = 'top-start';\n\n @State()\n private isOpen = false;\n\n public render() {\n return [\n <limel-popover\n open={this.isOpen}\n onClose={this.onPopoverClose}\n openDirection={this.openDirection}\n >\n <button\n slot=\"trigger\"\n onClick={this.openPopover}\n class={{\n 'is-open': this.isOpen,\n }}\n >\n {this.trigger}\n </button>\n <limel-help-content\n value={this.value}\n readMoreLink={this.readMoreLink}\n />\n </limel-popover>,\n ];\n }\n\n private openPopover = (event: MouseEvent) => {\n event.stopPropagation();\n this.isOpen = true;\n };\n\n private onPopoverClose = (event: CustomEvent) => {\n event.stopPropagation();\n this.isOpen = false;\n };\n}\n"],"version":3}
@@ -14,7 +14,7 @@ const patchEsm = () => {
14
14
  const defineCustomElements = (win, options) => {
15
15
  if (typeof window === 'undefined') return Promise.resolve();
16
16
  return patchEsm().then(() => {
17
- return index.bootstrapLazy([["limel-helper-line.cjs",[[1,"limel-helper-line",{"helperText":[513,"helper-text"],"length":[514],"maxLength":[514,"max-length"],"invalid":[516],"helperTextId":[513,"helper-text-id"]}]]],["limel-action-bar.cjs",[[1,"limel-action-bar",{"actions":[16],"accessibleLabel":[513,"accessible-label"],"layout":[513],"openDirection":[513,"open-direction"],"overflowCutoff":[32]}]]],["limel-split-button.cjs",[[1,"limel-split-button",{"label":[513],"primary":[516],"icon":[513],"disabled":[516],"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":[8],"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-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-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],"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-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],"formattedValue":[32],"internalFormat":[32],"showPortal":[32]}]]],["limel-snackbar.cjs",[[1,"limel-snackbar",{"message":[1],"timeout":[2],"actionText":[1,"action-text"],"dismissible":[4],"multiline":[4],"language":[1],"show":[64]}]]],["limel-tab-panel.cjs",[[1,"limel-tab-panel",{"tabs":[1040]}]]],["limel-button-group.cjs",[[1,"limel-button-group",{"value":[16],"disabled":[516],"selectedButtonId":[32]}]]],["limel-collapsible-section.cjs",[[1,"limel-collapsible-section",{"isOpen":[1540,"is-open"],"header":[513],"actions":[16]}]]],["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-file.cjs",[[1,"limel-file",{"value":[16],"label":[513],"required":[516],"disabled":[516],"readonly":[516],"invalid":[516],"accept":[513],"language":[1],"isDraggingOverDropZone":[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-checkbox.cjs",[[1,"limel-checkbox",{"disabled":[516],"readonly":[516],"invalid":[516],"label":[513],"helperText":[513,"helper-text"],"checked":[516],"indeterminate":[516],"required":[516],"modified":[32]}]]],["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-dialog.cjs",[[1,"limel-dialog",{"heading":[1],"fullscreen":[516],"open":[1540],"closingActions":[16]}]]],["limel-progress-flow-item.cjs",[[0,"limel-progress-flow-item",{"item":[16],"disabled":[4],"readonly":[4],"currentStep":[4,"current-step"]}]]],["limel-progress-flow.cjs",[[1,"limel-progress-flow",{"flowItems":[16],"disabled":[4],"readonly":[4]}]]],["limel-shortcut.cjs",[[1,"limel-shortcut",{"icon":[513],"label":[513],"disabled":[516],"badge":[520],"link":[16]}]]],["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-switch.cjs",[[1,"limel-switch",{"label":[513],"disabled":[516],"readonly":[516],"invalid":[516],"value":[516],"helperText":[513,"helper-text"],"fieldId":[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-markdown.cjs",[[1,"limel-markdown",{"value":[1]}]]],["limel-dock-button.cjs",[[0,"limel-dock-button",{"item":[16],"expanded":[516],"useMobileLayout":[516,"use-mobile-layout"],"isOpen":[32]}]]],["limel-color-picker-palette.cjs",[[1,"limel-color-picker-palette",{"value":[513],"label":[513],"helperText":[513,"helper-text"],"required":[516]}]]],["limel-tab-bar.cjs",[[1,"limel-tab-bar",{"tabs":[1040],"canScrollLeft":[32],"canScrollRight":[32]},[[9,"resize","handleWindowResize"]]]]],["limel-header.cjs",[[1,"limel-header",{"icon":[1],"heading":[1],"subheading":[1],"supportingText":[1,"supporting-text"]}]]],["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-icon.cjs",[[1,"limel-icon",{"size":[513],"name":[513],"badge":[516]}]]],["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"]}]]],["limel-chip-set.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],"language":[1],"editMode":[32],"textValue":[32],"blurred":[32],"inputChipIndexSelected":[32],"getEditMode":[64],"setFocus":[64],"emptyInput":[64]}]]],["limel-button.cjs",[[1,"limel-button",{"label":[513],"primary":[516],"outlined":[516],"icon":[513],"disabled":[516],"loading":[516],"loadingFailed":[516,"loading-failed"],"justLoaded":[32]}]]],["limel-circular-progress_2.cjs",[[1,"limel-circular-progress",{"value":[2],"maxValue":[2,"max-value"],"prefix":[513],"suffix":[1],"displayPercentageColors":[4,"display-percentage-colors"],"size":[513]}],[1,"limel-linear-progress",{"value":[514],"indeterminate":[516]}]]],["limel-portal_3.cjs",[[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]}],[1,"limel-portal",{"openDirection":[513,"open-direction"],"position":[513],"containerId":[513,"container-id"],"containerStyle":[16],"parent":[16],"inheritParentWidth":[516,"inherit-parent-width"],"visible":[516],"anchor":[16]}]]],["limel-icon-button.cjs",[[1,"limel-icon-button",{"icon":[513],"elevated":[516],"label":[513],"disabled":[516]}]]],["limel-popover_2.cjs",[[1,"limel-popover",{"open":[4],"openDirection":[513,"open-direction"]}],[1,"limel-popover-surface",{"contentCollection":[16]}]]],["limel-spinner.cjs",[[1,"limel-spinner",{"size":[513],"limeBranded":[4,"lime-branded"]}]]],["limel-badge.cjs",[[1,"limel-badge",{"label":[520]}]]],["limel-input-field_3.cjs",[[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],"isModified":[32],"showCompletions":[32]}],[1,"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-breadcrumbs_3.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],"searcher":[16],"emptyResultMessage":[1,"empty-result-message"],"loadingSubItems":[32],"menuBreadCrumb":[32],"searchValue":[32],"searchResults":[32]}],[1,"limel-breadcrumbs",{"items":[16],"divider":[1]}],[1,"limel-menu-list",{"items":[16],"badgeIcons":[4,"badge-icons"],"iconSize":[1,"icon-size"],"type":[1],"maxLinesSecondaryText":[2,"max-lines-secondary-text"]}]]]], options);
17
+ return index.bootstrapLazy(JSON.parse("[[\"limel-action-bar.cjs\",[[1,\"limel-action-bar\",{\"actions\":[16],\"accessibleLabel\":[513,\"accessible-label\"],\"layout\":[513],\"openDirection\":[513,\"open-direction\"],\"overflowCutoff\":[32]}]]],[\"limel-split-button.cjs\",[[1,\"limel-split-button\",{\"label\":[513],\"primary\":[516],\"icon\":[513],\"disabled\":[516],\"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\":[8],\"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-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-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],\"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-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],\"formattedValue\":[32],\"internalFormat\":[32],\"showPortal\":[32]}]]],[\"limel-snackbar.cjs\",[[1,\"limel-snackbar\",{\"message\":[1],\"timeout\":[2],\"actionText\":[1,\"action-text\"],\"dismissible\":[4],\"multiline\":[4],\"language\":[1],\"show\":[64]}]]],[\"limel-tab-panel.cjs\",[[1,\"limel-tab-panel\",{\"tabs\":[1040]}]]],[\"limel-button-group.cjs\",[[1,\"limel-button-group\",{\"value\":[16],\"disabled\":[516],\"selectedButtonId\":[32]}]]],[\"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-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-file.cjs\",[[1,\"limel-file\",{\"value\":[16],\"label\":[513],\"required\":[516],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"accept\":[513],\"language\":[1],\"isDraggingOverDropZone\":[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-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-shortcut.cjs\",[[1,\"limel-shortcut\",{\"icon\":[513],\"label\":[513],\"disabled\":[516],\"badge\":[520],\"link\":[16]}]]],[\"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-switch.cjs\",[[1,\"limel-switch\",{\"label\":[513],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"value\":[516],\"helperText\":[513,\"helper-text\"],\"fieldId\":[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-dock-button.cjs\",[[0,\"limel-dock-button\",{\"item\":[16],\"expanded\":[516],\"useMobileLayout\":[516,\"use-mobile-layout\"],\"isOpen\":[32]}]]],[\"limel-color-picker-palette.cjs\",[[1,\"limel-color-picker-palette\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516]}]]],[\"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],\"modified\":[32]}]]],[\"limel-header.cjs\",[[1,\"limel-header\",{\"icon\":[1],\"heading\":[1],\"subheading\":[1],\"supportingText\":[1,\"supporting-text\"]}]]],[\"limel-help-content.cjs\",[[1,\"limel-help-content\",{\"value\":[1],\"readMoreLink\":[16]}]]],[\"limel-icon.cjs\",[[1,\"limel-icon\",{\"size\":[513],\"name\":[513],\"badge\":[516]}]]],[\"limel-progress-flow-item.cjs\",[[0,\"limel-progress-flow-item\",{\"item\":[16],\"disabled\":[4],\"readonly\":[4],\"currentStep\":[4,\"current-step\"]}]]],[\"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-helper-line.cjs\",[[1,\"limel-helper-line\",{\"helperText\":[513,\"helper-text\"],\"length\":[514],\"maxLength\":[514,\"max-length\"],\"invalid\":[516],\"helperTextId\":[513,\"helper-text-id\"]}]]],[\"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\"]}]]],[\"limel-chip-set.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],\"language\":[1],\"editMode\":[32],\"textValue\":[32],\"blurred\":[32],\"inputChipIndexSelected\":[32],\"getEditMode\":[64],\"setFocus\":[64],\"emptyInput\":[64]}]]],[\"limel-button.cjs\",[[1,\"limel-button\",{\"label\":[513],\"primary\":[516],\"outlined\":[516],\"icon\":[513],\"disabled\":[516],\"loading\":[516],\"loadingFailed\":[516,\"loading-failed\"],\"justLoaded\":[32]}]]],[\"limel-circular-progress_2.cjs\",[[1,\"limel-circular-progress\",{\"value\":[2],\"maxValue\":[2,\"max-value\"],\"prefix\":[513],\"suffix\":[1],\"displayPercentageColors\":[4,\"display-percentage-colors\"],\"size\":[513]}],[1,\"limel-linear-progress\",{\"value\":[514],\"indeterminate\":[516]}]]],[\"limel-markdown.cjs\",[[1,\"limel-markdown\",{\"value\":[1]}]]],[\"limel-portal_3.cjs\",[[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]}],[1,\"limel-portal\",{\"openDirection\":[513,\"open-direction\"],\"position\":[513],\"containerId\":[513,\"container-id\"],\"containerStyle\":[16],\"parent\":[16],\"inheritParentWidth\":[516,\"inherit-parent-width\"],\"visible\":[516],\"anchor\":[16]}]]],[\"limel-icon-button.cjs\",[[1,\"limel-icon-button\",{\"icon\":[513],\"elevated\":[516],\"label\":[513],\"disabled\":[516]}]]],[\"limel-popover_2.cjs\",[[1,\"limel-popover\",{\"open\":[4],\"openDirection\":[513,\"open-direction\"]}],[1,\"limel-popover-surface\",{\"contentCollection\":[16]}]]],[\"limel-spinner.cjs\",[[1,\"limel-spinner\",{\"size\":[513],\"limeBranded\":[4,\"lime-branded\"]}]]],[\"limel-badge.cjs\",[[1,\"limel-badge\",{\"label\":[520]}]]],[\"limel-input-field_3.cjs\",[[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],\"isModified\":[32],\"showCompletions\":[32]}],[1,\"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-breadcrumbs_3.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],\"searcher\":[16],\"emptyResultMessage\":[1,\"empty-result-message\"],\"loadingSubItems\":[32],\"menuBreadCrumb\":[32],\"searchValue\":[32],\"searchResults\":[32]}],[1,\"limel-breadcrumbs\",{\"items\":[16],\"divider\":[1]}],[1,\"limel-menu-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"],\"type\":[1],\"maxLinesSecondaryText\":[2,\"max-lines-secondary-text\"]}]]]]"), options);
18
18
  });
19
19
  };
20
20
 
@@ -28,6 +28,8 @@
28
28
  "./components/form/form.js",
29
29
  "./components/grid/grid.js",
30
30
  "./components/header/header.js",
31
+ "./components/help/help-content.js",
32
+ "./components/help/help.js",
31
33
  "./components/helper-line/helper-line.js",
32
34
  "./components/icon/icon.js",
33
35
  "./components/icon-button/icon-button.js",
@@ -0,0 +1,82 @@
1
+ import { h } from '@stencil/core';
2
+ /**
3
+ * Help content
4
+ * This is scrollable content that is placed in the popover of the Help component.
5
+ * Moved here mostly to avoid having inlined styles in the parent component.
6
+ * Since you cannot send styles to the Portal component, we need to have this
7
+ * child component.
8
+ * @private
9
+ */
10
+ export class HelpContent {
11
+ constructor() {
12
+ this.renderReadMoreLink = () => {
13
+ var _a, _b, _c, _d;
14
+ if (!this.readMoreLink) {
15
+ return;
16
+ }
17
+ return (h("span", null, h("a", { href: (_a = this.readMoreLink) === null || _a === void 0 ? void 0 : _a.href, target: (_b = this.readMoreLink) === null || _b === void 0 ? void 0 : _b.target, title: (_c = this.readMoreLink) === null || _c === void 0 ? void 0 : _c.title, tabindex: "0" }, (_d = this.readMoreLink) === null || _d === void 0 ? void 0 : _d.text)));
18
+ };
19
+ this.value = undefined;
20
+ this.readMoreLink = undefined;
21
+ }
22
+ render() {
23
+ return [
24
+ h("limel-markdown", { value: this.value }),
25
+ this.renderReadMoreLink(),
26
+ ];
27
+ }
28
+ static get is() { return "limel-help-content"; }
29
+ static get encapsulation() { return "shadow"; }
30
+ static get originalStyleUrls() {
31
+ return {
32
+ "$": ["limel-help-content.scss"]
33
+ };
34
+ }
35
+ static get styleUrls() {
36
+ return {
37
+ "$": ["limel-help-content.css"]
38
+ };
39
+ }
40
+ static get properties() {
41
+ return {
42
+ "value": {
43
+ "type": "string",
44
+ "mutable": false,
45
+ "complexType": {
46
+ "original": "string",
47
+ "resolved": "string",
48
+ "references": {}
49
+ },
50
+ "required": false,
51
+ "optional": false,
52
+ "docs": {
53
+ "tags": [],
54
+ "text": ""
55
+ },
56
+ "attribute": "value",
57
+ "reflect": false
58
+ },
59
+ "readMoreLink": {
60
+ "type": "unknown",
61
+ "mutable": false,
62
+ "complexType": {
63
+ "original": "Link",
64
+ "resolved": "Link",
65
+ "references": {
66
+ "Link": {
67
+ "location": "import",
68
+ "path": "../../interface"
69
+ }
70
+ }
71
+ },
72
+ "required": false,
73
+ "optional": true,
74
+ "docs": {
75
+ "tags": [],
76
+ "text": ""
77
+ }
78
+ }
79
+ };
80
+ }
81
+ }
82
+ //# sourceMappingURL=help-content.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"help-content.js","sourceRoot":"","sources":["../../../src/components/help/help-content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAGnD;;;;;;;GAOG;AAMH,MAAM,OAAO,WAAW;;IAcZ,uBAAkB,GAAG,GAAG,EAAE;;MAC9B,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;QACpB,OAAO;OACV;MAED,OAAO,CACH;QACI,SACI,IAAI,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,EAC7B,MAAM,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,MAAM,EACjC,KAAK,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,KAAK,EAC/B,QAAQ,EAAC,GAAG,IAEX,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CACxB,CACD,CACV,CAAC;IACN,CAAC,CAAC;;;;EAxBK,MAAM;IACT,OAAO;MACH,sBAAgB,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI;MACrC,IAAI,CAAC,kBAAkB,EAAE;KAC5B,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoBJ","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { Link } from '../../interface';\n\n/**\n * Help content\n * This is scrollable content that is placed in the popover of the Help component.\n * Moved here mostly to avoid having inlined styles in the parent component.\n * Since you cannot send styles to the Portal component, we need to have this\n * child component.\n * @private\n */\n@Component({\n tag: 'limel-help-content',\n shadow: true,\n styleUrl: 'limel-help-content.scss',\n})\nexport class HelpContent {\n @Prop()\n public value: string;\n\n @Prop()\n public readMoreLink?: Link;\n\n public render() {\n return [\n <limel-markdown value={this.value} />,\n this.renderReadMoreLink(),\n ];\n }\n\n private renderReadMoreLink = () => {\n if (!this.readMoreLink) {\n return;\n }\n\n return (\n <span>\n <a\n href={this.readMoreLink?.href}\n target={this.readMoreLink?.target}\n title={this.readMoreLink?.title}\n tabindex=\"0\"\n >\n {this.readMoreLink?.text}\n </a>\n </span>\n );\n };\n}\n"]}
@@ -0,0 +1,84 @@
1
+ @charset "UTF-8";
2
+ /**
3
+ * Note! This file is exported to `dist/scss/` in the published
4
+ * node module, for consumer projects to import.
5
+ * That means this file cannot import from any file that isn't
6
+ * also exported, keeping the same relative path.
7
+ *
8
+ * Or, just don't import anything, that works too.
9
+ */
10
+ /**
11
+ * This mixin will mask out the content that is close to
12
+ * the edges of a scrollable area.
13
+ * - If the scrollable content has `overflow-y`, use `vertically`
14
+ * as an argument for `$direction`.
15
+ - If the scrollable content has `overflow-x`, use `horizontally`
16
+ * as an argument for `$direction`.
17
+ *
18
+ * For the visual effect to work smoothly, we need to make sure that
19
+ * the size of the fade-out edge effect is the same as the
20
+ * internal paddings of the scrollable area. Otherwise, content of a
21
+ * scrollable area that does not have a padding will fade out before
22
+ * any scrolling has been done.
23
+ * This is why this mixin already adds paddings, which automatically
24
+ * default to the size of the fade-out effect.
25
+ * This size defaults to `1rem`, but to override the size use
26
+ * `--limel-top-edge-fade-height` & `--limel-bottom-edge-fade-height`
27
+ * when `vertically` argument is set, and use
28
+ * `--limel-left-edge-fade-width` & `--limel-right-edge-fade-width`
29
+ * when `horizontally` argument is set.
30
+ * Of course you can also programmatically increase and decrease the
31
+ * size of these variables for each edge, based on the amount of
32
+ * scrolling that has been done by the user. In this case, make sure
33
+ * to add a custom padding where the mixin is used, to override
34
+ * the paddings that are automatically added by the mixin in the
35
+ * compiled CSS code.
36
+ */
37
+ /**
38
+ * This mixin will add an animated underline to the bottom of an `a` elements.
39
+ * Note that you may need to add `all: unset;` –depending on your use case–
40
+ * before using this mixin.
41
+ */
42
+ limel-popover {
43
+ display: flex;
44
+ --popover-surface-width: min(calc(100vw - 4rem), 22rem);
45
+ }
46
+
47
+ button[slot=trigger] {
48
+ all: unset;
49
+ transition: color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;
50
+ cursor: pointer;
51
+ color: var(--mdc-theme-on-surface);
52
+ background-color: var(--lime-elevated-surface-background-color);
53
+ box-sizing: border-box;
54
+ display: flex;
55
+ align-items: center;
56
+ justify-content: center;
57
+ color: rgb(var(--color-sky-default));
58
+ border-radius: 50%;
59
+ box-shadow: 0 0 0 1px rgb(var(--color-sky-lighter), 0.7);
60
+ width: 0.875rem;
61
+ height: 0.875rem;
62
+ font-size: 0.75rem;
63
+ }
64
+ button[slot=trigger]:hover {
65
+ color: rgb(var(--color-sky-dark));
66
+ background-color: var(--lime-elevated-surface-background-color);
67
+ box-shadow: var(--button-shadow-hovered);
68
+ }
69
+ button[slot=trigger]:active {
70
+ box-shadow: var(--button-shadow-pressed);
71
+ transform: translate3d(0, 0.08rem, 0);
72
+ }
73
+ button[slot=trigger]:focus {
74
+ outline: none;
75
+ }
76
+ button[slot=trigger]:focus-visible {
77
+ outline: none;
78
+ box-shadow: var(--shadow-depth-8-focused);
79
+ }
80
+ button[slot=trigger].is-open {
81
+ color: rgb(var(--color-white));
82
+ background-color: rgb(var(--color-sky-default));
83
+ box-shadow: var(--button-shadow-inset);
84
+ }
@@ -0,0 +1,145 @@
1
+ import { h } from '@stencil/core';
2
+ /**
3
+ * A good design is self-explanatory! However, sometimes concepts are
4
+ * too complex to understand, no matter how well-designed a user interface is.
5
+ * In such cases, contextual help can be a great way to provide users with
6
+ * help precisely where and when users need it.
7
+ *
8
+ * In app interface design, providing contextual help emerges as a viable practice
9
+ * for enhancing user experience and usability.
10
+ * Contextual help serves as a quick-to-access guiding,
11
+ * empowering users to more easily understand and navigate through
12
+ * the intricacies of an application.
13
+ *
14
+ * Using this component designers empower users to grasp the functionality
15
+ * of an app more effortlessly, minimizes the learning curve,
16
+ * transforming complex features into accessible opportunities for exploration.
17
+ * @exampleComponent limel-example-help
18
+ * @exampleComponent limel-example-read-more
19
+ * @exampleComponent limel-example-open-direction
20
+ * @exampleComponent limel-example-placement
21
+ */
22
+ export class Help {
23
+ constructor() {
24
+ this.openPopover = (event) => {
25
+ event.stopPropagation();
26
+ this.isOpen = true;
27
+ };
28
+ this.onPopoverClose = (event) => {
29
+ event.stopPropagation();
30
+ this.isOpen = false;
31
+ };
32
+ this.value = undefined;
33
+ this.trigger = '?';
34
+ this.readMoreLink = undefined;
35
+ this.openDirection = 'top-start';
36
+ this.isOpen = false;
37
+ }
38
+ render() {
39
+ return [
40
+ h("limel-popover", { open: this.isOpen, onClose: this.onPopoverClose, openDirection: this.openDirection }, h("button", { slot: "trigger", onClick: this.openPopover, class: {
41
+ 'is-open': this.isOpen,
42
+ } }, this.trigger), h("limel-help-content", { value: this.value, readMoreLink: this.readMoreLink })),
43
+ ];
44
+ }
45
+ static get is() { return "limel-help"; }
46
+ static get encapsulation() { return "shadow"; }
47
+ static get originalStyleUrls() {
48
+ return {
49
+ "$": ["help.scss"]
50
+ };
51
+ }
52
+ static get styleUrls() {
53
+ return {
54
+ "$": ["help.css"]
55
+ };
56
+ }
57
+ static get properties() {
58
+ return {
59
+ "value": {
60
+ "type": "string",
61
+ "mutable": false,
62
+ "complexType": {
63
+ "original": "string",
64
+ "resolved": "string",
65
+ "references": {}
66
+ },
67
+ "required": false,
68
+ "optional": false,
69
+ "docs": {
70
+ "tags": [],
71
+ "text": "The markdown content that will be displayed in the popover."
72
+ },
73
+ "attribute": "value",
74
+ "reflect": false
75
+ },
76
+ "trigger": {
77
+ "type": "string",
78
+ "mutable": false,
79
+ "complexType": {
80
+ "original": "string",
81
+ "resolved": "string",
82
+ "references": {}
83
+ },
84
+ "required": false,
85
+ "optional": false,
86
+ "docs": {
87
+ "tags": [],
88
+ "text": "Visualizes the trigger element. Defaults to: **?**\n:::important\nBe consistent across the product if you want to change it to a custom character.\nAll instances of the help component should have the same trigger visualization.\n:::"
89
+ },
90
+ "attribute": "trigger",
91
+ "reflect": false,
92
+ "defaultValue": "'?'"
93
+ },
94
+ "readMoreLink": {
95
+ "type": "unknown",
96
+ "mutable": false,
97
+ "complexType": {
98
+ "original": "Link",
99
+ "resolved": "Link",
100
+ "references": {
101
+ "Link": {
102
+ "location": "import",
103
+ "path": "../../interface"
104
+ }
105
+ }
106
+ },
107
+ "required": false,
108
+ "optional": true,
109
+ "docs": {
110
+ "tags": [],
111
+ "text": "If supplied, it will render a \"Read more\" link at the bottom of the content.\nEven though you can add a link anywhere in the content, it is recommended to\nuse the read more link. Because it will always be displayed at the bottom\nof the popover after the content, does not scroll away with the content,\nand it will be styled in a consistent way."
112
+ }
113
+ },
114
+ "openDirection": {
115
+ "type": "string",
116
+ "mutable": false,
117
+ "complexType": {
118
+ "original": "OpenDirection",
119
+ "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
120
+ "references": {
121
+ "OpenDirection": {
122
+ "location": "import",
123
+ "path": "../menu/menu.types"
124
+ }
125
+ }
126
+ },
127
+ "required": false,
128
+ "optional": false,
129
+ "docs": {
130
+ "tags": [],
131
+ "text": "Decides the popover's location in relation to the trigger."
132
+ },
133
+ "attribute": "open-direction",
134
+ "reflect": true,
135
+ "defaultValue": "'top-start'"
136
+ }
137
+ };
138
+ }
139
+ static get states() {
140
+ return {
141
+ "isOpen": {}
142
+ };
143
+ }
144
+ }
145
+ //# sourceMappingURL=help.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"help.js","sourceRoot":"","sources":["../../../src/components/help/help.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAI1D;;;;;;;;;;;;;;;;;;;GAmBG;AAMH,MAAM,OAAO,IAAI;;IA4DL,gBAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;MACxC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;IACvB,CAAC,CAAC;IAEM,mBAAc,GAAG,CAAC,KAAkB,EAAE,EAAE;MAC5C,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;IACxB,CAAC,CAAC;;mBArDuB,GAAG;;yBAgBU,WAAW;kBAGhC,KAAK;;EAEf,MAAM;IACT,OAAO;MACH,qBACI,IAAI,EAAE,IAAI,CAAC,MAAM,EACjB,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,aAAa,EAAE,IAAI,CAAC,aAAa;QAEjC,cACI,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE;YACH,SAAS,EAAE,IAAI,CAAC,MAAM;WACzB,IAEA,IAAI,CAAC,OAAO,CACR;QACT,0BACI,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,YAAY,EAAE,IAAI,CAAC,YAAY,GACjC,CACU;KACnB,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAWJ","sourcesContent":["import { Component, h, Prop, State } from '@stencil/core';\nimport { OpenDirection } from '../menu/menu.types';\nimport { Link } from '../../interface';\n\n/**\n * A good design is self-explanatory! However, sometimes concepts are\n * too complex to understand, no matter how well-designed a user interface is.\n * In such cases, contextual help can be a great way to provide users with\n * help precisely where and when users need it.\n *\n * In app interface design, providing contextual help emerges as a viable practice\n * for enhancing user experience and usability.\n * Contextual help serves as a quick-to-access guiding,\n * empowering users to more easily understand and navigate through\n * the intricacies of an application.\n *\n * Using this component designers empower users to grasp the functionality\n * of an app more effortlessly, minimizes the learning curve,\n * transforming complex features into accessible opportunities for exploration.\n * @exampleComponent limel-example-help\n * @exampleComponent limel-example-read-more\n * @exampleComponent limel-example-open-direction\n * @exampleComponent limel-example-placement\n */\n@Component({\n tag: 'limel-help',\n shadow: true,\n styleUrl: 'help.scss',\n})\nexport class Help {\n /**\n * The markdown content that will be displayed in the popover.\n */\n @Prop()\n public value: string;\n\n /**\n * Visualizes the trigger element. Defaults to: **?**\n * :::important\n * Be consistent across the product if you want to change it to a custom character.\n * All instances of the help component should have the same trigger visualization.\n * :::\n */\n @Prop()\n public trigger: string = '?';\n\n /**\n * If supplied, it will render a \"Read more\" link at the bottom of the content.\n * Even though you can add a link anywhere in the content, it is recommended to\n * use the read more link. Because it will always be displayed at the bottom\n * of the popover after the content, does not scroll away with the content,\n * and it will be styled in a consistent way.\n */\n @Prop()\n public readMoreLink?: Link;\n\n /**\n * Decides the popover's location in relation to the trigger.\n */\n @Prop({ reflect: true })\n public openDirection: OpenDirection = 'top-start';\n\n @State()\n private isOpen = false;\n\n public render() {\n return [\n <limel-popover\n open={this.isOpen}\n onClose={this.onPopoverClose}\n openDirection={this.openDirection}\n >\n <button\n slot=\"trigger\"\n onClick={this.openPopover}\n class={{\n 'is-open': this.isOpen,\n }}\n >\n {this.trigger}\n </button>\n <limel-help-content\n value={this.value}\n readMoreLink={this.readMoreLink}\n />\n </limel-popover>,\n ];\n }\n\n private openPopover = (event: MouseEvent) => {\n event.stopPropagation();\n this.isOpen = true;\n };\n\n private onPopoverClose = (event: CustomEvent) => {\n event.stopPropagation();\n this.isOpen = false;\n };\n}\n"]}