@simplysm/angular 14.2.8 → 14.2.9

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 (43) hide show
  1. package/dist/controls/button/sd-additional-button.js +1 -1
  2. package/dist/controls/button/sd-anchor.js +1 -1
  3. package/dist/controls/button/sd-button.js +1 -1
  4. package/dist/controls/button/sd-modal-select-button.js +1 -1
  5. package/dist/controls/checkbox/sd-checkbox.js +1 -1
  6. package/dist/controls/checkbox/sd-switch.js +1 -1
  7. package/dist/controls/dropdown/sd-dropdown-popup.js +1 -1
  8. package/dist/controls/gap/sd-gap.js +1 -1
  9. package/dist/controls/input/sd-date-range-picker.js +1 -1
  10. package/dist/controls/input/sd-numpad.js +1 -1
  11. package/dist/controls/input/sd-range.js +1 -1
  12. package/dist/controls/input/sd-textarea.js +1 -1
  13. package/dist/controls/input/sd-textfield.js +1 -1
  14. package/dist/controls/list/sd-list-item.js +2 -2
  15. package/dist/controls/list/sd-list.js +1 -1
  16. package/dist/controls/pagination/sd-pagination.js +1 -1
  17. package/dist/controls/select/sd-select-button.js +1 -1
  18. package/dist/controls/select/sd-select-item.js +1 -1
  19. package/dist/controls/select/sd-select.js +1 -1
  20. package/dist/controls/tab/sd-tab-item.js +1 -1
  21. package/dist/controls/tab/sd-tab.js +1 -1
  22. package/dist/core/busy/sd-busy-container.js +1 -1
  23. package/dist/core/modal/sd-modal.js +1 -1
  24. package/dist/core/toast/sd-toast-container.js +1 -1
  25. package/dist/core/toast/sd-toast.js +1 -1
  26. package/dist/data/kanban/sd-kanban-board.js +1 -1
  27. package/dist/data/kanban/sd-kanban-lane.js +1 -1
  28. package/dist/data/kanban/sd-kanban.js +1 -1
  29. package/dist/data/permission-table/sd-permission-table.js +1 -1
  30. package/dist/data/sheet/sd-sheet.js +1 -1
  31. package/dist/data/state-preset/sd-state-preset.js +1 -1
  32. package/dist/features/editor/sd-markdown-editor.js +1 -1
  33. package/dist/features/editor/sd-tiptap-editor.js +1 -1
  34. package/dist/features/visual/sd-calendar.js +1 -1
  35. package/dist/features/visual/sd-label.js +1 -1
  36. package/dist/features/visual/sd-note.js +1 -1
  37. package/dist/features/visual/sd-progress.js +1 -1
  38. package/dist/layout/sidebar/sd-sidebar-container.js +1 -1
  39. package/dist/layout/sidebar/sd-sidebar-user.js +1 -1
  40. package/dist/layout/sidebar/sd-sidebar.js +1 -1
  41. package/dist/layout/topbar/sd-topbar-menu.js +1 -1
  42. package/dist/layout/topbar/sd-topbar.js +1 -1
  43. package/package.json +24 -24
@@ -18,7 +18,7 @@ export class SdAdditionalButton {
18
18
  i0.ɵɵprojection(3, 1);
19
19
  i0.ɵɵprojection(4, 2);
20
20
  i0.ɵɵdomElementEnd();
21
- } }, styles: ["sd-additional-button {\n border: 1px solid var(--sd-bd-soft);\n border-radius: var(--sd-radius-default);\n overflow: hidden;\n}\nsd-additional-button > ._content {\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n}\nsd-additional-button > ._button {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n}\n@supports not (appearance: auto) {\n sd-additional-button > ._button.gap-xxs {\n gap: 0;\n }\n sd-additional-button > ._button.gap-xxs > * + * {\n margin-left: var(--sd-gap-xxs);\n }\n sd-additional-button > ._button.gap-xs {\n gap: 0;\n }\n sd-additional-button > ._button.gap-xs > * + * {\n margin-left: var(--sd-gap-xs);\n }\n sd-additional-button > ._button.gap-sm {\n gap: 0;\n }\n sd-additional-button > ._button.gap-sm > * + * {\n margin-left: var(--sd-gap-sm);\n }\n sd-additional-button > ._button.gap-default {\n gap: 0;\n }\n sd-additional-button > ._button.gap-default > * + * {\n margin-left: var(--sd-gap-default);\n }\n sd-additional-button > ._button.gap-lg {\n gap: 0;\n }\n sd-additional-button > ._button.gap-lg > * + * {\n margin-left: var(--sd-gap-lg);\n }\n sd-additional-button > ._button.gap-xl {\n gap: 0;\n }\n sd-additional-button > ._button.gap-xl > * + * {\n margin-left: var(--sd-gap-xl);\n }\n sd-additional-button > ._button.gap-xxl {\n gap: 0;\n }\n sd-additional-button > ._button.gap-xxl > * + * {\n margin-left: var(--sd-gap-xxl);\n }\n sd-additional-button > ._button.gap-0 {\n gap: 0;\n }\n sd-additional-button > ._button.gap-0 > * + * {\n margin-left: var(--sd-gap-0);\n }\n sd-additional-button > ._button.gap-auto {\n gap: 0;\n }\n sd-additional-button > ._button.gap-auto > * + * {\n margin-left: var(--sd-gap-auto);\n }\n}\nsd-additional-button > ._button > sd-anchor {\n padding: var(--sd-gap-sm) !important;\n}\nsd-additional-button > ._button > sd-button > button {\n border-left: 1px solid var(--sd-bd-hairline) !important;\n padding: var(--sd-gap-sm) !important;\n height: 100%;\n}\nsd-additional-button[data-sd-inset=true] {\n border-radius: 0;\n border: none;\n}\nsd-additional-button[data-sd-size=sm] > ._content {\n padding: var(--sd-gap-xs) var(--sd-gap-default);\n}\nsd-additional-button[data-sd-size=sm] > ._button > sd-anchor {\n padding: var(--sd-gap-xs) var(--sd-gap-sm) !important;\n}\nsd-additional-button[data-sd-size=sm] > ._button > sd-button > button {\n padding: var(--sd-gap-xs) var(--sd-gap-sm) !important;\n}\nsd-additional-button[data-sd-size=lg] > ._content {\n padding: var(--sd-gap-default) var(--sd-gap-xl);\n}\nsd-additional-button[data-sd-size=lg] > ._button > sd-anchor {\n padding: var(--sd-gap-default) !important;\n}\nsd-additional-button[data-sd-size=lg] > ._button > sd-button > button {\n padding: var(--sd-gap-default) !important;\n}"], encapsulation: 2 });
21
+ } }, styles: ["sd-additional-button {\n border: 1px solid var(--%NS%sd-bd-soft);\n border-radius: var(--%NS%sd-radius-default);\n overflow: hidden;\n}\nsd-additional-button > ._content {\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n}\nsd-additional-button > ._button {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n}\n@supports not (appearance: auto) {\n sd-additional-button > ._button.gap-xxs {\n gap: 0;\n }\n sd-additional-button > ._button.gap-xxs > * + * {\n margin-left: var(--%NS%sd-gap-xxs);\n }\n sd-additional-button > ._button.gap-xs {\n gap: 0;\n }\n sd-additional-button > ._button.gap-xs > * + * {\n margin-left: var(--%NS%sd-gap-xs);\n }\n sd-additional-button > ._button.gap-sm {\n gap: 0;\n }\n sd-additional-button > ._button.gap-sm > * + * {\n margin-left: var(--%NS%sd-gap-sm);\n }\n sd-additional-button > ._button.gap-default {\n gap: 0;\n }\n sd-additional-button > ._button.gap-default > * + * {\n margin-left: var(--%NS%sd-gap-default);\n }\n sd-additional-button > ._button.gap-lg {\n gap: 0;\n }\n sd-additional-button > ._button.gap-lg > * + * {\n margin-left: var(--%NS%sd-gap-lg);\n }\n sd-additional-button > ._button.gap-xl {\n gap: 0;\n }\n sd-additional-button > ._button.gap-xl > * + * {\n margin-left: var(--%NS%sd-gap-xl);\n }\n sd-additional-button > ._button.gap-xxl {\n gap: 0;\n }\n sd-additional-button > ._button.gap-xxl > * + * {\n margin-left: var(--%NS%sd-gap-xxl);\n }\n sd-additional-button > ._button.gap-0 {\n gap: 0;\n }\n sd-additional-button > ._button.gap-0 > * + * {\n margin-left: var(--%NS%sd-gap-0);\n }\n sd-additional-button > ._button.gap-auto {\n gap: 0;\n }\n sd-additional-button > ._button.gap-auto > * + * {\n margin-left: var(--%NS%sd-gap-auto);\n }\n}\nsd-additional-button > ._button > sd-anchor {\n padding: var(--%NS%sd-gap-sm) !important;\n}\nsd-additional-button > ._button > sd-button > button {\n border-left: 1px solid var(--%NS%sd-bd-hairline) !important;\n padding: var(--%NS%sd-gap-sm) !important;\n height: 100%;\n}\nsd-additional-button[data-sd-inset=true] {\n border-radius: 0;\n border: none;\n}\nsd-additional-button[data-sd-size=sm] > ._content {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-default);\n}\nsd-additional-button[data-sd-size=sm] > ._button > sd-anchor {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm) !important;\n}\nsd-additional-button[data-sd-size=sm] > ._button > sd-button > button {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm) !important;\n}\nsd-additional-button[data-sd-size=lg] > ._content {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-xl);\n}\nsd-additional-button[data-sd-size=lg] > ._button > sd-anchor {\n padding: var(--%NS%sd-gap-default) !important;\n}\nsd-additional-button[data-sd-size=lg] > ._button > sd-button > button {\n padding: var(--%NS%sd-gap-default) !important;\n}"], encapsulation: 2 });
22
22
  }
23
23
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdAdditionalButton, [{
24
24
  type: Component,
@@ -11,7 +11,7 @@ export class SdAnchor {
11
11
  } }, inputs: { disabled: [1, "disabled"], theme: [1, "theme"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdAnchor_Template(rf, ctx) { if (rf & 1) {
12
12
  i0.ɵɵprojectionDef();
13
13
  i0.ɵɵprojection(0);
14
- } }, styles: ["sd-anchor {\n display: inline-block;\n cursor: pointer;\n}\nsd-anchor[data-sd-theme=gray] {\n color: var(--sd-tx-gray);\n}\nsd-anchor[data-sd-theme=gray]:hover {\n color: var(--sd-tx-gray-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=gray]:active {\n color: var(--sd-tx-gray);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=gray]:hover {\n color: var(--sd-tx-gray);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=blue-gray] {\n color: var(--sd-tx-blue-gray);\n}\nsd-anchor[data-sd-theme=blue-gray]:hover {\n color: var(--sd-tx-blue-gray-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=blue-gray]:active {\n color: var(--sd-tx-blue-gray);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=blue-gray]:hover {\n color: var(--sd-tx-blue-gray);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=primary] {\n color: var(--sd-tx-primary);\n}\nsd-anchor[data-sd-theme=primary]:hover {\n color: var(--sd-tx-primary-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=primary]:active {\n color: var(--sd-tx-primary);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=primary]:hover {\n color: var(--sd-tx-primary);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=info] {\n color: var(--sd-tx-info);\n}\nsd-anchor[data-sd-theme=info]:hover {\n color: var(--sd-tx-info-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=info]:active {\n color: var(--sd-tx-info);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=info]:hover {\n color: var(--sd-tx-info);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=success] {\n color: var(--sd-tx-success);\n}\nsd-anchor[data-sd-theme=success]:hover {\n color: var(--sd-tx-success-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=success]:active {\n color: var(--sd-tx-success);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=success]:hover {\n color: var(--sd-tx-success);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=warning] {\n color: var(--sd-tx-warning);\n}\nsd-anchor[data-sd-theme=warning]:hover {\n color: var(--sd-tx-warning-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=warning]:active {\n color: var(--sd-tx-warning);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=warning]:hover {\n color: var(--sd-tx-warning);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=danger] {\n color: var(--sd-tx-danger);\n}\nsd-anchor[data-sd-theme=danger]:hover {\n color: var(--sd-tx-danger-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=danger]:active {\n color: var(--sd-tx-danger);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=danger]:hover {\n color: var(--sd-tx-danger);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-disabled=true] {\n color: var(--sd-tx-disabled) !important;\n pointer-events: none;\n}"], encapsulation: 2 });
14
+ } }, styles: ["sd-anchor {\n display: inline-block;\n cursor: pointer;\n}\nsd-anchor[data-sd-theme=gray] {\n color: var(--%NS%sd-tx-gray);\n}\nsd-anchor[data-sd-theme=gray]:hover {\n color: var(--%NS%sd-tx-gray-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=gray]:active {\n color: var(--%NS%sd-tx-gray);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=gray]:hover {\n color: var(--%NS%sd-tx-gray);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=blue-gray] {\n color: var(--%NS%sd-tx-blue-gray);\n}\nsd-anchor[data-sd-theme=blue-gray]:hover {\n color: var(--%NS%sd-tx-blue-gray-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=blue-gray]:active {\n color: var(--%NS%sd-tx-blue-gray);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=blue-gray]:hover {\n color: var(--%NS%sd-tx-blue-gray);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=primary] {\n color: var(--%NS%sd-tx-primary);\n}\nsd-anchor[data-sd-theme=primary]:hover {\n color: var(--%NS%sd-tx-primary-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=primary]:active {\n color: var(--%NS%sd-tx-primary);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=primary]:hover {\n color: var(--%NS%sd-tx-primary);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=info] {\n color: var(--%NS%sd-tx-info);\n}\nsd-anchor[data-sd-theme=info]:hover {\n color: var(--%NS%sd-tx-info-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=info]:active {\n color: var(--%NS%sd-tx-info);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=info]:hover {\n color: var(--%NS%sd-tx-info);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=success] {\n color: var(--%NS%sd-tx-success);\n}\nsd-anchor[data-sd-theme=success]:hover {\n color: var(--%NS%sd-tx-success-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=success]:active {\n color: var(--%NS%sd-tx-success);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=success]:hover {\n color: var(--%NS%sd-tx-success);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=warning] {\n color: var(--%NS%sd-tx-warning);\n}\nsd-anchor[data-sd-theme=warning]:hover {\n color: var(--%NS%sd-tx-warning-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=warning]:active {\n color: var(--%NS%sd-tx-warning);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=warning]:hover {\n color: var(--%NS%sd-tx-warning);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-theme=danger] {\n color: var(--%NS%sd-tx-danger);\n}\nsd-anchor[data-sd-theme=danger]:hover {\n color: var(--%NS%sd-tx-danger-hover);\n text-decoration: underline;\n}\nsd-anchor[data-sd-theme=danger]:active {\n color: var(--%NS%sd-tx-danger);\n}\n@media all and (pointer: coarse) {\n sd-anchor[data-sd-theme=danger]:hover {\n color: var(--%NS%sd-tx-danger);\n text-decoration: none;\n }\n}\nsd-anchor[data-sd-disabled=true] {\n color: var(--%NS%sd-tx-disabled) !important;\n pointer-events: none;\n}"], encapsulation: 2 });
15
15
  }
16
16
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdAnchor, [{
17
17
  type: Component,
@@ -28,7 +28,7 @@ export class SdButton {
28
28
  i0.ɵɵstyleMap(ctx.buttonStyle());
29
29
  i0.ɵɵclassMap(ctx.buttonClass());
30
30
  i0.ɵɵproperty("type", ctx.type())("disabled", ctx.disabled())("sdRipple", !ctx.disabled());
31
- } }, dependencies: [SdRipple], styles: ["sd-button > button {\n display: block;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n border: 1px solid transparent;\n font-size: var(--sd-font-size-default);\n font-family: var(--sd-font-family);\n font-variant-numeric: tabular-nums;\n line-height: var(--sd-line-height);\n color: var(--sd-tx-default);\n user-select: none;\n padding: var(--sd-gap-sm) var(--sd-gap-lg);\n width: 100%;\n background-color: var(--sd-bg-content);\n border-color: var(--sd-bd-strong);\n border-radius: var(--sd-radius-default);\n font-weight: bold;\n text-align: center;\n cursor: pointer;\n transition: var(--sd-animation-duration) linear;\n transition-property: border, background;\n}\nsd-button > button:hover {\n background-color: var(--sd-bg-state-hover);\n}\nsd-button > button:disabled {\n background-color: var(--sd-bg-disabled);\n border-color: var(--sd-bd-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-inset=true] > button {\n border-radius: 0;\n border: none;\n color: var(--sd-tx-primary);\n}\nsd-button[data-sd-inset=true] > button:hover {\n color: var(--sd-tx-primary-hover);\n}\nsd-button[data-sd-inset=true] > button:disabled {\n background-color: var(--sd-bg-disabled);\n border-color: var(--sd-bd-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=gray] > button {\n background-color: var(--sd-bg-gray-solid);\n border-color: var(--sd-bd-gray-solid);\n color: var(--sd-tx-gray-solid);\n}\nsd-button[data-sd-theme=gray] > button:hover {\n background-color: var(--sd-bg-gray-solid-hover);\n border-color: var(--sd-bd-gray-solid-hover);\n color: var(--sd-tx-gray-solid);\n}\nsd-button[data-sd-theme=gray] > button:disabled {\n background-color: var(--sd-bg-disabled);\n border-color: var(--sd-bd-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=blue-gray] > button {\n background-color: var(--sd-bg-blue-gray-solid);\n border-color: var(--sd-bd-blue-gray-solid);\n color: var(--sd-tx-blue-gray-solid);\n}\nsd-button[data-sd-theme=blue-gray] > button:hover {\n background-color: var(--sd-bg-blue-gray-solid-hover);\n border-color: var(--sd-bd-blue-gray-solid-hover);\n color: var(--sd-tx-blue-gray-solid);\n}\nsd-button[data-sd-theme=blue-gray] > button:disabled {\n background-color: var(--sd-bg-disabled);\n border-color: var(--sd-bd-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=primary] > button {\n background-color: var(--sd-bg-primary-solid);\n border-color: var(--sd-bd-primary-solid);\n color: var(--sd-tx-primary-solid);\n}\nsd-button[data-sd-theme=primary] > button:hover {\n background-color: var(--sd-bg-primary-solid-hover);\n border-color: var(--sd-bd-primary-solid-hover);\n color: var(--sd-tx-primary-solid);\n}\nsd-button[data-sd-theme=primary] > button:disabled {\n background-color: var(--sd-bg-disabled);\n border-color: var(--sd-bd-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=info] > button {\n background-color: var(--sd-bg-info-solid);\n border-color: var(--sd-bd-info-solid);\n color: var(--sd-tx-info-solid);\n}\nsd-button[data-sd-theme=info] > button:hover {\n background-color: var(--sd-bg-info-solid-hover);\n border-color: var(--sd-bd-info-solid-hover);\n color: var(--sd-tx-info-solid);\n}\nsd-button[data-sd-theme=info] > button:disabled {\n background-color: var(--sd-bg-disabled);\n border-color: var(--sd-bd-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=success] > button {\n background-color: var(--sd-bg-success-solid);\n border-color: var(--sd-bd-success-solid);\n color: var(--sd-tx-success-solid);\n}\nsd-button[data-sd-theme=success] > button:hover {\n background-color: var(--sd-bg-success-solid-hover);\n border-color: var(--sd-bd-success-solid-hover);\n color: var(--sd-tx-success-solid);\n}\nsd-button[data-sd-theme=success] > button:disabled {\n background-color: var(--sd-bg-disabled);\n border-color: var(--sd-bd-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=warning] > button {\n background-color: var(--sd-bg-warning-solid);\n border-color: var(--sd-bd-warning-solid);\n color: var(--sd-tx-warning-solid);\n}\nsd-button[data-sd-theme=warning] > button:hover {\n background-color: var(--sd-bg-warning-solid-hover);\n border-color: var(--sd-bd-warning-solid-hover);\n color: var(--sd-tx-warning-solid);\n}\nsd-button[data-sd-theme=warning] > button:disabled {\n background-color: var(--sd-bg-disabled);\n border-color: var(--sd-bd-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=danger] > button {\n background-color: var(--sd-bg-danger-solid);\n border-color: var(--sd-bd-danger-solid);\n color: var(--sd-tx-danger-solid);\n}\nsd-button[data-sd-theme=danger] > button:hover {\n background-color: var(--sd-bg-danger-solid-hover);\n border-color: var(--sd-bd-danger-solid-hover);\n color: var(--sd-tx-danger-solid);\n}\nsd-button[data-sd-theme=danger] > button:disabled {\n background-color: var(--sd-bg-disabled);\n border-color: var(--sd-bd-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=link] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--sd-tx-primary);\n}\nsd-button[data-sd-theme=link] > button:hover {\n color: var(--sd-tx-primary-hover);\n}\nsd-button[data-sd-theme=link] > button:disabled {\n border-color: transparent;\n color: var(--sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-gray] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--sd-tx-gray);\n}\nsd-button[data-sd-theme=link-gray] > button:hover {\n background-color: var(--sd-bg-state-hover);\n color: var(--sd-tx-gray-hover);\n}\nsd-button[data-sd-theme=link-gray] > button:disabled {\n border-color: transparent;\n color: var(--sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-blue-gray] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--sd-tx-blue-gray);\n}\nsd-button[data-sd-theme=link-blue-gray] > button:hover {\n background-color: var(--sd-bg-state-hover);\n color: var(--sd-tx-blue-gray-hover);\n}\nsd-button[data-sd-theme=link-blue-gray] > button:disabled {\n border-color: transparent;\n color: var(--sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-primary] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--sd-tx-primary);\n}\nsd-button[data-sd-theme=link-primary] > button:hover {\n background-color: var(--sd-bg-state-hover);\n color: var(--sd-tx-primary-hover);\n}\nsd-button[data-sd-theme=link-primary] > button:disabled {\n border-color: transparent;\n color: var(--sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-info] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--sd-tx-info);\n}\nsd-button[data-sd-theme=link-info] > button:hover {\n background-color: var(--sd-bg-state-hover);\n color: var(--sd-tx-info-hover);\n}\nsd-button[data-sd-theme=link-info] > button:disabled {\n border-color: transparent;\n color: var(--sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-success] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--sd-tx-success);\n}\nsd-button[data-sd-theme=link-success] > button:hover {\n background-color: var(--sd-bg-state-hover);\n color: var(--sd-tx-success-hover);\n}\nsd-button[data-sd-theme=link-success] > button:disabled {\n border-color: transparent;\n color: var(--sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-warning] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--sd-tx-warning);\n}\nsd-button[data-sd-theme=link-warning] > button:hover {\n background-color: var(--sd-bg-state-hover);\n color: var(--sd-tx-warning-hover);\n}\nsd-button[data-sd-theme=link-warning] > button:disabled {\n border-color: transparent;\n color: var(--sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-danger] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--sd-tx-danger);\n}\nsd-button[data-sd-theme=link-danger] > button:hover {\n background-color: var(--sd-bg-state-hover);\n color: var(--sd-tx-danger-hover);\n}\nsd-button[data-sd-theme=link-danger] > button:disabled {\n border-color: transparent;\n color: var(--sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-rev] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--sd-tx-on-inverse);\n}\nsd-button[data-sd-theme=link-rev] > button:hover {\n color: var(--sd-tx-on-inverse-muted);\n}\nsd-button[data-sd-theme=link-rev] > button:disabled {\n border-color: transparent;\n color: var(--sd-tx-on-inverse-disabled);\n}\nsd-button[data-sd-inline=true] > button {\n display: inline-block;\n width: auto;\n vertical-align: top;\n}\nsd-button[data-sd-size=xs] > button {\n padding: var(--sd-gap-xxs) var(--sd-gap-xs);\n}\nsd-button[data-sd-size=sm] > button {\n padding: var(--sd-gap-xs) var(--sd-gap-default);\n}\nsd-button[data-sd-size=lg] > button {\n padding: var(--sd-gap-default) var(--sd-gap-xl);\n}\nsd-button[data-sd-disabled=true]:active {\n pointer-events: none;\n}"], encapsulation: 2 });
31
+ } }, dependencies: [SdRipple], styles: ["sd-button > button {\n display: block;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n border: 1px solid transparent;\n font-size: var(--%NS%sd-font-size-default);\n font-family: var(--%NS%sd-font-family);\n font-variant-numeric: tabular-nums;\n line-height: var(--%NS%sd-line-height);\n color: var(--%NS%sd-tx-default);\n user-select: none;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-lg);\n width: 100%;\n background-color: var(--%NS%sd-bg-content);\n border-color: var(--%NS%sd-bd-strong);\n border-radius: var(--%NS%sd-radius-default);\n font-weight: bold;\n text-align: center;\n cursor: pointer;\n transition: var(--%NS%sd-animation-duration) linear;\n transition-property: border, background;\n}\nsd-button > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n}\nsd-button > button:disabled {\n background-color: var(--%NS%sd-bg-disabled);\n border-color: var(--%NS%sd-bd-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-inset=true] > button {\n border-radius: 0;\n border: none;\n color: var(--%NS%sd-tx-primary);\n}\nsd-button[data-sd-inset=true] > button:hover {\n color: var(--%NS%sd-tx-primary-hover);\n}\nsd-button[data-sd-inset=true] > button:disabled {\n background-color: var(--%NS%sd-bg-disabled);\n border-color: var(--%NS%sd-bd-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=gray] > button {\n background-color: var(--%NS%sd-bg-gray-solid);\n border-color: var(--%NS%sd-bd-gray-solid);\n color: var(--%NS%sd-tx-gray-solid);\n}\nsd-button[data-sd-theme=gray] > button:hover {\n background-color: var(--%NS%sd-bg-gray-solid-hover);\n border-color: var(--%NS%sd-bd-gray-solid-hover);\n color: var(--%NS%sd-tx-gray-solid);\n}\nsd-button[data-sd-theme=gray] > button:disabled {\n background-color: var(--%NS%sd-bg-disabled);\n border-color: var(--%NS%sd-bd-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=blue-gray] > button {\n background-color: var(--%NS%sd-bg-blue-gray-solid);\n border-color: var(--%NS%sd-bd-blue-gray-solid);\n color: var(--%NS%sd-tx-blue-gray-solid);\n}\nsd-button[data-sd-theme=blue-gray] > button:hover {\n background-color: var(--%NS%sd-bg-blue-gray-solid-hover);\n border-color: var(--%NS%sd-bd-blue-gray-solid-hover);\n color: var(--%NS%sd-tx-blue-gray-solid);\n}\nsd-button[data-sd-theme=blue-gray] > button:disabled {\n background-color: var(--%NS%sd-bg-disabled);\n border-color: var(--%NS%sd-bd-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=primary] > button {\n background-color: var(--%NS%sd-bg-primary-solid);\n border-color: var(--%NS%sd-bd-primary-solid);\n color: var(--%NS%sd-tx-primary-solid);\n}\nsd-button[data-sd-theme=primary] > button:hover {\n background-color: var(--%NS%sd-bg-primary-solid-hover);\n border-color: var(--%NS%sd-bd-primary-solid-hover);\n color: var(--%NS%sd-tx-primary-solid);\n}\nsd-button[data-sd-theme=primary] > button:disabled {\n background-color: var(--%NS%sd-bg-disabled);\n border-color: var(--%NS%sd-bd-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=info] > button {\n background-color: var(--%NS%sd-bg-info-solid);\n border-color: var(--%NS%sd-bd-info-solid);\n color: var(--%NS%sd-tx-info-solid);\n}\nsd-button[data-sd-theme=info] > button:hover {\n background-color: var(--%NS%sd-bg-info-solid-hover);\n border-color: var(--%NS%sd-bd-info-solid-hover);\n color: var(--%NS%sd-tx-info-solid);\n}\nsd-button[data-sd-theme=info] > button:disabled {\n background-color: var(--%NS%sd-bg-disabled);\n border-color: var(--%NS%sd-bd-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=success] > button {\n background-color: var(--%NS%sd-bg-success-solid);\n border-color: var(--%NS%sd-bd-success-solid);\n color: var(--%NS%sd-tx-success-solid);\n}\nsd-button[data-sd-theme=success] > button:hover {\n background-color: var(--%NS%sd-bg-success-solid-hover);\n border-color: var(--%NS%sd-bd-success-solid-hover);\n color: var(--%NS%sd-tx-success-solid);\n}\nsd-button[data-sd-theme=success] > button:disabled {\n background-color: var(--%NS%sd-bg-disabled);\n border-color: var(--%NS%sd-bd-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=warning] > button {\n background-color: var(--%NS%sd-bg-warning-solid);\n border-color: var(--%NS%sd-bd-warning-solid);\n color: var(--%NS%sd-tx-warning-solid);\n}\nsd-button[data-sd-theme=warning] > button:hover {\n background-color: var(--%NS%sd-bg-warning-solid-hover);\n border-color: var(--%NS%sd-bd-warning-solid-hover);\n color: var(--%NS%sd-tx-warning-solid);\n}\nsd-button[data-sd-theme=warning] > button:disabled {\n background-color: var(--%NS%sd-bg-disabled);\n border-color: var(--%NS%sd-bd-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=danger] > button {\n background-color: var(--%NS%sd-bg-danger-solid);\n border-color: var(--%NS%sd-bd-danger-solid);\n color: var(--%NS%sd-tx-danger-solid);\n}\nsd-button[data-sd-theme=danger] > button:hover {\n background-color: var(--%NS%sd-bg-danger-solid-hover);\n border-color: var(--%NS%sd-bd-danger-solid-hover);\n color: var(--%NS%sd-tx-danger-solid);\n}\nsd-button[data-sd-theme=danger] > button:disabled {\n background-color: var(--%NS%sd-bg-disabled);\n border-color: var(--%NS%sd-bd-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-button[data-sd-theme=link] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--%NS%sd-tx-primary);\n}\nsd-button[data-sd-theme=link] > button:hover {\n color: var(--%NS%sd-tx-primary-hover);\n}\nsd-button[data-sd-theme=link] > button:disabled {\n border-color: transparent;\n color: var(--%NS%sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-gray] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--%NS%sd-tx-gray);\n}\nsd-button[data-sd-theme=link-gray] > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n color: var(--%NS%sd-tx-gray-hover);\n}\nsd-button[data-sd-theme=link-gray] > button:disabled {\n border-color: transparent;\n color: var(--%NS%sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-blue-gray] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--%NS%sd-tx-blue-gray);\n}\nsd-button[data-sd-theme=link-blue-gray] > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n color: var(--%NS%sd-tx-blue-gray-hover);\n}\nsd-button[data-sd-theme=link-blue-gray] > button:disabled {\n border-color: transparent;\n color: var(--%NS%sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-primary] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--%NS%sd-tx-primary);\n}\nsd-button[data-sd-theme=link-primary] > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n color: var(--%NS%sd-tx-primary-hover);\n}\nsd-button[data-sd-theme=link-primary] > button:disabled {\n border-color: transparent;\n color: var(--%NS%sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-info] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--%NS%sd-tx-info);\n}\nsd-button[data-sd-theme=link-info] > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n color: var(--%NS%sd-tx-info-hover);\n}\nsd-button[data-sd-theme=link-info] > button:disabled {\n border-color: transparent;\n color: var(--%NS%sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-success] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--%NS%sd-tx-success);\n}\nsd-button[data-sd-theme=link-success] > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n color: var(--%NS%sd-tx-success-hover);\n}\nsd-button[data-sd-theme=link-success] > button:disabled {\n border-color: transparent;\n color: var(--%NS%sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-warning] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--%NS%sd-tx-warning);\n}\nsd-button[data-sd-theme=link-warning] > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n color: var(--%NS%sd-tx-warning-hover);\n}\nsd-button[data-sd-theme=link-warning] > button:disabled {\n border-color: transparent;\n color: var(--%NS%sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-danger] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--%NS%sd-tx-danger);\n}\nsd-button[data-sd-theme=link-danger] > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n color: var(--%NS%sd-tx-danger-hover);\n}\nsd-button[data-sd-theme=link-danger] > button:disabled {\n border-color: transparent;\n color: var(--%NS%sd-tx-disabled);\n}\nsd-button[data-sd-theme=link-rev] > button {\n border-color: transparent;\n background-color: transparent;\n color: var(--%NS%sd-tx-on-inverse);\n}\nsd-button[data-sd-theme=link-rev] > button:hover {\n color: var(--%NS%sd-tx-on-inverse-muted);\n}\nsd-button[data-sd-theme=link-rev] > button:disabled {\n border-color: transparent;\n color: var(--%NS%sd-tx-on-inverse-disabled);\n}\nsd-button[data-sd-inline=true] > button {\n display: inline-block;\n width: auto;\n vertical-align: top;\n}\nsd-button[data-sd-size=xs] > button {\n padding: var(--%NS%sd-gap-xxs) var(--%NS%sd-gap-xs);\n}\nsd-button[data-sd-size=sm] > button {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-default);\n}\nsd-button[data-sd-size=lg] > button {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-xl);\n}\nsd-button[data-sd-disabled=true]:active {\n pointer-events: none;\n}"], encapsulation: 2 });
32
32
  }
33
33
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdButton, [{
34
34
  type: Component,
@@ -109,7 +109,7 @@ export class SdModalSelectButton {
109
109
  i0.ɵɵconditional(!ctx.disabled() && !ctx.required() && ctx._hasValue() ? 3 : -1);
110
110
  i0.ɵɵadvance();
111
111
  i0.ɵɵconditional(!ctx.disabled() ? 4 : -1);
112
- } }, dependencies: [SdAnchor, SdButton, NgIcon], styles: ["sd-modal-select-button {\n display: flex;\n flex-direction: row;\n gap: var(--sd-gap-sm);\n position: relative;\n width: 100%;\n min-width: 3em;\n border: 1px solid var(--sd-bd-soft);\n border-radius: var(--sd-radius-default);\n overflow: hidden;\n}\nsd-modal-select-button > ._content {\n flex: 1;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n}\nsd-modal-select-button > ._button {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n}\n@supports not (appearance: auto) {\n sd-modal-select-button > ._button.gap-xxs {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-xxs > * + * {\n margin-left: var(--sd-gap-xxs);\n }\n sd-modal-select-button > ._button.gap-xs {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-xs > * + * {\n margin-left: var(--sd-gap-xs);\n }\n sd-modal-select-button > ._button.gap-sm {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-sm > * + * {\n margin-left: var(--sd-gap-sm);\n }\n sd-modal-select-button > ._button.gap-default {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-default > * + * {\n margin-left: var(--sd-gap-default);\n }\n sd-modal-select-button > ._button.gap-lg {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-lg > * + * {\n margin-left: var(--sd-gap-lg);\n }\n sd-modal-select-button > ._button.gap-xl {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-xl > * + * {\n margin-left: var(--sd-gap-xl);\n }\n sd-modal-select-button > ._button.gap-xxl {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-xxl > * + * {\n margin-left: var(--sd-gap-xxl);\n }\n sd-modal-select-button > ._button.gap-0 {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-0 > * + * {\n margin-left: var(--sd-gap-0);\n }\n sd-modal-select-button > ._button.gap-auto {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-auto > * + * {\n margin-left: var(--sd-gap-auto);\n }\n}\nsd-modal-select-button > ._button > sd-anchor {\n padding: var(--sd-gap-sm) !important;\n}\nsd-modal-select-button > ._button > sd-button > button {\n border-left: 1px solid var(--sd-bd-hairline) !important;\n padding: var(--sd-gap-sm) !important;\n height: 100%;\n}\nsd-modal-select-button[data-sd-inset=true] {\n border-radius: 0;\n border: none;\n}\nsd-modal-select-button[data-sd-size=sm] > ._content {\n padding: var(--sd-gap-xs) var(--sd-gap-default);\n}\nsd-modal-select-button[data-sd-size=sm] > ._button > sd-anchor {\n padding: var(--sd-gap-xs) var(--sd-gap-sm) !important;\n}\nsd-modal-select-button[data-sd-size=sm] > ._button > sd-button > button {\n padding: var(--sd-gap-xs) var(--sd-gap-sm) !important;\n}\nsd-modal-select-button[data-sd-size=lg] > ._content {\n padding: var(--sd-gap-default) var(--sd-gap-xl);\n}\nsd-modal-select-button[data-sd-size=lg] > ._button > sd-anchor {\n padding: var(--sd-gap-default) !important;\n}\nsd-modal-select-button[data-sd-size=lg] > ._button > sd-button > button {\n padding: var(--sd-gap-default) !important;\n}"], encapsulation: 2 });
112
+ } }, dependencies: [SdAnchor, SdButton, NgIcon], styles: ["sd-modal-select-button {\n display: flex;\n flex-direction: row;\n gap: var(--%NS%sd-gap-sm);\n position: relative;\n width: 100%;\n min-width: 3em;\n border: 1px solid var(--%NS%sd-bd-soft);\n border-radius: var(--%NS%sd-radius-default);\n overflow: hidden;\n}\nsd-modal-select-button > ._content {\n flex: 1;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n}\nsd-modal-select-button > ._button {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n}\n@supports not (appearance: auto) {\n sd-modal-select-button > ._button.gap-xxs {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-xxs > * + * {\n margin-left: var(--%NS%sd-gap-xxs);\n }\n sd-modal-select-button > ._button.gap-xs {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-xs > * + * {\n margin-left: var(--%NS%sd-gap-xs);\n }\n sd-modal-select-button > ._button.gap-sm {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-sm > * + * {\n margin-left: var(--%NS%sd-gap-sm);\n }\n sd-modal-select-button > ._button.gap-default {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-default > * + * {\n margin-left: var(--%NS%sd-gap-default);\n }\n sd-modal-select-button > ._button.gap-lg {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-lg > * + * {\n margin-left: var(--%NS%sd-gap-lg);\n }\n sd-modal-select-button > ._button.gap-xl {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-xl > * + * {\n margin-left: var(--%NS%sd-gap-xl);\n }\n sd-modal-select-button > ._button.gap-xxl {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-xxl > * + * {\n margin-left: var(--%NS%sd-gap-xxl);\n }\n sd-modal-select-button > ._button.gap-0 {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-0 > * + * {\n margin-left: var(--%NS%sd-gap-0);\n }\n sd-modal-select-button > ._button.gap-auto {\n gap: 0;\n }\n sd-modal-select-button > ._button.gap-auto > * + * {\n margin-left: var(--%NS%sd-gap-auto);\n }\n}\nsd-modal-select-button > ._button > sd-anchor {\n padding: var(--%NS%sd-gap-sm) !important;\n}\nsd-modal-select-button > ._button > sd-button > button {\n border-left: 1px solid var(--%NS%sd-bd-hairline) !important;\n padding: var(--%NS%sd-gap-sm) !important;\n height: 100%;\n}\nsd-modal-select-button[data-sd-inset=true] {\n border-radius: 0;\n border: none;\n}\nsd-modal-select-button[data-sd-size=sm] > ._content {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-default);\n}\nsd-modal-select-button[data-sd-size=sm] > ._button > sd-anchor {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm) !important;\n}\nsd-modal-select-button[data-sd-size=sm] > ._button > sd-button > button {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm) !important;\n}\nsd-modal-select-button[data-sd-size=lg] > ._content {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-xl);\n}\nsd-modal-select-button[data-sd-size=lg] > ._button > sd-anchor {\n padding: var(--%NS%sd-gap-default) !important;\n}\nsd-modal-select-button[data-sd-size=lg] > ._button > sd-button > button {\n padding: var(--%NS%sd-gap-default) !important;\n}"], encapsulation: 2 });
113
113
  }
114
114
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdModalSelectButton, [{
115
115
  type: Component,
@@ -79,7 +79,7 @@ export class SdCheckbox {
79
79
  i0.ɵɵconditional(!ctx.radio() ? 2 : 3);
80
80
  i0.ɵɵadvance(2);
81
81
  i0.ɵɵstyleMap(ctx.contentStyle());
82
- } }, dependencies: [NgIcon], styles: ["sd-checkbox {\n display: block;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n border: 1px solid transparent;\n font-size: var(--sd-font-size-default);\n font-family: var(--sd-font-family);\n font-variant-numeric: tabular-nums;\n line-height: var(--sd-line-height);\n color: var(--sd-tx-default);\n color: inherit;\n cursor: pointer;\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit) + var(--sd-gap-sm) * 2 + 2px);\n gap: var(--sd-gap-sm);\n}\n@supports not (appearance: auto) {\n sd-checkbox {\n gap: 0;\n }\n sd-checkbox > * + * {\n margin-left: var(--sd-gap-sm);\n }\n}\nsd-checkbox > ._indicator_rect {\n display: inline-block;\n vertical-align: -0.125em;\n user-select: none;\n width: calc(var(--sd-font-size-default) + 2px);\n height: calc(var(--sd-font-size-default) + 2px);\n border: 1px solid var(--sd-bd-field);\n background-color: var(--sd-bg-field);\n}\nsd-checkbox > ._indicator_rect > ._indicator {\n margin: -1px -2px;\n text-align: center;\n opacity: 0;\n color: var(--sd-tx-primary-solid);\n}\nsd-checkbox > ._indicator_rect > ._indicator > ng-icon > svg {\n vertical-align: top;\n stroke-width: 2.5px !important;\n}\nsd-checkbox ._contents {\n display: inline-block;\n vertical-align: top;\n padding-left: var(--sd-gap-sm);\n}\nsd-checkbox > ._indicator_rect + ._contents:empty {\n display: none;\n}\nsd-checkbox:focus > ._indicator_rect {\n border-color: var(--sd-focus-ring-color);\n}\nsd-checkbox[data-sd-checked=true] > ._indicator_rect {\n border-color: var(--sd-bd-primary-solid);\n background-color: var(--sd-bg-primary-solid);\n}\nsd-checkbox[data-sd-checked=true] > ._indicator_rect > ._indicator {\n opacity: 1;\n}\nsd-checkbox[data-sd-theme=gray] > ._indicator_rect {\n background-color: var(--sd-bg-gray-subtle);\n}\nsd-checkbox[data-sd-theme=gray] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-gray);\n}\nsd-checkbox[data-sd-theme=gray][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--sd-bd-gray-solid);\n background-color: var(--sd-bg-gray-solid);\n}\nsd-checkbox[data-sd-theme=gray][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-gray-solid);\n}\nsd-checkbox[data-sd-theme=gray]:focus > ._indicator_rect {\n border-color: var(--sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=blue-gray] > ._indicator_rect {\n background-color: var(--sd-bg-blue-gray-subtle);\n}\nsd-checkbox[data-sd-theme=blue-gray] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-blue-gray);\n}\nsd-checkbox[data-sd-theme=blue-gray][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--sd-bd-blue-gray-solid);\n background-color: var(--sd-bg-blue-gray-solid);\n}\nsd-checkbox[data-sd-theme=blue-gray][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-blue-gray-solid);\n}\nsd-checkbox[data-sd-theme=blue-gray]:focus > ._indicator_rect {\n border-color: var(--sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=primary] > ._indicator_rect {\n background-color: var(--sd-bg-primary-subtle);\n}\nsd-checkbox[data-sd-theme=primary] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-primary);\n}\nsd-checkbox[data-sd-theme=primary][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--sd-bd-primary-solid);\n background-color: var(--sd-bg-primary-solid);\n}\nsd-checkbox[data-sd-theme=primary][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-primary-solid);\n}\nsd-checkbox[data-sd-theme=primary]:focus > ._indicator_rect {\n border-color: var(--sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=info] > ._indicator_rect {\n background-color: var(--sd-bg-info-subtle);\n}\nsd-checkbox[data-sd-theme=info] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-info);\n}\nsd-checkbox[data-sd-theme=info][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--sd-bd-info-solid);\n background-color: var(--sd-bg-info-solid);\n}\nsd-checkbox[data-sd-theme=info][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-info-solid);\n}\nsd-checkbox[data-sd-theme=info]:focus > ._indicator_rect {\n border-color: var(--sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=success] > ._indicator_rect {\n background-color: var(--sd-bg-success-subtle);\n}\nsd-checkbox[data-sd-theme=success] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-success);\n}\nsd-checkbox[data-sd-theme=success][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--sd-bd-success-solid);\n background-color: var(--sd-bg-success-solid);\n}\nsd-checkbox[data-sd-theme=success][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-success-solid);\n}\nsd-checkbox[data-sd-theme=success]:focus > ._indicator_rect {\n border-color: var(--sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=warning] > ._indicator_rect {\n background-color: var(--sd-bg-warning-subtle);\n}\nsd-checkbox[data-sd-theme=warning] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-warning);\n}\nsd-checkbox[data-sd-theme=warning][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--sd-bd-warning-solid);\n background-color: var(--sd-bg-warning-solid);\n}\nsd-checkbox[data-sd-theme=warning][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-warning-solid);\n}\nsd-checkbox[data-sd-theme=warning]:focus > ._indicator_rect {\n border-color: var(--sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=danger] > ._indicator_rect {\n background-color: var(--sd-bg-danger-subtle);\n}\nsd-checkbox[data-sd-theme=danger] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-danger);\n}\nsd-checkbox[data-sd-theme=danger][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--sd-bd-danger-solid);\n background-color: var(--sd-bg-danger-solid);\n}\nsd-checkbox[data-sd-theme=danger][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-danger-solid);\n}\nsd-checkbox[data-sd-theme=danger]:focus > ._indicator_rect {\n border-color: var(--sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=white] > ._indicator_rect {\n background-color: var(--sd-bg-checkbox);\n border-color: var(--sd-bd-field);\n}\nsd-checkbox[data-sd-theme=white][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--sd-bd-primary-solid);\n background-color: var(--sd-bg-primary-solid);\n}\nsd-checkbox[data-sd-theme=white]:focus > ._indicator_rect {\n border-color: var(--sd-focus-ring-color);\n}\nsd-checkbox[data-sd-radio=true] > ._indicator_rect {\n border-radius: 100%;\n padding: var(--sd-gap-xs);\n}\nsd-checkbox[data-sd-radio=true] > ._indicator_rect > ._indicator {\n border-radius: 100%;\n width: 100%;\n height: 100%;\n background-color: var(--sd-bg-primary-solid);\n}\nsd-checkbox[data-sd-radio=true][data-sd-checked=true] > ._indicator_rect {\n background-color: var(--sd-bg-field);\n border-color: var(--sd-bd-primary-solid);\n}\nsd-checkbox[data-sd-size=sm] {\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit) + var(--sd-gap-xs) * 2 + 2px);\n padding: var(--sd-gap-xs) var(--sd-gap-sm);\n gap: var(--sd-gap-xs);\n}\n@supports not (appearance: auto) {\n sd-checkbox[data-sd-size=sm] {\n gap: 0;\n }\n sd-checkbox[data-sd-size=sm] > * + * {\n margin-left: var(--sd-gap-xs);\n }\n}\nsd-checkbox[data-sd-size=lg] {\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit) + var(--sd-gap-default) * 2 + 2px);\n padding: var(--sd-gap-default) var(--sd-gap-lg);\n gap: var(--sd-gap-default);\n}\n@supports not (appearance: auto) {\n sd-checkbox[data-sd-size=lg] {\n gap: 0;\n }\n sd-checkbox[data-sd-size=lg] > * + * {\n margin-left: var(--sd-gap-default);\n }\n}\nsd-checkbox[data-sd-inset=true] {\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit) + var(--sd-gap-sm) * 2);\n border: none;\n justify-content: center;\n text-align: center;\n}\nsd-checkbox[data-sd-inset=true][data-sd-size=sm] {\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit) + var(--sd-gap-xs) * 2);\n}\nsd-checkbox[data-sd-inset=true][data-sd-size=lg] {\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit) + var(--sd-gap-default) * 2);\n}\nsd-checkbox[data-sd-inline=true] {\n display: inline-block;\n vertical-align: top;\n padding: 0;\n border: none;\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit));\n width: auto;\n}\nsd-checkbox[data-sd-disabled=true] {\n color: var(--sd-tx-disabled) !important;\n pointer-events: none;\n}\nsd-checkbox[data-sd-disabled=true] > ._indicator_rect {\n background-color: var(--sd-bg-disabled) !important;\n border-color: var(--sd-bd-disabled) !important;\n}\nsd-checkbox[data-sd-disabled=true] > ._indicator_rect > ._indicator {\n color: var(--sd-tx-disabled) !important;\n}"], encapsulation: 2 });
82
+ } }, dependencies: [NgIcon], styles: ["sd-checkbox {\n display: block;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n border: 1px solid transparent;\n font-size: var(--%NS%sd-font-size-default);\n font-family: var(--%NS%sd-font-family);\n font-variant-numeric: tabular-nums;\n line-height: var(--%NS%sd-line-height);\n color: var(--%NS%sd-tx-default);\n color: inherit;\n cursor: pointer;\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit) + var(--%NS%sd-gap-sm) * 2 + 2px);\n gap: var(--%NS%sd-gap-sm);\n}\n@supports not (appearance: auto) {\n sd-checkbox {\n gap: 0;\n }\n sd-checkbox > * + * {\n margin-left: var(--%NS%sd-gap-sm);\n }\n}\nsd-checkbox > ._indicator_rect {\n display: inline-block;\n vertical-align: -0.125em;\n user-select: none;\n width: calc(var(--%NS%sd-font-size-default) + 2px);\n height: calc(var(--%NS%sd-font-size-default) + 2px);\n border: 1px solid var(--%NS%sd-bd-field);\n background-color: var(--%NS%sd-bg-field);\n}\nsd-checkbox > ._indicator_rect > ._indicator {\n margin: -1px -2px;\n text-align: center;\n opacity: 0;\n color: var(--%NS%sd-tx-primary-solid);\n}\nsd-checkbox > ._indicator_rect > ._indicator > ng-icon > svg {\n vertical-align: top;\n stroke-width: 2.5px !important;\n}\nsd-checkbox ._contents {\n display: inline-block;\n vertical-align: top;\n padding-left: var(--%NS%sd-gap-sm);\n}\nsd-checkbox > ._indicator_rect + ._contents:empty {\n display: none;\n}\nsd-checkbox:focus > ._indicator_rect {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-checkbox[data-sd-checked=true] > ._indicator_rect {\n border-color: var(--%NS%sd-bd-primary-solid);\n background-color: var(--%NS%sd-bg-primary-solid);\n}\nsd-checkbox[data-sd-checked=true] > ._indicator_rect > ._indicator {\n opacity: 1;\n}\nsd-checkbox[data-sd-theme=gray] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-gray-subtle);\n}\nsd-checkbox[data-sd-theme=gray] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-gray);\n}\nsd-checkbox[data-sd-theme=gray][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--%NS%sd-bd-gray-solid);\n background-color: var(--%NS%sd-bg-gray-solid);\n}\nsd-checkbox[data-sd-theme=gray][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-gray-solid);\n}\nsd-checkbox[data-sd-theme=gray]:focus > ._indicator_rect {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=blue-gray] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-blue-gray-subtle);\n}\nsd-checkbox[data-sd-theme=blue-gray] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-blue-gray);\n}\nsd-checkbox[data-sd-theme=blue-gray][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--%NS%sd-bd-blue-gray-solid);\n background-color: var(--%NS%sd-bg-blue-gray-solid);\n}\nsd-checkbox[data-sd-theme=blue-gray][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-blue-gray-solid);\n}\nsd-checkbox[data-sd-theme=blue-gray]:focus > ._indicator_rect {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=primary] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-primary-subtle);\n}\nsd-checkbox[data-sd-theme=primary] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-primary);\n}\nsd-checkbox[data-sd-theme=primary][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--%NS%sd-bd-primary-solid);\n background-color: var(--%NS%sd-bg-primary-solid);\n}\nsd-checkbox[data-sd-theme=primary][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-primary-solid);\n}\nsd-checkbox[data-sd-theme=primary]:focus > ._indicator_rect {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=info] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-info-subtle);\n}\nsd-checkbox[data-sd-theme=info] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-info);\n}\nsd-checkbox[data-sd-theme=info][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--%NS%sd-bd-info-solid);\n background-color: var(--%NS%sd-bg-info-solid);\n}\nsd-checkbox[data-sd-theme=info][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-info-solid);\n}\nsd-checkbox[data-sd-theme=info]:focus > ._indicator_rect {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=success] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-success-subtle);\n}\nsd-checkbox[data-sd-theme=success] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-success);\n}\nsd-checkbox[data-sd-theme=success][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--%NS%sd-bd-success-solid);\n background-color: var(--%NS%sd-bg-success-solid);\n}\nsd-checkbox[data-sd-theme=success][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-success-solid);\n}\nsd-checkbox[data-sd-theme=success]:focus > ._indicator_rect {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=warning] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-warning-subtle);\n}\nsd-checkbox[data-sd-theme=warning] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-warning);\n}\nsd-checkbox[data-sd-theme=warning][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--%NS%sd-bd-warning-solid);\n background-color: var(--%NS%sd-bg-warning-solid);\n}\nsd-checkbox[data-sd-theme=warning][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-warning-solid);\n}\nsd-checkbox[data-sd-theme=warning]:focus > ._indicator_rect {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=danger] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-danger-subtle);\n}\nsd-checkbox[data-sd-theme=danger] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-danger);\n}\nsd-checkbox[data-sd-theme=danger][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--%NS%sd-bd-danger-solid);\n background-color: var(--%NS%sd-bg-danger-solid);\n}\nsd-checkbox[data-sd-theme=danger][data-sd-checked=true] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-danger-solid);\n}\nsd-checkbox[data-sd-theme=danger]:focus > ._indicator_rect {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-checkbox[data-sd-theme=white] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-checkbox);\n border-color: var(--%NS%sd-bd-field);\n}\nsd-checkbox[data-sd-theme=white][data-sd-checked=true] > ._indicator_rect {\n border-color: var(--%NS%sd-bd-primary-solid);\n background-color: var(--%NS%sd-bg-primary-solid);\n}\nsd-checkbox[data-sd-theme=white]:focus > ._indicator_rect {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-checkbox[data-sd-radio=true] > ._indicator_rect {\n border-radius: 100%;\n padding: var(--%NS%sd-gap-xs);\n}\nsd-checkbox[data-sd-radio=true] > ._indicator_rect > ._indicator {\n border-radius: 100%;\n width: 100%;\n height: 100%;\n background-color: var(--%NS%sd-bg-primary-solid);\n}\nsd-checkbox[data-sd-radio=true][data-sd-checked=true] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-field);\n border-color: var(--%NS%sd-bd-primary-solid);\n}\nsd-checkbox[data-sd-size=sm] {\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit) + var(--%NS%sd-gap-xs) * 2 + 2px);\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm);\n gap: var(--%NS%sd-gap-xs);\n}\n@supports not (appearance: auto) {\n sd-checkbox[data-sd-size=sm] {\n gap: 0;\n }\n sd-checkbox[data-sd-size=sm] > * + * {\n margin-left: var(--%NS%sd-gap-xs);\n }\n}\nsd-checkbox[data-sd-size=lg] {\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit) + var(--%NS%sd-gap-default) * 2 + 2px);\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-lg);\n gap: var(--%NS%sd-gap-default);\n}\n@supports not (appearance: auto) {\n sd-checkbox[data-sd-size=lg] {\n gap: 0;\n }\n sd-checkbox[data-sd-size=lg] > * + * {\n margin-left: var(--%NS%sd-gap-default);\n }\n}\nsd-checkbox[data-sd-inset=true] {\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit) + var(--%NS%sd-gap-sm) * 2);\n border: none;\n justify-content: center;\n text-align: center;\n}\nsd-checkbox[data-sd-inset=true][data-sd-size=sm] {\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit) + var(--%NS%sd-gap-xs) * 2);\n}\nsd-checkbox[data-sd-inset=true][data-sd-size=lg] {\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit) + var(--%NS%sd-gap-default) * 2);\n}\nsd-checkbox[data-sd-inline=true] {\n display: inline-block;\n vertical-align: top;\n padding: 0;\n border: none;\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit));\n width: auto;\n}\nsd-checkbox[data-sd-disabled=true] {\n color: var(--%NS%sd-tx-disabled) !important;\n pointer-events: none;\n}\nsd-checkbox[data-sd-disabled=true] > ._indicator_rect {\n background-color: var(--%NS%sd-bg-disabled) !important;\n border-color: var(--%NS%sd-bd-disabled) !important;\n}\nsd-checkbox[data-sd-disabled=true] > ._indicator_rect > ._indicator {\n color: var(--%NS%sd-tx-disabled) !important;\n}"], encapsulation: 2 });
83
83
  }
84
84
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdCheckbox, [{
85
85
  type: Component,
@@ -41,7 +41,7 @@ export class SdSwitch {
41
41
  i0.ɵɵdomElementStart(0, "div");
42
42
  i0.ɵɵdomElement(1, "div");
43
43
  i0.ɵɵdomElementEnd();
44
- } }, styles: ["sd-switch {\n display: block;\n padding: var(--sd-gap-sm) 0;\n border: 1px solid transparent;\n vertical-align: top;\n cursor: pointer;\n}\nsd-switch > div {\n height: var(--sd-line-height);\n width: calc(var(--sd-line-height) * 2 - var(--sd-gap-xs));\n padding: calc(var(--sd-gap-xs) / 2);\n border-radius: calc(var(--sd-line-height) / 2);\n text-align: left;\n background-color: var(--sd-bg-track);\n}\nsd-switch > div > div {\n display: inline-block;\n width: calc(var(--sd-line-height) - var(--sd-gap-xs));\n height: calc(var(--sd-line-height) - var(--sd-gap-xs));\n border-radius: 100%;\n background-color: var(--sd-bg-knob);\n transition: transform var(--sd-animation-duration);\n}\nsd-switch[data-sd-on=true] > div {\n background-color: var(--sd-bg-success-solid);\n}\nsd-switch[data-sd-on=true] > div > div {\n transform: translateX(100%);\n}\nsd-switch[data-sd-inline=true] {\n display: inline-block;\n padding: 0;\n border: none;\n}\nsd-switch[data-sd-inset=true] {\n border: none;\n}\nsd-switch[data-sd-size=sm] {\n padding: var(--sd-gap-sm) 0;\n}\nsd-switch[data-sd-size=lg] {\n padding: var(--sd-gap-default) 0;\n}\nsd-switch[data-sd-theme=gray][data-sd-on=true] > div {\n background-color: var(--sd-bg-gray-solid);\n}\nsd-switch[data-sd-theme=blue-gray][data-sd-on=true] > div {\n background-color: var(--sd-bg-blue-gray-solid);\n}\nsd-switch[data-sd-theme=primary][data-sd-on=true] > div {\n background-color: var(--sd-bg-primary-solid);\n}\nsd-switch[data-sd-theme=info][data-sd-on=true] > div {\n background-color: var(--sd-bg-info-solid);\n}\nsd-switch[data-sd-theme=success][data-sd-on=true] > div {\n background-color: var(--sd-bg-success-solid);\n}\nsd-switch[data-sd-theme=warning][data-sd-on=true] > div {\n background-color: var(--sd-bg-warning-solid);\n}\nsd-switch[data-sd-theme=danger][data-sd-on=true] > div {\n background-color: var(--sd-bg-danger-solid);\n}\nsd-switch[data-sd-disabled=true] > div {\n background-color: var(--sd-bg-disabled) !important;\n}\nsd-switch[data-sd-disabled=true] > div > div {\n background-color: var(--sd-bg-gray-solid);\n}"], encapsulation: 2 });
44
+ } }, styles: ["sd-switch {\n display: block;\n padding: var(--%NS%sd-gap-sm) 0;\n border: 1px solid transparent;\n vertical-align: top;\n cursor: pointer;\n}\nsd-switch > div {\n height: var(--%NS%sd-line-height);\n width: calc(var(--%NS%sd-line-height) * 2 - var(--%NS%sd-gap-xs));\n padding: calc(var(--%NS%sd-gap-xs) / 2);\n border-radius: calc(var(--%NS%sd-line-height) / 2);\n text-align: left;\n background-color: var(--%NS%sd-bg-track);\n}\nsd-switch > div > div {\n display: inline-block;\n width: calc(var(--%NS%sd-line-height) - var(--%NS%sd-gap-xs));\n height: calc(var(--%NS%sd-line-height) - var(--%NS%sd-gap-xs));\n border-radius: 100%;\n background-color: var(--%NS%sd-bg-knob);\n transition: transform var(--%NS%sd-animation-duration);\n}\nsd-switch[data-sd-on=true] > div {\n background-color: var(--%NS%sd-bg-success-solid);\n}\nsd-switch[data-sd-on=true] > div > div {\n transform: translateX(100%);\n}\nsd-switch[data-sd-inline=true] {\n display: inline-block;\n padding: 0;\n border: none;\n}\nsd-switch[data-sd-inset=true] {\n border: none;\n}\nsd-switch[data-sd-size=sm] {\n padding: var(--%NS%sd-gap-sm) 0;\n}\nsd-switch[data-sd-size=lg] {\n padding: var(--%NS%sd-gap-default) 0;\n}\nsd-switch[data-sd-theme=gray][data-sd-on=true] > div {\n background-color: var(--%NS%sd-bg-gray-solid);\n}\nsd-switch[data-sd-theme=blue-gray][data-sd-on=true] > div {\n background-color: var(--%NS%sd-bg-blue-gray-solid);\n}\nsd-switch[data-sd-theme=primary][data-sd-on=true] > div {\n background-color: var(--%NS%sd-bg-primary-solid);\n}\nsd-switch[data-sd-theme=info][data-sd-on=true] > div {\n background-color: var(--%NS%sd-bg-info-solid);\n}\nsd-switch[data-sd-theme=success][data-sd-on=true] > div {\n background-color: var(--%NS%sd-bg-success-solid);\n}\nsd-switch[data-sd-theme=warning][data-sd-on=true] > div {\n background-color: var(--%NS%sd-bg-warning-solid);\n}\nsd-switch[data-sd-theme=danger][data-sd-on=true] > div {\n background-color: var(--%NS%sd-bg-danger-solid);\n}\nsd-switch[data-sd-disabled=true] > div {\n background-color: var(--%NS%sd-bg-disabled) !important;\n}\nsd-switch[data-sd-disabled=true] > div > div {\n background-color: var(--%NS%sd-bg-gray-solid);\n}"], encapsulation: 2 });
45
45
  }
46
46
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSwitch, [{
47
47
  type: Component,
@@ -33,7 +33,7 @@ export class SdDropdownPopup {
33
33
  i0.ɵɵlistener("sdResize", function SdDropdownPopup_Template_div_sdResize_0_listener() { return ctx.onResize(); });
34
34
  i0.ɵɵprojection(1);
35
35
  i0.ɵɵelementEnd();
36
- } }, dependencies: [SdResizeDirective], styles: ["sd-dropdown-popup {\n position: fixed;\n z-index: var(--sd-z-dropdown);\n opacity: 0;\n transform: translateY(-0.625rem);\n transition: var(--sd-animation-duration) linear;\n transition-property: transform, opacity;\n pointer-events: none;\n background-color: var(--sd-bg-overlay);\n min-width: 7.5rem;\n box-shadow: 0 calc(4 * var(--sd-shadow-size)) calc(4 * 4 * var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color), 0 var(--sd-shadow-size) calc(var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color);\n overflow: hidden;\n border-radius: var(--sd-radius-default);\n border: 1px solid var(--sd-dropdown-bd);\n}\nsd-dropdown-popup > div {\n width: 100%;\n height: 100%;\n overflow: auto;\n white-space: nowrap;\n}\nsd-dropdown-popup:focus {\n outline: 1px solid var(--sd-focus-ring-color);\n}\n@media all and (max-width: 520px) {\n sd-dropdown-popup {\n box-shadow: none;\n border: 1px solid var(--sd-bd-strong);\n }\n}\nsd-dropdown-popup[data-sd-mobile] {\n position: fixed;\n left: 0;\n right: 0;\n bottom: 0;\n top: auto;\n max-height: 80vh;\n border-radius: var(--sd-radius-default) var(--sd-radius-default) 0 0;\n opacity: 1;\n pointer-events: auto;\n transform: none;\n animation: sd-dropdown-slide-up var(--sd-animation-duration) ease-out;\n box-shadow: 0 calc(8 * var(--sd-shadow-size)) calc(8 * 4 * var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color), 0 var(--sd-shadow-size) calc(var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color);\n}\n\n@keyframes sd-dropdown-slide-up {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}"], encapsulation: 2 });
36
+ } }, dependencies: [SdResizeDirective], styles: ["sd-dropdown-popup {\n position: fixed;\n z-index: var(--%NS%sd-z-dropdown);\n opacity: 0;\n transform: translateY(-0.625rem);\n transition: var(--%NS%sd-animation-duration) linear;\n transition-property: transform, opacity;\n pointer-events: none;\n background-color: var(--%NS%sd-bg-overlay);\n min-width: 7.5rem;\n box-shadow: 0 calc(4 * var(--%NS%sd-shadow-size)) calc(4 * 4 * var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color), 0 var(--%NS%sd-shadow-size) calc(var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color);\n overflow: hidden;\n border-radius: var(--%NS%sd-radius-default);\n border: 1px solid var(--%NS%sd-dropdown-bd);\n}\nsd-dropdown-popup > div {\n width: 100%;\n height: 100%;\n overflow: auto;\n white-space: nowrap;\n}\nsd-dropdown-popup:focus {\n outline: 1px solid var(--%NS%sd-focus-ring-color);\n}\n@media all and (max-width: 520px) {\n sd-dropdown-popup {\n box-shadow: none;\n border: 1px solid var(--%NS%sd-bd-strong);\n }\n}\nsd-dropdown-popup[data-sd-mobile] {\n position: fixed;\n left: 0;\n right: 0;\n bottom: 0;\n top: auto;\n max-height: 80vh;\n border-radius: var(--%NS%sd-radius-default) var(--%NS%sd-radius-default) 0 0;\n opacity: 1;\n pointer-events: auto;\n transform: none;\n animation: sd-dropdown-slide-up var(--%NS%sd-animation-duration) ease-out;\n box-shadow: 0 calc(8 * var(--%NS%sd-shadow-size)) calc(8 * 4 * var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color), 0 var(--%NS%sd-shadow-size) calc(var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color);\n}\n\n@keyframes sd-dropdown-slide-up {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}"], encapsulation: 2 });
37
37
  }
38
38
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdDropdownPopup, [{
39
39
  type: Component,
@@ -30,7 +30,7 @@ export class SdGap {
30
30
  static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdGap, selectors: [["sd-gap"]], hostVars: 10, hostBindings: function SdGap_HostBindings(rf, ctx) { if (rf & 2) {
31
31
  i0.ɵɵattribute("data-sd-height", ctx.height())("data-sd-width", ctx.width());
32
32
  i0.ɵɵstyleProp("height", ctx.heightPx(), "px")("width", ctx.widthPx(), "px")("width", ctx.widthEm(), "em")("display", ctx._displayStyle());
33
- } }, inputs: { height: [1, "height"], heightPx: [1, "heightPx"], width: [1, "width"], widthPx: [1, "widthPx"], widthEm: [1, "widthEm"] }, decls: 0, vars: 0, template: function SdGap_Template(rf, ctx) { }, styles: ["sd-gap[data-sd-height=xxs] {\n height: var(--sd-gap-xxs);\n}\nsd-gap[data-sd-width=xxs] {\n width: var(--sd-gap-xxs);\n}\nsd-gap[data-sd-height=xs] {\n height: var(--sd-gap-xs);\n}\nsd-gap[data-sd-width=xs] {\n width: var(--sd-gap-xs);\n}\nsd-gap[data-sd-height=sm] {\n height: var(--sd-gap-sm);\n}\nsd-gap[data-sd-width=sm] {\n width: var(--sd-gap-sm);\n}\nsd-gap[data-sd-height=default] {\n height: var(--sd-gap-default);\n}\nsd-gap[data-sd-width=default] {\n width: var(--sd-gap-default);\n}\nsd-gap[data-sd-height=lg] {\n height: var(--sd-gap-lg);\n}\nsd-gap[data-sd-width=lg] {\n width: var(--sd-gap-lg);\n}\nsd-gap[data-sd-height=xl] {\n height: var(--sd-gap-xl);\n}\nsd-gap[data-sd-width=xl] {\n width: var(--sd-gap-xl);\n}\nsd-gap[data-sd-height=xxl] {\n height: var(--sd-gap-xxl);\n}\nsd-gap[data-sd-width=xxl] {\n width: var(--sd-gap-xxl);\n}\nsd-gap[data-sd-height=\"0\"] {\n height: var(--sd-gap-0);\n}\nsd-gap[data-sd-width=\"0\"] {\n width: var(--sd-gap-0);\n}\nsd-gap[data-sd-height=auto] {\n height: var(--sd-gap-auto);\n}\nsd-gap[data-sd-width=auto] {\n width: var(--sd-gap-auto);\n}"], encapsulation: 2 });
33
+ } }, inputs: { height: [1, "height"], heightPx: [1, "heightPx"], width: [1, "width"], widthPx: [1, "widthPx"], widthEm: [1, "widthEm"] }, decls: 0, vars: 0, template: function SdGap_Template(rf, ctx) { }, styles: ["sd-gap[data-sd-height=xxs] {\n height: var(--%NS%sd-gap-xxs);\n}\nsd-gap[data-sd-width=xxs] {\n width: var(--%NS%sd-gap-xxs);\n}\nsd-gap[data-sd-height=xs] {\n height: var(--%NS%sd-gap-xs);\n}\nsd-gap[data-sd-width=xs] {\n width: var(--%NS%sd-gap-xs);\n}\nsd-gap[data-sd-height=sm] {\n height: var(--%NS%sd-gap-sm);\n}\nsd-gap[data-sd-width=sm] {\n width: var(--%NS%sd-gap-sm);\n}\nsd-gap[data-sd-height=default] {\n height: var(--%NS%sd-gap-default);\n}\nsd-gap[data-sd-width=default] {\n width: var(--%NS%sd-gap-default);\n}\nsd-gap[data-sd-height=lg] {\n height: var(--%NS%sd-gap-lg);\n}\nsd-gap[data-sd-width=lg] {\n width: var(--%NS%sd-gap-lg);\n}\nsd-gap[data-sd-height=xl] {\n height: var(--%NS%sd-gap-xl);\n}\nsd-gap[data-sd-width=xl] {\n width: var(--%NS%sd-gap-xl);\n}\nsd-gap[data-sd-height=xxl] {\n height: var(--%NS%sd-gap-xxl);\n}\nsd-gap[data-sd-width=xxl] {\n width: var(--%NS%sd-gap-xxl);\n}\nsd-gap[data-sd-height=\"0\"] {\n height: var(--%NS%sd-gap-0);\n}\nsd-gap[data-sd-width=\"0\"] {\n width: var(--%NS%sd-gap-0);\n}\nsd-gap[data-sd-height=auto] {\n height: var(--%NS%sd-gap-auto);\n}\nsd-gap[data-sd-width=auto] {\n width: var(--%NS%sd-gap-auto);\n}"], encapsulation: 2 });
34
34
  }
35
35
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdGap, [{
36
36
  type: Component,
@@ -95,7 +95,7 @@ export class SdDateRangePicker {
95
95
  i0.ɵɵproperty("value", "\uBC94\uC704");
96
96
  i0.ɵɵadvance(2);
97
97
  i0.ɵɵconditional(ctx.periodType() === "\uBC94\uC704" ? 7 : 8);
98
- } }, dependencies: [SdSelect, SdSelectItem, SdRange, SdTextfield], styles: ["sd-date-range-picker {\n display: flex;\n align-items: center;\n flex-direction: row;\n gap: var(--sd-gap-sm);\n}\n@supports not (appearance: auto) {\n sd-date-range-picker {\n gap: 0;\n }\n sd-date-range-picker > * + * {\n margin-left: var(--sd-gap-sm);\n }\n sd-date-range-picker.gap-xxs {\n gap: 0;\n }\n sd-date-range-picker.gap-xxs > * + * {\n margin-left: var(--sd-gap-xxs);\n }\n sd-date-range-picker.gap-xs {\n gap: 0;\n }\n sd-date-range-picker.gap-xs > * + * {\n margin-left: var(--sd-gap-xs);\n }\n sd-date-range-picker.gap-sm {\n gap: 0;\n }\n sd-date-range-picker.gap-sm > * + * {\n margin-left: var(--sd-gap-sm);\n }\n sd-date-range-picker.gap-default {\n gap: 0;\n }\n sd-date-range-picker.gap-default > * + * {\n margin-left: var(--sd-gap-default);\n }\n sd-date-range-picker.gap-lg {\n gap: 0;\n }\n sd-date-range-picker.gap-lg > * + * {\n margin-left: var(--sd-gap-lg);\n }\n sd-date-range-picker.gap-xl {\n gap: 0;\n }\n sd-date-range-picker.gap-xl > * + * {\n margin-left: var(--sd-gap-xl);\n }\n sd-date-range-picker.gap-xxl {\n gap: 0;\n }\n sd-date-range-picker.gap-xxl > * + * {\n margin-left: var(--sd-gap-xxl);\n }\n sd-date-range-picker.gap-0 {\n gap: 0;\n }\n sd-date-range-picker.gap-0 > * + * {\n margin-left: var(--sd-gap-0);\n }\n sd-date-range-picker.gap-auto {\n gap: 0;\n }\n sd-date-range-picker.gap-auto > * + * {\n margin-left: var(--sd-gap-auto);\n }\n}"], encapsulation: 2 });
98
+ } }, dependencies: [SdSelect, SdSelectItem, SdRange, SdTextfield], styles: ["sd-date-range-picker {\n display: flex;\n align-items: center;\n flex-direction: row;\n gap: var(--%NS%sd-gap-sm);\n}\n@supports not (appearance: auto) {\n sd-date-range-picker {\n gap: 0;\n }\n sd-date-range-picker > * + * {\n margin-left: var(--%NS%sd-gap-sm);\n }\n sd-date-range-picker.gap-xxs {\n gap: 0;\n }\n sd-date-range-picker.gap-xxs > * + * {\n margin-left: var(--%NS%sd-gap-xxs);\n }\n sd-date-range-picker.gap-xs {\n gap: 0;\n }\n sd-date-range-picker.gap-xs > * + * {\n margin-left: var(--%NS%sd-gap-xs);\n }\n sd-date-range-picker.gap-sm {\n gap: 0;\n }\n sd-date-range-picker.gap-sm > * + * {\n margin-left: var(--%NS%sd-gap-sm);\n }\n sd-date-range-picker.gap-default {\n gap: 0;\n }\n sd-date-range-picker.gap-default > * + * {\n margin-left: var(--%NS%sd-gap-default);\n }\n sd-date-range-picker.gap-lg {\n gap: 0;\n }\n sd-date-range-picker.gap-lg > * + * {\n margin-left: var(--%NS%sd-gap-lg);\n }\n sd-date-range-picker.gap-xl {\n gap: 0;\n }\n sd-date-range-picker.gap-xl > * + * {\n margin-left: var(--%NS%sd-gap-xl);\n }\n sd-date-range-picker.gap-xxl {\n gap: 0;\n }\n sd-date-range-picker.gap-xxl > * + * {\n margin-left: var(--%NS%sd-gap-xxl);\n }\n sd-date-range-picker.gap-0 {\n gap: 0;\n }\n sd-date-range-picker.gap-0 > * + * {\n margin-left: var(--%NS%sd-gap-0);\n }\n sd-date-range-picker.gap-auto {\n gap: 0;\n }\n sd-date-range-picker.gap-auto > * + * {\n margin-left: var(--%NS%sd-gap-auto);\n }\n}"], encapsulation: 2 });
99
99
  }
100
100
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdDateRangePicker, [{
101
101
  type: Component,
@@ -159,7 +159,7 @@ export class SdNumpad {
159
159
  i0.ɵɵproperty("size", "lg");
160
160
  i0.ɵɵadvance(3);
161
161
  i0.ɵɵproperty("size", "lg");
162
- } }, dependencies: [SdTextfield, SdButton, NgIcon], styles: ["sd-numpad table {\n width: 100%;\n border-collapse: collapse;\n}\nsd-numpad table > * > tr > * {\n border: none;\n padding: var(--sd-gap-xxs);\n}\nsd-numpad table > * > tr > * > sd-button {\n border: none;\n}"], encapsulation: 2 });
162
+ } }, dependencies: [SdTextfield, SdButton, NgIcon], styles: ["sd-numpad table {\n width: 100%;\n border-collapse: collapse;\n}\nsd-numpad table > * > tr > * {\n border: none;\n padding: var(--%NS%sd-gap-xxs);\n}\nsd-numpad table > * > tr > * > sd-button {\n border: none;\n}"], encapsulation: 2 });
163
163
  }
164
164
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdNumpad, [{
165
165
  type: Component,
@@ -31,7 +31,7 @@ export class SdRange {
31
31
  i0.ɵɵproperty("type", ctx.type());
32
32
  i0.ɵɵtwoWayProperty("value", ctx.to);
33
33
  i0.ɵɵproperty("min", ctx.from())("required", ctx.required())("disabled", ctx.disabled())("inputStyle", ctx.inputStyle());
34
- } }, dependencies: [SdTextfield], styles: ["sd-range {\n display: flex;\n align-items: center;\n flex-direction: row;\n gap: var(--sd-gap-sm);\n}\n@supports not (appearance: auto) {\n sd-range {\n gap: 0;\n }\n sd-range > * + * {\n margin-left: var(--sd-gap-sm);\n }\n sd-range.gap-xxs {\n gap: 0;\n }\n sd-range.gap-xxs > * + * {\n margin-left: var(--sd-gap-xxs);\n }\n sd-range.gap-xs {\n gap: 0;\n }\n sd-range.gap-xs > * + * {\n margin-left: var(--sd-gap-xs);\n }\n sd-range.gap-sm {\n gap: 0;\n }\n sd-range.gap-sm > * + * {\n margin-left: var(--sd-gap-sm);\n }\n sd-range.gap-default {\n gap: 0;\n }\n sd-range.gap-default > * + * {\n margin-left: var(--sd-gap-default);\n }\n sd-range.gap-lg {\n gap: 0;\n }\n sd-range.gap-lg > * + * {\n margin-left: var(--sd-gap-lg);\n }\n sd-range.gap-xl {\n gap: 0;\n }\n sd-range.gap-xl > * + * {\n margin-left: var(--sd-gap-xl);\n }\n sd-range.gap-xxl {\n gap: 0;\n }\n sd-range.gap-xxl > * + * {\n margin-left: var(--sd-gap-xxl);\n }\n sd-range.gap-0 {\n gap: 0;\n }\n sd-range.gap-0 > * + * {\n margin-left: var(--sd-gap-0);\n }\n sd-range.gap-auto {\n gap: 0;\n }\n sd-range.gap-auto > * + * {\n margin-left: var(--sd-gap-auto);\n }\n}"], encapsulation: 2 });
34
+ } }, dependencies: [SdTextfield], styles: ["sd-range {\n display: flex;\n align-items: center;\n flex-direction: row;\n gap: var(--%NS%sd-gap-sm);\n}\n@supports not (appearance: auto) {\n sd-range {\n gap: 0;\n }\n sd-range > * + * {\n margin-left: var(--%NS%sd-gap-sm);\n }\n sd-range.gap-xxs {\n gap: 0;\n }\n sd-range.gap-xxs > * + * {\n margin-left: var(--%NS%sd-gap-xxs);\n }\n sd-range.gap-xs {\n gap: 0;\n }\n sd-range.gap-xs > * + * {\n margin-left: var(--%NS%sd-gap-xs);\n }\n sd-range.gap-sm {\n gap: 0;\n }\n sd-range.gap-sm > * + * {\n margin-left: var(--%NS%sd-gap-sm);\n }\n sd-range.gap-default {\n gap: 0;\n }\n sd-range.gap-default > * + * {\n margin-left: var(--%NS%sd-gap-default);\n }\n sd-range.gap-lg {\n gap: 0;\n }\n sd-range.gap-lg > * + * {\n margin-left: var(--%NS%sd-gap-lg);\n }\n sd-range.gap-xl {\n gap: 0;\n }\n sd-range.gap-xl > * + * {\n margin-left: var(--%NS%sd-gap-xl);\n }\n sd-range.gap-xxl {\n gap: 0;\n }\n sd-range.gap-xxl > * + * {\n margin-left: var(--%NS%sd-gap-xxl);\n }\n sd-range.gap-0 {\n gap: 0;\n }\n sd-range.gap-0 > * + * {\n margin-left: var(--%NS%sd-gap-0);\n }\n sd-range.gap-auto {\n gap: 0;\n }\n sd-range.gap-auto > * + * {\n margin-left: var(--%NS%sd-gap-auto);\n }\n}"], encapsulation: 2 });
35
35
  }
36
36
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdRange, [{
37
37
  type: Component,
@@ -100,7 +100,7 @@ export class SdTextarea {
100
100
  i0.ɵɵconditional(ctx.value() ? 1 : ctx.placeholder() ? 2 : 3);
101
101
  i0.ɵɵadvance(3);
102
102
  i0.ɵɵconditional(!ctx.readonly() && !ctx.disabled() ? 4 : -1);
103
- } }, styles: ["sd-textarea {\n display: block;\n position: relative;\n}\nsd-textarea > textarea,\nsd-textarea > ._contents {\n display: block;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n border: 1px solid transparent;\n font-size: var(--sd-font-size-default);\n font-family: var(--sd-font-family);\n font-variant-numeric: tabular-nums;\n line-height: var(--sd-line-height);\n color: var(--sd-tx-default);\n font-family: var(--sd-font-family-field);\n resize: none;\n overflow: auto;\n width: 100%;\n border: 1px solid var(--sd-bd-field);\n border-radius: var(--sd-radius-default);\n background-color: var(--sd-bg-field);\n}\nsd-textarea > textarea:focus,\nsd-textarea > ._contents:focus {\n outline: none;\n border-color: var(--sd-focus-ring-color);\n}\nsd-textarea > textarea::-webkit-scrollbar,\nsd-textarea > ._contents::-webkit-scrollbar {\n display: none;\n}\nsd-textarea > textarea::-webkit-input-placeholder,\nsd-textarea > ._contents::-webkit-input-placeholder {\n color: var(--sd-tx-faint);\n}\nsd-textarea > ._contents > pre {\n font-family: inherit;\n}\nsd-textarea:not([data-sd-inset=true]):not([data-sd-disabled=true]) > ._contents {\n height: 0;\n max-height: 0;\n padding-top: 0;\n padding-bottom: 0;\n margin-top: 0;\n margin-bottom: 0;\n}\nsd-textarea[data-sd-theme=gray] > textarea,\nsd-textarea[data-sd-theme=gray] > ._contents {\n background-color: var(--sd-bg-gray-subtle);\n}\nsd-textarea[data-sd-theme=blue-gray] > textarea,\nsd-textarea[data-sd-theme=blue-gray] > ._contents {\n background-color: var(--sd-bg-blue-gray-subtle);\n}\nsd-textarea[data-sd-theme=primary] > textarea,\nsd-textarea[data-sd-theme=primary] > ._contents {\n background-color: var(--sd-bg-primary-subtle);\n}\nsd-textarea[data-sd-theme=info] > textarea,\nsd-textarea[data-sd-theme=info] > ._contents {\n background-color: var(--sd-bg-info-subtle);\n}\nsd-textarea[data-sd-theme=success] > textarea,\nsd-textarea[data-sd-theme=success] > ._contents {\n background-color: var(--sd-bg-success-subtle);\n}\nsd-textarea[data-sd-theme=warning] > textarea,\nsd-textarea[data-sd-theme=warning] > ._contents {\n background-color: var(--sd-bg-warning-subtle);\n}\nsd-textarea[data-sd-theme=danger] > textarea,\nsd-textarea[data-sd-theme=danger] > ._contents {\n background-color: var(--sd-bg-danger-subtle);\n}\nsd-textarea[data-sd-size=sm] > textarea,\nsd-textarea[data-sd-size=sm] > ._contents {\n padding: var(--sd-gap-xs) var(--sd-gap-sm);\n}\nsd-textarea[data-sd-size=lg] > textarea,\nsd-textarea[data-sd-size=lg] > ._contents {\n padding: var(--sd-gap-default) var(--sd-gap-lg);\n}\nsd-textarea[data-sd-inline=true] {\n display: inline-block;\n vertical-align: top;\n}\nsd-textarea[data-sd-inline=true] > textarea,\nsd-textarea[data-sd-inline=true] > ._contents {\n width: auto;\n vertical-align: top;\n}\nsd-textarea[data-sd-inset=true] > ._contents {\n display: block;\n}\nsd-textarea[data-sd-inset=true] > textarea {\n position: absolute;\n top: 0;\n left: 0;\n}\nsd-textarea[data-sd-inset=true] > textarea,\nsd-textarea[data-sd-inset=true] > ._contents {\n width: 100%;\n border: none;\n border-radius: 0;\n}\nsd-textarea[data-sd-inset=true] > textarea:focus {\n outline: 1px solid var(--sd-focus-ring-color);\n outline-offset: -1px;\n}\nsd-textarea[data-sd-disabled=true] > ._contents {\n display: block;\n background-color: var(--sd-bg-disabled);\n color: var(--sd-tx-disabled);\n}\nsd-textarea[data-sd-disabled=true][data-sd-inset=true] > ._contents {\n background-color: var(--sd-bg-content);\n color: var(--sd-tx-default);\n}"], encapsulation: 2 });
103
+ } }, styles: ["sd-textarea {\n display: block;\n position: relative;\n}\nsd-textarea > textarea,\nsd-textarea > ._contents {\n display: block;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n border: 1px solid transparent;\n font-size: var(--%NS%sd-font-size-default);\n font-family: var(--%NS%sd-font-family);\n font-variant-numeric: tabular-nums;\n line-height: var(--%NS%sd-line-height);\n color: var(--%NS%sd-tx-default);\n font-family: var(--%NS%sd-font-family-field);\n resize: none;\n overflow: auto;\n width: 100%;\n border: 1px solid var(--%NS%sd-bd-field);\n border-radius: var(--%NS%sd-radius-default);\n background-color: var(--%NS%sd-bg-field);\n}\nsd-textarea > textarea:focus,\nsd-textarea > ._contents:focus {\n outline: none;\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-textarea > textarea::-webkit-scrollbar,\nsd-textarea > ._contents::-webkit-scrollbar {\n display: none;\n}\nsd-textarea > textarea::-webkit-input-placeholder,\nsd-textarea > ._contents::-webkit-input-placeholder {\n color: var(--%NS%sd-tx-faint);\n}\nsd-textarea > ._contents > pre {\n font-family: inherit;\n}\nsd-textarea:not([data-sd-inset=true]):not([data-sd-disabled=true]) > ._contents {\n height: 0;\n max-height: 0;\n padding-top: 0;\n padding-bottom: 0;\n margin-top: 0;\n margin-bottom: 0;\n}\nsd-textarea[data-sd-theme=gray] > textarea,\nsd-textarea[data-sd-theme=gray] > ._contents {\n background-color: var(--%NS%sd-bg-gray-subtle);\n}\nsd-textarea[data-sd-theme=blue-gray] > textarea,\nsd-textarea[data-sd-theme=blue-gray] > ._contents {\n background-color: var(--%NS%sd-bg-blue-gray-subtle);\n}\nsd-textarea[data-sd-theme=primary] > textarea,\nsd-textarea[data-sd-theme=primary] > ._contents {\n background-color: var(--%NS%sd-bg-primary-subtle);\n}\nsd-textarea[data-sd-theme=info] > textarea,\nsd-textarea[data-sd-theme=info] > ._contents {\n background-color: var(--%NS%sd-bg-info-subtle);\n}\nsd-textarea[data-sd-theme=success] > textarea,\nsd-textarea[data-sd-theme=success] > ._contents {\n background-color: var(--%NS%sd-bg-success-subtle);\n}\nsd-textarea[data-sd-theme=warning] > textarea,\nsd-textarea[data-sd-theme=warning] > ._contents {\n background-color: var(--%NS%sd-bg-warning-subtle);\n}\nsd-textarea[data-sd-theme=danger] > textarea,\nsd-textarea[data-sd-theme=danger] > ._contents {\n background-color: var(--%NS%sd-bg-danger-subtle);\n}\nsd-textarea[data-sd-size=sm] > textarea,\nsd-textarea[data-sd-size=sm] > ._contents {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm);\n}\nsd-textarea[data-sd-size=lg] > textarea,\nsd-textarea[data-sd-size=lg] > ._contents {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-lg);\n}\nsd-textarea[data-sd-inline=true] {\n display: inline-block;\n vertical-align: top;\n}\nsd-textarea[data-sd-inline=true] > textarea,\nsd-textarea[data-sd-inline=true] > ._contents {\n width: auto;\n vertical-align: top;\n}\nsd-textarea[data-sd-inset=true] > ._contents {\n display: block;\n}\nsd-textarea[data-sd-inset=true] > textarea {\n position: absolute;\n top: 0;\n left: 0;\n}\nsd-textarea[data-sd-inset=true] > textarea,\nsd-textarea[data-sd-inset=true] > ._contents {\n width: 100%;\n border: none;\n border-radius: 0;\n}\nsd-textarea[data-sd-inset=true] > textarea:focus {\n outline: 1px solid var(--%NS%sd-focus-ring-color);\n outline-offset: -1px;\n}\nsd-textarea[data-sd-disabled=true] > ._contents {\n display: block;\n background-color: var(--%NS%sd-bg-disabled);\n color: var(--%NS%sd-tx-disabled);\n}\nsd-textarea[data-sd-disabled=true][data-sd-inset=true] > ._contents {\n background-color: var(--%NS%sd-bg-content);\n color: var(--%NS%sd-tx-default);\n}"], encapsulation: 2 });
104
104
  }
105
105
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTextarea, [{
106
106
  type: Component,
@@ -251,7 +251,7 @@ export class SdTextfield {
251
251
  i0.ɵɵconditional(ctx.controlType() === "password" ? 1 : 2);
252
252
  i0.ɵɵadvance(2);
253
253
  i0.ɵɵconditional(!ctx.readonly() && !ctx.disabled() ? 3 : -1);
254
- } }, styles: ["sd-textfield {\n display: block;\n position: relative;\n}\nsd-textfield > input,\nsd-textfield > ._contents {\n display: block;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n border: 1px solid transparent;\n font-size: var(--sd-font-size-default);\n font-family: var(--sd-font-family);\n font-variant-numeric: tabular-nums;\n line-height: var(--sd-line-height);\n color: var(--sd-tx-default);\n font-family: var(--sd-font-family-field);\n overflow: auto;\n width: 100%;\n border: 1px solid var(--sd-bd-field);\n border-radius: var(--sd-radius-default);\n background-color: var(--sd-bg-field);\n}\nsd-textfield > input:focus,\nsd-textfield > ._contents:focus {\n outline: none;\n border-color: var(--sd-focus-ring-color);\n}\nsd-textfield > input[type=date], sd-textfield > input[type=month], sd-textfield > input[type=datetime-local],\nsd-textfield > ._contents[type=date],\nsd-textfield > ._contents[type=month],\nsd-textfield > ._contents[type=datetime-local] {\n padding-top: calc(var(--sd-gap-sm) - 1px);\n padding-bottom: calc(var(--sd-gap-sm) - 1px);\n}\nsd-textfield > input::-webkit-scrollbar,\nsd-textfield > ._contents::-webkit-scrollbar {\n display: none;\n}\nsd-textfield > input::-webkit-input-placeholder,\nsd-textfield > ._contents::-webkit-input-placeholder {\n color: var(--sd-tx-faint);\n}\nsd-textfield > input::-webkit-outer-spin-button, sd-textfield > input::-webkit-inner-spin-button,\nsd-textfield > ._contents::-webkit-outer-spin-button,\nsd-textfield > ._contents::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\nsd-textfield > input::-webkit-calendar-picker-indicator,\nsd-textfield > ._contents::-webkit-calendar-picker-indicator {\n cursor: pointer;\n margin: auto;\n}\nsd-textfield > ._contents {\n display: none;\n}\nsd-textfield > ._contents > pre {\n font-family: inherit;\n}\nsd-textfield[data-sd-type=number] > input,\nsd-textfield[data-sd-type=number] > ._contents {\n text-align: right;\n}\nsd-textfield[data-sd-theme=gray] > input,\nsd-textfield[data-sd-theme=gray] > ._contents {\n background-color: var(--sd-bg-gray-subtle);\n}\nsd-textfield[data-sd-theme=blue-gray] > input,\nsd-textfield[data-sd-theme=blue-gray] > ._contents {\n background-color: var(--sd-bg-blue-gray-subtle);\n}\nsd-textfield[data-sd-theme=primary] > input,\nsd-textfield[data-sd-theme=primary] > ._contents {\n background-color: var(--sd-bg-primary-subtle);\n}\nsd-textfield[data-sd-theme=info] > input,\nsd-textfield[data-sd-theme=info] > ._contents {\n background-color: var(--sd-bg-info-subtle);\n}\nsd-textfield[data-sd-theme=success] > input,\nsd-textfield[data-sd-theme=success] > ._contents {\n background-color: var(--sd-bg-success-subtle);\n}\nsd-textfield[data-sd-theme=warning] > input,\nsd-textfield[data-sd-theme=warning] > ._contents {\n background-color: var(--sd-bg-warning-subtle);\n}\nsd-textfield[data-sd-theme=danger] > input,\nsd-textfield[data-sd-theme=danger] > ._contents {\n background-color: var(--sd-bg-danger-subtle);\n}\nsd-textfield[data-sd-size=sm] > input,\nsd-textfield[data-sd-size=sm] > ._contents {\n padding: var(--sd-gap-xs) var(--sd-gap-sm);\n}\nsd-textfield[data-sd-size=sm] > input[type=date], sd-textfield[data-sd-size=sm] > input[type=month], sd-textfield[data-sd-size=sm] > input[type=datetime-local], sd-textfield[data-sd-size=sm] > input[type=color],\nsd-textfield[data-sd-size=sm] > ._contents[type=date],\nsd-textfield[data-sd-size=sm] > ._contents[type=month],\nsd-textfield[data-sd-size=sm] > ._contents[type=datetime-local],\nsd-textfield[data-sd-size=sm] > ._contents[type=color] {\n padding-top: calc(var(--sd-gap-xs) - 1px);\n padding-bottom: calc(var(--sd-gap-xs) - 1px);\n}\nsd-textfield[data-sd-size=lg] > input,\nsd-textfield[data-sd-size=lg] > ._contents {\n padding: var(--sd-gap-default) var(--sd-gap-lg);\n}\nsd-textfield[data-sd-size=lg] > input[type=date], sd-textfield[data-sd-size=lg] > input[type=month], sd-textfield[data-sd-size=lg] > input[type=datetime-local], sd-textfield[data-sd-size=lg] > input[type=color],\nsd-textfield[data-sd-size=lg] > ._contents[type=date],\nsd-textfield[data-sd-size=lg] > ._contents[type=month],\nsd-textfield[data-sd-size=lg] > ._contents[type=datetime-local],\nsd-textfield[data-sd-size=lg] > ._contents[type=color] {\n padding-top: calc(var(--sd-gap-default) - 1px);\n padding-bottom: calc(var(--sd-gap-default) - 1px);\n}\nsd-textfield[data-sd-inline=true] {\n display: inline-block;\n vertical-align: top;\n}\nsd-textfield[data-sd-inline=true] > input,\nsd-textfield[data-sd-inline=true] > ._contents {\n width: auto;\n vertical-align: top;\n}\nsd-textfield[data-sd-inset=true] > ._contents {\n display: block;\n}\nsd-textfield[data-sd-inset=true] > input {\n position: absolute;\n top: 0;\n left: 0;\n}\nsd-textfield[data-sd-inset=true] > input,\nsd-textfield[data-sd-inset=true] > ._contents {\n width: 100%;\n border: none;\n border-radius: 0;\n}\nsd-textfield[data-sd-inset=true] > input:focus {\n outline: 1px solid var(--sd-focus-ring-color);\n outline-offset: -1px;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=month] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=month] > ._contents {\n min-width: 8.25em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=date] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=date] > ._contents {\n min-width: 8.25em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=datetime-local] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=datetime-local] > ._contents {\n min-width: 14em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=year] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=year] > ._contents {\n min-width: 4em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color] > ._contents {\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit) + var(--sd-gap-sm) * 2);\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=sm] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=sm] > ._contents {\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit) + var(--sd-gap-xs) * 2);\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=lg] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=lg] > ._contents {\n height: calc(var(--sd-font-size-default) * var(--sd-line-height-strip-unit) + var(--sd-gap-default) * 2);\n}\nsd-textfield[data-sd-disabled=true] > ._contents {\n display: block;\n background-color: var(--sd-bg-disabled);\n color: var(--sd-tx-disabled);\n}\nsd-textfield[data-sd-disabled=true][data-sd-inset=true] > ._contents {\n background-color: var(--sd-bg-content);\n color: var(--sd-tx-default);\n}\nsd-textfield[data-sd-readonly=true] > ._contents {\n display: block;\n}"], encapsulation: 2 });
254
+ } }, styles: ["sd-textfield {\n display: block;\n position: relative;\n}\nsd-textfield > input,\nsd-textfield > ._contents {\n display: block;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n border: 1px solid transparent;\n font-size: var(--%NS%sd-font-size-default);\n font-family: var(--%NS%sd-font-family);\n font-variant-numeric: tabular-nums;\n line-height: var(--%NS%sd-line-height);\n color: var(--%NS%sd-tx-default);\n font-family: var(--%NS%sd-font-family-field);\n overflow: auto;\n width: 100%;\n border: 1px solid var(--%NS%sd-bd-field);\n border-radius: var(--%NS%sd-radius-default);\n background-color: var(--%NS%sd-bg-field);\n}\nsd-textfield > input:focus,\nsd-textfield > ._contents:focus {\n outline: none;\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-textfield > input[type=date], sd-textfield > input[type=month], sd-textfield > input[type=datetime-local],\nsd-textfield > ._contents[type=date],\nsd-textfield > ._contents[type=month],\nsd-textfield > ._contents[type=datetime-local] {\n padding-top: calc(var(--%NS%sd-gap-sm) - 1px);\n padding-bottom: calc(var(--%NS%sd-gap-sm) - 1px);\n}\nsd-textfield > input::-webkit-scrollbar,\nsd-textfield > ._contents::-webkit-scrollbar {\n display: none;\n}\nsd-textfield > input::-webkit-input-placeholder,\nsd-textfield > ._contents::-webkit-input-placeholder {\n color: var(--%NS%sd-tx-faint);\n}\nsd-textfield > input::-webkit-outer-spin-button, sd-textfield > input::-webkit-inner-spin-button,\nsd-textfield > ._contents::-webkit-outer-spin-button,\nsd-textfield > ._contents::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\nsd-textfield > input::-webkit-calendar-picker-indicator,\nsd-textfield > ._contents::-webkit-calendar-picker-indicator {\n cursor: pointer;\n margin: auto;\n}\nsd-textfield > ._contents {\n display: none;\n}\nsd-textfield > ._contents > pre {\n font-family: inherit;\n}\nsd-textfield[data-sd-type=number] > input,\nsd-textfield[data-sd-type=number] > ._contents {\n text-align: right;\n}\nsd-textfield[data-sd-theme=gray] > input,\nsd-textfield[data-sd-theme=gray] > ._contents {\n background-color: var(--%NS%sd-bg-gray-subtle);\n}\nsd-textfield[data-sd-theme=blue-gray] > input,\nsd-textfield[data-sd-theme=blue-gray] > ._contents {\n background-color: var(--%NS%sd-bg-blue-gray-subtle);\n}\nsd-textfield[data-sd-theme=primary] > input,\nsd-textfield[data-sd-theme=primary] > ._contents {\n background-color: var(--%NS%sd-bg-primary-subtle);\n}\nsd-textfield[data-sd-theme=info] > input,\nsd-textfield[data-sd-theme=info] > ._contents {\n background-color: var(--%NS%sd-bg-info-subtle);\n}\nsd-textfield[data-sd-theme=success] > input,\nsd-textfield[data-sd-theme=success] > ._contents {\n background-color: var(--%NS%sd-bg-success-subtle);\n}\nsd-textfield[data-sd-theme=warning] > input,\nsd-textfield[data-sd-theme=warning] > ._contents {\n background-color: var(--%NS%sd-bg-warning-subtle);\n}\nsd-textfield[data-sd-theme=danger] > input,\nsd-textfield[data-sd-theme=danger] > ._contents {\n background-color: var(--%NS%sd-bg-danger-subtle);\n}\nsd-textfield[data-sd-size=sm] > input,\nsd-textfield[data-sd-size=sm] > ._contents {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm);\n}\nsd-textfield[data-sd-size=sm] > input[type=date], sd-textfield[data-sd-size=sm] > input[type=month], sd-textfield[data-sd-size=sm] > input[type=datetime-local], sd-textfield[data-sd-size=sm] > input[type=color],\nsd-textfield[data-sd-size=sm] > ._contents[type=date],\nsd-textfield[data-sd-size=sm] > ._contents[type=month],\nsd-textfield[data-sd-size=sm] > ._contents[type=datetime-local],\nsd-textfield[data-sd-size=sm] > ._contents[type=color] {\n padding-top: calc(var(--%NS%sd-gap-xs) - 1px);\n padding-bottom: calc(var(--%NS%sd-gap-xs) - 1px);\n}\nsd-textfield[data-sd-size=lg] > input,\nsd-textfield[data-sd-size=lg] > ._contents {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-lg);\n}\nsd-textfield[data-sd-size=lg] > input[type=date], sd-textfield[data-sd-size=lg] > input[type=month], sd-textfield[data-sd-size=lg] > input[type=datetime-local], sd-textfield[data-sd-size=lg] > input[type=color],\nsd-textfield[data-sd-size=lg] > ._contents[type=date],\nsd-textfield[data-sd-size=lg] > ._contents[type=month],\nsd-textfield[data-sd-size=lg] > ._contents[type=datetime-local],\nsd-textfield[data-sd-size=lg] > ._contents[type=color] {\n padding-top: calc(var(--%NS%sd-gap-default) - 1px);\n padding-bottom: calc(var(--%NS%sd-gap-default) - 1px);\n}\nsd-textfield[data-sd-inline=true] {\n display: inline-block;\n vertical-align: top;\n}\nsd-textfield[data-sd-inline=true] > input,\nsd-textfield[data-sd-inline=true] > ._contents {\n width: auto;\n vertical-align: top;\n}\nsd-textfield[data-sd-inset=true] > ._contents {\n display: block;\n}\nsd-textfield[data-sd-inset=true] > input {\n position: absolute;\n top: 0;\n left: 0;\n}\nsd-textfield[data-sd-inset=true] > input,\nsd-textfield[data-sd-inset=true] > ._contents {\n width: 100%;\n border: none;\n border-radius: 0;\n}\nsd-textfield[data-sd-inset=true] > input:focus {\n outline: 1px solid var(--%NS%sd-focus-ring-color);\n outline-offset: -1px;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=month] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=month] > ._contents {\n min-width: 8.25em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=date] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=date] > ._contents {\n min-width: 8.25em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=datetime-local] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=datetime-local] > ._contents {\n min-width: 14em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=year] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=year] > ._contents {\n min-width: 4em;\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color] > ._contents {\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit) + var(--%NS%sd-gap-sm) * 2);\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=sm] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=sm] > ._contents {\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit) + var(--%NS%sd-gap-xs) * 2);\n}\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=lg] > input,\nsd-textfield[data-sd-inset=true][data-sd-type=color][data-sd-size=lg] > ._contents {\n height: calc(var(--%NS%sd-font-size-default) * var(--%NS%sd-line-height-strip-unit) + var(--%NS%sd-gap-default) * 2);\n}\nsd-textfield[data-sd-disabled=true] > ._contents {\n display: block;\n background-color: var(--%NS%sd-bg-disabled);\n color: var(--%NS%sd-tx-disabled);\n}\nsd-textfield[data-sd-disabled=true][data-sd-inset=true] > ._contents {\n background-color: var(--%NS%sd-bg-content);\n color: var(--%NS%sd-tx-default);\n}\nsd-textfield[data-sd-readonly=true] > ._contents {\n display: block;\n}"], encapsulation: 2 });
255
255
  }
256
256
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTextfield, [{
257
257
  type: Component,
@@ -89,7 +89,7 @@ export class SdListItem {
89
89
  i0.ɵɵqueryAdvance(2);
90
90
  } }, hostVars: 8, hostBindings: function SdListItem_HostBindings(rf, ctx) { if (rf & 2) {
91
91
  i0.ɵɵattribute("data-sd-layout", ctx.layout())("data-sd-open", ctx.open())("data-sd-selected", ctx.selected())("data-sd-readonly", ctx.readonly())("data-sd-has-children", ctx.hasChildren())("data-sd-has-selected-icon", ctx.selectedIcon() != null);
92
- i0.ɵɵstyleProp("--sd-list-item-depth", ctx.depth());
92
+ i0.ɵɵstyleProp("--%NS%sd-list-item-depth", ctx.depth());
93
93
  } }, inputs: { layout: [1, "layout"], open: [1, "open"], selected: [1, "selected"], selectedIcon: [1, "selectedIcon"], readonly: [1, "readonly"], contentStyle: [1, "contentStyle"], contentClass: [1, "contentClass"] }, outputs: { open: "openChange" }, ngContentSelectors: _c2, decls: 7, vars: 9, consts: [["tabindex", "0", 1, "_content", 3, "click", "keydown.enter", "sdRipple"], [3, "tx-primary", "tx-faint", "svg"], [1, "_label"], [1, "_tool"], [3, "open"], [3, "svg"], [3, "ngTemplateOutlet"], [1, "_children"], [1, "_indent-guide"]], template: function SdListItem_Template(rf, ctx) { if (rf & 1) {
94
94
  i0.ɵɵprojectionDef(_c1);
95
95
  i0.ɵɵelementStart(0, "div", 0);
@@ -114,7 +114,7 @@ export class SdListItem {
114
114
  i0.ɵɵconditional(ctx.layout() === "accordion" && ctx.hasChildren() ? 5 : -1);
115
115
  i0.ɵɵadvance();
116
116
  i0.ɵɵconditional(ctx.hasChildren() ? 6 : -1);
117
- } }, dependencies: [SdCollapse, SdCollapseIcon, NgTemplateOutlet, NgIcon, SdRipple], styles: ["sd-list-item {\n display: block;\n}\nsd-list-item > ._content {\n display: flex;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n cursor: pointer;\n gap: var(--sd-gap-xs);\n border-radius: var(--sd-radius-default);\n transition: background var(--sd-animation-duration) ease-in;\n}\nsd-list-item > ._content > ._label {\n flex: 1 1 auto;\n overflow: auto;\n}\nsd-list-item > ._content:focus-visible {\n outline: none;\n transition: background var(--sd-animation-duration) ease-out;\n background-color: var(--sd-bg-state-hover);\n}\nsd-list-item[data-sd-selected=true] > ._content {\n background-color: var(--sd-bg-state-selected);\n font-weight: bold;\n}\nsd-list-item[data-sd-has-selected-icon=true][data-sd-selected=true] > ._content {\n color: var(--sd-tx-default);\n}\nsd-list-item[data-sd-has-selected-icon=true][data-sd-selected=true] > ._content:hover {\n background-color: var(--sd-bg-state-hover);\n}\nsd-list-item[data-sd-readonly=true] > ._content {\n cursor: default;\n}\nsd-list-item > sd-collapse > ._content > ._children {\n position: relative;\n}\nsd-list-item > sd-collapse > ._content > ._children > ._indent-guide {\n position: absolute;\n top: 0;\n bottom: 0;\n left: calc(0.65em + 1.3em * var(--sd-list-item-depth, 0));\n width: 0;\n border-left: 1px solid var(--sd-bd-soft);\n pointer-events: none;\n}\nsd-list-item[data-sd-layout=accordion]:not([data-sd-readonly=true]) > ._content:hover {\n transition: background var(--sd-animation-duration) ease-out;\n background-color: var(--sd-bg-state-hover);\n}\nsd-list-item[data-sd-layout=accordion] > sd-collapse > ._content > ._children > sd-list > sd-list-item > ._content {\n padding-left: calc(1.3em * var(--sd-list-item-depth, 1));\n}\nsd-list-item[data-sd-layout=flat][data-sd-has-children=true] > ._content {\n display: block;\n background-color: transparent;\n cursor: default;\n font-size: var(--sd-font-size-sm);\n opacity: 0.7;\n margin: 0;\n}\n\n.sd-theme-mobile > sd-list-item > ._content:hover {\n background-color: transparent;\n}"], encapsulation: 2 });
117
+ } }, dependencies: [SdCollapse, SdCollapseIcon, NgTemplateOutlet, NgIcon, SdRipple], styles: ["sd-list-item {\n display: block;\n}\nsd-list-item > ._content {\n display: flex;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n cursor: pointer;\n gap: var(--%NS%sd-gap-xs);\n border-radius: var(--%NS%sd-radius-default);\n transition: background var(--%NS%sd-animation-duration) ease-in;\n}\nsd-list-item > ._content > ._label {\n flex: 1 1 auto;\n overflow: auto;\n}\nsd-list-item > ._content:focus-visible {\n outline: none;\n transition: background var(--%NS%sd-animation-duration) ease-out;\n background-color: var(--%NS%sd-bg-state-hover);\n}\nsd-list-item[data-sd-selected=true] > ._content {\n background-color: var(--%NS%sd-bg-state-selected);\n font-weight: bold;\n}\nsd-list-item[data-sd-has-selected-icon=true][data-sd-selected=true] > ._content {\n color: var(--%NS%sd-tx-default);\n}\nsd-list-item[data-sd-has-selected-icon=true][data-sd-selected=true] > ._content:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n}\nsd-list-item[data-sd-readonly=true] > ._content {\n cursor: default;\n}\nsd-list-item > sd-collapse > ._content > ._children {\n position: relative;\n}\nsd-list-item > sd-collapse > ._content > ._children > ._indent-guide {\n position: absolute;\n top: 0;\n bottom: 0;\n left: calc(0.65em + 1.3em * var(--%NS%sd-list-item-depth, 0));\n width: 0;\n border-left: 1px solid var(--%NS%sd-bd-soft);\n pointer-events: none;\n}\nsd-list-item[data-sd-layout=accordion]:not([data-sd-readonly=true]) > ._content:hover {\n transition: background var(--%NS%sd-animation-duration) ease-out;\n background-color: var(--%NS%sd-bg-state-hover);\n}\nsd-list-item[data-sd-layout=accordion] > sd-collapse > ._content > ._children > sd-list > sd-list-item > ._content {\n padding-left: calc(1.3em * var(--%NS%sd-list-item-depth, 1));\n}\nsd-list-item[data-sd-layout=flat][data-sd-has-children=true] > ._content {\n display: block;\n background-color: transparent;\n cursor: default;\n font-size: var(--%NS%sd-font-size-sm);\n opacity: 0.7;\n margin: 0;\n}\n\n.sd-theme-mobile > sd-list-item > ._content:hover {\n background-color: transparent;\n}"], encapsulation: 2 });
118
118
  }
119
119
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdListItem, [{
120
120
  type: Component,
@@ -9,7 +9,7 @@ export class SdList {
9
9
  } }, inputs: { inset: [1, "inset"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdList_Template(rf, ctx) { if (rf & 1) {
10
10
  i0.ɵɵprojectionDef();
11
11
  i0.ɵɵprojection(0);
12
- } }, styles: ["sd-list {\n display: flex;\n flex-direction: column;\n user-select: none;\n background-color: var(--sd-bg-content);\n border: 1px solid var(--sd-bd-strong);\n border-radius: var(--sd-radius-default);\n padding: var(--sd-gap-sm);\n gap: var(--sd-gap-xs);\n}\nsd-list[data-sd-inset=true] {\n background-color: transparent;\n border: none;\n}\nsd-list[data-sd-inset=true] sd-list {\n background-color: transparent;\n}\nsd-list sd-list-item sd-list {\n border-color: transparent;\n border-radius: 0;\n padding: 0;\n background-color: transparent;\n}"], encapsulation: 2 });
12
+ } }, styles: ["sd-list {\n display: flex;\n flex-direction: column;\n user-select: none;\n background-color: var(--%NS%sd-bg-content);\n border: 1px solid var(--%NS%sd-bd-strong);\n border-radius: var(--%NS%sd-radius-default);\n padding: var(--%NS%sd-gap-sm);\n gap: var(--%NS%sd-gap-xs);\n}\nsd-list[data-sd-inset=true] {\n background-color: transparent;\n border: none;\n}\nsd-list[data-sd-inset=true] sd-list {\n background-color: transparent;\n}\nsd-list sd-list-item sd-list {\n border-color: transparent;\n border-radius: 0;\n padding: 0;\n background-color: transparent;\n}"], encapsulation: 2 });
13
13
  }
14
14
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdList, [{
15
15
  type: Component,
@@ -115,7 +115,7 @@ export class SdPagination {
115
115
  i0.ɵɵproperty("disabled", !ctx.hasNext());
116
116
  i0.ɵɵadvance();
117
117
  i0.ɵɵproperty("svg", ctx.icons.tablerChevronsRight);
118
- } }, dependencies: [SdAnchor, NgIcon], styles: ["sd-pagination > sd-anchor {\n display: inline-block;\n padding: var(--sd-gap-xxs) var(--sd-gap-xs);\n}"], encapsulation: 2 });
118
+ } }, dependencies: [SdAnchor, NgIcon], styles: ["sd-pagination > sd-anchor {\n display: inline-block;\n padding: var(--%NS%sd-gap-xxs) var(--%NS%sd-gap-xs);\n}"], encapsulation: 2 });
119
119
  }
120
120
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdPagination, [{
121
121
  type: Component,
@@ -10,7 +10,7 @@ export class SdSelectButton {
10
10
  static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSelectButton, selectors: [["sd-select-button"]], ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdSelectButton_Template(rf, ctx) { if (rf & 1) {
11
11
  i0.ɵɵprojectionDef();
12
12
  i0.ɵɵprojection(0);
13
- } }, styles: ["sd-select-button {\n display: block;\n background-color: var(--sd-bg-content);\n font-weight: bold;\n cursor: pointer;\n color: var(--sd-tx-primary);\n transition: background var(--sd-animation-duration) linear;\n}\nsd-select-button:hover {\n color: var(--sd-tx-primary-hover);\n background-color: var(--sd-bg-state-hover);\n}"], encapsulation: 2 });
13
+ } }, styles: ["sd-select-button {\n display: block;\n background-color: var(--%NS%sd-bg-content);\n font-weight: bold;\n cursor: pointer;\n color: var(--%NS%sd-tx-primary);\n transition: background var(--%NS%sd-animation-duration) linear;\n}\nsd-select-button:hover {\n color: var(--%NS%sd-tx-primary-hover);\n background-color: var(--%NS%sd-bg-state-hover);\n}"], encapsulation: 2 });
14
14
  }
15
15
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSelectButton, [{
16
16
  type: Component,
@@ -87,7 +87,7 @@ export class SdSelectItem {
87
87
  i0.ɵɵelementEnd();
88
88
  } if (rf & 2) {
89
89
  i0.ɵɵconditional(ctx._parentControl.selectMode() === "multi" ? 0 : -1);
90
- } }, dependencies: [SdCheckbox, SdGap], styles: ["sd-select-item {\n display: block;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n cursor: pointer;\n font-family: var(--sd-font-family-field);\n transition: background var(--sd-animation-duration) ease-in;\n background-color: var(--sd-bg-overlay);\n}\nsd-select-item:hover {\n transition: background var(--sd-animation-duration) ease-out;\n background-color: var(--sd-bg-state-hover);\n}\nsd-select-item:focus {\n outline: none;\n transition: background var(--sd-animation-duration) ease-out;\n background-color: var(--sd-bg-state-hover);\n}\nsd-select-item[data-sd-selected=true] {\n color: var(--sd-tx-primary);\n font-weight: bold;\n background-color: var(--sd-bg-state-selected);\n}\nsd-select-item[data-sd-disabled=true] {\n background-color: var(--sd-bg-disabled);\n color: var(--sd-tx-disabled);\n cursor: default;\n pointer-events: none;\n}\nsd-select-item[data-sd-hidden=true] {\n display: none;\n}"], encapsulation: 2 });
90
+ } }, dependencies: [SdCheckbox, SdGap], styles: ["sd-select-item {\n display: block;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n cursor: pointer;\n font-family: var(--%NS%sd-font-family-field);\n transition: background var(--%NS%sd-animation-duration) ease-in;\n background-color: var(--%NS%sd-bg-overlay);\n}\nsd-select-item:hover {\n transition: background var(--%NS%sd-animation-duration) ease-out;\n background-color: var(--%NS%sd-bg-state-hover);\n}\nsd-select-item:focus {\n outline: none;\n transition: background var(--%NS%sd-animation-duration) ease-out;\n background-color: var(--%NS%sd-bg-state-hover);\n}\nsd-select-item[data-sd-selected=true] {\n color: var(--%NS%sd-tx-primary);\n font-weight: bold;\n background-color: var(--%NS%sd-bg-state-selected);\n}\nsd-select-item[data-sd-disabled=true] {\n background-color: var(--%NS%sd-bg-disabled);\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n pointer-events: none;\n}\nsd-select-item[data-sd-hidden=true] {\n display: none;\n}"], encapsulation: 2 });
91
91
  }
92
92
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSelectItem, [{
93
93
  type: Component,
@@ -330,7 +330,7 @@ export class SdSelect {
330
330
  i0.ɵɵconditional(ctx._beforeTpl() ? 12 : -1);
331
331
  i0.ɵɵadvance();
332
332
  i0.ɵɵconditional((tmp_12_0 = ctx._itemOfTpl()) ? 13 : 14, tmp_12_0);
333
- } }, dependencies: [SdDropdown, SdDropdownPopup, SdAnchor, SdGap, NgTemplateOutlet, SdRipple, NgIcon], styles: ["sd-select {\n display: block;\n position: relative;\n width: 100%;\n min-width: 10em;\n}\nsd-select > sd-dropdown {\n display: flex;\n overflow: hidden;\n border: 1px solid var(--sd-bd-field);\n border-radius: var(--sd-radius-default);\n background-color: var(--sd-bg-field);\n}\nsd-select > sd-dropdown:focus, sd-select > sd-dropdown:focus-within {\n border-color: var(--sd-focus-ring-color);\n}\nsd-select > sd-dropdown > ._sd-select-control {\n display: flex;\n position: relative;\n gap: var(--sd-gap-default);\n flex-grow: 1;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n cursor: pointer;\n font-family: var(--sd-font-family-field);\n}\nsd-select > sd-dropdown > ._sd-select-control > ._sd-select-control-content {\n flex: 1;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\nsd-select > sd-dropdown > ._sd-select-control > ._sd-select-control-icon {\n opacity: 0.3;\n}\nsd-select > sd-dropdown > ._sd-select-control:hover > ._sd-select-control-icon, sd-select > sd-dropdown > ._sd-select-control:focus > ._sd-select-control-icon, sd-select > sd-dropdown > ._sd-select-control:active > ._sd-select-control-icon {\n opacity: 1;\n}\nsd-select > sd-dropdown > sd-select-button {\n padding: var(--sd-gap-sm);\n border-left: 1px solid var(--sd-bd-hairline);\n}\nsd-select > sd-dropdown > sd-select-button:last-of-type {\n border-top-right-radius: var(--sd-radius-default);\n border-bottom-right-radius: var(--sd-radius-default);\n}\nsd-select[data-sd-disabled=true] > sd-dropdown {\n background-color: var(--sd-bg-disabled);\n}\nsd-select[data-sd-disabled=true] > sd-dropdown > ._sd-select-control {\n color: var(--sd-tx-disabled);\n cursor: default;\n}\nsd-select[data-sd-disabled=true] > sd-dropdown > ._sd-select-control > ._sd-select-control-icon {\n display: none;\n}\nsd-select[data-sd-inline=true] {\n display: inline-block;\n width: auto;\n vertical-align: top;\n}\nsd-select[data-sd-size=sm] > sd-dropdown > ._sd-select-control {\n padding: var(--sd-gap-xs) var(--sd-gap-sm);\n gap: var(--sd-gap-sm);\n}\nsd-select[data-sd-size=sm] > sd-dropdown > sd-select-button {\n padding: var(--sd-gap-xs);\n}\nsd-select[data-sd-size=lg] > sd-dropdown > ._sd-select-control {\n padding: var(--sd-gap-default) var(--sd-gap-lg);\n gap: var(--sd-gap-lg);\n}\nsd-select[data-sd-size=lg] > sd-dropdown > sd-select-button {\n padding: var(--sd-gap-default);\n}\nsd-select[data-sd-inset=true] {\n min-width: auto;\n border-radius: 0;\n}\nsd-select[data-sd-inset=true] > sd-dropdown {\n border: none;\n border-radius: 0;\n}\nsd-select[data-sd-inset=true] > sd-dropdown > sd-select-button {\n border-radius: 0;\n}\nsd-select[data-sd-inset=true] > sd-dropdown:focus, sd-select[data-sd-inset=true] > sd-dropdown:focus-within {\n outline: 1px solid var(--sd-focus-ring-color);\n outline-offset: -1px;\n}\nsd-select[data-sd-inset=true] > sd-dropdown:focus > sd-select-button, sd-select[data-sd-inset=true] > sd-dropdown:focus-within > sd-select-button {\n outline: 1px solid var(--sd-focus-ring-color);\n outline-offset: -1px;\n}\nsd-select[data-sd-inset=true][data-sd-disabled=true] > sd-dropdown {\n background-color: var(--sd-bg-content);\n}\nsd-select[data-sd-inset=true][data-sd-disabled=true] > sd-dropdown > ._sd-select-control {\n color: var(--sd-tx-default);\n}\n\n._sd-select-all-bar {\n display: flex;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n border-bottom: 1px solid var(--sd-bd-default);\n}"], encapsulation: 2 });
333
+ } }, dependencies: [SdDropdown, SdDropdownPopup, SdAnchor, SdGap, NgTemplateOutlet, SdRipple, NgIcon], styles: ["sd-select {\n display: block;\n position: relative;\n width: 100%;\n min-width: 10em;\n}\nsd-select > sd-dropdown {\n display: flex;\n overflow: hidden;\n border: 1px solid var(--%NS%sd-bd-field);\n border-radius: var(--%NS%sd-radius-default);\n background-color: var(--%NS%sd-bg-field);\n}\nsd-select > sd-dropdown:focus, sd-select > sd-dropdown:focus-within {\n border-color: var(--%NS%sd-focus-ring-color);\n}\nsd-select > sd-dropdown > ._sd-select-control {\n display: flex;\n position: relative;\n gap: var(--%NS%sd-gap-default);\n flex-grow: 1;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n cursor: pointer;\n font-family: var(--%NS%sd-font-family-field);\n}\nsd-select > sd-dropdown > ._sd-select-control > ._sd-select-control-content {\n flex: 1;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\nsd-select > sd-dropdown > ._sd-select-control > ._sd-select-control-icon {\n opacity: 0.3;\n}\nsd-select > sd-dropdown > ._sd-select-control:hover > ._sd-select-control-icon, sd-select > sd-dropdown > ._sd-select-control:focus > ._sd-select-control-icon, sd-select > sd-dropdown > ._sd-select-control:active > ._sd-select-control-icon {\n opacity: 1;\n}\nsd-select > sd-dropdown > sd-select-button {\n padding: var(--%NS%sd-gap-sm);\n border-left: 1px solid var(--%NS%sd-bd-hairline);\n}\nsd-select > sd-dropdown > sd-select-button:last-of-type {\n border-top-right-radius: var(--%NS%sd-radius-default);\n border-bottom-right-radius: var(--%NS%sd-radius-default);\n}\nsd-select[data-sd-disabled=true] > sd-dropdown {\n background-color: var(--%NS%sd-bg-disabled);\n}\nsd-select[data-sd-disabled=true] > sd-dropdown > ._sd-select-control {\n color: var(--%NS%sd-tx-disabled);\n cursor: default;\n}\nsd-select[data-sd-disabled=true] > sd-dropdown > ._sd-select-control > ._sd-select-control-icon {\n display: none;\n}\nsd-select[data-sd-inline=true] {\n display: inline-block;\n width: auto;\n vertical-align: top;\n}\nsd-select[data-sd-size=sm] > sd-dropdown > ._sd-select-control {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm);\n gap: var(--%NS%sd-gap-sm);\n}\nsd-select[data-sd-size=sm] > sd-dropdown > sd-select-button {\n padding: var(--%NS%sd-gap-xs);\n}\nsd-select[data-sd-size=lg] > sd-dropdown > ._sd-select-control {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-lg);\n gap: var(--%NS%sd-gap-lg);\n}\nsd-select[data-sd-size=lg] > sd-dropdown > sd-select-button {\n padding: var(--%NS%sd-gap-default);\n}\nsd-select[data-sd-inset=true] {\n min-width: auto;\n border-radius: 0;\n}\nsd-select[data-sd-inset=true] > sd-dropdown {\n border: none;\n border-radius: 0;\n}\nsd-select[data-sd-inset=true] > sd-dropdown > sd-select-button {\n border-radius: 0;\n}\nsd-select[data-sd-inset=true] > sd-dropdown:focus, sd-select[data-sd-inset=true] > sd-dropdown:focus-within {\n outline: 1px solid var(--%NS%sd-focus-ring-color);\n outline-offset: -1px;\n}\nsd-select[data-sd-inset=true] > sd-dropdown:focus > sd-select-button, sd-select[data-sd-inset=true] > sd-dropdown:focus-within > sd-select-button {\n outline: 1px solid var(--%NS%sd-focus-ring-color);\n outline-offset: -1px;\n}\nsd-select[data-sd-inset=true][data-sd-disabled=true] > sd-dropdown {\n background-color: var(--%NS%sd-bg-content);\n}\nsd-select[data-sd-inset=true][data-sd-disabled=true] > sd-dropdown > ._sd-select-control {\n color: var(--%NS%sd-tx-default);\n}\n\n._sd-select-all-bar {\n display: flex;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n border-bottom: 1px solid var(--%NS%sd-bd-default);\n}"], encapsulation: 2 });
334
334
  }
335
335
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSelect, [{
336
336
  type: Component,
@@ -19,7 +19,7 @@ export class SdTabItem {
19
19
  } }, inputs: { value: [1, "value"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdTabItem_Template(rf, ctx) { if (rf & 1) {
20
20
  i0.ɵɵprojectionDef();
21
21
  i0.ɵɵprojection(0);
22
- } }, styles: ["sd-tab-item {\n display: inline-block;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n cursor: pointer;\n margin-bottom: -2px;\n border-bottom: 2px solid transparent !important;\n font-weight: bold;\n color: var(--sd-tx-gray);\n}\nsd-tab-item[data-sd-selected=true] {\n border-bottom: 3px solid var(--sd-bd-primary-solid) !important;\n color: var(--sd-tx-primary);\n}"], encapsulation: 2 });
22
+ } }, styles: ["sd-tab-item {\n display: inline-block;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n cursor: pointer;\n margin-bottom: -2px;\n border-bottom: 2px solid transparent !important;\n font-weight: bold;\n color: var(--%NS%sd-tx-gray);\n}\nsd-tab-item[data-sd-selected=true] {\n border-bottom: 3px solid var(--%NS%sd-bd-primary-solid) !important;\n color: var(--%NS%sd-tx-primary);\n}"], encapsulation: 2 });
23
23
  }
24
24
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTabItem, [{
25
25
  type: Component,
@@ -8,7 +8,7 @@ export class SdTab {
8
8
  static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTab, selectors: [["sd-tab"]], inputs: { value: [1, "value"] }, outputs: { value: "valueChange" }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdTab_Template(rf, ctx) { if (rf & 1) {
9
9
  i0.ɵɵprojectionDef();
10
10
  i0.ɵɵprojection(0);
11
- } }, styles: ["sd-tab {\n display: block;\n border-bottom: 2px solid var(--sd-bd-hairline);\n padding: 0 calc(var(--sd-gap-default) + 1px) 0 calc(var(--sd-gap-default) - 1px);\n}"], encapsulation: 2 });
11
+ } }, styles: ["sd-tab {\n display: block;\n border-bottom: 2px solid var(--%NS%sd-bd-hairline);\n padding: 0 calc(var(--%NS%sd-gap-default) + 1px) 0 calc(var(--%NS%sd-gap-default) - 1px);\n}"], encapsulation: 2 });
12
12
  }
13
13
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTab, [{
14
14
  type: Component,
@@ -69,7 +69,7 @@ export class SdBusyContainer {
69
69
  i0.ɵɵconditional(ctx.message() != undefined ? 6 : -1);
70
70
  i0.ɵɵadvance();
71
71
  i0.ɵɵconditional(ctx.progressPercent() != null ? 7 : -1);
72
- } }, styles: ["sd-busy-container {\n display: block;\n position: relative;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n min-width: 70px;\n min-height: 70px;\n overflow: auto;\n}\nsd-busy-container > ._screen {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 9998;\n visibility: hidden;\n pointer-events: none;\n opacity: 0;\n transition: opacity var(--sd-animation-duration);\n transition-timing-function: linear;\n}\nsd-busy-container > ._screen > ._progress {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n height: 4px;\n width: 100%;\n background-color: var(--sd-bg-canvas);\n}\nsd-busy-container > ._screen > ._progress > ._progress-bar {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n content: \"\";\n height: 4px;\n width: 100%;\n transition: var(--sd-animation-duration) ease-in;\n transition-property: transform;\n transform-origin: left;\n transform: scaleX(0);\n background-color: var(--sd-bg-primary-solid);\n}\nsd-busy-container[data-sd-busy=true] > ._screen {\n visibility: visible;\n pointer-events: auto;\n opacity: 1;\n}\nsd-busy-container[data-sd-type=spinner] > ._screen > ._rect {\n transform: translateY(-100%);\n transition: var(--sd-animation-duration) ease-in;\n transition-property: transform;\n}\nsd-busy-container[data-sd-type=spinner] > ._screen > ._rect > ._indicator {\n top: 0;\n width: 30px;\n height: 30px;\n margin: 20px auto 0 auto;\n border: 6px solid var(--sd-bg-canvas);\n border-radius: 100%;\n border-bottom-color: var(--sd-bg-primary-solid);\n animation: sd-busy-spin 1s linear infinite;\n box-shadow: 0 2px 4px var(--sd-shadow-color);\n}\nsd-busy-container[data-sd-type=spinner] > ._screen > ._rect > ._indicator > div {\n display: none;\n}\nsd-busy-container[data-sd-type=spinner] > ._screen > ._rect > ._message {\n position: absolute;\n top: 55px;\n width: 100%;\n color: var(--sd-bg-canvas);\n font-weight: bold;\n text-align: center;\n text-shadow: 0 0 2px var(--sd-bg-inverse);\n}\nsd-busy-container[data-sd-type=spinner][data-sd-busy=true] > ._screen > ._rect {\n transform: none;\n transition: var(--sd-animation-duration) ease-out;\n}\nsd-busy-container[data-sd-type=bar] {\n min-height: 4px;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator {\n position: absolute;\n top: 0;\n left: 0;\n height: 4px;\n width: 100%;\n background-color: var(--sd-bg-canvas);\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator:before, sd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator:after {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n content: \"\";\n height: 4px;\n width: 100%;\n transform-origin: left;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator:before {\n background-color: var(--sd-bg-primary-solid);\n animation: sd-busy-bar-indicator-before 2s infinite ease-in;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator:after {\n background-color: var(--sd-bg-canvas);\n animation: sd-busy-bar-indicator-after 2s infinite ease-out;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator > div {\n display: none;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._message {\n position: absolute;\n top: 4px;\n right: 0;\n display: inline-block;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator {\n position: absolute;\n top: calc(50% - 20px);\n left: calc(50% - 20px);\n width: 40px;\n height: 40px;\n transform: rotateZ(45deg);\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube1,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube2,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube3,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube4 {\n float: left;\n width: 50%;\n height: 50%;\n position: relative;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube1:before,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube2:before,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube3:before,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube4:before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: var(--sd-bg-busy-indicator);\n animation: sd-busy-cube 2.4s infinite linear both;\n transform-origin: 100% 100%;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube2 {\n transform: rotateZ(90deg);\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube2:before {\n animation-delay: 0.3s;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube3 {\n transform: rotateZ(180deg);\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube3:before {\n animation-delay: 0.6s;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube4 {\n transform: rotateZ(270deg);\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube4:before {\n animation-delay: 0.9s;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._message {\n position: absolute;\n top: 4px;\n right: 0;\n display: inline-block;\n}\n\n@keyframes sd-busy-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes sd-busy-bar-indicator-before {\n 0% {\n transform: scaleX(0);\n }\n 60%, 100% {\n transform: scaleX(1);\n }\n}\n@keyframes sd-busy-bar-indicator-after {\n 0%, 50% {\n transform: scaleX(0);\n }\n 100% {\n transform: scaleX(1);\n }\n}\n@keyframes sd-busy-cube {\n 0%, 10% {\n transform: perspective(140px) rotateX(-180deg);\n opacity: 0;\n }\n 25%, 75% {\n transform: perspective(140px) rotateX(0deg);\n opacity: 1;\n }\n 90%, 100% {\n transform: perspective(140px) rotateY(180deg);\n opacity: 0;\n }\n}"], encapsulation: 2 });
72
+ } }, styles: ["sd-busy-container {\n display: block;\n position: relative;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n min-width: 70px;\n min-height: 70px;\n overflow: auto;\n}\nsd-busy-container > ._screen {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 9998;\n visibility: hidden;\n pointer-events: none;\n opacity: 0;\n transition: opacity var(--%NS%sd-animation-duration);\n transition-timing-function: linear;\n}\nsd-busy-container > ._screen > ._progress {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n height: 4px;\n width: 100%;\n background-color: var(--%NS%sd-bg-canvas);\n}\nsd-busy-container > ._screen > ._progress > ._progress-bar {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n content: \"\";\n height: 4px;\n width: 100%;\n transition: var(--%NS%sd-animation-duration) ease-in;\n transition-property: transform;\n transform-origin: left;\n transform: scaleX(0);\n background-color: var(--%NS%sd-bg-primary-solid);\n}\nsd-busy-container[data-sd-busy=true] > ._screen {\n visibility: visible;\n pointer-events: auto;\n opacity: 1;\n}\nsd-busy-container[data-sd-type=spinner] > ._screen > ._rect {\n transform: translateY(-100%);\n transition: var(--%NS%sd-animation-duration) ease-in;\n transition-property: transform;\n}\nsd-busy-container[data-sd-type=spinner] > ._screen > ._rect > ._indicator {\n top: 0;\n width: 30px;\n height: 30px;\n margin: 20px auto 0 auto;\n border: 6px solid var(--%NS%sd-bg-canvas);\n border-radius: 100%;\n border-bottom-color: var(--%NS%sd-bg-primary-solid);\n animation: sd-busy-spin 1s linear infinite;\n box-shadow: 0 2px 4px var(--%NS%sd-shadow-color);\n}\nsd-busy-container[data-sd-type=spinner] > ._screen > ._rect > ._indicator > div {\n display: none;\n}\nsd-busy-container[data-sd-type=spinner] > ._screen > ._rect > ._message {\n position: absolute;\n top: 55px;\n width: 100%;\n color: var(--%NS%sd-bg-canvas);\n font-weight: bold;\n text-align: center;\n text-shadow: 0 0 2px var(--%NS%sd-bg-inverse);\n}\nsd-busy-container[data-sd-type=spinner][data-sd-busy=true] > ._screen > ._rect {\n transform: none;\n transition: var(--%NS%sd-animation-duration) ease-out;\n}\nsd-busy-container[data-sd-type=bar] {\n min-height: 4px;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator {\n position: absolute;\n top: 0;\n left: 0;\n height: 4px;\n width: 100%;\n background-color: var(--%NS%sd-bg-canvas);\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator:before, sd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator:after {\n position: absolute;\n top: 0;\n left: 0;\n display: inline-block;\n content: \"\";\n height: 4px;\n width: 100%;\n transform-origin: left;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator:before {\n background-color: var(--%NS%sd-bg-primary-solid);\n animation: sd-busy-bar-indicator-before 2s infinite ease-in;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator:after {\n background-color: var(--%NS%sd-bg-canvas);\n animation: sd-busy-bar-indicator-after 2s infinite ease-out;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._indicator > div {\n display: none;\n}\nsd-busy-container[data-sd-type=bar][data-sd-busy=true] > ._screen > ._rect > ._message {\n position: absolute;\n top: 4px;\n right: 0;\n display: inline-block;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator {\n position: absolute;\n top: calc(50% - 20px);\n left: calc(50% - 20px);\n width: 40px;\n height: 40px;\n transform: rotateZ(45deg);\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube1,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube2,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube3,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube4 {\n float: left;\n width: 50%;\n height: 50%;\n position: relative;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube1:before,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube2:before,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube3:before,\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube4:before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: var(--%NS%sd-bg-busy-indicator);\n animation: sd-busy-cube 2.4s infinite linear both;\n transform-origin: 100% 100%;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube2 {\n transform: rotateZ(90deg);\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube2:before {\n animation-delay: 0.3s;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube3 {\n transform: rotateZ(180deg);\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube3:before {\n animation-delay: 0.6s;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube4 {\n transform: rotateZ(270deg);\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._indicator ._cube4:before {\n animation-delay: 0.9s;\n}\nsd-busy-container[data-sd-type=cube] > ._screen > ._rect > ._message {\n position: absolute;\n top: 4px;\n right: 0;\n display: inline-block;\n}\n\n@keyframes sd-busy-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes sd-busy-bar-indicator-before {\n 0% {\n transform: scaleX(0);\n }\n 60%, 100% {\n transform: scaleX(1);\n }\n}\n@keyframes sd-busy-bar-indicator-after {\n 0%, 50% {\n transform: scaleX(0);\n }\n 100% {\n transform: scaleX(1);\n }\n}\n@keyframes sd-busy-cube {\n 0%, 10% {\n transform: perspective(140px) rotateX(-180deg);\n opacity: 0;\n }\n 25%, 75% {\n transform: perspective(140px) rotateX(0deg);\n opacity: 1;\n }\n 90%, 100% {\n transform: perspective(140px) rotateY(180deg);\n opacity: 0;\n }\n}"], encapsulation: 2 });
73
73
  }
74
74
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdBusyContainer, [{
75
75
  type: Component,
@@ -373,7 +373,7 @@ export class SdModal {
373
373
  i0.ɵɵconditional(!ctx.hideHeader() ? 2 : -1);
374
374
  i0.ɵɵadvance(3);
375
375
  i0.ɵɵconditional(ctx.resizable() ? 5 : -1);
376
- } }, dependencies: [NgTemplateOutlet, NgIcon, SdAnchor, SdResizeDirective], styles: ["sd-modal {\n display: block;\n position: fixed;\n z-index: var(--sd-z-modal);\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n padding-top: calc(var(--sd-topbar-height) + var(--sd-gap-sm));\n opacity: 0;\n transition: opacity var(--sd-animation-duration) ease-in-out;\n pointer-events: none;\n}\nsd-modal > ._backdrop {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: var(--sd-bg-backdrop);\n}\nsd-modal > ._dialog {\n position: relative;\n display: flex;\n flex-direction: column;\n margin: 0 auto;\n width: fit-content;\n min-width: 200px;\n background-color: var(--sd-bg-elevated);\n border: 1px solid var(--sd-modal-bd);\n overflow: hidden;\n box-shadow: 0 calc(16 * var(--sd-shadow-size)) calc(16 * 4 * var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color), 0 var(--sd-shadow-size) calc(var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color);\n border-radius: var(--sd-radius-default);\n transform: translateY(-25px);\n transition: transform var(--sd-animation-duration) ease-in-out;\n}\nsd-modal > ._dialog:focus {\n outline: none;\n}\nsd-modal > ._dialog > ._header {\n display: flex;\n align-items: center;\n user-select: none;\n border-bottom: 1px solid var(--sd-bd-hairline);\n background-color: var(--sd-modal-header-bg);\n color: var(--sd-modal-header-tx);\n}\nsd-modal > ._dialog > ._header > ._title {\n flex: 1;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n}\nsd-modal > ._dialog > ._header > ._close-btn {\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n color: var(--sd-modal-header-tx-muted);\n}\nsd-modal > ._dialog > ._header > ._close-btn:hover {\n color: var(--sd-modal-header-tx);\n}\nsd-modal > ._dialog > ._content {\n flex: 1;\n overflow: auto;\n}\nsd-modal > ._dialog > ._resize-handle {\n position: absolute;\n}\nsd-modal > ._dialog > ._resize-handle._resize-left {\n top: 0;\n left: 0;\n width: var(--sd-gap-sm);\n height: 100%;\n cursor: ew-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-right {\n top: 0;\n right: 0;\n width: var(--sd-gap-sm);\n height: 100%;\n cursor: ew-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-top {\n top: 0;\n left: 0;\n width: 100%;\n height: var(--sd-gap-sm);\n cursor: ns-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-top-right {\n right: 0;\n top: 0;\n width: var(--sd-gap-sm);\n height: var(--sd-gap-sm);\n z-index: 1;\n cursor: nesw-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-top-left {\n left: 0;\n top: 0;\n width: var(--sd-gap-sm);\n height: var(--sd-gap-sm);\n cursor: nwse-resize;\n z-index: 1;\n}\nsd-modal > ._dialog > ._resize-handle._resize-bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n height: var(--sd-gap-sm);\n cursor: ns-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-bottom-right {\n right: 0;\n bottom: 0;\n width: var(--sd-gap-sm);\n height: var(--sd-gap-sm);\n z-index: 1;\n cursor: nwse-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-bottom-left {\n left: 0;\n bottom: 0;\n width: var(--sd-gap-sm);\n height: var(--sd-gap-sm);\n cursor: nesw-resize;\n z-index: 1;\n}\nsd-modal[data-sd-open][data-sd-init] {\n opacity: 1;\n pointer-events: auto;\n}\nsd-modal[data-sd-open][data-sd-init] > ._dialog {\n transform: none;\n}\nsd-modal[data-sd-float] {\n pointer-events: none;\n}\nsd-modal[data-sd-float] > ._backdrop {\n display: none;\n}\nsd-modal[data-sd-float] > ._dialog {\n pointer-events: auto;\n opacity: 0;\n box-shadow: 0 calc(4 * var(--sd-shadow-size)) calc(4 * 4 * var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color), 0 var(--sd-shadow-size) calc(var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color);\n border: 1px solid var(--sd-bd-hairline);\n}\nsd-modal[data-sd-float] > ._dialog:focus {\n box-shadow: 0 calc(16 * var(--sd-shadow-size)) calc(16 * 4 * var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color), 0 var(--sd-shadow-size) calc(var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color);\n}\nsd-modal[data-sd-float][data-sd-open][data-sd-init] {\n pointer-events: none;\n}\nsd-modal[data-sd-float][data-sd-open][data-sd-init] > ._dialog {\n pointer-events: auto;\n opacity: 1;\n}\nsd-modal[data-sd-position=bottom-right] > ._dialog {\n position: absolute;\n right: calc(var(--sd-gap-xxl) * 2);\n bottom: var(--sd-gap-xxl);\n}\nsd-modal[data-sd-position=top-right] > ._dialog {\n position: absolute;\n right: var(--sd-gap-xxl);\n top: var(--sd-gap-xxl);\n}\nsd-modal[data-sd-fill] {\n padding-top: 0;\n}\nsd-modal[data-sd-fill] > ._dialog {\n width: 100%;\n height: 100%;\n border: none;\n border-radius: 0;\n}\nsd-modal[data-sd-fill] > ._dialog > ._header {\n background-color: transparent;\n color: var(--sd-tx-faint);\n}"], encapsulation: 2 });
376
+ } }, dependencies: [NgTemplateOutlet, NgIcon, SdAnchor, SdResizeDirective], styles: ["sd-modal {\n display: block;\n position: fixed;\n z-index: var(--%NS%sd-z-modal);\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n padding-top: calc(var(--%NS%sd-topbar-height) + var(--%NS%sd-gap-sm));\n opacity: 0;\n transition: opacity var(--%NS%sd-animation-duration) ease-in-out;\n pointer-events: none;\n}\nsd-modal > ._backdrop {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: var(--%NS%sd-bg-backdrop);\n}\nsd-modal > ._dialog {\n position: relative;\n display: flex;\n flex-direction: column;\n margin: 0 auto;\n width: fit-content;\n min-width: 200px;\n background-color: var(--%NS%sd-bg-elevated);\n border: 1px solid var(--%NS%sd-modal-bd);\n overflow: hidden;\n box-shadow: 0 calc(16 * var(--%NS%sd-shadow-size)) calc(16 * 4 * var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color), 0 var(--%NS%sd-shadow-size) calc(var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color);\n border-radius: var(--%NS%sd-radius-default);\n transform: translateY(-25px);\n transition: transform var(--%NS%sd-animation-duration) ease-in-out;\n}\nsd-modal > ._dialog:focus {\n outline: none;\n}\nsd-modal > ._dialog > ._header {\n display: flex;\n align-items: center;\n user-select: none;\n border-bottom: 1px solid var(--%NS%sd-bd-hairline);\n background-color: var(--%NS%sd-modal-header-bg);\n color: var(--%NS%sd-modal-header-tx);\n}\nsd-modal > ._dialog > ._header > ._title {\n flex: 1;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n}\nsd-modal > ._dialog > ._header > ._close-btn {\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n color: var(--%NS%sd-modal-header-tx-muted);\n}\nsd-modal > ._dialog > ._header > ._close-btn:hover {\n color: var(--%NS%sd-modal-header-tx);\n}\nsd-modal > ._dialog > ._content {\n flex: 1;\n overflow: auto;\n}\nsd-modal > ._dialog > ._resize-handle {\n position: absolute;\n}\nsd-modal > ._dialog > ._resize-handle._resize-left {\n top: 0;\n left: 0;\n width: var(--%NS%sd-gap-sm);\n height: 100%;\n cursor: ew-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-right {\n top: 0;\n right: 0;\n width: var(--%NS%sd-gap-sm);\n height: 100%;\n cursor: ew-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-top {\n top: 0;\n left: 0;\n width: 100%;\n height: var(--%NS%sd-gap-sm);\n cursor: ns-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-top-right {\n right: 0;\n top: 0;\n width: var(--%NS%sd-gap-sm);\n height: var(--%NS%sd-gap-sm);\n z-index: 1;\n cursor: nesw-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-top-left {\n left: 0;\n top: 0;\n width: var(--%NS%sd-gap-sm);\n height: var(--%NS%sd-gap-sm);\n cursor: nwse-resize;\n z-index: 1;\n}\nsd-modal > ._dialog > ._resize-handle._resize-bottom {\n bottom: 0;\n left: 0;\n width: 100%;\n height: var(--%NS%sd-gap-sm);\n cursor: ns-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-bottom-right {\n right: 0;\n bottom: 0;\n width: var(--%NS%sd-gap-sm);\n height: var(--%NS%sd-gap-sm);\n z-index: 1;\n cursor: nwse-resize;\n}\nsd-modal > ._dialog > ._resize-handle._resize-bottom-left {\n left: 0;\n bottom: 0;\n width: var(--%NS%sd-gap-sm);\n height: var(--%NS%sd-gap-sm);\n cursor: nesw-resize;\n z-index: 1;\n}\nsd-modal[data-sd-open][data-sd-init] {\n opacity: 1;\n pointer-events: auto;\n}\nsd-modal[data-sd-open][data-sd-init] > ._dialog {\n transform: none;\n}\nsd-modal[data-sd-float] {\n pointer-events: none;\n}\nsd-modal[data-sd-float] > ._backdrop {\n display: none;\n}\nsd-modal[data-sd-float] > ._dialog {\n pointer-events: auto;\n opacity: 0;\n box-shadow: 0 calc(4 * var(--%NS%sd-shadow-size)) calc(4 * 4 * var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color), 0 var(--%NS%sd-shadow-size) calc(var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color);\n border: 1px solid var(--%NS%sd-bd-hairline);\n}\nsd-modal[data-sd-float] > ._dialog:focus {\n box-shadow: 0 calc(16 * var(--%NS%sd-shadow-size)) calc(16 * 4 * var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color), 0 var(--%NS%sd-shadow-size) calc(var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color);\n}\nsd-modal[data-sd-float][data-sd-open][data-sd-init] {\n pointer-events: none;\n}\nsd-modal[data-sd-float][data-sd-open][data-sd-init] > ._dialog {\n pointer-events: auto;\n opacity: 1;\n}\nsd-modal[data-sd-position=bottom-right] > ._dialog {\n position: absolute;\n right: calc(var(--%NS%sd-gap-xxl) * 2);\n bottom: var(--%NS%sd-gap-xxl);\n}\nsd-modal[data-sd-position=top-right] > ._dialog {\n position: absolute;\n right: var(--%NS%sd-gap-xxl);\n top: var(--%NS%sd-gap-xxl);\n}\nsd-modal[data-sd-fill] {\n padding-top: 0;\n}\nsd-modal[data-sd-fill] > ._dialog {\n width: 100%;\n height: 100%;\n border: none;\n border-radius: 0;\n}\nsd-modal[data-sd-fill] > ._dialog > ._header {\n background-color: transparent;\n color: var(--%NS%sd-tx-faint);\n}"], encapsulation: 2 });
377
377
  }
378
378
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdModal, [{
379
379
  type: Component,
@@ -5,7 +5,7 @@ export class SdToastContainer {
5
5
  static ɵfac = function SdToastContainer_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdToastContainer)(); };
6
6
  static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdToastContainer, selectors: [["sd-toast-container"]], hostVars: 1, hostBindings: function SdToastContainer_HostBindings(rf, ctx) { if (rf & 2) {
7
7
  i0.ɵɵattribute("data-sd-overlap", ctx.overlap() || undefined);
8
- } }, inputs: { overlap: [1, "overlap"] }, decls: 0, vars: 0, template: function SdToastContainer_Template(rf, ctx) { }, styles: ["sd-toast-container {\n display: flex;\n position: fixed;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n pointer-events: none;\n padding: var(--sd-gap-xxl);\n z-index: 9999;\n flex-direction: column;\n}\n@supports not (appearance: auto) {\n sd-toast-container.gap-xxs {\n gap: 0;\n }\n sd-toast-container.gap-xxs > * + * {\n margin-top: var(--sd-gap-xxs);\n }\n sd-toast-container.gap-xs {\n gap: 0;\n }\n sd-toast-container.gap-xs > * + * {\n margin-top: var(--sd-gap-xs);\n }\n sd-toast-container.gap-sm {\n gap: 0;\n }\n sd-toast-container.gap-sm > * + * {\n margin-top: var(--sd-gap-sm);\n }\n sd-toast-container.gap-default {\n gap: 0;\n }\n sd-toast-container.gap-default > * + * {\n margin-top: var(--sd-gap-default);\n }\n sd-toast-container.gap-lg {\n gap: 0;\n }\n sd-toast-container.gap-lg > * + * {\n margin-top: var(--sd-gap-lg);\n }\n sd-toast-container.gap-xl {\n gap: 0;\n }\n sd-toast-container.gap-xl > * + * {\n margin-top: var(--sd-gap-xl);\n }\n sd-toast-container.gap-xxl {\n gap: 0;\n }\n sd-toast-container.gap-xxl > * + * {\n margin-top: var(--sd-gap-xxl);\n }\n sd-toast-container.gap-0 {\n gap: 0;\n }\n sd-toast-container.gap-0 > * + * {\n margin-top: var(--sd-gap-0);\n }\n sd-toast-container.gap-auto {\n gap: 0;\n }\n sd-toast-container.gap-auto > * + * {\n margin-top: var(--sd-gap-auto);\n }\n}\n@media all and (max-width: 520px) {\n sd-toast-container {\n flex-direction: column-reverse;\n }\n}\nsd-toast-container[data-sd-overlap] {\n display: block;\n}\nsd-toast-container[data-sd-overlap] > sd-toast {\n position: absolute;\n bottom: var(--sd-gap-xxl);\n left: var(--sd-gap-xxl);\n right: var(--sd-gap-xxl);\n width: auto;\n}"], encapsulation: 2 });
8
+ } }, inputs: { overlap: [1, "overlap"] }, decls: 0, vars: 0, template: function SdToastContainer_Template(rf, ctx) { }, styles: ["sd-toast-container {\n display: flex;\n position: fixed;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n pointer-events: none;\n padding: var(--%NS%sd-gap-xxl);\n z-index: 9999;\n flex-direction: column;\n}\n@supports not (appearance: auto) {\n sd-toast-container.gap-xxs {\n gap: 0;\n }\n sd-toast-container.gap-xxs > * + * {\n margin-top: var(--%NS%sd-gap-xxs);\n }\n sd-toast-container.gap-xs {\n gap: 0;\n }\n sd-toast-container.gap-xs > * + * {\n margin-top: var(--%NS%sd-gap-xs);\n }\n sd-toast-container.gap-sm {\n gap: 0;\n }\n sd-toast-container.gap-sm > * + * {\n margin-top: var(--%NS%sd-gap-sm);\n }\n sd-toast-container.gap-default {\n gap: 0;\n }\n sd-toast-container.gap-default > * + * {\n margin-top: var(--%NS%sd-gap-default);\n }\n sd-toast-container.gap-lg {\n gap: 0;\n }\n sd-toast-container.gap-lg > * + * {\n margin-top: var(--%NS%sd-gap-lg);\n }\n sd-toast-container.gap-xl {\n gap: 0;\n }\n sd-toast-container.gap-xl > * + * {\n margin-top: var(--%NS%sd-gap-xl);\n }\n sd-toast-container.gap-xxl {\n gap: 0;\n }\n sd-toast-container.gap-xxl > * + * {\n margin-top: var(--%NS%sd-gap-xxl);\n }\n sd-toast-container.gap-0 {\n gap: 0;\n }\n sd-toast-container.gap-0 > * + * {\n margin-top: var(--%NS%sd-gap-0);\n }\n sd-toast-container.gap-auto {\n gap: 0;\n }\n sd-toast-container.gap-auto > * + * {\n margin-top: var(--%NS%sd-gap-auto);\n }\n}\n@media all and (max-width: 520px) {\n sd-toast-container {\n flex-direction: column-reverse;\n }\n}\nsd-toast-container[data-sd-overlap] {\n display: block;\n}\nsd-toast-container[data-sd-overlap] > sd-toast {\n position: absolute;\n bottom: var(--%NS%sd-gap-xxl);\n left: var(--%NS%sd-gap-xxl);\n right: var(--%NS%sd-gap-xxl);\n width: auto;\n}"], encapsulation: 2 });
9
9
  }
10
10
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdToastContainer, [{
11
11
  type: Component,
@@ -64,7 +64,7 @@ export class SdToast {
64
64
  i0.ɵɵconditional(ctx.message() != undefined ? 2 : 3);
65
65
  i0.ɵɵadvance(2);
66
66
  i0.ɵɵconditional(ctx.useProgress() ? 4 : -1);
67
- } }, styles: ["sd-toast {\n display: block;\n margin-bottom: var(--sd-gap-sm);\n text-align: center;\n width: 100%;\n pointer-events: none;\n}\nsd-toast > ._sd-toast-block {\n display: inline-block;\n text-align: left;\n transform: translateY(-100%);\n border-radius: var(--sd-radius-lg);\n opacity: 0;\n box-shadow: 0 calc(12 * var(--sd-shadow-size)) calc(12 * 4 * var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color), 0 var(--sd-shadow-size) calc(var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color);\n pointer-events: auto;\n}\nsd-toast > ._sd-toast-block > ._sd-toast-message {\n padding: var(--sd-gap-default) var(--sd-gap-lg);\n word-break: break-all;\n white-space: pre-wrap;\n}\nsd-toast > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--sd-bg-state-active);\n height: 4px;\n border-radius: var(--sd-radius-xl);\n margin: 0 4px 4px 4px;\n}\nsd-toast > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n border-radius: var(--sd-radius-xl);\n height: 4px;\n transition: width 1s ease-out;\n}\nsd-toast[data-sd-theme=gray] > ._sd-toast-block {\n background-color: var(--sd-bg-gray-solid);\n color: var(--sd-tx-gray-solid);\n}\nsd-toast[data-sd-theme=gray] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--sd-bg-state-active);\n}\nsd-toast[data-sd-theme=gray] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--sd-bg-gray-subtle);\n}\nsd-toast[data-sd-theme=blue-gray] > ._sd-toast-block {\n background-color: var(--sd-bg-blue-gray-solid);\n color: var(--sd-tx-blue-gray-solid);\n}\nsd-toast[data-sd-theme=blue-gray] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--sd-bg-state-active);\n}\nsd-toast[data-sd-theme=blue-gray] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--sd-bg-blue-gray-subtle);\n}\nsd-toast[data-sd-theme=primary] > ._sd-toast-block {\n background-color: var(--sd-bg-primary-solid);\n color: var(--sd-tx-primary-solid);\n}\nsd-toast[data-sd-theme=primary] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--sd-bg-state-active);\n}\nsd-toast[data-sd-theme=primary] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--sd-bg-primary-subtle);\n}\nsd-toast[data-sd-theme=info] > ._sd-toast-block {\n background-color: var(--sd-bg-info-solid);\n color: var(--sd-tx-info-solid);\n}\nsd-toast[data-sd-theme=info] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--sd-bg-state-active);\n}\nsd-toast[data-sd-theme=info] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--sd-bg-info-subtle);\n}\nsd-toast[data-sd-theme=success] > ._sd-toast-block {\n background-color: var(--sd-bg-success-solid);\n color: var(--sd-tx-success-solid);\n}\nsd-toast[data-sd-theme=success] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--sd-bg-state-active);\n}\nsd-toast[data-sd-theme=success] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--sd-bg-success-subtle);\n}\nsd-toast[data-sd-theme=warning] > ._sd-toast-block {\n background-color: var(--sd-bg-warning-solid);\n color: var(--sd-tx-warning-solid);\n}\nsd-toast[data-sd-theme=warning] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--sd-bg-state-active);\n}\nsd-toast[data-sd-theme=warning] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--sd-bg-warning-subtle);\n}\nsd-toast[data-sd-theme=danger] > ._sd-toast-block {\n background-color: var(--sd-bg-danger-solid);\n color: var(--sd-tx-danger-solid);\n}\nsd-toast[data-sd-theme=danger] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--sd-bg-state-active);\n}\nsd-toast[data-sd-theme=danger] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--sd-bg-danger-subtle);\n}\nsd-toast[data-sd-open=true] > ._sd-toast-block {\n transform: none;\n transition: var(--sd-animation-duration) ease-out;\n transition-property: transform, opacity;\n opacity: 1;\n}\nsd-toast[data-sd-open=false] > ._sd-toast-block {\n transform: translateY(-100%);\n transition: var(--sd-animation-duration) ease-in;\n transition-property: transform, opacity;\n opacity: 0;\n}\n@media all and (max-width: 520px) {\n sd-toast > ._sd-toast-block {\n border-radius: calc(var(--sd-line-height) / 2);\n transform: translateY(100%);\n }\n sd-toast > ._sd-toast-block > ._sd-toast-message {\n padding: var(--sd-gap-xs) var(--sd-gap-default);\n }\n sd-toast[data-sd-open=false] > ._sd-toast-block {\n transform: translateY(100%);\n }\n}"], encapsulation: 2 });
67
+ } }, styles: ["sd-toast {\n display: block;\n margin-bottom: var(--%NS%sd-gap-sm);\n text-align: center;\n width: 100%;\n pointer-events: none;\n}\nsd-toast > ._sd-toast-block {\n display: inline-block;\n text-align: left;\n transform: translateY(-100%);\n border-radius: var(--%NS%sd-radius-lg);\n opacity: 0;\n box-shadow: 0 calc(12 * var(--%NS%sd-shadow-size)) calc(12 * 4 * var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color), 0 var(--%NS%sd-shadow-size) calc(var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color);\n pointer-events: auto;\n}\nsd-toast > ._sd-toast-block > ._sd-toast-message {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-lg);\n word-break: break-all;\n white-space: pre-wrap;\n}\nsd-toast > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--%NS%sd-bg-state-active);\n height: 4px;\n border-radius: var(--%NS%sd-radius-xl);\n margin: 0 4px 4px 4px;\n}\nsd-toast > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n border-radius: var(--%NS%sd-radius-xl);\n height: 4px;\n transition: width 1s ease-out;\n}\nsd-toast[data-sd-theme=gray] > ._sd-toast-block {\n background-color: var(--%NS%sd-bg-gray-solid);\n color: var(--%NS%sd-tx-gray-solid);\n}\nsd-toast[data-sd-theme=gray] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--%NS%sd-bg-state-active);\n}\nsd-toast[data-sd-theme=gray] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--%NS%sd-bg-gray-subtle);\n}\nsd-toast[data-sd-theme=blue-gray] > ._sd-toast-block {\n background-color: var(--%NS%sd-bg-blue-gray-solid);\n color: var(--%NS%sd-tx-blue-gray-solid);\n}\nsd-toast[data-sd-theme=blue-gray] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--%NS%sd-bg-state-active);\n}\nsd-toast[data-sd-theme=blue-gray] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--%NS%sd-bg-blue-gray-subtle);\n}\nsd-toast[data-sd-theme=primary] > ._sd-toast-block {\n background-color: var(--%NS%sd-bg-primary-solid);\n color: var(--%NS%sd-tx-primary-solid);\n}\nsd-toast[data-sd-theme=primary] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--%NS%sd-bg-state-active);\n}\nsd-toast[data-sd-theme=primary] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--%NS%sd-bg-primary-subtle);\n}\nsd-toast[data-sd-theme=info] > ._sd-toast-block {\n background-color: var(--%NS%sd-bg-info-solid);\n color: var(--%NS%sd-tx-info-solid);\n}\nsd-toast[data-sd-theme=info] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--%NS%sd-bg-state-active);\n}\nsd-toast[data-sd-theme=info] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--%NS%sd-bg-info-subtle);\n}\nsd-toast[data-sd-theme=success] > ._sd-toast-block {\n background-color: var(--%NS%sd-bg-success-solid);\n color: var(--%NS%sd-tx-success-solid);\n}\nsd-toast[data-sd-theme=success] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--%NS%sd-bg-state-active);\n}\nsd-toast[data-sd-theme=success] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--%NS%sd-bg-success-subtle);\n}\nsd-toast[data-sd-theme=warning] > ._sd-toast-block {\n background-color: var(--%NS%sd-bg-warning-solid);\n color: var(--%NS%sd-tx-warning-solid);\n}\nsd-toast[data-sd-theme=warning] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--%NS%sd-bg-state-active);\n}\nsd-toast[data-sd-theme=warning] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--%NS%sd-bg-warning-subtle);\n}\nsd-toast[data-sd-theme=danger] > ._sd-toast-block {\n background-color: var(--%NS%sd-bg-danger-solid);\n color: var(--%NS%sd-tx-danger-solid);\n}\nsd-toast[data-sd-theme=danger] > ._sd-toast-block > ._sd-toast-progress {\n background-color: var(--%NS%sd-bg-state-active);\n}\nsd-toast[data-sd-theme=danger] > ._sd-toast-block > ._sd-toast-progress > ._sd-toast-progress-bar {\n background-color: var(--%NS%sd-bg-danger-subtle);\n}\nsd-toast[data-sd-open=true] > ._sd-toast-block {\n transform: none;\n transition: var(--%NS%sd-animation-duration) ease-out;\n transition-property: transform, opacity;\n opacity: 1;\n}\nsd-toast[data-sd-open=false] > ._sd-toast-block {\n transform: translateY(-100%);\n transition: var(--%NS%sd-animation-duration) ease-in;\n transition-property: transform, opacity;\n opacity: 0;\n}\n@media all and (max-width: 520px) {\n sd-toast > ._sd-toast-block {\n border-radius: calc(var(--%NS%sd-line-height) / 2);\n transform: translateY(100%);\n }\n sd-toast > ._sd-toast-block > ._sd-toast-message {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-default);\n }\n sd-toast[data-sd-open=false] > ._sd-toast-block {\n transform: translateY(100%);\n }\n}"], encapsulation: 2 });
68
68
  }
69
69
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdToast, [{
70
70
  type: Component,
@@ -26,7 +26,7 @@ export class SdKanbanBoard {
26
26
  } }, inputs: { selectedValues: [1, "selectedValues"] }, outputs: { selectedValues: "selectedValuesChange", drop: "drop" }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdKanbanBoard_Template(rf, ctx) { if (rf & 1) {
27
27
  i0.ɵɵprojectionDef();
28
28
  i0.ɵɵprojection(0);
29
- } }, styles: ["sd-kanban-board {\n display: inline-flex;\n flex-wrap: nowrap;\n white-space: nowrap;\n height: 100%;\n flex-direction: row;\n gap: var(--sd-gap-lg);\n}\n@supports not (appearance: auto) {\n sd-kanban-board {\n gap: 0;\n }\n sd-kanban-board > * + * {\n margin-left: var(--sd-gap-lg);\n }\n sd-kanban-board.gap-xxs {\n gap: 0;\n }\n sd-kanban-board.gap-xxs > * + * {\n margin-left: var(--sd-gap-xxs);\n }\n sd-kanban-board.gap-xs {\n gap: 0;\n }\n sd-kanban-board.gap-xs > * + * {\n margin-left: var(--sd-gap-xs);\n }\n sd-kanban-board.gap-sm {\n gap: 0;\n }\n sd-kanban-board.gap-sm > * + * {\n margin-left: var(--sd-gap-sm);\n }\n sd-kanban-board.gap-default {\n gap: 0;\n }\n sd-kanban-board.gap-default > * + * {\n margin-left: var(--sd-gap-default);\n }\n sd-kanban-board.gap-lg {\n gap: 0;\n }\n sd-kanban-board.gap-lg > * + * {\n margin-left: var(--sd-gap-lg);\n }\n sd-kanban-board.gap-xl {\n gap: 0;\n }\n sd-kanban-board.gap-xl > * + * {\n margin-left: var(--sd-gap-xl);\n }\n sd-kanban-board.gap-xxl {\n gap: 0;\n }\n sd-kanban-board.gap-xxl > * + * {\n margin-left: var(--sd-gap-xxl);\n }\n sd-kanban-board.gap-0 {\n gap: 0;\n }\n sd-kanban-board.gap-0 > * + * {\n margin-left: var(--sd-gap-0);\n }\n sd-kanban-board.gap-auto {\n gap: 0;\n }\n sd-kanban-board.gap-auto > * + * {\n margin-left: var(--sd-gap-auto);\n }\n}"], encapsulation: 2 });
29
+ } }, styles: ["sd-kanban-board {\n display: inline-flex;\n flex-wrap: nowrap;\n white-space: nowrap;\n height: 100%;\n flex-direction: row;\n gap: var(--%NS%sd-gap-lg);\n}\n@supports not (appearance: auto) {\n sd-kanban-board {\n gap: 0;\n }\n sd-kanban-board > * + * {\n margin-left: var(--%NS%sd-gap-lg);\n }\n sd-kanban-board.gap-xxs {\n gap: 0;\n }\n sd-kanban-board.gap-xxs > * + * {\n margin-left: var(--%NS%sd-gap-xxs);\n }\n sd-kanban-board.gap-xs {\n gap: 0;\n }\n sd-kanban-board.gap-xs > * + * {\n margin-left: var(--%NS%sd-gap-xs);\n }\n sd-kanban-board.gap-sm {\n gap: 0;\n }\n sd-kanban-board.gap-sm > * + * {\n margin-left: var(--%NS%sd-gap-sm);\n }\n sd-kanban-board.gap-default {\n gap: 0;\n }\n sd-kanban-board.gap-default > * + * {\n margin-left: var(--%NS%sd-gap-default);\n }\n sd-kanban-board.gap-lg {\n gap: 0;\n }\n sd-kanban-board.gap-lg > * + * {\n margin-left: var(--%NS%sd-gap-lg);\n }\n sd-kanban-board.gap-xl {\n gap: 0;\n }\n sd-kanban-board.gap-xl > * + * {\n margin-left: var(--%NS%sd-gap-xl);\n }\n sd-kanban-board.gap-xxl {\n gap: 0;\n }\n sd-kanban-board.gap-xxl > * + * {\n margin-left: var(--%NS%sd-gap-xxl);\n }\n sd-kanban-board.gap-0 {\n gap: 0;\n }\n sd-kanban-board.gap-0 > * + * {\n margin-left: var(--%NS%sd-gap-0);\n }\n sd-kanban-board.gap-auto {\n gap: 0;\n }\n sd-kanban-board.gap-auto > * + * {\n margin-left: var(--%NS%sd-gap-auto);\n }\n}"], encapsulation: 2 });
30
30
  }
31
31
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdKanbanBoard, [{
32
32
  type: Component,
@@ -174,7 +174,7 @@ export class SdKanbanLane {
174
174
  i0.ɵɵconditional(!ctx.collapse() ? 4 : -1);
175
175
  i0.ɵɵadvance();
176
176
  i0.ɵɵstyleProp("height", ctx.dragOvered() ? (ctx.dragKanban()?.heightOnDrag() ?? 0) + "px" : "0px")("display", ctx.dragKanban() ? "block" : "none");
177
- } }, dependencies: [SdBusyContainer, SdCheckbox, NgTemplateOutlet, SdAnchor, NgIcon], styles: ["sd-kanban-lane > .flex-fill > sd-busy-container {\n padding: var(--sd-gap-xl) var(--sd-gap-lg);\n background-color: var(--sd-bg-gray-subtle);\n border-radius: var(--sd-radius-default);\n height: 100%;\n}\nsd-kanban-lane > .flex-fill > sd-busy-container > ._drop-position {\n pointer-events: none;\n border-radius: var(--sd-radius-default);\n background-color: var(--sd-bg-state-active);\n height: 0;\n margin-bottom: 0;\n visibility: hidden;\n transition: var(--sd-animation-duration) linear;\n transition-property: height, margin-bottom, visibility;\n}\nsd-kanban-lane[data-sd-drag-over=true] > .flex-fill > sd-busy-container > ._drop-position {\n margin-bottom: var(--sd-gap-lg);\n visibility: visible;\n}"], encapsulation: 2 });
177
+ } }, dependencies: [SdBusyContainer, SdCheckbox, NgTemplateOutlet, SdAnchor, NgIcon], styles: ["sd-kanban-lane > .flex-fill > sd-busy-container {\n padding: var(--%NS%sd-gap-xl) var(--%NS%sd-gap-lg);\n background-color: var(--%NS%sd-bg-gray-subtle);\n border-radius: var(--%NS%sd-radius-default);\n height: 100%;\n}\nsd-kanban-lane > .flex-fill > sd-busy-container > ._drop-position {\n pointer-events: none;\n border-radius: var(--%NS%sd-radius-default);\n background-color: var(--%NS%sd-bg-state-active);\n height: 0;\n margin-bottom: 0;\n visibility: hidden;\n transition: var(--%NS%sd-animation-duration) linear;\n transition-property: height, margin-bottom, visibility;\n}\nsd-kanban-lane[data-sd-drag-over=true] > .flex-fill > sd-busy-container > ._drop-position {\n margin-bottom: var(--%NS%sd-gap-lg);\n visibility: visible;\n}"], encapsulation: 2 });
178
178
  }
179
179
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdKanbanLane, [{
180
180
  type: Component,
@@ -117,7 +117,7 @@ export class SdKanban {
117
117
  i0.ɵɵadvance();
118
118
  i0.ɵɵclassMap(ctx.contentClass());
119
119
  i0.ɵɵproperty("draggable", ctx.draggable());
120
- } }, dependencies: [SdResizeDirective], styles: ["sd-kanban {\n position: relative;\n display: block;\n}\nsd-kanban[data-sd-dragging-this=true] {\n display: none;\n}\nsd-kanban > ._drag-position {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n}\nsd-kanban[data-sd-dragging=true] > ._drag-position {\n pointer-events: auto;\n}\nsd-kanban[data-sd-dragging=true] > .card {\n pointer-events: none;\n cursor: pointer;\n}\nsd-kanban > ._drop-position {\n border-radius: var(--sd-radius-default);\n background-color: var(--sd-bg-state-active);\n height: 0;\n margin-bottom: 0;\n visibility: hidden;\n transition: var(--sd-animation-duration) linear;\n transition-property: height, margin-bottom, visibility;\n}\nsd-kanban[data-sd-drag-over=true] > ._drop-position {\n margin-bottom: var(--sd-gap-lg);\n visibility: visible;\n}\nsd-kanban > .card {\n white-space: normal;\n user-select: none;\n margin-bottom: var(--sd-gap-lg);\n}"], encapsulation: 2 });
120
+ } }, dependencies: [SdResizeDirective], styles: ["sd-kanban {\n position: relative;\n display: block;\n}\nsd-kanban[data-sd-dragging-this=true] {\n display: none;\n}\nsd-kanban > ._drag-position {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n}\nsd-kanban[data-sd-dragging=true] > ._drag-position {\n pointer-events: auto;\n}\nsd-kanban[data-sd-dragging=true] > .card {\n pointer-events: none;\n cursor: pointer;\n}\nsd-kanban > ._drop-position {\n border-radius: var(--%NS%sd-radius-default);\n background-color: var(--%NS%sd-bg-state-active);\n height: 0;\n margin-bottom: 0;\n visibility: hidden;\n transition: var(--%NS%sd-animation-duration) linear;\n transition-property: height, margin-bottom, visibility;\n}\nsd-kanban[data-sd-drag-over=true] > ._drop-position {\n margin-bottom: var(--%NS%sd-gap-lg);\n visibility: visible;\n}\nsd-kanban > .card {\n white-space: normal;\n user-select: none;\n margin-bottom: var(--%NS%sd-gap-lg);\n}"], encapsulation: 2 });
121
121
  }
122
122
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdKanban, [{
123
123
  type: Component,
@@ -369,7 +369,7 @@ export class SdPermissionTable {
369
369
  i0.ɵɵrepeater(ctx.items());
370
370
  i0.ɵɵadvance(2);
371
371
  i0.ɵɵproperty("typed", ctx.itemTemplateType);
372
- } }, dependencies: [SdTypedTemplate, NgTemplateOutlet, SdCollapseIcon, SdCheckbox, SdAnchor], styles: ["sd-permission-table table {\n border-collapse: collapse;\n}\nsd-permission-table table > * > tr > * {\n padding: var(--sd-gap-sm) var(--sd-gap-lg);\n position: sticky;\n top: 0;\n border-top: 1px solid transparent;\n border-bottom: 1px solid transparent;\n color: var(--sd-tx-default);\n}\nsd-permission-table table > * > tr > * > * {\n color: var(--sd-tx-default) !important;\n}\nsd-permission-table table > * > tr > *._title {\n border-top-left-radius: 14px;\n border-bottom-left-radius: 14px;\n padding-left: var(--sd-gap-lg);\n}\nsd-permission-table table > * > tr[data-sd-collapse=true] {\n display: none;\n}\nsd-permission-table table > * > tr[data-sd-theme=first] > *._title, sd-permission-table table > * > tr[data-sd-theme=first] > *._after {\n background-color: var(--sd-permission-group-bg);\n color: var(--sd-permission-group-tx);\n}\nsd-permission-table table > * > tr[data-sd-theme=first] > *._title > *, sd-permission-table table > * > tr[data-sd-theme=first] > *._after > * {\n color: var(--sd-permission-group-tx) !important;\n}\nsd-permission-table table > * > tr[data-sd-theme=info] > *._title, sd-permission-table table > * > tr[data-sd-theme=info] > *._after {\n background-color: var(--sd-bg-info-subtle);\n}\nsd-permission-table table > * > tr[data-sd-theme=warning] > *._title, sd-permission-table table > * > tr[data-sd-theme=warning] > *._after {\n background-color: var(--sd-bg-warning-subtle);\n}\nsd-permission-table table > * > tr[data-sd-theme=success] > *._title, sd-permission-table table > * > tr[data-sd-theme=success] > *._after {\n background-color: var(--sd-bg-success-subtle);\n}"], encapsulation: 2 });
372
+ } }, dependencies: [SdTypedTemplate, NgTemplateOutlet, SdCollapseIcon, SdCheckbox, SdAnchor], styles: ["sd-permission-table table {\n border-collapse: collapse;\n}\nsd-permission-table table > * > tr > * {\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-lg);\n position: sticky;\n top: 0;\n border-top: 1px solid transparent;\n border-bottom: 1px solid transparent;\n color: var(--%NS%sd-tx-default);\n}\nsd-permission-table table > * > tr > * > * {\n color: var(--%NS%sd-tx-default) !important;\n}\nsd-permission-table table > * > tr > *._title {\n border-top-left-radius: 14px;\n border-bottom-left-radius: 14px;\n padding-left: var(--%NS%sd-gap-lg);\n}\nsd-permission-table table > * > tr[data-sd-collapse=true] {\n display: none;\n}\nsd-permission-table table > * > tr[data-sd-theme=first] > *._title, sd-permission-table table > * > tr[data-sd-theme=first] > *._after {\n background-color: var(--%NS%sd-permission-group-bg);\n color: var(--%NS%sd-permission-group-tx);\n}\nsd-permission-table table > * > tr[data-sd-theme=first] > *._title > *, sd-permission-table table > * > tr[data-sd-theme=first] > *._after > * {\n color: var(--%NS%sd-permission-group-tx) !important;\n}\nsd-permission-table table > * > tr[data-sd-theme=info] > *._title, sd-permission-table table > * > tr[data-sd-theme=info] > *._after {\n background-color: var(--%NS%sd-bg-info-subtle);\n}\nsd-permission-table table > * > tr[data-sd-theme=warning] > *._title, sd-permission-table table > * > tr[data-sd-theme=warning] > *._after {\n background-color: var(--%NS%sd-bg-warning-subtle);\n}\nsd-permission-table table > * > tr[data-sd-theme=success] > *._title, sd-permission-table table > * > tr[data-sd-theme=success] > *._after {\n background-color: var(--%NS%sd-bg-success-subtle);\n}"], encapsulation: 2 });
373
373
  }
374
374
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdPermissionTable, [{
375
375
  type: Component,
@@ -804,7 +804,7 @@ export class SdSheet {
804
804
  SdPagination,
805
805
  SdAnchor,
806
806
  SdButton,
807
- SdResizeDirective], styles: ["sd-sheet {\n border: 1px solid var(--sd-bd-soft);\n border-radius: var(--sd-radius-default);\n}\nsd-sheet > ._tool {\n background-color: var(--sd-bg-canvas);\n border-top-left-radius: var(--sd-radius-default);\n border-top-right-radius: var(--sd-radius-default);\n border-bottom: 1px solid var(--sd-bd-soft);\n}\nsd-sheet > ._sheet-container {\n position: relative;\n background-color: var(--sd-bg-sheet);\n background-image: var(--sd-bg-sheet-image);\n border-bottom-left-radius: var(--sd-radius-default);\n border-bottom-right-radius: var(--sd-radius-default);\n overflow: auto;\n}\nsd-sheet > ._sheet-container > table {\n border-spacing: 0;\n table-layout: fixed;\n margin-right: 2px;\n margin-bottom: 2px;\n border-bottom-right-radius: var(--sd-radius-default);\n box-shadow: var(--sd-sheet-shadow);\n}\nsd-sheet > ._sheet-container > table > * > tr > *:last-child {\n border-right: 1px solid var(--sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > * > tr:last-child > * {\n border-bottom: 1px solid var(--sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > *:last-child > tr:last-child > td:last-child {\n border-bottom-right-radius: var(--sd-radius-default);\n overflow: hidden;\n}\nsd-sheet > ._sheet-container > table > * > tr > * {\n border-right: 1px solid var(--sd-bd-soft);\n border-bottom: 1px solid var(--sd-bd-soft);\n white-space: nowrap;\n overflow: hidden;\n padding: 0;\n position: relative;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed:has(+ :not(._fixed)) + :not(._fixed):not([data-c=\"0\"]) {\n border-left: 1px solid var(--sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > * > tr > *._feature-cell {\n background-color: var(--sd-bg-gray-subtle);\n min-width: calc(var(--sd-font-size-default) + 2px + var(--sd-sheet-ph) * 2);\n padding: var(--sd-sheet-pv) var(--sd-sheet-ph);\n text-align: left;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._feature-cell > ng-icon {\n cursor: pointer;\n color: var(--sd-tx-faint);\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed {\n position: sticky;\n left: 0;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed:has(+ :not(._fixed)) {\n border-right: 1px solid var(--sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > thead {\n position: sticky;\n top: 0;\n z-index: 3;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th {\n position: relative;\n background-color: var(--sd-bg-gray-subtle);\n vertical-align: middle;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._fixed {\n z-index: 4;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._last-depth {\n border-bottom: 1px solid var(--sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._feature-cell {\n border-bottom: 1px solid var(--sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._sort {\n cursor: pointer;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._sort:hover {\n text-decoration: underline;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th > ._headerContent > ._sort-icon {\n padding: var(--sd-gap-xs) var(--sd-gap-xs) var(--sd-gap-xs) 0;\n background-color: var(--sd-bg-gray-subtle);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th > ._resizer {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 2px;\n cursor: ew-resize;\n}\nsd-sheet > ._sheet-container > table > thead:has(> tr._summary-row) > tr > th._last-depth {\n border-bottom: 1px solid var(--sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > thead:has(> tr._summary-row) > tr._summary-row > th {\n background-color: var(--sd-bg-warning-subtle);\n text-align: left;\n border-bottom: 1px solid var(--sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td {\n font-family: var(--sd-font-family-field);\n background-color: var(--sd-bg-content);\n vertical-align: top;\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td._fixed {\n z-index: 2;\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td > ._depth-indicator {\n display: inline-block;\n margin-top: 0.4em;\n width: 0.5em;\n height: 0.5em;\n border-left: 1px solid currentColor;\n border-bottom: 1px solid currentColor;\n vertical-align: top;\n}\nsd-sheet > ._sheet-container > ._focus-row-indicator {\n display: none;\n position: absolute;\n pointer-events: none;\n background-color: var(--sd-bg-state-active);\n z-index: 6;\n}\nsd-sheet > ._sheet-container > ._focus-row-indicator > ._focus-cell-indicator {\n position: absolute;\n border: 2px solid var(--sd-focus-ring-color);\n border-radius: var(--sd-radius-default);\n}\nsd-sheet > ._sheet-container > ._resize-indicator {\n display: none;\n position: absolute;\n pointer-events: none;\n top: 0;\n height: 100%;\n border: 1px dotted var(--sd-bd-default);\n z-index: 7;\n}\nsd-sheet > ._sheet-container > ._select-row-indicator-container {\n display: none;\n position: absolute;\n pointer-events: none;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n}\nsd-sheet > ._sheet-container > ._select-row-indicator-container > ._select-row-indicator {\n display: block;\n left: 0;\n position: absolute;\n pointer-events: none;\n background-color: var(--sd-bg-primary-solid);\n opacity: 0.1;\n}\nsd-sheet ._p-sheet {\n padding: var(--sd-sheet-pv) var(--sd-sheet-ph);\n}\nsd-sheet[data-sd-focus-mode=row] > ._sheet-container > ._focus-row-indicator > ._focus-cell-indicator {\n display: none !important;\n}\nsd-sheet[data-sd-inset=true] {\n border: none;\n border-radius: 0;\n}"], encapsulation: 2 });
807
+ SdResizeDirective], styles: ["sd-sheet {\n border: 1px solid var(--%NS%sd-bd-soft);\n border-radius: var(--%NS%sd-radius-default);\n}\nsd-sheet > ._tool {\n background-color: var(--%NS%sd-bg-canvas);\n border-top-left-radius: var(--%NS%sd-radius-default);\n border-top-right-radius: var(--%NS%sd-radius-default);\n border-bottom: 1px solid var(--%NS%sd-bd-soft);\n}\nsd-sheet > ._sheet-container {\n position: relative;\n background-color: var(--%NS%sd-bg-sheet);\n background-image: var(--%NS%sd-bg-sheet-image);\n border-bottom-left-radius: var(--%NS%sd-radius-default);\n border-bottom-right-radius: var(--%NS%sd-radius-default);\n overflow: auto;\n}\nsd-sheet > ._sheet-container > table {\n border-spacing: 0;\n table-layout: fixed;\n margin-right: 2px;\n margin-bottom: 2px;\n border-bottom-right-radius: var(--%NS%sd-radius-default);\n box-shadow: var(--%NS%sd-sheet-shadow);\n}\nsd-sheet > ._sheet-container > table > * > tr > *:last-child {\n border-right: 1px solid var(--%NS%sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > * > tr:last-child > * {\n border-bottom: 1px solid var(--%NS%sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > *:last-child > tr:last-child > td:last-child {\n border-bottom-right-radius: var(--%NS%sd-radius-default);\n overflow: hidden;\n}\nsd-sheet > ._sheet-container > table > * > tr > * {\n border-right: 1px solid var(--%NS%sd-bd-soft);\n border-bottom: 1px solid var(--%NS%sd-bd-soft);\n white-space: nowrap;\n overflow: hidden;\n padding: 0;\n position: relative;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed:has(+ :not(._fixed)) + :not(._fixed):not([data-c=\"0\"]) {\n border-left: 1px solid var(--%NS%sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > * > tr > *._feature-cell {\n background-color: var(--%NS%sd-bg-gray-subtle);\n min-width: calc(var(--%NS%sd-font-size-default) + 2px + var(--%NS%sd-sheet-ph) * 2);\n padding: var(--%NS%sd-sheet-pv) var(--%NS%sd-sheet-ph);\n text-align: left;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._feature-cell > ng-icon {\n cursor: pointer;\n color: var(--%NS%sd-tx-faint);\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed {\n position: sticky;\n left: 0;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed:has(+ :not(._fixed)) {\n border-right: 1px solid var(--%NS%sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > thead {\n position: sticky;\n top: 0;\n z-index: 3;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th {\n position: relative;\n background-color: var(--%NS%sd-bg-gray-subtle);\n vertical-align: middle;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._fixed {\n z-index: 4;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._last-depth {\n border-bottom: 1px solid var(--%NS%sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._feature-cell {\n border-bottom: 1px solid var(--%NS%sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._sort {\n cursor: pointer;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._sort:hover {\n text-decoration: underline;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th > ._headerContent > ._sort-icon {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-xs) var(--%NS%sd-gap-xs) 0;\n background-color: var(--%NS%sd-bg-gray-subtle);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th > ._resizer {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 2px;\n cursor: ew-resize;\n}\nsd-sheet > ._sheet-container > table > thead:has(> tr._summary-row) > tr > th._last-depth {\n border-bottom: 1px solid var(--%NS%sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > thead:has(> tr._summary-row) > tr._summary-row > th {\n background-color: var(--%NS%sd-bg-warning-subtle);\n text-align: left;\n border-bottom: 1px solid var(--%NS%sd-bd-soft);\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td {\n font-family: var(--%NS%sd-font-family-field);\n background-color: var(--%NS%sd-bg-content);\n vertical-align: top;\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td._fixed {\n z-index: 2;\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td > ._depth-indicator {\n display: inline-block;\n margin-top: 0.4em;\n width: 0.5em;\n height: 0.5em;\n border-left: 1px solid currentColor;\n border-bottom: 1px solid currentColor;\n vertical-align: top;\n}\nsd-sheet > ._sheet-container > ._focus-row-indicator {\n display: none;\n position: absolute;\n pointer-events: none;\n background-color: var(--%NS%sd-bg-state-active);\n z-index: 6;\n}\nsd-sheet > ._sheet-container > ._focus-row-indicator > ._focus-cell-indicator {\n position: absolute;\n border: 2px solid var(--%NS%sd-focus-ring-color);\n border-radius: var(--%NS%sd-radius-default);\n}\nsd-sheet > ._sheet-container > ._resize-indicator {\n display: none;\n position: absolute;\n pointer-events: none;\n top: 0;\n height: 100%;\n border: 1px dotted var(--%NS%sd-bd-default);\n z-index: 7;\n}\nsd-sheet > ._sheet-container > ._select-row-indicator-container {\n display: none;\n position: absolute;\n pointer-events: none;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n}\nsd-sheet > ._sheet-container > ._select-row-indicator-container > ._select-row-indicator {\n display: block;\n left: 0;\n position: absolute;\n pointer-events: none;\n background-color: var(--%NS%sd-bg-primary-solid);\n opacity: 0.1;\n}\nsd-sheet ._p-sheet {\n padding: var(--%NS%sd-sheet-pv) var(--%NS%sd-sheet-ph);\n}\nsd-sheet[data-sd-focus-mode=row] > ._sheet-container > ._focus-row-indicator > ._focus-cell-indicator {\n display: none !important;\n}\nsd-sheet[data-sd-inset=true] {\n border: none;\n border-radius: 0;\n}"], encapsulation: 2 });
808
808
  }
809
809
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSheet, [{
810
810
  type: Component,
@@ -112,7 +112,7 @@ export class SdStatePreset {
112
112
  i0.ɵɵproperty("svg", ctx.tablerStar);
113
113
  i0.ɵɵadvance();
114
114
  i0.ɵɵrepeater(ctx._presets());
115
- } }, dependencies: [SdAnchor, NgIcon], styles: ["sd-state-preset {\n display: inline-block;\n vertical-align: top;\n}\nsd-state-preset > ._sd-state-preset {\n display: flex;\n align-items: center;\n gap: var(--sd-gap-sm);\n flex-wrap: wrap;\n}\nsd-state-preset > ._sd-state-preset > ._add-btn {\n line-height: var(--sd-line-height);\n border: 1px solid transparent;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item {\n display: inline-flex;\n align-items: center;\n gap: var(--sd-gap-xs);\n line-height: var(--sd-line-height);\n border: 1px solid transparent;\n border-radius: var(--sd-radius-lg);\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n background-color: var(--sd-bg-gray-subtle);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item:hover {\n background-color: var(--sd-bg-gray-subtle-hover);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item > sd-anchor {\n padding: 0 var(--sd-gap-sm);\n}\nsd-state-preset[data-sd-size=sm] > ._sd-state-preset > ._add-btn {\n padding: var(--sd-gap-xs) var(--sd-gap-default);\n}\nsd-state-preset[data-sd-size=sm] > ._sd-state-preset > ._preset-item {\n padding: var(--sd-gap-xs) var(--sd-gap-default);\n}\nsd-state-preset[data-sd-size=lg] > ._sd-state-preset > ._add-btn {\n padding: var(--sd-gap-default) var(--sd-gap-lg);\n}\nsd-state-preset[data-sd-size=lg] > ._sd-state-preset > ._preset-item {\n padding: var(--sd-gap-default) var(--sd-gap-lg);\n}"], encapsulation: 2 });
115
+ } }, dependencies: [SdAnchor, NgIcon], styles: ["sd-state-preset {\n display: inline-block;\n vertical-align: top;\n}\nsd-state-preset > ._sd-state-preset {\n display: flex;\n align-items: center;\n gap: var(--%NS%sd-gap-sm);\n flex-wrap: wrap;\n}\nsd-state-preset > ._sd-state-preset > ._add-btn {\n line-height: var(--%NS%sd-line-height);\n border: 1px solid transparent;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item {\n display: inline-flex;\n align-items: center;\n gap: var(--%NS%sd-gap-xs);\n line-height: var(--%NS%sd-line-height);\n border: 1px solid transparent;\n border-radius: var(--%NS%sd-radius-lg);\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n background-color: var(--%NS%sd-bg-gray-subtle);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item:hover {\n background-color: var(--%NS%sd-bg-gray-subtle-hover);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item > sd-anchor {\n padding: 0 var(--%NS%sd-gap-sm);\n}\nsd-state-preset[data-sd-size=sm] > ._sd-state-preset > ._add-btn {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-default);\n}\nsd-state-preset[data-sd-size=sm] > ._sd-state-preset > ._preset-item {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-default);\n}\nsd-state-preset[data-sd-size=lg] > ._sd-state-preset > ._add-btn {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-lg);\n}\nsd-state-preset[data-sd-size=lg] > ._sd-state-preset > ._preset-item {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-lg);\n}"], encapsulation: 2 });
116
116
  }
117
117
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdStatePreset, [{
118
118
  type: Component,
@@ -203,7 +203,7 @@ export class SdMarkdownEditor {
203
203
  i0.ɵɵdomElement(1, "div", 1);
204
204
  } if (rf & 2) {
205
205
  i0.ɵɵconditional(!ctx.disabled() && !ctx.readonly() ? 0 : -1);
206
- } }, styles: ["sd-markdown-editor {\n display: block;\n position: relative;\n border: 1px solid var(--sd-bd-field);\n border-radius: var(--sd-radius-default);\n background-color: var(--sd-bg-field);\n}\nsd-markdown-editor > ._toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: var(--sd-gap-xs);\n padding: var(--sd-gap-xs);\n border-bottom: 1px solid var(--sd-bd-hairline);\n}\nsd-markdown-editor > ._toolbar > ._btn-group {\n display: flex;\n gap: 1px;\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button {\n padding: var(--sd-gap-xs) var(--sd-gap-sm);\n border: 1px solid var(--sd-bd-hairline);\n border-radius: var(--sd-radius-default);\n background-color: transparent;\n cursor: pointer;\n font-size: var(--sd-font-size-default);\n line-height: 1;\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button._active {\n background-color: var(--sd-bg-primary-solid);\n color: var(--sd-tx-primary-solid);\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button:hover {\n background-color: var(--sd-bg-state-hover);\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button._active:hover {\n background-color: var(--sd-bg-primary-solid);\n}\nsd-markdown-editor > ._editor-container {\n padding: var(--sd-gap-sm);\n min-height: 6.25rem;\n font-family: var(--sd-font-family-field);\n}\nsd-markdown-editor > ._editor-container > .tiptap {\n outline: none;\n}\nsd-markdown-editor > ._editor-container > .tiptap:focus {\n outline: none;\n}\nsd-markdown-editor[data-sd-disabled=true] {\n background-color: var(--sd-bg-disabled);\n color: var(--sd-tx-disabled);\n}\nsd-markdown-editor[data-sd-disabled=true] > ._editor-container > .tiptap {\n cursor: not-allowed;\n}\nsd-markdown-editor[data-sd-readonly=true] > ._editor-container > .tiptap {\n cursor: default;\n}"], encapsulation: 2 });
206
+ } }, styles: ["sd-markdown-editor {\n display: block;\n position: relative;\n border: 1px solid var(--%NS%sd-bd-field);\n border-radius: var(--%NS%sd-radius-default);\n background-color: var(--%NS%sd-bg-field);\n}\nsd-markdown-editor > ._toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: var(--%NS%sd-gap-xs);\n padding: var(--%NS%sd-gap-xs);\n border-bottom: 1px solid var(--%NS%sd-bd-hairline);\n}\nsd-markdown-editor > ._toolbar > ._btn-group {\n display: flex;\n gap: 1px;\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm);\n border: 1px solid var(--%NS%sd-bd-hairline);\n border-radius: var(--%NS%sd-radius-default);\n background-color: transparent;\n cursor: pointer;\n font-size: var(--%NS%sd-font-size-default);\n line-height: 1;\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button._active {\n background-color: var(--%NS%sd-bg-primary-solid);\n color: var(--%NS%sd-tx-primary-solid);\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button._active:hover {\n background-color: var(--%NS%sd-bg-primary-solid);\n}\nsd-markdown-editor > ._editor-container {\n padding: var(--%NS%sd-gap-sm);\n min-height: 6.25rem;\n font-family: var(--%NS%sd-font-family-field);\n}\nsd-markdown-editor > ._editor-container > .tiptap {\n outline: none;\n}\nsd-markdown-editor > ._editor-container > .tiptap:focus {\n outline: none;\n}\nsd-markdown-editor[data-sd-disabled=true] {\n background-color: var(--%NS%sd-bg-disabled);\n color: var(--%NS%sd-tx-disabled);\n}\nsd-markdown-editor[data-sd-disabled=true] > ._editor-container > .tiptap {\n cursor: not-allowed;\n}\nsd-markdown-editor[data-sd-readonly=true] > ._editor-container > .tiptap {\n cursor: default;\n}"], encapsulation: 2 });
207
207
  }
208
208
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdMarkdownEditor, [{
209
209
  type: Component,
@@ -336,7 +336,7 @@ export class SdTiptapEditor {
336
336
  i0.ɵɵdomElement(1, "div", 0);
337
337
  } if (rf & 2) {
338
338
  i0.ɵɵconditional(!ctx.disabled() ? 0 : -1);
339
- } }, styles: ["sd-tiptap-editor {\n display: block;\n position: relative;\n border: 1px solid var(--sd-bd-field);\n border-radius: var(--sd-radius-default);\n background-color: var(--sd-bg-field);\n}\nsd-tiptap-editor > ._toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: var(--sd-gap-xs);\n padding: var(--sd-gap-xs);\n border-bottom: 1px solid var(--sd-bd-hairline);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group {\n display: flex;\n gap: 1px;\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button {\n padding: var(--sd-gap-xs) var(--sd-gap-sm);\n border: 1px solid var(--sd-bd-hairline);\n border-radius: var(--sd-radius-default);\n background-color: transparent;\n cursor: pointer;\n font-size: var(--sd-font-size-default);\n line-height: 1;\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button._active {\n background-color: var(--sd-bg-primary-solid);\n color: var(--sd-tx-primary-solid);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button:hover {\n background-color: var(--sd-bg-state-hover);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button._active:hover {\n background-color: var(--sd-bg-primary-solid);\n}\nsd-tiptap-editor > ._color-picker {\n display: flex;\n flex-wrap: wrap;\n gap: 2px;\n padding: var(--sd-gap-xs);\n border-bottom: 1px solid var(--sd-bd-hairline);\n}\nsd-tiptap-editor > ._color-picker > ._color-swatch {\n width: 1.25rem;\n height: 1.25rem;\n border: 1px solid var(--sd-bd-hairline);\n border-radius: 2px;\n cursor: pointer;\n padding: 0;\n}\nsd-tiptap-editor > ._color-picker > ._color-swatch._no-color {\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--sd-bg-content);\n font-size: 0.625rem;\n}\nsd-tiptap-editor > ._editor-container {\n padding: var(--sd-gap-sm);\n min-height: 6.25rem;\n font-family: var(--sd-font-family-field);\n}\nsd-tiptap-editor > ._editor-container > .tiptap {\n outline: none;\n}\nsd-tiptap-editor > ._editor-container > .tiptap:focus {\n outline: none;\n}\nsd-tiptap-editor[data-sd-disabled=true] {\n background-color: var(--sd-bg-disabled);\n color: var(--sd-tx-disabled);\n}\nsd-tiptap-editor[data-sd-disabled=true] > ._editor-container > .tiptap {\n cursor: not-allowed;\n}\nsd-tiptap-editor[data-sd-readonly=true] > ._editor-container > .tiptap {\n cursor: default;\n}\nsd-tiptap-editor ._color-btn {\n position: relative;\n}\nsd-tiptap-editor ._color-btn > ._color-indicator {\n display: block;\n height: 2px;\n width: 100%;\n position: absolute;\n bottom: 2px;\n left: 0;\n}"], encapsulation: 2 });
339
+ } }, styles: ["sd-tiptap-editor {\n display: block;\n position: relative;\n border: 1px solid var(--%NS%sd-bd-field);\n border-radius: var(--%NS%sd-radius-default);\n background-color: var(--%NS%sd-bg-field);\n}\nsd-tiptap-editor > ._toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: var(--%NS%sd-gap-xs);\n padding: var(--%NS%sd-gap-xs);\n border-bottom: 1px solid var(--%NS%sd-bd-hairline);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group {\n display: flex;\n gap: 1px;\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm);\n border: 1px solid var(--%NS%sd-bd-hairline);\n border-radius: var(--%NS%sd-radius-default);\n background-color: transparent;\n cursor: pointer;\n font-size: var(--%NS%sd-font-size-default);\n line-height: 1;\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button._active {\n background-color: var(--%NS%sd-bg-primary-solid);\n color: var(--%NS%sd-tx-primary-solid);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button._active:hover {\n background-color: var(--%NS%sd-bg-primary-solid);\n}\nsd-tiptap-editor > ._color-picker {\n display: flex;\n flex-wrap: wrap;\n gap: 2px;\n padding: var(--%NS%sd-gap-xs);\n border-bottom: 1px solid var(--%NS%sd-bd-hairline);\n}\nsd-tiptap-editor > ._color-picker > ._color-swatch {\n width: 1.25rem;\n height: 1.25rem;\n border: 1px solid var(--%NS%sd-bd-hairline);\n border-radius: 2px;\n cursor: pointer;\n padding: 0;\n}\nsd-tiptap-editor > ._color-picker > ._color-swatch._no-color {\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--%NS%sd-bg-content);\n font-size: 0.625rem;\n}\nsd-tiptap-editor > ._editor-container {\n padding: var(--%NS%sd-gap-sm);\n min-height: 6.25rem;\n font-family: var(--%NS%sd-font-family-field);\n}\nsd-tiptap-editor > ._editor-container > .tiptap {\n outline: none;\n}\nsd-tiptap-editor > ._editor-container > .tiptap:focus {\n outline: none;\n}\nsd-tiptap-editor[data-sd-disabled=true] {\n background-color: var(--%NS%sd-bg-disabled);\n color: var(--%NS%sd-tx-disabled);\n}\nsd-tiptap-editor[data-sd-disabled=true] > ._editor-container > .tiptap {\n cursor: not-allowed;\n}\nsd-tiptap-editor[data-sd-readonly=true] > ._editor-container > .tiptap {\n cursor: default;\n}\nsd-tiptap-editor ._color-btn {\n position: relative;\n}\nsd-tiptap-editor ._color-btn > ._color-indicator {\n display: block;\n height: 2px;\n width: 100%;\n position: absolute;\n bottom: 2px;\n left: 0;\n}"], encapsulation: 2 });
340
340
  }
341
341
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTiptapEditor, [{
342
342
  type: Component,
@@ -132,7 +132,7 @@ export class SdCalendar {
132
132
  i0.ɵɵtextInterpolate1(" ", ctx.weeks[(ctx.weekStartDay() + 6) % 7], " ");
133
133
  i0.ɵɵadvance(2);
134
134
  i0.ɵɵrepeater(ctx.dataTable());
135
- } }, dependencies: [NgTemplateOutlet, FormatPipe], styles: ["sd-calendar > table {\n border-collapse: collapse;\n width: 100%;\n height: 100%;\n border-radius: var(--sd-radius-default);\n overflow: hidden;\n}\nsd-calendar > table > * > tr > * {\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n border: 1px solid var(--sd-bd-default);\n width: 14.2857142857%;\n}\nsd-calendar > table > thead > tr > th {\n background-color: var(--sd-bg-gray-subtle);\n height: 10%;\n}\nsd-calendar > table > tbody > tr > td {\n vertical-align: top;\n height: 15%;\n}\nsd-calendar > table > tbody > tr > td > .day {\n margin-bottom: var(--sd-gap-sm);\n}\nsd-calendar > table > tbody > tr > td.not-current {\n background-color: var(--sd-bg-canvas);\n}\nsd-calendar > table > tbody > tr > td.not-current > .day {\n color: var(--sd-tx-gray);\n}\nsd-calendar > table > tbody > tr > td > .content {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n gap: var(--sd-gap-sm);\n}\n@supports not (appearance: auto) {\n sd-calendar > table > tbody > tr > td > .content {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content > * + * {\n margin-top: var(--sd-gap-sm);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxs {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxs > * + * {\n margin-top: var(--sd-gap-xxs);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xs {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xs > * + * {\n margin-top: var(--sd-gap-xs);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-sm {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-sm > * + * {\n margin-top: var(--sd-gap-sm);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-default {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-default > * + * {\n margin-top: var(--sd-gap-default);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-lg {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-lg > * + * {\n margin-top: var(--sd-gap-lg);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xl {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xl > * + * {\n margin-top: var(--sd-gap-xl);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxl {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxl > * + * {\n margin-top: var(--sd-gap-xxl);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-0 {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-0 > * + * {\n margin-top: var(--sd-gap-0);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-auto {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-auto > * + * {\n margin-top: var(--sd-gap-auto);\n }\n}"], encapsulation: 2 });
135
+ } }, dependencies: [NgTemplateOutlet, FormatPipe], styles: ["sd-calendar > table {\n border-collapse: collapse;\n width: 100%;\n height: 100%;\n border-radius: var(--%NS%sd-radius-default);\n overflow: hidden;\n}\nsd-calendar > table > * > tr > * {\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n border: 1px solid var(--%NS%sd-bd-default);\n width: 14.2857142857%;\n}\nsd-calendar > table > thead > tr > th {\n background-color: var(--%NS%sd-bg-gray-subtle);\n height: 10%;\n}\nsd-calendar > table > tbody > tr > td {\n vertical-align: top;\n height: 15%;\n}\nsd-calendar > table > tbody > tr > td > .day {\n margin-bottom: var(--%NS%sd-gap-sm);\n}\nsd-calendar > table > tbody > tr > td.not-current {\n background-color: var(--%NS%sd-bg-canvas);\n}\nsd-calendar > table > tbody > tr > td.not-current > .day {\n color: var(--%NS%sd-tx-gray);\n}\nsd-calendar > table > tbody > tr > td > .content {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n gap: var(--%NS%sd-gap-sm);\n}\n@supports not (appearance: auto) {\n sd-calendar > table > tbody > tr > td > .content {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content > * + * {\n margin-top: var(--%NS%sd-gap-sm);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxs {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxs > * + * {\n margin-top: var(--%NS%sd-gap-xxs);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xs {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xs > * + * {\n margin-top: var(--%NS%sd-gap-xs);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-sm {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-sm > * + * {\n margin-top: var(--%NS%sd-gap-sm);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-default {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-default > * + * {\n margin-top: var(--%NS%sd-gap-default);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-lg {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-lg > * + * {\n margin-top: var(--%NS%sd-gap-lg);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xl {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xl > * + * {\n margin-top: var(--%NS%sd-gap-xl);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxl {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxl > * + * {\n margin-top: var(--%NS%sd-gap-xxl);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-0 {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-0 > * + * {\n margin-top: var(--%NS%sd-gap-0);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-auto {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-auto > * + * {\n margin-top: var(--%NS%sd-gap-auto);\n }\n}"], encapsulation: 2 });
136
136
  }
137
137
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdCalendar, [{
138
138
  type: Component,
@@ -14,7 +14,7 @@ export class SdLabel {
14
14
  } }, inputs: { theme: [1, "theme"], color: [1, "color"], clickable: [1, "clickable"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdLabel_Template(rf, ctx) { if (rf & 1) {
15
15
  i0.ɵɵprojectionDef();
16
16
  i0.ɵɵprojection(0);
17
- } }, styles: ["sd-label {\n display: inline-block;\n background-color: var(--sd-bg-gray-solid);\n color: var(--sd-tx-gray-solid);\n padding: 0 var(--sd-gap-sm);\n border-radius: var(--sd-radius-default);\n text-indent: 0;\n}\nsd-label[data-sd-theme=gray] {\n background-color: var(--sd-bg-gray-solid);\n color: var(--sd-tx-gray-solid);\n}\nsd-label[data-sd-theme=blue-gray] {\n background-color: var(--sd-bg-blue-gray-solid);\n color: var(--sd-tx-blue-gray-solid);\n}\nsd-label[data-sd-theme=primary] {\n background-color: var(--sd-bg-primary-solid);\n color: var(--sd-tx-primary-solid);\n}\nsd-label[data-sd-theme=info] {\n background-color: var(--sd-bg-info-solid);\n color: var(--sd-tx-info-solid);\n}\nsd-label[data-sd-theme=success] {\n background-color: var(--sd-bg-success-solid);\n color: var(--sd-tx-success-solid);\n}\nsd-label[data-sd-theme=warning] {\n background-color: var(--sd-bg-warning-solid);\n color: var(--sd-tx-warning-solid);\n}\nsd-label[data-sd-theme=danger] {\n background-color: var(--sd-bg-danger-solid);\n color: var(--sd-tx-danger-solid);\n}\nsd-label[data-sd-clickable=true] {\n cursor: pointer;\n}\nsd-label[data-sd-clickable=true]:hover {\n background-color: var(--sd-bg-gray-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=gray] {\n background-color: var(--sd-bg-gray-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=blue-gray] {\n background-color: var(--sd-bg-blue-gray-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=primary] {\n background-color: var(--sd-bg-primary-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=info] {\n background-color: var(--sd-bg-info-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=success] {\n background-color: var(--sd-bg-success-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=warning] {\n background-color: var(--sd-bg-warning-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=danger] {\n background-color: var(--sd-bg-danger-solid-hover);\n}"], encapsulation: 2 });
17
+ } }, styles: ["sd-label {\n display: inline-block;\n background-color: var(--%NS%sd-bg-gray-solid);\n color: var(--%NS%sd-tx-gray-solid);\n padding: 0 var(--%NS%sd-gap-sm);\n border-radius: var(--%NS%sd-radius-default);\n text-indent: 0;\n}\nsd-label[data-sd-theme=gray] {\n background-color: var(--%NS%sd-bg-gray-solid);\n color: var(--%NS%sd-tx-gray-solid);\n}\nsd-label[data-sd-theme=blue-gray] {\n background-color: var(--%NS%sd-bg-blue-gray-solid);\n color: var(--%NS%sd-tx-blue-gray-solid);\n}\nsd-label[data-sd-theme=primary] {\n background-color: var(--%NS%sd-bg-primary-solid);\n color: var(--%NS%sd-tx-primary-solid);\n}\nsd-label[data-sd-theme=info] {\n background-color: var(--%NS%sd-bg-info-solid);\n color: var(--%NS%sd-tx-info-solid);\n}\nsd-label[data-sd-theme=success] {\n background-color: var(--%NS%sd-bg-success-solid);\n color: var(--%NS%sd-tx-success-solid);\n}\nsd-label[data-sd-theme=warning] {\n background-color: var(--%NS%sd-bg-warning-solid);\n color: var(--%NS%sd-tx-warning-solid);\n}\nsd-label[data-sd-theme=danger] {\n background-color: var(--%NS%sd-bg-danger-solid);\n color: var(--%NS%sd-tx-danger-solid);\n}\nsd-label[data-sd-clickable=true] {\n cursor: pointer;\n}\nsd-label[data-sd-clickable=true]:hover {\n background-color: var(--%NS%sd-bg-gray-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=gray] {\n background-color: var(--%NS%sd-bg-gray-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=blue-gray] {\n background-color: var(--%NS%sd-bg-blue-gray-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=primary] {\n background-color: var(--%NS%sd-bg-primary-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=info] {\n background-color: var(--%NS%sd-bg-info-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=success] {\n background-color: var(--%NS%sd-bg-success-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=warning] {\n background-color: var(--%NS%sd-bg-warning-solid-hover);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=danger] {\n background-color: var(--%NS%sd-bg-danger-solid-hover);\n}"], encapsulation: 2 });
18
18
  }
19
19
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdLabel, [{
20
20
  type: Component,
@@ -13,7 +13,7 @@ export class SdNote {
13
13
  } }, inputs: { theme: [1, "theme"], size: [1, "size"], inset: [1, "inset"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdNote_Template(rf, ctx) { if (rf & 1) {
14
14
  i0.ɵɵprojectionDef();
15
15
  i0.ɵɵprojection(0);
16
- } }, styles: ["sd-note {\n display: block;\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n background-color: var(--sd-bg-gray-subtle);\n border: none;\n border-radius: var(--sd-radius-default);\n}\nsd-note[data-sd-theme=gray] {\n background-color: var(--sd-bg-gray-subtle);\n border: 1px solid var(--sd-bg-gray-subtle);\n}\nsd-note[data-sd-theme=blue-gray] {\n background-color: var(--sd-bg-blue-gray-subtle);\n border: 1px solid var(--sd-bg-blue-gray-subtle);\n}\nsd-note[data-sd-theme=primary] {\n background-color: var(--sd-bg-primary-subtle);\n border: 1px solid var(--sd-bg-primary-subtle);\n}\nsd-note[data-sd-theme=info] {\n background-color: var(--sd-bg-info-subtle);\n border: 1px solid var(--sd-bg-info-subtle);\n}\nsd-note[data-sd-theme=success] {\n background-color: var(--sd-bg-success-subtle);\n border: 1px solid var(--sd-bg-success-subtle);\n}\nsd-note[data-sd-theme=warning] {\n background-color: var(--sd-bg-warning-subtle);\n border: 1px solid var(--sd-bg-warning-subtle);\n}\nsd-note[data-sd-theme=danger] {\n background-color: var(--sd-bg-danger-subtle);\n border: 1px solid var(--sd-bg-danger-subtle);\n}\nsd-note[data-sd-size=sm] {\n font-size: var(--sd-font-size-sm);\n padding: var(--sd-gap-xs) var(--sd-gap-sm);\n}\nsd-note[data-sd-size=lg] {\n padding: var(--sd-gap-default) var(--sd-gap-lg);\n}\nsd-note[data-sd-inset=true] {\n border-radius: 0;\n}"], encapsulation: 2 });
16
+ } }, styles: ["sd-note {\n display: block;\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n background-color: var(--%NS%sd-bg-gray-subtle);\n border: none;\n border-radius: var(--%NS%sd-radius-default);\n}\nsd-note[data-sd-theme=gray] {\n background-color: var(--%NS%sd-bg-gray-subtle);\n border: 1px solid var(--%NS%sd-bg-gray-subtle);\n}\nsd-note[data-sd-theme=blue-gray] {\n background-color: var(--%NS%sd-bg-blue-gray-subtle);\n border: 1px solid var(--%NS%sd-bg-blue-gray-subtle);\n}\nsd-note[data-sd-theme=primary] {\n background-color: var(--%NS%sd-bg-primary-subtle);\n border: 1px solid var(--%NS%sd-bg-primary-subtle);\n}\nsd-note[data-sd-theme=info] {\n background-color: var(--%NS%sd-bg-info-subtle);\n border: 1px solid var(--%NS%sd-bg-info-subtle);\n}\nsd-note[data-sd-theme=success] {\n background-color: var(--%NS%sd-bg-success-subtle);\n border: 1px solid var(--%NS%sd-bg-success-subtle);\n}\nsd-note[data-sd-theme=warning] {\n background-color: var(--%NS%sd-bg-warning-subtle);\n border: 1px solid var(--%NS%sd-bg-warning-subtle);\n}\nsd-note[data-sd-theme=danger] {\n background-color: var(--%NS%sd-bg-danger-subtle);\n border: 1px solid var(--%NS%sd-bg-danger-subtle);\n}\nsd-note[data-sd-size=sm] {\n font-size: var(--%NS%sd-font-size-sm);\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-sm);\n}\nsd-note[data-sd-size=lg] {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-lg);\n}\nsd-note[data-sd-inset=true] {\n border-radius: 0;\n}"], encapsulation: 2 });
17
17
  }
18
18
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdNote, [{
19
19
  type: Component,
@@ -25,7 +25,7 @@ export class SdProgress {
25
25
  i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(2, 3, ctx.value(), "1.0-2"), " ");
26
26
  i0.ɵɵadvance(2);
27
27
  i0.ɵɵstyleProp("width", ctx._barWidth());
28
- } }, dependencies: [PercentPipe], styles: ["sd-progress {\n position: relative;\n display: block;\n width: 100%;\n white-space: nowrap;\n background-color: var(--sd-bg-gray-subtle);\n border: 1px solid var(--sd-bd-hairline);\n border-radius: var(--sd-radius-default);\n overflow: hidden;\n}\nsd-progress > ._content {\n position: relative;\n z-index: 2;\n padding: var(--sd-gap-lg) var(--sd-gap-default);\n}\nsd-progress > ._progress {\n position: absolute;\n z-index: 1;\n top: 0;\n left: 0;\n height: 100%;\n}\nsd-progress[data-sd-theme=gray] > ._progress {\n background-color: var(--sd-bg-gray-solid);\n}\nsd-progress[data-sd-theme=blue-gray] > ._progress {\n background-color: var(--sd-bg-blue-gray-solid);\n}\nsd-progress[data-sd-theme=primary] > ._progress {\n background-color: var(--sd-bg-primary-solid);\n}\nsd-progress[data-sd-theme=info] > ._progress {\n background-color: var(--sd-bg-info-solid);\n}\nsd-progress[data-sd-theme=success] > ._progress {\n background-color: var(--sd-bg-success-solid);\n}\nsd-progress[data-sd-theme=warning] > ._progress {\n background-color: var(--sd-bg-warning-solid);\n}\nsd-progress[data-sd-theme=danger] > ._progress {\n background-color: var(--sd-bg-danger-solid);\n}\nsd-progress[data-sd-size=sm] > ._content {\n padding: var(--sd-gap-xs) var(--sd-gap-default);\n}\nsd-progress[data-sd-size=lg] > ._content {\n padding: var(--sd-gap-default) var(--sd-gap-xl);\n}\nsd-progress[data-sd-inset=true] {\n border-radius: 0;\n border: none;\n background-color: var(--sd-bg-track);\n}"], encapsulation: 2 });
28
+ } }, dependencies: [PercentPipe], styles: ["sd-progress {\n position: relative;\n display: block;\n width: 100%;\n white-space: nowrap;\n background-color: var(--%NS%sd-bg-gray-subtle);\n border: 1px solid var(--%NS%sd-bd-hairline);\n border-radius: var(--%NS%sd-radius-default);\n overflow: hidden;\n}\nsd-progress > ._content {\n position: relative;\n z-index: 2;\n padding: var(--%NS%sd-gap-lg) var(--%NS%sd-gap-default);\n}\nsd-progress > ._progress {\n position: absolute;\n z-index: 1;\n top: 0;\n left: 0;\n height: 100%;\n}\nsd-progress[data-sd-theme=gray] > ._progress {\n background-color: var(--%NS%sd-bg-gray-solid);\n}\nsd-progress[data-sd-theme=blue-gray] > ._progress {\n background-color: var(--%NS%sd-bg-blue-gray-solid);\n}\nsd-progress[data-sd-theme=primary] > ._progress {\n background-color: var(--%NS%sd-bg-primary-solid);\n}\nsd-progress[data-sd-theme=info] > ._progress {\n background-color: var(--%NS%sd-bg-info-solid);\n}\nsd-progress[data-sd-theme=success] > ._progress {\n background-color: var(--%NS%sd-bg-success-solid);\n}\nsd-progress[data-sd-theme=warning] > ._progress {\n background-color: var(--%NS%sd-bg-warning-solid);\n}\nsd-progress[data-sd-theme=danger] > ._progress {\n background-color: var(--%NS%sd-bg-danger-solid);\n}\nsd-progress[data-sd-size=sm] > ._content {\n padding: var(--%NS%sd-gap-xs) var(--%NS%sd-gap-default);\n}\nsd-progress[data-sd-size=lg] > ._content {\n padding: var(--%NS%sd-gap-default) var(--%NS%sd-gap-xl);\n}\nsd-progress[data-sd-inset=true] {\n border-radius: 0;\n border: none;\n background-color: var(--%NS%sd-bg-track);\n}"], encapsulation: 2 });
29
29
  }
30
30
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdProgress, [{
31
31
  type: Component,
@@ -33,7 +33,7 @@ export class SdSidebarContainer {
33
33
  i0.ɵɵdomElementStart(1, "div", 0);
34
34
  i0.ɵɵdomListener("click", function SdSidebarContainer_Template_div_click_1_listener() { return ctx.onBackdropClick(); })("keydown.enter", function SdSidebarContainer_Template_div_keydown_enter_1_listener() { return ctx.onBackdropClick(); });
35
35
  i0.ɵɵdomElementEnd();
36
- } }, styles: ["sd-sidebar-container {\n display: block;\n position: relative;\n height: 100%;\n padding-left: var(--sd-sidebar-width);\n transition: padding-left var(--sd-animation-duration) ease-out;\n}\nsd-sidebar-container[data-sd-toggle=true] {\n padding-left: 0;\n transition: padding-left var(--sd-animation-duration) ease-in;\n}\nsd-sidebar-container > ._backdrop {\n display: none;\n}\n\n@media all and (max-width: 520px) {\n sd-sidebar-container {\n padding-left: 0;\n }\n sd-sidebar-container > ._backdrop {\n position: absolute;\n display: block;\n z-index: calc(var(--sd-z-sidebar) - 1);\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: var(--sd-bg-inverse);\n opacity: 0;\n pointer-events: none;\n transition: opacity var(--sd-animation-duration) ease-in-out;\n }\n sd-sidebar-container[data-sd-toggle=true] > ._backdrop {\n opacity: 0.6;\n pointer-events: auto;\n }\n}"], encapsulation: 2 });
36
+ } }, styles: ["sd-sidebar-container {\n display: block;\n position: relative;\n height: 100%;\n padding-left: var(--%NS%sd-sidebar-width);\n transition: padding-left var(--%NS%sd-animation-duration) ease-out;\n}\nsd-sidebar-container[data-sd-toggle=true] {\n padding-left: 0;\n transition: padding-left var(--%NS%sd-animation-duration) ease-in;\n}\nsd-sidebar-container > ._backdrop {\n display: none;\n}\n\n@media all and (max-width: 520px) {\n sd-sidebar-container {\n padding-left: 0;\n }\n sd-sidebar-container > ._backdrop {\n position: absolute;\n display: block;\n z-index: calc(var(--%NS%sd-z-sidebar) - 1);\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: var(--%NS%sd-bg-inverse);\n opacity: 0;\n pointer-events: none;\n transition: opacity var(--%NS%sd-animation-duration) ease-in-out;\n }\n sd-sidebar-container[data-sd-toggle=true] > ._backdrop {\n opacity: 0.6;\n pointer-events: auto;\n }\n}"], encapsulation: 2 });
37
37
  }
38
38
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSidebarContainer, [{
39
39
  type: Component,
@@ -74,7 +74,7 @@ export class SdSidebarUser {
74
74
  let tmp_0_0;
75
75
  i0.ɵɵadvance(2);
76
76
  i0.ɵɵconditional((tmp_0_0 = ctx.userMenu()) ? 2 : -1, tmp_0_0);
77
- } }, dependencies: [SdCollapseIcon, SdCollapse, SdRipple, SdList, SdListItem, NgIcon], styles: ["sd-sidebar-user {\n display: block;\n}\nsd-sidebar-user > ._menu-button {\n display: block;\n cursor: pointer;\n user-select: none;\n color: var(--sd-tx-muted);\n padding: var(--sd-gap-sm) var(--sd-gap-default);\n border-radius: var(--sd-radius-default);\n margin: 0 var(--sd-gap-sm);\n}\nsd-sidebar-user > ._menu-button:hover {\n background-color: var(--sd-bg-state-hover);\n}\nsd-sidebar-user > sd-collapse > ._content > sd-list {\n background-color: var(--sd-bg-gray-subtle);\n padding: var(--sd-gap-xs) 0;\n margin: 0 var(--sd-gap-sm);\n}"], encapsulation: 2 });
77
+ } }, dependencies: [SdCollapseIcon, SdCollapse, SdRipple, SdList, SdListItem, NgIcon], styles: ["sd-sidebar-user {\n display: block;\n}\nsd-sidebar-user > ._menu-button {\n display: block;\n cursor: pointer;\n user-select: none;\n color: var(--%NS%sd-tx-muted);\n padding: var(--%NS%sd-gap-sm) var(--%NS%sd-gap-default);\n border-radius: var(--%NS%sd-radius-default);\n margin: 0 var(--%NS%sd-gap-sm);\n}\nsd-sidebar-user > ._menu-button:hover {\n background-color: var(--%NS%sd-bg-state-hover);\n}\nsd-sidebar-user > sd-collapse > ._content > sd-list {\n background-color: var(--%NS%sd-bg-gray-subtle);\n padding: var(--%NS%sd-gap-xs) 0;\n margin: 0 var(--%NS%sd-gap-sm);\n}"], encapsulation: 2 });
78
78
  }
79
79
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSidebarUser, [{
80
80
  type: Component,
@@ -12,7 +12,7 @@ export class SdSidebar {
12
12
  } }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdSidebar_Template(rf, ctx) { if (rf & 1) {
13
13
  i0.ɵɵprojectionDef();
14
14
  i0.ɵɵprojection(0);
15
- } }, styles: ["sd-sidebar {\n position: absolute;\n z-index: var(--sd-z-sidebar);\n top: 0;\n left: 0;\n width: var(--sd-sidebar-width);\n height: 100%;\n background-color: var(--sd-bg-canvas);\n border-right: 1px solid var(--sd-bd-soft);\n}\n@media not all and (max-width: 520px) {\n sd-sidebar {\n transition: transform var(--sd-animation-duration) ease-out;\n }\n sd-sidebar[data-sd-toggle=true] {\n transform: translateX(-100%);\n transition: transform var(--sd-animation-duration) ease-in;\n }\n}\n@media all and (max-width: 520px) {\n sd-sidebar {\n transition: transform var(--sd-animation-duration) ease-in;\n transform: translateX(-100%);\n }\n sd-sidebar[data-sd-toggle=true] {\n transform: none;\n transition: transform var(--sd-animation-duration) ease-out;\n box-shadow: 0 calc(16 * var(--sd-shadow-size)) calc(16 * 4 * var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color), 0 var(--sd-shadow-size) calc(var(--sd-shadow-size) * var(--sd-shadow-blur-mult)) var(--sd-shadow-color);\n }\n}"], encapsulation: 2 });
15
+ } }, styles: ["sd-sidebar {\n position: absolute;\n z-index: var(--%NS%sd-z-sidebar);\n top: 0;\n left: 0;\n width: var(--%NS%sd-sidebar-width);\n height: 100%;\n background-color: var(--%NS%sd-bg-canvas);\n border-right: 1px solid var(--%NS%sd-bd-soft);\n}\n@media not all and (max-width: 520px) {\n sd-sidebar {\n transition: transform var(--%NS%sd-animation-duration) ease-out;\n }\n sd-sidebar[data-sd-toggle=true] {\n transform: translateX(-100%);\n transition: transform var(--%NS%sd-animation-duration) ease-in;\n }\n}\n@media all and (max-width: 520px) {\n sd-sidebar {\n transition: transform var(--%NS%sd-animation-duration) ease-in;\n transform: translateX(-100%);\n }\n sd-sidebar[data-sd-toggle=true] {\n transform: none;\n transition: transform var(--%NS%sd-animation-duration) ease-out;\n box-shadow: 0 calc(16 * var(--%NS%sd-shadow-size)) calc(16 * 4 * var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color), 0 var(--%NS%sd-shadow-size) calc(var(--%NS%sd-shadow-size) * var(--%NS%sd-shadow-blur-mult)) var(--%NS%sd-shadow-color);\n }\n}"], encapsulation: 2 });
16
16
  }
17
17
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSidebar, [{
18
18
  type: Component,
@@ -163,7 +163,7 @@ export class SdTopbarMenu {
163
163
  SdList,
164
164
  SdListItem,
165
165
  SdButton,
166
- NgIcon], styles: ["sd-topbar-menu sd-list sd-list {\n background-color: var(--sd-bg-gray-subtle);\n}"], encapsulation: 2 });
166
+ NgIcon], styles: ["sd-topbar-menu sd-list sd-list {\n background-color: var(--%NS%sd-bg-gray-subtle);\n}"], encapsulation: 2 });
167
167
  }
168
168
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTopbarMenu, [{
169
169
  type: Component,
@@ -39,7 +39,7 @@ export class SdTopbar {
39
39
  i0.ɵɵprojection(1);
40
40
  } if (rf & 2) {
41
41
  i0.ɵɵconditional(ctx.hasSidebar() ? 0 : -1);
42
- } }, dependencies: [SdButton, NgIcon], styles: ["sd-topbar {\n min-height: var(--sd-topbar-height);\n overflow-x: auto;\n overflow-y: hidden;\n user-select: none;\n background-color: var(--sd-bg-canvas);\n color: var(--sd-tx-default);\n border-bottom: 1px solid var(--sd-bd-soft);\n padding-left: var(--sd-gap-xs);\n}\nsd-topbar > h1 {\n padding-right: var(--sd-gap-xl);\n}\nsd-topbar > h2 {\n padding-right: var(--sd-gap-xl);\n}\nsd-topbar > h3 {\n padding-right: var(--sd-gap-xl);\n}\nsd-topbar > h4 {\n padding-right: var(--sd-gap-xl);\n}\nsd-topbar > h5 {\n padding-right: var(--sd-gap-xl);\n}\nsd-topbar > h6 {\n padding-right: var(--sd-gap-xl);\n}\nsd-topbar::-webkit-scrollbar-track {\n background-color: var(--sd-scrollbar-track);\n}\nsd-topbar::-webkit-scrollbar-corner {\n background-color: var(--sd-scrollbar-track);\n}\nsd-topbar::-webkit-scrollbar {\n width: var(--sd-gap-sm);\n height: var(--sd-gap-sm);\n background-color: transparent;\n}\nsd-topbar::-webkit-scrollbar-thumb {\n background-color: var(--sd-scrollbar-thumb-hover);\n}"], encapsulation: 2 });
42
+ } }, dependencies: [SdButton, NgIcon], styles: ["sd-topbar {\n min-height: var(--%NS%sd-topbar-height);\n overflow-x: auto;\n overflow-y: hidden;\n user-select: none;\n background-color: var(--%NS%sd-bg-canvas);\n color: var(--%NS%sd-tx-default);\n border-bottom: 1px solid var(--%NS%sd-bd-soft);\n padding-left: var(--%NS%sd-gap-xs);\n}\nsd-topbar > h1 {\n padding-right: var(--%NS%sd-gap-xl);\n}\nsd-topbar > h2 {\n padding-right: var(--%NS%sd-gap-xl);\n}\nsd-topbar > h3 {\n padding-right: var(--%NS%sd-gap-xl);\n}\nsd-topbar > h4 {\n padding-right: var(--%NS%sd-gap-xl);\n}\nsd-topbar > h5 {\n padding-right: var(--%NS%sd-gap-xl);\n}\nsd-topbar > h6 {\n padding-right: var(--%NS%sd-gap-xl);\n}\nsd-topbar::-webkit-scrollbar-track {\n background-color: var(--%NS%sd-scrollbar-track);\n}\nsd-topbar::-webkit-scrollbar-corner {\n background-color: var(--%NS%sd-scrollbar-track);\n}\nsd-topbar::-webkit-scrollbar {\n width: var(--%NS%sd-gap-sm);\n height: var(--%NS%sd-gap-sm);\n background-color: transparent;\n}\nsd-topbar::-webkit-scrollbar-thumb {\n background-color: var(--%NS%sd-scrollbar-thumb-hover);\n}"], encapsulation: 2 });
43
43
  }
44
44
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTopbar, [{
45
45
  type: Component,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@simplysm/angular",
3
- "version": "14.2.8",
3
+ "version": "14.2.9",
4
4
  "description": "심플리즘 패키지 - Angular",
5
5
  "license": "Apache-2.0",
6
6
  "author": "심플리즘",
@@ -32,39 +32,39 @@
32
32
  }
33
33
  },
34
34
  "dependencies": {
35
- "@angular/common": "^22.0.8",
36
- "@angular/core": "^22.0.8",
37
- "@angular/platform-browser": "^22.0.8",
38
- "@angular/router": "^22.0.8",
39
- "@angular/service-worker": "^22.0.8",
35
+ "@angular/common": "^22.1.0",
36
+ "@angular/core": "^22.1.0",
37
+ "@angular/platform-browser": "^22.1.0",
38
+ "@angular/router": "^22.1.0",
39
+ "@angular/service-worker": "^22.1.0",
40
40
  "@ng-icons/core": "^34.0.0",
41
41
  "@ng-icons/tabler-icons": "^34.0.0",
42
- "@tiptap/core": "^3.29.0",
43
- "@tiptap/extension-color": "^3.29.0",
44
- "@tiptap/extension-document": "^3.29.0",
45
- "@tiptap/extension-highlight": "^3.29.0",
46
- "@tiptap/extension-image": "^3.29.0",
47
- "@tiptap/extension-paragraph": "^3.29.0",
48
- "@tiptap/extension-placeholder": "^3.29.0",
49
- "@tiptap/extension-text": "^3.29.0",
50
- "@tiptap/extension-text-align": "^3.29.0",
51
- "@tiptap/extension-text-style": "^3.29.0",
52
- "@tiptap/extension-underline": "^3.29.0",
53
- "@tiptap/markdown": "^3.29.0",
54
- "@tiptap/starter-kit": "^3.29.0",
42
+ "@tiptap/core": "^3.29.2",
43
+ "@tiptap/extension-color": "^3.29.2",
44
+ "@tiptap/extension-document": "^3.29.2",
45
+ "@tiptap/extension-highlight": "^3.29.2",
46
+ "@tiptap/extension-image": "^3.29.2",
47
+ "@tiptap/extension-paragraph": "^3.29.2",
48
+ "@tiptap/extension-placeholder": "^3.29.2",
49
+ "@tiptap/extension-text": "^3.29.2",
50
+ "@tiptap/extension-text-align": "^3.29.2",
51
+ "@tiptap/extension-text-style": "^3.29.2",
52
+ "@tiptap/extension-underline": "^3.29.2",
53
+ "@tiptap/markdown": "^3.29.2",
54
+ "@tiptap/starter-kit": "^3.29.2",
55
55
  "bwip-js": "^4.11.2",
56
56
  "echarts": "^6.1.0",
57
57
  "html-to-image": "^1.11.13",
58
58
  "jspdf": "^4.2.1",
59
59
  "rxjs": "^7.8.2",
60
60
  "tabbable": "^6.5.0",
61
- "@simplysm/core-common": "14.2.8",
62
- "@simplysm/core-browser": "14.2.8",
63
- "@simplysm/service-common": "14.2.8",
64
- "@simplysm/service-client": "14.2.8"
61
+ "@simplysm/core-browser": "14.2.9",
62
+ "@simplysm/service-client": "14.2.9",
63
+ "@simplysm/core-common": "14.2.9",
64
+ "@simplysm/service-common": "14.2.9"
65
65
  },
66
66
  "devDependencies": {
67
- "@angular/compiler": "^22.0.8"
67
+ "@angular/compiler": "^22.1.0"
68
68
  },
69
69
  "scripts": {}
70
70
  }