npm - @sky.ui/core - Versions diffs - 0.0.32 → 0.0.35 - Mend

@sky.ui/core 0.0.32 → 0.0.35

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 (10) hide show

package/dist/custom-elements.json +3448 -3448
package/dist/sky-appbar/sky-appbar.js.map +1 -1
package/dist/sky-card/sky-card.js.map +1 -1
package/dist/sky-combobox/sky-combobox.js.map +1 -1
package/dist/sky-dialog/sky-dialog.js.map +1 -1
package/dist/sky-input/sky-input.js.map +1 -1
package/dist/sky-radio/sky-radio.js.map +1 -1
package/dist/sky-sheet/sky-sheet.js.map +1 -1
package/package.json +7 -7
package/plugins/vite-plugin.js +7 -1

package/dist/sky-appbar/sky-appbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sky-appbar.js","sources":["../../src/sky-appbar/sky-appbar.ts"],"sourcesContent":["import { LitElement, html, css, PropertyValues, nothing } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport {\n resolveColor,\n resolveTextColorForToken,\n isDefaultColorToken,\n} from \"../helper/utils/color-resolver\";\nimport { SkyIcon } from \"../sky-icon/sky-icon.js\";\n\n/*\n @element sky-appbar\n \n @summary Application top bar with title, optional leading control, trailing actions, and optional color/image background.\n \n @status stable\n * @since 1.0.0\n \n @documentation https://library.sky-ui.com/components/appbar\n * @dependency sky-icon\n \n @slot button - Leading area (e.g., menu/back button). Defaults to a hamburger icon.\n * @slot - Trailing actions (icons/buttons). This is the default slot.\n \n @property {string} title - Title text displayed in the app bar.\n * @property {string} color - Semantic token or CSS color for bar background; foreground color is derived for contrast.\n * @property {string} url - Background image URL.\n * @property {boolean} banner - Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.\n * @property {boolean} dense - Enables compact vertical spacing.\n * @property {boolean} elevated - Applies elevated shadow styling.\n * @property {string} leadingLabel - Accessible label for default leading button fallback.\n \n @csspart content - Wrapper that contains the leading slot, title, and actions.\n * @csspart leading - Container for the leading slot (e.g. menu button).\n * @csspart title - The title area (contains .title-text with the title string).\n * @csspart actions - The trailing actions container.\n \n @Behavior\n * - `color` resolves background via `resolveColor()` and text/icon color via `resolveTextColorForToken()`.\n * - `url` renders a background layer behind content.\n * - `banner` should be true only for the primary page app bar landmark.\n * - In RTL contexts, the default leading icon is mirrored unless reduced motion is enabled.\n \n @example\n * ```html\n * <sky-appbar title=\"Dashboard\" color=\"primary\" dense>\n * <button slot=\"button\">Menu</button>\n * <sky-icon icon=\"ion:search\"></sky-icon>\n * </sky-appbar>\n * ```\n * ```vue\n * <template>\n * <sky-appbar title=\"Dashboard\" color=\"primary\" dense>\n * <button slot=\"button\">Menu</button>\n * <sky-icon icon=\"ion:search\"></sky-icon>\n * </sky-appbar>\n * </template>\n * ```\n * ```jsx\n * export default function Demo() {\n * return (\n * <sky-appbar title=\"Dashboard\" color=\"primary\" dense>\n * <button slot=\"button\">Menu</button>\n * <sky-icon icon=\"ion:search\"></sky-icon>\n * </sky-appbar>\n * );\n * }\n * ```\n /\n@customElement(\"sky-appbar\")\nexport class SkyAppbar extends LitElement {\n\n static dependencies: Record<string, CustomElementConstructor> = {\n \"sky-icon\": SkyIcon,\n };\n\n /* Title text displayed in the app bar. @default \"App Bar\" /\n @property({ type: String }) title = \"App Bar\";\n\n /\n Bar background token or CSS color; when set, foreground uses `resolveTextColorForToken` for contrast.\n * @default \"default\"\n /\n @property({ type: String }) color = \"default\";\n\n /* Background image URL. @default \"\" /\n @property({ type: String }) url = \"\";\n\n /* When true, the bar has role=\"banner\" (main app header). Set false for secondary bars. @default true /\n @property({ type: Boolean }) banner = true;\n\n /* When true, reduces vertical padding for a compact bar. @default false /\n @property({ type: Boolean }) dense = false;\n\n /* When true, applies stronger shadow (e.g. for sticky bar after scroll). @default false /\n @property({ type: Boolean }) elevated = false;\n\n /* Accessible label for the default leading button when no slot content is provided. @default \"Open menu\" /\n @property({ type: String }) leadingLabel = \"Open menu\";\n\n static override styles = css`\n :host {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n position: relative;\n font-family: var(--sky-font);\n overflow: hidden;\n color: var(--appbar-text-color, var(--sky-text-primary));\n transition: var(--sky-transition-default);\n }\n\n :host(:not([data-surface=\"solid\"])) {\n background: var(--sky-glass-secondary);\n background-image: var(--sky-glass-surface);\n backdrop-filter:\n var(--sky-blur-secondary)\n var(--sky-saturation-secondary)\n var(--sky-brightness-secondary);\n -webkit-backdrop-filter:\n var(--sky-blur-secondary)\n var(--sky-saturation-secondary)\n var(--sky-brightness-secondary);\n border-bottom: var(--sky-border-secondary);\n box-shadow:\n var(--sky-box-shadow-inset),\n var(--sky-box-shadow-primary);\n }\n\n :host([data-surface=\"solid\"]) {\n background-color: var(--appbar-bg-color);\n color: var(--appbar-text-color);\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n border-bottom: var(--sky-border-primary);\n box-shadow: var(--sky-box-shadow-primary);\n }\n\n :host([elevated]:not([data-surface=\"solid\"])) {\n box-shadow:\n var(--sky-box-shadow-inset),\n var(--sky-box-shadow-secondary);\n }\n\n :host([elevated][data-surface=\"solid\"]) {\n box-shadow: var(--sky-box-shadow-secondary);\n }\n\n .background {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n background-image: var(--appbar-bg-image, none);\n background-size: cover;\n background-position: center;\n z-index: -2;\n pointer-events: none;\n }\n\n .background-overlay {\n position: absolute;\n inset: 0;\n background: var(--appbar-bg-overlay, transparent);\n z-index: -1;\n pointer-events: none;\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n }\n\n .content {\n display: flex;\n padding: var(--sky-space-2, 8px) var(--sky-space-4, 16px);\n align-items: center;\n justify-content: space-between;\n width: 100%;\n position: relative;\n gap: var(--sky-space-2, 8px);\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n }\n\n :host([dense]) .content {\n padding-block: var(--sky-space-1, 4px);\n }\n\n .title-area {\n flex: 1 1 auto;\n min-width: 0;\n padding-inline-start: var(--sky-space-2\\\\.5, 10px);\n }\n\n .title-text {\n font: var(--sky-text-title);\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n }\n\n .leading {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n }\n\n .leading ::slotted() {\n cursor: pointer;\n }\n\n .leading-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin: 0;\n padding: 0;\n border: none;\n background: none;\n cursor: pointer;\n font: inherit;\n color: inherit;\n -webkit-tap-highlight-color: transparent;\n min-width: var(--sky-touch-target, 44px);\n min-height: var(--sky-touch-target, 44px);\n box-sizing: border-box;\n border-radius: var(--sky-radius-primary);\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n transition: var(--sky-transition-fast);\n }\n\n .leading-button:hover {\n background: var(--sky-hover-primary);\n }\n\n .leading-button:focus-visible,\n .leading ::slotted(:focus-visible),\n .actions ::slotted(:focus-visible) {\n outline: none;\n box-shadow: var(--sky-focus-ring);\n }\n\n .icon {\n cursor: pointer;\n font-size: var(--sky-font-size-xl, 1.25rem);\n display: flex;\n align-items: center;\n }\n\n .actions {\n display: flex;\n align-items: center;\n gap: var(--sky-space-2, 8px);\n padding-inline-start: var(--sky-space-2\\\\.5, 10px);\n flex-shrink: 0;\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n }\n\n .actions ::slotted(button),\n .actions ::slotted([role=\"button\"]) {\n min-width: var(--sky-touch-target, 44px);\n min-height: var(--sky-touch-target, 44px);\n box-sizing: border-box;\n }\n\n :host-context([dir=\"rtl\"]) .leading-button .icon {\n transform: scaleX(-1);\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host,\n .content,\n .leading-button,\n .leading ::slotted(),\n .actions ::slotted() {\n transition: none;\n }\n\n :host-context([dir=\"rtl\"]) .leading-button .icon {\n transform: none;\n }\n }\n\n `;\n\n /** Applies glass vs solid surface tokens from `color`. /\n private _applyColorSurface(): void {\n if (!isDefaultColorToken(this.color)) {\n this.setAttribute(\"data-surface\", \"solid\");\n this.style.setProperty(\"--appbar-bg-color\", resolveColor(this.color));\n this.style.setProperty(\n \"--appbar-text-color\",\n resolveTextColorForToken(this.color),\n );\n return;\n }\n\n this.removeAttribute(\"data-surface\");\n this.style.removeProperty(\"--appbar-bg-color\");\n this.style.removeProperty(\"--appbar-text-color\");\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n this._applyColorSurface();\n this._applyBackgroundImage();\n }\n\n /* Sets background image CSS variable from `url`. /\n private _applyBackgroundImage(): void {\n const image = this.url ? `url(${this.url})` : \"none\";\n this.style.setProperty(\"--appbar-bg-image\", image);\n }\n\n /* Updates host style variables when visual input properties change. */\n protected override updated(changedProperties: PropertyValues): void {\n if (changedProperties.has(\"color\")) {\n this._applyColorSurface();\n }\n\n if (changedProperties.has(\"url\")) {\n this._applyBackgroundImage();\n }\n }\n\n override render() {\n return html`\n ${this.url\n ? html`\n <div class=\"background\" aria-hidden=\"true\"></div>\n <div class=\"background-overlay\" aria-hidden=\"true\"></div>\n `\n : nothing}\n <div\n class=\"content\"\n part=\"content\"\n role=\"${this.banner ? \"banner\" : \"group\"}\"\n >\n <div class=\"leading\" part=\"leading\">\n <slot name=\"button\">\n <button\n type=\"button\"\n class=\"leading-button\"\n aria-label=\"${this.leadingLabel}\"\n >\n <sky-icon class=\"icon\" icon=\"mdi:menu\"></sky-icon>\n </button>\n </slot>\n </div>\n <div class=\"title-area\" part=\"title\">\n <span class=\"title-text\">${this.title}</span>\n </div>\n <div class=\"actions\" part=\"actions\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n"],"names":["SkyAppbar","LitElement","constructor","super","arguments","this","title","color","url","banner","dense","elevated","leadingLabel","_applyColorSurface","isDefaultColorToken","setAttribute","style","setProperty","resolveColor","resolveTextColorForToken","removeAttribute","removeProperty","connectedCallback","_applyBackgroundImage","image","updated","changedProperties","has","render","html","nothing","dependencies","SkyIcon","styles","css","__decorateClass","property","type","String","prototype","Boolean","customElement"],"mappings":"2eAqEO,IAAMA,EAAN,cAAwBC,EAAxB,WAAAC,GAAAC,SAAAC,WAOuBC,KAAAC,MAAQ,UAMRD,KAAAE,MAAQ,UAGRF,KAAAG,IAAM,GAGLH,KAAAI,QAAS,EAGTJ,KAAAK,OAAQ,EAGRL,KAAAM,UAAW,EAGZN,KAAAO,aAAe,WAAA,CA8LnC,kBAAAC,GACN,IAAKC,EAAoBT,KAAKE,OAO5B,OANAF,KAAKU,aAAa,eAAgB,SAClCV,KAAKW,MAAMC,YAAY,oBAAqBC,EAAab,KAAKE,aAC9DF,KAAKW,MAAMC,YACT,sBACAE,EAAyBd,KAAKE,QAKlCF,KAAKe,gBAAgB,gBACrBf,KAAKW,MAAMK,eAAe,qBAC1BhB,KAAKW,MAAMK,eAAe,sBAC5B,CAES,iBAAAC,GACPnB,MAAMmB,oBACNjB,KAAKQ,qBACLR,KAAKkB,uBACP,CAGQ,qBAAAA,GACN,MAAMC,EAAQnB,KAAKG,IAAM,OAAOH,KAAKG,OAAS,OAC9CH,KAAKW,MAAMC,YAAY,oBAAqBO,EAC9C,CAGmB,OAAAC,CAAQC,GACrBA,EAAkBC,IAAI,UACxBtB,KAAKQ,qBAGHa,EAAkBC,IAAI,QACxBtB,KAAKkB,uBAET,CAES,MAAAK,GACP,OAAOC,CAAA;QACHxB,KAAKG,IACHqB,CAAA;;;YAIAC;;;;gBAIMzB,KAAKI,OAAS,SAAW;;;;;;;4BAObJ,KAAKO;;;;;;;qCAOIP,KAAKC;;;;;;KAOxC,GAjSWN,EAEJ+B,aAAyD,CAC9D,WAAYC,GAHHhC,EA8BKiC,OAASC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAvBGC,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAPPtC,EAOiBuC,UAAA,QAAA,GAMAJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAbPtC,EAaiBuC,UAAA,QAAA,GAGAJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAhBPtC,EAgBiBuC,UAAA,MAAA,GAGCJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAnBPxC,EAmBkBuC,UAAA,SAAA,GAGAJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAtBPxC,EAsBkBuC,UAAA,QAAA,GAGAJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAzBPxC,EAyBkBuC,UAAA,WAAA,GAGDJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UA5BPtC,EA4BiBuC,UAAA,eAAA,GA5BjBvC,EAANmC,EAAA,CADNM,EAAc,eACFzC"}
1	+ {"version":3,"file":"sky-appbar.js","sources":["../../src/sky-appbar/sky-appbar.ts"],"sourcesContent":["import { LitElement, html, css, PropertyValues, nothing } from \"lit\";\r\nimport { customElement, property } from \"lit/decorators.js\";\r\nimport {\r\n resolveColor,\r\n resolveTextColorForToken,\r\n isDefaultColorToken,\r\n} from \"../helper/utils/color-resolver\";\r\nimport { SkyIcon } from \"../sky-icon/sky-icon.js\";\r\n\r\n/*\r\n @element sky-appbar\r\n \r\n @summary Application top bar with title, optional leading control, trailing actions, and optional color/image background.\r\n \r\n @status stable\r\n * @since 1.0.0\r\n \r\n @documentation https://library.sky-ui.com/components/appbar\r\n * @dependency sky-icon\r\n \r\n @slot button - Leading area (e.g., menu/back button). Defaults to a hamburger icon.\r\n * @slot - Trailing actions (icons/buttons). This is the default slot.\r\n \r\n @property {string} title - Title text displayed in the app bar.\r\n * @property {string} color - Semantic token or CSS color for bar background; foreground color is derived for contrast.\r\n * @property {string} url - Background image URL.\r\n * @property {boolean} banner - Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.\r\n * @property {boolean} dense - Enables compact vertical spacing.\r\n * @property {boolean} elevated - Applies elevated shadow styling.\r\n * @property {string} leadingLabel - Accessible label for default leading button fallback.\r\n \r\n @csspart content - Wrapper that contains the leading slot, title, and actions.\r\n * @csspart leading - Container for the leading slot (e.g. menu button).\r\n * @csspart title - The title area (contains .title-text with the title string).\r\n * @csspart actions - The trailing actions container.\r\n \r\n @Behavior\r\n * - `color` resolves background via `resolveColor()` and text/icon color via `resolveTextColorForToken()`.\r\n * - `url` renders a background layer behind content.\r\n * - `banner` should be true only for the primary page app bar landmark.\r\n * - In RTL contexts, the default leading icon is mirrored unless reduced motion is enabled.\r\n \r\n @example\r\n * ```html\r\n * <sky-appbar title=\"Dashboard\" color=\"primary\" dense>\r\n * <button slot=\"button\">Menu</button>\r\n * <sky-icon icon=\"ion:search\"></sky-icon>\r\n * </sky-appbar>\r\n * ```\r\n * ```vue\r\n * <template>\r\n * <sky-appbar title=\"Dashboard\" color=\"primary\" dense>\r\n * <button slot=\"button\">Menu</button>\r\n * <sky-icon icon=\"ion:search\"></sky-icon>\r\n * </sky-appbar>\r\n * </template>\r\n * ```\r\n * ```jsx\r\n * export default function Demo() {\r\n * return (\r\n * <sky-appbar title=\"Dashboard\" color=\"primary\" dense>\r\n * <button slot=\"button\">Menu</button>\r\n * <sky-icon icon=\"ion:search\"></sky-icon>\r\n * </sky-appbar>\r\n * );\r\n * }\r\n * ```\r\n /\r\n@customElement(\"sky-appbar\")\r\nexport class SkyAppbar extends LitElement {\r\n\r\n static dependencies: Record<string, CustomElementConstructor> = {\r\n \"sky-icon\": SkyIcon,\r\n };\r\n\r\n /* Title text displayed in the app bar. @default \"App Bar\" /\r\n @property({ type: String }) title = \"App Bar\";\r\n\r\n /\r\n Bar background token or CSS color; when set, foreground uses `resolveTextColorForToken` for contrast.\r\n * @default \"default\"\r\n /\r\n @property({ type: String }) color = \"default\";\r\n\r\n /* Background image URL. @default \"\" /\r\n @property({ type: String }) url = \"\";\r\n\r\n /* When true, the bar has role=\"banner\" (main app header). Set false for secondary bars. @default true /\r\n @property({ type: Boolean }) banner = true;\r\n\r\n /* When true, reduces vertical padding for a compact bar. @default false /\r\n @property({ type: Boolean }) dense = false;\r\n\r\n /* When true, applies stronger shadow (e.g. for sticky bar after scroll). @default false /\r\n @property({ type: Boolean }) elevated = false;\r\n\r\n /* Accessible label for the default leading button when no slot content is provided. @default \"Open menu\" /\r\n @property({ type: String }) leadingLabel = \"Open menu\";\r\n\r\n static override styles = css`\r\n :host {\r\n width: 100%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n position: relative;\r\n font-family: var(--sky-font);\r\n overflow: hidden;\r\n color: var(--appbar-text-color, var(--sky-text-primary));\r\n transition: var(--sky-transition-default);\r\n }\r\n\r\n :host(:not([data-surface=\"solid\"])) {\r\n background: var(--sky-glass-secondary);\r\n background-image: var(--sky-glass-surface);\r\n backdrop-filter:\r\n var(--sky-blur-secondary)\r\n var(--sky-saturation-secondary)\r\n var(--sky-brightness-secondary);\r\n -webkit-backdrop-filter:\r\n var(--sky-blur-secondary)\r\n var(--sky-saturation-secondary)\r\n var(--sky-brightness-secondary);\r\n border-bottom: var(--sky-border-secondary);\r\n box-shadow:\r\n var(--sky-box-shadow-inset),\r\n var(--sky-box-shadow-primary);\r\n }\r\n\r\n :host([data-surface=\"solid\"]) {\r\n background-color: var(--appbar-bg-color);\r\n color: var(--appbar-text-color);\r\n backdrop-filter: none;\r\n -webkit-backdrop-filter: none;\r\n border-bottom: var(--sky-border-primary);\r\n box-shadow: var(--sky-box-shadow-primary);\r\n }\r\n\r\n :host([elevated]:not([data-surface=\"solid\"])) {\r\n box-shadow:\r\n var(--sky-box-shadow-inset),\r\n var(--sky-box-shadow-secondary);\r\n }\r\n\r\n :host([elevated][data-surface=\"solid\"]) {\r\n box-shadow: var(--sky-box-shadow-secondary);\r\n }\r\n\r\n .background {\r\n position: absolute;\r\n inset: 0;\r\n width: 100%;\r\n height: 100%;\r\n background-image: var(--appbar-bg-image, none);\r\n background-size: cover;\r\n background-position: center;\r\n z-index: -2;\r\n pointer-events: none;\r\n }\r\n\r\n .background-overlay {\r\n position: absolute;\r\n inset: 0;\r\n background: var(--appbar-bg-overlay, transparent);\r\n z-index: -1;\r\n pointer-events: none;\r\n backdrop-filter: none;\r\n -webkit-backdrop-filter: none;\r\n }\r\n\r\n .content {\r\n display: flex;\r\n padding: var(--sky-space-2, 8px) var(--sky-space-4, 16px);\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n position: relative;\r\n gap: var(--sky-space-2, 8px);\r\n backdrop-filter: none;\r\n -webkit-backdrop-filter: none;\r\n }\r\n\r\n :host([dense]) .content {\r\n padding-block: var(--sky-space-1, 4px);\r\n }\r\n\r\n .title-area {\r\n flex: 1 1 auto;\r\n min-width: 0;\r\n padding-inline-start: var(--sky-space-2\\\\.5, 10px);\r\n }\r\n\r\n .title-text {\r\n font: var(--sky-text-title);\r\n backdrop-filter: none;\r\n -webkit-backdrop-filter: none;\r\n }\r\n\r\n .leading {\r\n display: flex;\r\n align-items: center;\r\n flex-shrink: 0;\r\n backdrop-filter: none;\r\n -webkit-backdrop-filter: none;\r\n }\r\n\r\n .leading ::slotted() {\r\n cursor: pointer;\r\n }\r\n\r\n .leading-button {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin: 0;\r\n padding: 0;\r\n border: none;\r\n background: none;\r\n cursor: pointer;\r\n font: inherit;\r\n color: inherit;\r\n -webkit-tap-highlight-color: transparent;\r\n min-width: var(--sky-touch-target, 44px);\r\n min-height: var(--sky-touch-target, 44px);\r\n box-sizing: border-box;\r\n border-radius: var(--sky-radius-primary);\r\n backdrop-filter: none;\r\n -webkit-backdrop-filter: none;\r\n transition: var(--sky-transition-fast);\r\n }\r\n\r\n .leading-button:hover {\r\n background: var(--sky-hover-primary);\r\n }\r\n\r\n .leading-button:focus-visible,\r\n .leading ::slotted(:focus-visible),\r\n .actions ::slotted(:focus-visible) {\r\n outline: none;\r\n box-shadow: var(--sky-focus-ring);\r\n }\r\n\r\n .icon {\r\n cursor: pointer;\r\n font-size: var(--sky-font-size-xl, 1.25rem);\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .actions {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--sky-space-2, 8px);\r\n padding-inline-start: var(--sky-space-2\\\\.5, 10px);\r\n flex-shrink: 0;\r\n backdrop-filter: none;\r\n -webkit-backdrop-filter: none;\r\n }\r\n\r\n .actions ::slotted(button),\r\n .actions ::slotted([role=\"button\"]) {\r\n min-width: var(--sky-touch-target, 44px);\r\n min-height: var(--sky-touch-target, 44px);\r\n box-sizing: border-box;\r\n }\r\n\r\n :host-context([dir=\"rtl\"]) .leading-button .icon {\r\n transform: scaleX(-1);\r\n }\r\n\r\n @media (prefers-reduced-motion: reduce) {\r\n :host,\r\n .content,\r\n .leading-button,\r\n .leading ::slotted(),\r\n .actions ::slotted() {\r\n transition: none;\r\n }\r\n\r\n :host-context([dir=\"rtl\"]) .leading-button .icon {\r\n transform: none;\r\n }\r\n }\r\n\r\n `;\r\n\r\n /** Applies glass vs solid surface tokens from `color`. /\r\n private _applyColorSurface(): void {\r\n if (!isDefaultColorToken(this.color)) {\r\n this.setAttribute(\"data-surface\", \"solid\");\r\n this.style.setProperty(\"--appbar-bg-color\", resolveColor(this.color));\r\n this.style.setProperty(\r\n \"--appbar-text-color\",\r\n resolveTextColorForToken(this.color),\r\n );\r\n return;\r\n }\r\n\r\n this.removeAttribute(\"data-surface\");\r\n this.style.removeProperty(\"--appbar-bg-color\");\r\n this.style.removeProperty(\"--appbar-text-color\");\r\n }\r\n\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n this._applyColorSurface();\r\n this._applyBackgroundImage();\r\n }\r\n\r\n /* Sets background image CSS variable from `url`. /\r\n private _applyBackgroundImage(): void {\r\n const image = this.url ? `url(${this.url})` : \"none\";\r\n this.style.setProperty(\"--appbar-bg-image\", image);\r\n }\r\n\r\n /* Updates host style variables when visual input properties change. */\r\n protected override updated(changedProperties: PropertyValues): void {\r\n if (changedProperties.has(\"color\")) {\r\n this._applyColorSurface();\r\n }\r\n\r\n if (changedProperties.has(\"url\")) {\r\n this._applyBackgroundImage();\r\n }\r\n }\r\n\r\n override render() {\r\n return html`\r\n ${this.url\r\n ? html`\r\n <div class=\"background\" aria-hidden=\"true\"></div>\r\n <div class=\"background-overlay\" aria-hidden=\"true\"></div>\r\n `\r\n : nothing}\r\n <div\r\n class=\"content\"\r\n part=\"content\"\r\n role=\"${this.banner ? \"banner\" : \"group\"}\"\r\n >\r\n <div class=\"leading\" part=\"leading\">\r\n <slot name=\"button\">\r\n <button\r\n type=\"button\"\r\n class=\"leading-button\"\r\n aria-label=\"${this.leadingLabel}\"\r\n >\r\n <sky-icon class=\"icon\" icon=\"mdi:menu\"></sky-icon>\r\n </button>\r\n </slot>\r\n </div>\r\n <div class=\"title-area\" part=\"title\">\r\n <span class=\"title-text\">${this.title}</span>\r\n </div>\r\n <div class=\"actions\" part=\"actions\">\r\n <slot></slot>\r\n </div>\r\n </div>\r\n `;\r\n }\r\n}\r\n"],"names":["SkyAppbar","LitElement","constructor","super","arguments","this","title","color","url","banner","dense","elevated","leadingLabel","_applyColorSurface","isDefaultColorToken","setAttribute","style","setProperty","resolveColor","resolveTextColorForToken","removeAttribute","removeProperty","connectedCallback","_applyBackgroundImage","image","updated","changedProperties","has","render","html","nothing","dependencies","SkyIcon","styles","css","__decorateClass","property","type","String","prototype","Boolean","customElement"],"mappings":"2eAqEO,IAAMA,EAAN,cAAwBC,EAAxB,WAAAC,GAAAC,SAAAC,WAOuBC,KAAAC,MAAQ,UAMRD,KAAAE,MAAQ,UAGRF,KAAAG,IAAM,GAGLH,KAAAI,QAAS,EAGTJ,KAAAK,OAAQ,EAGRL,KAAAM,UAAW,EAGZN,KAAAO,aAAe,WAAA,CA8LnC,kBAAAC,GACN,IAAKC,EAAoBT,KAAKE,OAO5B,OANAF,KAAKU,aAAa,eAAgB,SAClCV,KAAKW,MAAMC,YAAY,oBAAqBC,EAAab,KAAKE,aAC9DF,KAAKW,MAAMC,YACT,sBACAE,EAAyBd,KAAKE,QAKlCF,KAAKe,gBAAgB,gBACrBf,KAAKW,MAAMK,eAAe,qBAC1BhB,KAAKW,MAAMK,eAAe,sBAC5B,CAES,iBAAAC,GACPnB,MAAMmB,oBACNjB,KAAKQ,qBACLR,KAAKkB,uBACP,CAGQ,qBAAAA,GACN,MAAMC,EAAQnB,KAAKG,IAAM,OAAOH,KAAKG,OAAS,OAC9CH,KAAKW,MAAMC,YAAY,oBAAqBO,EAC9C,CAGmB,OAAAC,CAAQC,GACrBA,EAAkBC,IAAI,UACxBtB,KAAKQ,qBAGHa,EAAkBC,IAAI,QACxBtB,KAAKkB,uBAET,CAES,MAAAK,GACP,OAAOC,CAAA;QACHxB,KAAKG,IACHqB,CAAA;;;YAIAC;;;;gBAIMzB,KAAKI,OAAS,SAAW;;;;;;;4BAObJ,KAAKO;;;;;;;qCAOIP,KAAKC;;;;;;KAOxC,GAjSWN,EAEJ+B,aAAyD,CAC9D,WAAYC,GAHHhC,EA8BKiC,OAASC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAvBGC,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAPPtC,EAOiBuC,UAAA,QAAA,GAMAJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAbPtC,EAaiBuC,UAAA,QAAA,GAGAJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAhBPtC,EAgBiBuC,UAAA,MAAA,GAGCJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAnBPxC,EAmBkBuC,UAAA,SAAA,GAGAJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAtBPxC,EAsBkBuC,UAAA,QAAA,GAGAJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAzBPxC,EAyBkBuC,UAAA,WAAA,GAGDJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UA5BPtC,EA4BiBuC,UAAA,eAAA,GA5BjBvC,EAANmC,EAAA,CADNM,EAAc,eACFzC"}

package/dist/sky-card/sky-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sky-card.js","sources":["../../src/sky-card/sky-card.ts"],"sourcesContent":["import { LitElement, html, css, PropertyValues } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { resolveRadius } from \"../helper/utils/size-resolver\";\nimport { resolveColor } from \"../helper/utils/color-resolver\";\n\nexport type SkyCardElevation = \"none\" \| \"sm\" \| \"md\" \| \"lg\";\nexport type SkyCardSectionLayout = \"inline\" \| \"stack\";\nexport type SkyCardSectionTarget = \"both\" \| \"header\" \| \"footer\" \| \"none\";\n\n/*\n @element sky-card\n \n @summary Customizable card with configurable header/footer sections, blur/background styles, elevation, insets, overlays, and separators.\n \n @status stable\n * @since 1.0.0\n \n @documentation https://library.sky-ui.com/components/card\n \n @slot - Default slot for the card body content (replaces `bodyPadding` property if used).\n * @slot title - Slot for the card title.\n * @slot subtitle - Slot for the card subtitle.\n * @slot actions - Slot for the card actions (usually buttons).\n * @slot footer-title - Slot for the footer title.\n * @slot footer-subtitle - Slot for the footer subtitle.\n * @slot footer-actions - Slot for the footer actions (usually buttons).\n \n @csspart card - The main card container element.\n * @csspart header - The card header section.\n * @csspart footer - The card footer section.\n * @csspart ripple - The ripple animation element injected when the card is clicked.\n \n @property {string} bg - Background color of the card. Accepts color tokens or custom CSS colors. Default: `\"primary\"`.\n * @property {string} blurLevel - Level of blur applied to the background. Default: `\"none\"`.\n * @property {string} radius - Border radius of the card. Default: `\"md\"`.\n * @property {string} bodyPadding - Padding for the card body. Default: `\"none\"`.\n * @property {SkyCardElevation} elevation - Shadow depth of the card. Default: `\"md\"`.\n * @property {boolean} outlined - Whether the card has an outline. Default: `false`.\n * @property {boolean} clickable - Whether the card is clickable. Default: `false`.\n * @property {string} headerBg - Background color of the header. Default: `\"transparent\"`.\n * @property {string} headerBlur - Blur level for the header background. Default: `\"none\"`.\n * @property {string} headerPadding - Padding for the header. Default: `\"md\"`.\n * @property {SkyCardSectionLayout} headerLayout - Layout of the header content. Default: `\"inline\"`.\n * @property {string} headerInsetGap - Inset gap for the header section. Default: `\"sm\"`.\n * @property {string} headerRadius - Border radius for the header. Default: `\"md\"`.\n * @property {string} headerSeparatorColor - Color for the header separator. Default: `\"border-light\"`.\n * @property {string} footerBg - Background color of the footer. Default: `\"transparent\"`.\n * @property {string} footerBlur - Blur level for the footer background. Default: `\"none\"`.\n * @property {string} footerPadding - Padding for the footer. Default: `\"md\"`.\n * @property {SkyCardSectionLayout} footerLayout - Layout of the footer content. Default: `\"inline\"`.\n * @property {string} footerInsetGap - Inset gap for the footer section. Default: `\"sm\"`.\n * @property {string} footerRadius - Border radius for the footer. Default: `\"md\"`.\n * @property {string} footerSeparatorColor - Color for the footer separator. Default: `\"border-light\"`.\n * @property {number} padRatio - Ratio to adjust padding. Default: `1`.\n * @property {SkyCardSectionTarget} separators - Determines where separators should appear. Default: `\"none\"`.\n * @property {SkyCardSectionTarget} overlays - Determines where overlays should appear. Default: `\"none\"`.\n * @property {SkyCardSectionTarget} insets - Determines where insets should appear. Default: `\"none\"`.\n * @method refreshLayout Recomputes card variables and section synchronization.\n \n @example\n * ```html\n * <sky-card bg=\"primary\" elevation=\"lg\" headerpadding=\"md\">\n * <span slot=\"title\">Monthly Report</span>\n * <span slot=\"subtitle\">April 2026</span>\n * <div>Total revenue increased by 18%.</div>\n * <button slot=\"actions\">View Details</button>\n * </sky-card>\n * ```\n * ```vue\n * <template>\n * <sky-card bg=\"primary\" elevation=\"lg\" headerpadding=\"md\">\n * <span slot=\"title\">Monthly Report</span>\n * <span slot=\"subtitle\">April 2026</span>\n * <div>Total revenue increased by 18%.</div>\n * <button slot=\"actions\">View Details</button>\n * </sky-card>\n * </template>\n * ```\n * ```jsx\n * export default function Demo() {\n * return (\n * <sky-card bg=\"primary\" elevation=\"lg\" headerpadding=\"md\">\n * <span slot=\"title\">Monthly Report</span>\n * <span slot=\"subtitle\">April 2026</span>\n * <div>Total revenue increased by 18%.</div>\n * <button slot=\"actions\">View Details</button>\n * </sky-card>\n * );\n * }\n * ```\n /\n@customElement(\"sky-card\")\nexport class SkyCard extends LitElement {\n @property({ type: String, reflect: true }) bg = \"primary\";\n @property({ type: String, reflect: true }) blurLevel = \"none\";\n @property({ type: String, reflect: true }) radius = \"md\";\n @property({ type: String, reflect: true }) bodyPadding = \"none\";\n @property({ type: String, reflect: true }) elevation: SkyCardElevation = \"md\";\n @property({ type: Boolean, reflect: true }) outlined = false;\n @property({ type: Boolean, reflect: true }) clickable = false;\n\n @property({ type: String, reflect: true }) headerBg =\n \"transparent\";\n @property({ type: String, reflect: true })\n headerBlur = \"none\";\n @property({ type: String, reflect: true })\n headerPadding = \"md\";\n @property({ type: String }) headerLayout: SkyCardSectionLayout = \"inline\";\n @property({ type: String, reflect: true })\n headerInsetGap = \"sm\";\n @property({ type: String, reflect: true })\n headerRadius = \"md\";\n @property({ type: String })\n headerSeparatorColor = \"border-light\";\n\n @property({ type: String, reflect: true }) footerBg =\n \"transparent\";\n @property({ type: String, reflect: true })\n footerBlur = \"none\";\n @property({ type: String, reflect: true })\n footerPadding = \"md\";\n @property({ type: String }) footerLayout: SkyCardSectionLayout = \"inline\";\n @property({ type: String, reflect: true })\n footerInsetGap = \"sm\";\n @property({ type: String, reflect: true })\n footerRadius = \"md\";\n @property({ type: String })\n footerSeparatorColor = \"border-light\";\n\n @property({ type: Number }) padRatio = 1;\n\n @property({ type: String }) separators: SkyCardSectionTarget = \"none\";\n @property({ type: String }) overlays: SkyCardSectionTarget = \"none\";\n @property({ type: String }) insets: SkyCardSectionTarget = \"none\";\n\n private _effHeaderSeparator = false;\n private _effFooterSeparator = false;\n private _effHeaderOverlay = false;\n private _effFooterOverlay = false;\n private _effHeaderInset = false;\n private _effFooterInset = false;\n private _varsCache: Record<string, string> = {};\n\n private static readonly BG_MAP = {\n primary: \"var(--sky-glass-primary)\",\n secondary: \"var(--sky-glass-secondary)\",\n tertiary: \"var(--sky-glass-tertiary)\",\n transparent: \"transparent\",\n } as const;\n\n private static readonly BLUR_MAP = {\n none: \"none\",\n xs: \"blur(2px)\",\n sm: \"var(--sky-blur-secondary)\",\n md: \"var(--sky-blur-secondary)\",\n lg: \"var(--sky-blur-tertiary)\",\n } as const;\n\n private static readonly SIZE_MAP = {\n none: \"0\",\n sm: \"var(--sky-space-1\\\\.5, 6px)\",\n md: \"var(--sky-space-4, 16px)\",\n lg: \"var(--sky-space-6, 24px)\",\n xl: \"var(--sky-space-8, 32px)\",\n } as const;\n\n private static readonly GLASS_BG_TIERS = new Set([\n \"primary\",\n \"secondary\",\n \"tertiary\",\n ]);\n\n /* Non-overlay inset bars use hover tints — overlay sections own their own blur. /\n private static readonly SECTION_INSET_BG_MAP = {\n primary: \"var(--sky-hover-primary)\",\n secondary: \"var(--sky-hover-secondary)\",\n tertiary: \"var(--sky-hover-tertiary)\",\n transparent: \"transparent\",\n } as const;\n\n private static _composeBackdrop(blurLevel: string): string {\n const blur =\n SkyCard.BLUR_MAP[blurLevel as keyof typeof SkyCard.BLUR_MAP] ?? blurLevel;\n if (blur === \"none\") return \"none\";\n return `${blur} var(--sky-saturation-secondary) var(--sky-brightness-secondary)`;\n }\n\n private static _composeElevation(level: SkyCardElevation \| string): string {\n const depthMap: Record<SkyCardElevation, string \| null> = {\n none: null,\n sm: \"var(--sky-box-shadow-primary)\",\n md: \"var(--sky-box-shadow-secondary)\",\n lg: \"var(--sky-box-shadow-tertiary)\",\n };\n const depth = depthMap[level as SkyCardElevation];\n if (depth === null) return \"none\";\n if (depth === undefined) return level;\n return `var(--sky-box-shadow-inset), ${depth}`;\n }\n\n static styles = css`\n :host {\n display: block;\n }\n\n .card {\n display: flex;\n flex-direction: column;\n width: 100%;\n position: relative;\n overflow: hidden;\n box-sizing: border-box;\n color: var(--sky-text-primary);\n background: var(--_card-bg, var(--sky-glass-primary));\n background-image: var(--_card-glass-surface, var(--sky-glass-surface));\n border-radius: var(--_card-radius, var(--sky-radius-secondary));\n backdrop-filter: var(--_card-backdrop, none);\n -webkit-backdrop-filter: var(--_card-backdrop, none);\n box-shadow: var(\n --_card-shadow,\n var(--sky-box-shadow-inset),\n var(--sky-box-shadow-primary)\n );\n border: var(--_card-border, var(--sky-border-primary));\n transition: var(--sky-transition-default);\n }\n\n :host([outlined]) .card {\n box-shadow: none;\n border: var(--sky-border-primary);\n }\n :host([clickable]) .card {\n cursor: pointer;\n }\n :host([clickable]) .card:hover {\n box-shadow: var(\n --_card-shadow-hover,\n var(--sky-box-shadow-inset),\n var(--sky-box-shadow-hover)\n );\n }\n\n .section {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--sky-space-1\\\\.5, 6px);\n box-sizing: border-box;\n min-width: 0;\n background: transparent;\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n }\n .section.stack {\n flex-direction: column;\n align-items: stretch;\n gap: var(--sky-space-1\\\\.5, 6px);\n }\n .section.row {\n flex-direction: row;\n }\n\n .overlay-top {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1;\n }\n .overlay-bottom {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 1;\n }\n\n .inset {\n overflow: hidden;\n box-shadow: none;\n }\n .section.inset[part=\"header\"] {\n border: var(--_header-inset-border, 0 solid transparent);\n border-radius: var(--_header-radius, var(--sky-radius-secondary));\n }\n .section.inset[part=\"footer\"] {\n border: var(--_footer-inset-border, 0 solid transparent);\n border-radius: var(--_footer-radius, var(--sky-radius-secondary));\n }\n .overlay-top.inset {\n top: var(--_header-inset-gap, var(--sky-space-2, 8px));\n left: var(--_header-inset-gap, var(--sky-space-2, 8px));\n right: var(--_header-inset-gap, var(--sky-space-2, 8px));\n }\n .overlay-bottom.inset {\n bottom: var(--_footer-inset-gap, var(--sky-space-2, 8px));\n left: var(--_footer-inset-gap, var(--sky-space-2, 8px));\n right: var(--_footer-inset-gap, var(--sky-space-2, 8px));\n }\n\n .section[part=\"header\"]:has(slot:not([empty])),\n .section[part=\"header\"][has-content] {\n background: var(--_header-bg);\n background-image: var(--_header-glass-surface, none);\n padding-block: var(--_header-pad-y, var(--sky-space-3, 12px));\n padding-inline: var(--_header-pad-x, var(--sky-space-4, 16px));\n }\n .section[part=\"footer\"]:has(slot:not([empty])),\n .section[part=\"footer\"][has-content] {\n background: var(--_footer-bg);\n background-image: var(--_footer-glass-surface, none);\n padding-block: var(--_footer-pad-y, var(--sky-space-3, 12px));\n padding-inline: var(--_footer-pad-x, var(--sky-space-4, 16px));\n }\n\n .section[part=\"header\"].overlay-top:has(slot:not([empty])),\n .section[part=\"header\"].overlay-top[has-content] {\n backdrop-filter: var(--_header-backdrop, none);\n -webkit-backdrop-filter: var(--_header-backdrop, none);\n }\n .section[part=\"footer\"].overlay-bottom:has(slot:not([empty])),\n .section[part=\"footer\"].overlay-bottom[has-content] {\n backdrop-filter: var(--_footer-backdrop, none);\n -webkit-backdrop-filter: var(--_footer-backdrop, none);\n }\n\n .section[part=\"header\"]:not(.inset):has(slot:not([empty])),\n .section[part=\"header\"]:not(.inset)[has-content] {\n border-bottom: var(--_header-separator, 0px) solid\n var(--_header-separator-color, var(--sky-border-light));\n }\n .section[part=\"footer\"]:not(.inset):has(slot:not([empty])),\n .section[part=\"footer\"]:not(.inset)[has-content] {\n border-top: var(--_footer-separator, 0px) solid\n var(--_footer-separator-color, var(--sky-border-light));\n }\n\n ::slotted(:not([slot])) {\n box-sizing: border-box;\n padding-block: var(--_body-pad-y, var(--sky-space-3, 12px));\n padding-inline: var(--_body-pad-x, var(--sky-space-4, 16px));\n }\n slot[empty] {\n display: none;\n }\n\n ::slotted([slot=\"title\"]) {\n font-size: var(--sky-font-size-lg, 18px);\n font-weight: var(--sky-font-weight-semibold, 600);\n margin: 0;\n color: var(--sky-text-primary);\n text-align: start;\n text-shadow: var(--sky-text-shadow-on-glass, none);\n }\n ::slotted([slot=\"subtitle\"]) {\n font-size: var(--sky-font-size-sm, 14px);\n margin: 0;\n color: var(--sky-text-secondary);\n text-align: start;\n text-shadow: var(--sky-text-shadow-on-glass, none);\n }\n ::slotted([slot=\"actions\"]) {\n display: inline-flex;\n gap: var(--sky-space-1\\\\.5, 6px);\n align-items: center;\n margin-left: auto;\n }\n ::slotted([slot=\"footer-title\"]) {\n font-size: var(--sky-font-size-md, 16px);\n font-weight: var(--sky-font-weight-medium, 500);\n margin: 0;\n color: var(--sky-text-primary);\n text-align: start;\n }\n ::slotted([slot=\"footer-subtitle\"]) {\n font-size: var(--sky-font-size-xs, 12px);\n margin: 0;\n color: var(--sky-text-secondary);\n text-align: start;\n }\n ::slotted([slot=\"footer-actions\"]) {\n display: inline-flex;\n gap: var(--sky-space-1\\\\.5, 6px);\n align-items: center;\n margin-left: auto;\n }\n\n .main {\n width: 100%;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .card {\n transition: none;\n }\n }\n `;\n\n override firstUpdated(): void {\n this._wireSlotChangeHandlers();\n\n this._syncHeader();\n this._syncFooter();\n }\n\n protected override willUpdate(changed: PropertyValues): void {\n if (\n changed.has(\"separators\") \|\|\n changed.has(\"overlays\") \|\|\n changed.has(\"insets\")\n ) {\n this._computeEffectiveFlags();\n }\n\n if (\n changed.has(\"bg\") \|\|\n changed.has(\"blurLevel\") \|\|\n changed.has(\"radius\") \|\|\n changed.has(\"elevation\")\n ) {\n this._applyCardVars();\n }\n if (\n changed.has(\"headerPadding\") \|\|\n changed.has(\"bodyPadding\") \|\|\n changed.has(\"footerPadding\") \|\|\n changed.has(\"padRatio\")\n ) {\n this._applyPaddingVars();\n }\n if (\n changed.has(\"headerBg\") \|\|\n changed.has(\"footerBg\") \|\|\n changed.has(\"headerBlur\") \|\|\n changed.has(\"footerBlur\") \|\|\n changed.has(\"headerRadius\") \|\|\n changed.has(\"footerRadius\") \|\|\n changed.has(\"headerInsetGap\") \|\|\n changed.has(\"footerInsetGap\") \|\|\n changed.has(\"headerSeparatorColor\") \|\|\n changed.has(\"footerSeparatorColor\") \|\|\n changed.has(\"separators\") \|\|\n changed.has(\"insets\") \|\|\n changed.has(\"overlays\")\n ) {\n this._applySectionChrome();\n }\n }\n\n private _wireSlotChangeHandlers(): void {\n this.renderRoot\n .querySelector(\"#slot-title\")\n ?.addEventListener(\"slotchange\", () => this._syncHeader());\n this.renderRoot\n .querySelector(\"#slot-subtitle\")\n ?.addEventListener(\"slotchange\", () => this._syncHeader());\n this.renderRoot\n .querySelector(\"#slot-actions\")\n ?.addEventListener(\"slotchange\", () => this._syncHeader());\n\n this.renderRoot\n .querySelector(\"#slot-f-title\")\n ?.addEventListener(\"slotchange\", () => this._syncFooter());\n this.renderRoot\n .querySelector(\"#slot-f-subtitle\")\n ?.addEventListener(\"slotchange\", () => this._syncFooter());\n this.renderRoot\n .querySelector(\"#slot-f-actions\")\n ?.addEventListener(\"slotchange\", () => this._syncFooter());\n }\n\n private _syncHeader(): void {\n const hdr = this.renderRoot.querySelector(\"#hdr\");\n const slots = [\n this.renderRoot.querySelector(\"#slot-title\") as HTMLSlotElement \| null,\n this.renderRoot.querySelector(\"#slot-subtitle\") as HTMLSlotElement \| null,\n this.renderRoot.querySelector(\"#slot-actions\") as HTMLSlotElement \| null,\n ].filter(Boolean) as HTMLSlotElement[];\n\n const has = slots.some(\n (s) => s.assignedNodes({ flatten: true }).length > 0\n );\n hdr?.toggleAttribute(\"has-content\", has);\n\n slots.forEach((s) =>\n s.toggleAttribute(\n \"empty\",\n s.assignedNodes({ flatten: true }).length === 0\n )\n );\n }\n\n private _syncFooter(): void {\n const ftr = this.renderRoot.querySelector(\"#ftr\");\n const slots = [\n this.renderRoot.querySelector(\"#slot-f-title\") as HTMLSlotElement \| null,\n this.renderRoot.querySelector(\n \"#slot-f-subtitle\"\n ) as HTMLSlotElement \| null,\n this.renderRoot.querySelector(\n \"#slot-f-actions\"\n ) as HTMLSlotElement \| null,\n ].filter(Boolean) as HTMLSlotElement[];\n\n const has = slots.some(\n (s) => s.assignedNodes({ flatten: true }).length > 0\n );\n ftr?.toggleAttribute(\"has-content\", has);\n slots.forEach((s) =>\n s.toggleAttribute(\n \"empty\",\n s.assignedNodes({ flatten: true }).length === 0\n )\n );\n }\n\n private _expandPair(sh: SkyCardSectionTarget): [boolean, boolean] {\n switch (sh) {\n case \"both\":\n return [true, true];\n case \"header\":\n return [true, false];\n case \"footer\":\n return [false, true];\n case \"none\":\n default:\n return [false, false];\n }\n }\n\n private _computeEffectiveFlags(): void {\n [this._effHeaderSeparator, this._effFooterSeparator] = this._expandPair(\n this.separators\n );\n [this._effHeaderOverlay, this._effFooterOverlay] = this._expandPair(\n this.overlays\n );\n [this._effHeaderInset, this._effFooterInset] = this._expandPair(\n this.insets\n );\n }\n\n private _setVar(name: string, value: string): void {\n if (this._varsCache[name] === value) return;\n this.style.setProperty(name, value);\n this._varsCache[name] = value;\n }\n\n private _resolveSectionBg(\n token: string,\n isInset: boolean,\n isOverlay: boolean\n ): string {\n if (isInset && !isOverlay) {\n return (\n SkyCard.SECTION_INSET_BG_MAP[\n token as keyof typeof SkyCard.SECTION_INSET_BG_MAP\n ] ?? token\n );\n }\n return SkyCard.BG_MAP[token as keyof typeof SkyCard.BG_MAP] ?? token;\n }\n\n private _resolveSectionGlassSurface(token: string): string {\n return SkyCard.GLASS_BG_TIERS.has(token)\n ? \"var(--sky-glass-surface)\"\n : \"none\";\n }\n\n private _applyCardVars(): void {\n this._setVar(\n \"--_card-bg\",\n SkyCard.BG_MAP[this.bg as keyof typeof SkyCard.BG_MAP] ?? this.bg\n );\n this._setVar(\n \"--_card-glass-surface\",\n SkyCard.GLASS_BG_TIERS.has(this.bg)\n ? \"var(--sky-glass-surface)\"\n : \"none\"\n );\n\n this._setVar(\n \"--_card-backdrop\",\n SkyCard._composeBackdrop(this.blurLevel)\n );\n\n this._setVar(\"--_card-radius\", resolveRadius(this.radius));\n this._setVar(\n \"--_card-shadow\",\n SkyCard._composeElevation(this.elevation)\n );\n this._setVar(\n \"--_card-shadow-hover\",\n \"var(--sky-box-shadow-inset), var(--sky-box-shadow-hover)\"\n );\n }\n\n private _applyPaddingVars(): void {\n const h =\n SkyCard.SIZE_MAP[this.headerPadding as keyof typeof SkyCard.SIZE_MAP] ??\n this.headerPadding;\n const b =\n SkyCard.SIZE_MAP[this.bodyPadding as keyof typeof SkyCard.SIZE_MAP] ??\n this.bodyPadding;\n const f =\n SkyCard.SIZE_MAP[this.footerPadding as keyof typeof SkyCard.SIZE_MAP] ??\n this.footerPadding;\n\n const ratio = Number.isFinite(this.padRatio)\n ? Math.max(0, this.padRatio)\n : 1;\n\n this._setVar(\"--_header-pad-y\", h);\n this._setVar(\"--_header-pad-x\", `calc(${h} ${ratio})`);\n\n this._setVar(\"--_body-pad-y\", b);\n this._setVar(\"--_body-pad-x\", `calc(${b} * ${ratio})`);\n\n this._setVar(\"--_footer-pad-y\", f);\n this._setVar(\"--_footer-pad-x\", `calc(${f} * ${ratio})`);\n }\n\n private _applySectionChrome(): void {\n const headerSep = this._effHeaderInset\n ? \"0px\"\n : this._effHeaderSeparator\n ? \"1px\"\n : \"0px\";\n const footerSep = this._effFooterInset\n ? \"0px\"\n : this._effFooterSeparator\n ? \"1px\"\n : \"0px\";\n this._setVar(\"--_header-separator\", headerSep);\n this._setVar(\"--_footer-separator\", footerSep);\n\n this._setVar(\"--_header-separator-color\", resolveColor(this.headerSeparatorColor));\n this._setVar(\"--_footer-separator-color\", resolveColor(this.footerSeparatorColor));\n\n const headerInsetBorder =\n this._effHeaderInset && this._effHeaderSeparator\n ? \"1px solid var(--sky-border-light)\"\n : \"0 solid transparent\";\n const footerInsetBorder =\n this._effFooterInset && this._effFooterSeparator\n ? \"1px solid var(--sky-border-light)\"\n : \"0 solid transparent\";\n this._setVar(\"--_header-inset-border\", headerInsetBorder);\n this._setVar(\"--_footer-inset-border\", footerInsetBorder);\n\n this._setVar(\n \"--_header-bg\",\n this._resolveSectionBg(\n this.headerBg,\n this._effHeaderInset,\n this._effHeaderOverlay\n )\n );\n this._setVar(\n \"--_footer-bg\",\n this._resolveSectionBg(\n this.footerBg,\n this._effFooterInset,\n this._effFooterOverlay\n )\n );\n this._setVar(\n \"--_header-glass-surface\",\n this._effHeaderOverlay\n ? this._resolveSectionGlassSurface(this.headerBg)\n : \"none\"\n );\n this._setVar(\n \"--_footer-glass-surface\",\n this._effFooterOverlay\n ? this._resolveSectionGlassSurface(this.footerBg)\n : \"none\"\n );\n this._setVar(\n \"--_header-backdrop\",\n this._effHeaderOverlay\n ? SkyCard._composeBackdrop(this.headerBlur)\n : \"none\"\n );\n this._setVar(\n \"--_footer-backdrop\",\n this._effFooterOverlay\n ? SkyCard._composeBackdrop(this.footerBlur)\n : \"none\"\n );\n\n this._setVar(\n \"--_header-radius\",\n resolveRadius(this.headerRadius)\n );\n this._setVar(\n \"--_footer-radius\",\n resolveRadius(this.footerRadius)\n );\n this._setVar(\n \"--_header-inset-gap\",\n SkyCard.SIZE_MAP[this.headerInsetGap as keyof typeof SkyCard.SIZE_MAP] ??\n this.headerInsetGap\n );\n this._setVar(\n \"--_footer-inset-gap\",\n SkyCard.SIZE_MAP[this.footerInsetGap as keyof typeof SkyCard.SIZE_MAP] ??\n this.footerInsetGap\n );\n }\n /*\n Recomputes card variables and section synchronization.\n \n @returns {void}\n */\n public refreshLayout(): void {\n this._computeEffectiveFlags();\n this._applyCardVars();\n this._applyPaddingVars();\n this._applySectionChrome();\n this._syncHeader();\n this._syncFooter();\n }\n\n override render() {\n const headerLayoutClass = this.headerLayout === \"inline\" ? \"row\" : \"stack\";\n const footerLayoutClass = this.footerLayout === \"inline\" ? \"row\" : \"stack\";\n const headerClasses = classMap({\n section: true,\n [headerLayoutClass]: true,\n \"overlay-top\": !!this._effHeaderOverlay,\n inset: !!this._effHeaderInset,\n });\n const footerClasses = classMap({\n section: true,\n [footerLayoutClass]: true,\n \"overlay-bottom\": !!this._effFooterOverlay,\n inset: !!this._effFooterInset,\n });\n\n return html`\n <div class=\"card\" part=\"card\">\n <div class=${headerClasses} part=\"header\" id=\"hdr\">\n <div class=\"main\">\n <slot name=\"title\" id=\"slot-title\"></slot>\n <slot name=\"subtitle\" id=\"slot-subtitle\"></slot>\n </div>\n <slot name=\"actions\" id=\"slot-actions\"></slot>\n </div>\n\n <slot></slot>\n\n <div class=${footerClasses} part=\"footer\" id=\"ftr\">\n <div class=\"main\">\n <slot name=\"footer-title\" id=\"slot-f-title\"></slot>\n <slot name=\"footer-subtitle\" id=\"slot-f-subtitle\"></slot>\n </div>\n <slot name=\"footer-actions\" id=\"slot-f-actions\"></slot>\n </div>\n </div>\n `;\n }\n}\n"],"names":["SkyCard","LitElement","constructor","super","arguments","this","bg","blurLevel","radius","bodyPadding","elevation","outlined","clickable","headerBg","headerBlur","headerPadding","headerLayout","headerInsetGap","headerRadius","headerSeparatorColor","footerBg","footerBlur","footerPadding","footerLayout","footerInsetGap","footerRadius","footerSeparatorColor","padRatio","separators","overlays","insets","_effHeaderSeparator","_effFooterSeparator","_effHeaderOverlay","_effFooterOverlay","_effHeaderInset","_effFooterInset","_varsCache","_composeBackdrop","blur","BLUR_MAP","_composeElevation","level","depth","none","sm","md","lg","firstUpdated","_wireSlotChangeHandlers","_syncHeader","_syncFooter","willUpdate","changed","has","_computeEffectiveFlags","_applyCardVars","_applyPaddingVars","_applySectionChrome","renderRoot","querySelector","addEventListener","hdr","slots","filter","Boolean","some","s","assignedNodes","flatten","length","toggleAttribute","forEach","ftr","_expandPair","sh","_setVar","name","value","style","setProperty","_resolveSectionBg","token","isInset","isOverlay","SECTION_INSET_BG_MAP","BG_MAP","_resolveSectionGlassSurface","GLASS_BG_TIERS","resolveRadius","h","SIZE_MAP","b","f","ratio","Number","isFinite","Math","max","headerSep","footerSep","resolveColor","headerInsetBorder","footerInsetBorder","refreshLayout","render","headerLayoutClass","footerLayoutClass","headerClasses","classMap","section","inset","footerClasses","html","primary","secondary","tertiary","transparent","xs","xl","Set","styles","css","__decorateClass","property","type","String","reflect","prototype","customElement"],"mappings":"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"}
1	+ {"version":3,"file":"sky-card.js","sources":["../../src/sky-card/sky-card.ts"],"sourcesContent":["import { LitElement, html, css, PropertyValues } from \"lit\";\r\nimport { customElement, property } from \"lit/decorators.js\";\r\nimport { classMap } from \"lit/directives/class-map.js\";\r\nimport { resolveRadius } from \"../helper/utils/size-resolver\";\r\nimport { resolveColor } from \"../helper/utils/color-resolver\";\r\n\r\nexport type SkyCardElevation = \"none\" \| \"sm\" \| \"md\" \| \"lg\";\r\nexport type SkyCardSectionLayout = \"inline\" \| \"stack\";\r\nexport type SkyCardSectionTarget = \"both\" \| \"header\" \| \"footer\" \| \"none\";\r\n\r\n/*\r\n @element sky-card\r\n \r\n @summary Customizable card with configurable header/footer sections, blur/background styles, elevation, insets, overlays, and separators.\r\n \r\n @status stable\r\n * @since 1.0.0\r\n \r\n @documentation https://library.sky-ui.com/components/card\r\n \r\n @slot - Default slot for the card body content (replaces `bodyPadding` property if used).\r\n * @slot title - Slot for the card title.\r\n * @slot subtitle - Slot for the card subtitle.\r\n * @slot actions - Slot for the card actions (usually buttons).\r\n * @slot footer-title - Slot for the footer title.\r\n * @slot footer-subtitle - Slot for the footer subtitle.\r\n * @slot footer-actions - Slot for the footer actions (usually buttons).\r\n \r\n @csspart card - The main card container element.\r\n * @csspart header - The card header section.\r\n * @csspart footer - The card footer section.\r\n * @csspart ripple - The ripple animation element injected when the card is clicked.\r\n \r\n @property {string} bg - Background color of the card. Accepts color tokens or custom CSS colors. Default: `\"primary\"`.\r\n * @property {string} blurLevel - Level of blur applied to the background. Default: `\"none\"`.\r\n * @property {string} radius - Border radius of the card. Default: `\"md\"`.\r\n * @property {string} bodyPadding - Padding for the card body. Default: `\"none\"`.\r\n * @property {SkyCardElevation} elevation - Shadow depth of the card. Default: `\"md\"`.\r\n * @property {boolean} outlined - Whether the card has an outline. Default: `false`.\r\n * @property {boolean} clickable - Whether the card is clickable. Default: `false`.\r\n * @property {string} headerBg - Background color of the header. Default: `\"transparent\"`.\r\n * @property {string} headerBlur - Blur level for the header background. Default: `\"none\"`.\r\n * @property {string} headerPadding - Padding for the header. Default: `\"md\"`.\r\n * @property {SkyCardSectionLayout} headerLayout - Layout of the header content. Default: `\"inline\"`.\r\n * @property {string} headerInsetGap - Inset gap for the header section. Default: `\"sm\"`.\r\n * @property {string} headerRadius - Border radius for the header. Default: `\"md\"`.\r\n * @property {string} headerSeparatorColor - Color for the header separator. Default: `\"border-light\"`.\r\n * @property {string} footerBg - Background color of the footer. Default: `\"transparent\"`.\r\n * @property {string} footerBlur - Blur level for the footer background. Default: `\"none\"`.\r\n * @property {string} footerPadding - Padding for the footer. Default: `\"md\"`.\r\n * @property {SkyCardSectionLayout} footerLayout - Layout of the footer content. Default: `\"inline\"`.\r\n * @property {string} footerInsetGap - Inset gap for the footer section. Default: `\"sm\"`.\r\n * @property {string} footerRadius - Border radius for the footer. Default: `\"md\"`.\r\n * @property {string} footerSeparatorColor - Color for the footer separator. Default: `\"border-light\"`.\r\n * @property {number} padRatio - Ratio to adjust padding. Default: `1`.\r\n * @property {SkyCardSectionTarget} separators - Determines where separators should appear. Default: `\"none\"`.\r\n * @property {SkyCardSectionTarget} overlays - Determines where overlays should appear. Default: `\"none\"`.\r\n * @property {SkyCardSectionTarget} insets - Determines where insets should appear. Default: `\"none\"`.\r\n * @method refreshLayout Recomputes card variables and section synchronization.\r\n \r\n @example\r\n * ```html\r\n * <sky-card bg=\"primary\" elevation=\"lg\" headerpadding=\"md\">\r\n * <span slot=\"title\">Monthly Report</span>\r\n * <span slot=\"subtitle\">April 2026</span>\r\n * <div>Total revenue increased by 18%.</div>\r\n * <button slot=\"actions\">View Details</button>\r\n * </sky-card>\r\n * ```\r\n * ```vue\r\n * <template>\r\n * <sky-card bg=\"primary\" elevation=\"lg\" headerpadding=\"md\">\r\n * <span slot=\"title\">Monthly Report</span>\r\n * <span slot=\"subtitle\">April 2026</span>\r\n * <div>Total revenue increased by 18%.</div>\r\n * <button slot=\"actions\">View Details</button>\r\n * </sky-card>\r\n * </template>\r\n * ```\r\n * ```jsx\r\n * export default function Demo() {\r\n * return (\r\n * <sky-card bg=\"primary\" elevation=\"lg\" headerpadding=\"md\">\r\n * <span slot=\"title\">Monthly Report</span>\r\n * <span slot=\"subtitle\">April 2026</span>\r\n * <div>Total revenue increased by 18%.</div>\r\n * <button slot=\"actions\">View Details</button>\r\n * </sky-card>\r\n * );\r\n * }\r\n * ```\r\n /\r\n@customElement(\"sky-card\")\r\nexport class SkyCard extends LitElement {\r\n @property({ type: String, reflect: true }) bg = \"primary\";\r\n @property({ type: String, reflect: true }) blurLevel = \"none\";\r\n @property({ type: String, reflect: true }) radius = \"md\";\r\n @property({ type: String, reflect: true }) bodyPadding = \"none\";\r\n @property({ type: String, reflect: true }) elevation: SkyCardElevation = \"md\";\r\n @property({ type: Boolean, reflect: true }) outlined = false;\r\n @property({ type: Boolean, reflect: true }) clickable = false;\r\n\r\n @property({ type: String, reflect: true }) headerBg =\r\n \"transparent\";\r\n @property({ type: String, reflect: true })\r\n headerBlur = \"none\";\r\n @property({ type: String, reflect: true })\r\n headerPadding = \"md\";\r\n @property({ type: String }) headerLayout: SkyCardSectionLayout = \"inline\";\r\n @property({ type: String, reflect: true })\r\n headerInsetGap = \"sm\";\r\n @property({ type: String, reflect: true })\r\n headerRadius = \"md\";\r\n @property({ type: String })\r\n headerSeparatorColor = \"border-light\";\r\n\r\n @property({ type: String, reflect: true }) footerBg =\r\n \"transparent\";\r\n @property({ type: String, reflect: true })\r\n footerBlur = \"none\";\r\n @property({ type: String, reflect: true })\r\n footerPadding = \"md\";\r\n @property({ type: String }) footerLayout: SkyCardSectionLayout = \"inline\";\r\n @property({ type: String, reflect: true })\r\n footerInsetGap = \"sm\";\r\n @property({ type: String, reflect: true })\r\n footerRadius = \"md\";\r\n @property({ type: String })\r\n footerSeparatorColor = \"border-light\";\r\n\r\n @property({ type: Number }) padRatio = 1;\r\n\r\n @property({ type: String }) separators: SkyCardSectionTarget = \"none\";\r\n @property({ type: String }) overlays: SkyCardSectionTarget = \"none\";\r\n @property({ type: String }) insets: SkyCardSectionTarget = \"none\";\r\n\r\n private _effHeaderSeparator = false;\r\n private _effFooterSeparator = false;\r\n private _effHeaderOverlay = false;\r\n private _effFooterOverlay = false;\r\n private _effHeaderInset = false;\r\n private _effFooterInset = false;\r\n private _varsCache: Record<string, string> = {};\r\n\r\n private static readonly BG_MAP = {\r\n primary: \"var(--sky-glass-primary)\",\r\n secondary: \"var(--sky-glass-secondary)\",\r\n tertiary: \"var(--sky-glass-tertiary)\",\r\n transparent: \"transparent\",\r\n } as const;\r\n\r\n private static readonly BLUR_MAP = {\r\n none: \"none\",\r\n xs: \"blur(2px)\",\r\n sm: \"var(--sky-blur-secondary)\",\r\n md: \"var(--sky-blur-secondary)\",\r\n lg: \"var(--sky-blur-tertiary)\",\r\n } as const;\r\n\r\n private static readonly SIZE_MAP = {\r\n none: \"0\",\r\n sm: \"var(--sky-space-1\\\\.5, 6px)\",\r\n md: \"var(--sky-space-4, 16px)\",\r\n lg: \"var(--sky-space-6, 24px)\",\r\n xl: \"var(--sky-space-8, 32px)\",\r\n } as const;\r\n\r\n private static readonly GLASS_BG_TIERS = new Set([\r\n \"primary\",\r\n \"secondary\",\r\n \"tertiary\",\r\n ]);\r\n\r\n /* Non-overlay inset bars use hover tints — overlay sections own their own blur. /\r\n private static readonly SECTION_INSET_BG_MAP = {\r\n primary: \"var(--sky-hover-primary)\",\r\n secondary: \"var(--sky-hover-secondary)\",\r\n tertiary: \"var(--sky-hover-tertiary)\",\r\n transparent: \"transparent\",\r\n } as const;\r\n\r\n private static _composeBackdrop(blurLevel: string): string {\r\n const blur =\r\n SkyCard.BLUR_MAP[blurLevel as keyof typeof SkyCard.BLUR_MAP] ?? blurLevel;\r\n if (blur === \"none\") return \"none\";\r\n return `${blur} var(--sky-saturation-secondary) var(--sky-brightness-secondary)`;\r\n }\r\n\r\n private static _composeElevation(level: SkyCardElevation \| string): string {\r\n const depthMap: Record<SkyCardElevation, string \| null> = {\r\n none: null,\r\n sm: \"var(--sky-box-shadow-primary)\",\r\n md: \"var(--sky-box-shadow-secondary)\",\r\n lg: \"var(--sky-box-shadow-tertiary)\",\r\n };\r\n const depth = depthMap[level as SkyCardElevation];\r\n if (depth === null) return \"none\";\r\n if (depth === undefined) return level;\r\n return `var(--sky-box-shadow-inset), ${depth}`;\r\n }\r\n\r\n static styles = css`\r\n :host {\r\n display: block;\r\n }\r\n\r\n .card {\r\n display: flex;\r\n flex-direction: column;\r\n width: 100%;\r\n position: relative;\r\n overflow: hidden;\r\n box-sizing: border-box;\r\n color: var(--sky-text-primary);\r\n background: var(--_card-bg, var(--sky-glass-primary));\r\n background-image: var(--_card-glass-surface, var(--sky-glass-surface));\r\n border-radius: var(--_card-radius, var(--sky-radius-secondary));\r\n backdrop-filter: var(--_card-backdrop, none);\r\n -webkit-backdrop-filter: var(--_card-backdrop, none);\r\n box-shadow: var(\r\n --_card-shadow,\r\n var(--sky-box-shadow-inset),\r\n var(--sky-box-shadow-primary)\r\n );\r\n border: var(--_card-border, var(--sky-border-primary));\r\n transition: var(--sky-transition-default);\r\n }\r\n\r\n :host([outlined]) .card {\r\n box-shadow: none;\r\n border: var(--sky-border-primary);\r\n }\r\n :host([clickable]) .card {\r\n cursor: pointer;\r\n }\r\n :host([clickable]) .card:hover {\r\n box-shadow: var(\r\n --_card-shadow-hover,\r\n var(--sky-box-shadow-inset),\r\n var(--sky-box-shadow-hover)\r\n );\r\n }\r\n\r\n .section {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: var(--sky-space-1\\\\.5, 6px);\r\n box-sizing: border-box;\r\n min-width: 0;\r\n background: transparent;\r\n backdrop-filter: none;\r\n -webkit-backdrop-filter: none;\r\n }\r\n .section.stack {\r\n flex-direction: column;\r\n align-items: stretch;\r\n gap: var(--sky-space-1\\\\.5, 6px);\r\n }\r\n .section.row {\r\n flex-direction: row;\r\n }\r\n\r\n .overlay-top {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n z-index: 1;\r\n }\r\n .overlay-bottom {\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n right: 0;\r\n z-index: 1;\r\n }\r\n\r\n .inset {\r\n overflow: hidden;\r\n box-shadow: none;\r\n }\r\n .section.inset[part=\"header\"] {\r\n border: var(--_header-inset-border, 0 solid transparent);\r\n border-radius: var(--_header-radius, var(--sky-radius-secondary));\r\n }\r\n .section.inset[part=\"footer\"] {\r\n border: var(--_footer-inset-border, 0 solid transparent);\r\n border-radius: var(--_footer-radius, var(--sky-radius-secondary));\r\n }\r\n .overlay-top.inset {\r\n top: var(--_header-inset-gap, var(--sky-space-2, 8px));\r\n left: var(--_header-inset-gap, var(--sky-space-2, 8px));\r\n right: var(--_header-inset-gap, var(--sky-space-2, 8px));\r\n }\r\n .overlay-bottom.inset {\r\n bottom: var(--_footer-inset-gap, var(--sky-space-2, 8px));\r\n left: var(--_footer-inset-gap, var(--sky-space-2, 8px));\r\n right: var(--_footer-inset-gap, var(--sky-space-2, 8px));\r\n }\r\n\r\n .section[part=\"header\"]:has(slot:not([empty])),\r\n .section[part=\"header\"][has-content] {\r\n background: var(--_header-bg);\r\n background-image: var(--_header-glass-surface, none);\r\n padding-block: var(--_header-pad-y, var(--sky-space-3, 12px));\r\n padding-inline: var(--_header-pad-x, var(--sky-space-4, 16px));\r\n }\r\n .section[part=\"footer\"]:has(slot:not([empty])),\r\n .section[part=\"footer\"][has-content] {\r\n background: var(--_footer-bg);\r\n background-image: var(--_footer-glass-surface, none);\r\n padding-block: var(--_footer-pad-y, var(--sky-space-3, 12px));\r\n padding-inline: var(--_footer-pad-x, var(--sky-space-4, 16px));\r\n }\r\n\r\n .section[part=\"header\"].overlay-top:has(slot:not([empty])),\r\n .section[part=\"header\"].overlay-top[has-content] {\r\n backdrop-filter: var(--_header-backdrop, none);\r\n -webkit-backdrop-filter: var(--_header-backdrop, none);\r\n }\r\n .section[part=\"footer\"].overlay-bottom:has(slot:not([empty])),\r\n .section[part=\"footer\"].overlay-bottom[has-content] {\r\n backdrop-filter: var(--_footer-backdrop, none);\r\n -webkit-backdrop-filter: var(--_footer-backdrop, none);\r\n }\r\n\r\n .section[part=\"header\"]:not(.inset):has(slot:not([empty])),\r\n .section[part=\"header\"]:not(.inset)[has-content] {\r\n border-bottom: var(--_header-separator, 0px) solid\r\n var(--_header-separator-color, var(--sky-border-light));\r\n }\r\n .section[part=\"footer\"]:not(.inset):has(slot:not([empty])),\r\n .section[part=\"footer\"]:not(.inset)[has-content] {\r\n border-top: var(--_footer-separator, 0px) solid\r\n var(--_footer-separator-color, var(--sky-border-light));\r\n }\r\n\r\n ::slotted(:not([slot])) {\r\n box-sizing: border-box;\r\n padding-block: var(--_body-pad-y, var(--sky-space-3, 12px));\r\n padding-inline: var(--_body-pad-x, var(--sky-space-4, 16px));\r\n }\r\n slot[empty] {\r\n display: none;\r\n }\r\n\r\n ::slotted([slot=\"title\"]) {\r\n font-size: var(--sky-font-size-lg, 18px);\r\n font-weight: var(--sky-font-weight-semibold, 600);\r\n margin: 0;\r\n color: var(--sky-text-primary);\r\n text-align: start;\r\n text-shadow: var(--sky-text-shadow-on-glass, none);\r\n }\r\n ::slotted([slot=\"subtitle\"]) {\r\n font-size: var(--sky-font-size-sm, 14px);\r\n margin: 0;\r\n color: var(--sky-text-secondary);\r\n text-align: start;\r\n text-shadow: var(--sky-text-shadow-on-glass, none);\r\n }\r\n ::slotted([slot=\"actions\"]) {\r\n display: inline-flex;\r\n gap: var(--sky-space-1\\\\.5, 6px);\r\n align-items: center;\r\n margin-left: auto;\r\n }\r\n ::slotted([slot=\"footer-title\"]) {\r\n font-size: var(--sky-font-size-md, 16px);\r\n font-weight: var(--sky-font-weight-medium, 500);\r\n margin: 0;\r\n color: var(--sky-text-primary);\r\n text-align: start;\r\n }\r\n ::slotted([slot=\"footer-subtitle\"]) {\r\n font-size: var(--sky-font-size-xs, 12px);\r\n margin: 0;\r\n color: var(--sky-text-secondary);\r\n text-align: start;\r\n }\r\n ::slotted([slot=\"footer-actions\"]) {\r\n display: inline-flex;\r\n gap: var(--sky-space-1\\\\.5, 6px);\r\n align-items: center;\r\n margin-left: auto;\r\n }\r\n\r\n .main {\r\n width: 100%;\r\n }\r\n\r\n @media (prefers-reduced-motion: reduce) {\r\n .card {\r\n transition: none;\r\n }\r\n }\r\n `;\r\n\r\n override firstUpdated(): void {\r\n this._wireSlotChangeHandlers();\r\n\r\n this._syncHeader();\r\n this._syncFooter();\r\n }\r\n\r\n protected override willUpdate(changed: PropertyValues): void {\r\n if (\r\n changed.has(\"separators\") \|\|\r\n changed.has(\"overlays\") \|\|\r\n changed.has(\"insets\")\r\n ) {\r\n this._computeEffectiveFlags();\r\n }\r\n\r\n if (\r\n changed.has(\"bg\") \|\|\r\n changed.has(\"blurLevel\") \|\|\r\n changed.has(\"radius\") \|\|\r\n changed.has(\"elevation\")\r\n ) {\r\n this._applyCardVars();\r\n }\r\n if (\r\n changed.has(\"headerPadding\") \|\|\r\n changed.has(\"bodyPadding\") \|\|\r\n changed.has(\"footerPadding\") \|\|\r\n changed.has(\"padRatio\")\r\n ) {\r\n this._applyPaddingVars();\r\n }\r\n if (\r\n changed.has(\"headerBg\") \|\|\r\n changed.has(\"footerBg\") \|\|\r\n changed.has(\"headerBlur\") \|\|\r\n changed.has(\"footerBlur\") \|\|\r\n changed.has(\"headerRadius\") \|\|\r\n changed.has(\"footerRadius\") \|\|\r\n changed.has(\"headerInsetGap\") \|\|\r\n changed.has(\"footerInsetGap\") \|\|\r\n changed.has(\"headerSeparatorColor\") \|\|\r\n changed.has(\"footerSeparatorColor\") \|\|\r\n changed.has(\"separators\") \|\|\r\n changed.has(\"insets\") \|\|\r\n changed.has(\"overlays\")\r\n ) {\r\n this._applySectionChrome();\r\n }\r\n }\r\n\r\n private _wireSlotChangeHandlers(): void {\r\n this.renderRoot\r\n .querySelector(\"#slot-title\")\r\n ?.addEventListener(\"slotchange\", () => this._syncHeader());\r\n this.renderRoot\r\n .querySelector(\"#slot-subtitle\")\r\n ?.addEventListener(\"slotchange\", () => this._syncHeader());\r\n this.renderRoot\r\n .querySelector(\"#slot-actions\")\r\n ?.addEventListener(\"slotchange\", () => this._syncHeader());\r\n\r\n this.renderRoot\r\n .querySelector(\"#slot-f-title\")\r\n ?.addEventListener(\"slotchange\", () => this._syncFooter());\r\n this.renderRoot\r\n .querySelector(\"#slot-f-subtitle\")\r\n ?.addEventListener(\"slotchange\", () => this._syncFooter());\r\n this.renderRoot\r\n .querySelector(\"#slot-f-actions\")\r\n ?.addEventListener(\"slotchange\", () => this._syncFooter());\r\n }\r\n\r\n private _syncHeader(): void {\r\n const hdr = this.renderRoot.querySelector(\"#hdr\");\r\n const slots = [\r\n this.renderRoot.querySelector(\"#slot-title\") as HTMLSlotElement \| null,\r\n this.renderRoot.querySelector(\"#slot-subtitle\") as HTMLSlotElement \| null,\r\n this.renderRoot.querySelector(\"#slot-actions\") as HTMLSlotElement \| null,\r\n ].filter(Boolean) as HTMLSlotElement[];\r\n\r\n const has = slots.some(\r\n (s) => s.assignedNodes({ flatten: true }).length > 0\r\n );\r\n hdr?.toggleAttribute(\"has-content\", has);\r\n\r\n slots.forEach((s) =>\r\n s.toggleAttribute(\r\n \"empty\",\r\n s.assignedNodes({ flatten: true }).length === 0\r\n )\r\n );\r\n }\r\n\r\n private _syncFooter(): void {\r\n const ftr = this.renderRoot.querySelector(\"#ftr\");\r\n const slots = [\r\n this.renderRoot.querySelector(\"#slot-f-title\") as HTMLSlotElement \| null,\r\n this.renderRoot.querySelector(\r\n \"#slot-f-subtitle\"\r\n ) as HTMLSlotElement \| null,\r\n this.renderRoot.querySelector(\r\n \"#slot-f-actions\"\r\n ) as HTMLSlotElement \| null,\r\n ].filter(Boolean) as HTMLSlotElement[];\r\n\r\n const has = slots.some(\r\n (s) => s.assignedNodes({ flatten: true }).length > 0\r\n );\r\n ftr?.toggleAttribute(\"has-content\", has);\r\n slots.forEach((s) =>\r\n s.toggleAttribute(\r\n \"empty\",\r\n s.assignedNodes({ flatten: true }).length === 0\r\n )\r\n );\r\n }\r\n\r\n private _expandPair(sh: SkyCardSectionTarget): [boolean, boolean] {\r\n switch (sh) {\r\n case \"both\":\r\n return [true, true];\r\n case \"header\":\r\n return [true, false];\r\n case \"footer\":\r\n return [false, true];\r\n case \"none\":\r\n default:\r\n return [false, false];\r\n }\r\n }\r\n\r\n private _computeEffectiveFlags(): void {\r\n [this._effHeaderSeparator, this._effFooterSeparator] = this._expandPair(\r\n this.separators\r\n );\r\n [this._effHeaderOverlay, this._effFooterOverlay] = this._expandPair(\r\n this.overlays\r\n );\r\n [this._effHeaderInset, this._effFooterInset] = this._expandPair(\r\n this.insets\r\n );\r\n }\r\n\r\n private _setVar(name: string, value: string): void {\r\n if (this._varsCache[name] === value) return;\r\n this.style.setProperty(name, value);\r\n this._varsCache[name] = value;\r\n }\r\n\r\n private _resolveSectionBg(\r\n token: string,\r\n isInset: boolean,\r\n isOverlay: boolean\r\n ): string {\r\n if (isInset && !isOverlay) {\r\n return (\r\n SkyCard.SECTION_INSET_BG_MAP[\r\n token as keyof typeof SkyCard.SECTION_INSET_BG_MAP\r\n ] ?? token\r\n );\r\n }\r\n return SkyCard.BG_MAP[token as keyof typeof SkyCard.BG_MAP] ?? token;\r\n }\r\n\r\n private _resolveSectionGlassSurface(token: string): string {\r\n return SkyCard.GLASS_BG_TIERS.has(token)\r\n ? \"var(--sky-glass-surface)\"\r\n : \"none\";\r\n }\r\n\r\n private _applyCardVars(): void {\r\n this._setVar(\r\n \"--_card-bg\",\r\n SkyCard.BG_MAP[this.bg as keyof typeof SkyCard.BG_MAP] ?? this.bg\r\n );\r\n this._setVar(\r\n \"--_card-glass-surface\",\r\n SkyCard.GLASS_BG_TIERS.has(this.bg)\r\n ? \"var(--sky-glass-surface)\"\r\n : \"none\"\r\n );\r\n\r\n this._setVar(\r\n \"--_card-backdrop\",\r\n SkyCard._composeBackdrop(this.blurLevel)\r\n );\r\n\r\n this._setVar(\"--_card-radius\", resolveRadius(this.radius));\r\n this._setVar(\r\n \"--_card-shadow\",\r\n SkyCard._composeElevation(this.elevation)\r\n );\r\n this._setVar(\r\n \"--_card-shadow-hover\",\r\n \"var(--sky-box-shadow-inset), var(--sky-box-shadow-hover)\"\r\n );\r\n }\r\n\r\n private _applyPaddingVars(): void {\r\n const h =\r\n SkyCard.SIZE_MAP[this.headerPadding as keyof typeof SkyCard.SIZE_MAP] ??\r\n this.headerPadding;\r\n const b =\r\n SkyCard.SIZE_MAP[this.bodyPadding as keyof typeof SkyCard.SIZE_MAP] ??\r\n this.bodyPadding;\r\n const f =\r\n SkyCard.SIZE_MAP[this.footerPadding as keyof typeof SkyCard.SIZE_MAP] ??\r\n this.footerPadding;\r\n\r\n const ratio = Number.isFinite(this.padRatio)\r\n ? Math.max(0, this.padRatio)\r\n : 1;\r\n\r\n this._setVar(\"--_header-pad-y\", h);\r\n this._setVar(\"--_header-pad-x\", `calc(${h} ${ratio})`);\r\n\r\n this._setVar(\"--_body-pad-y\", b);\r\n this._setVar(\"--_body-pad-x\", `calc(${b} * ${ratio})`);\r\n\r\n this._setVar(\"--_footer-pad-y\", f);\r\n this._setVar(\"--_footer-pad-x\", `calc(${f} * ${ratio})`);\r\n }\r\n\r\n private _applySectionChrome(): void {\r\n const headerSep = this._effHeaderInset\r\n ? \"0px\"\r\n : this._effHeaderSeparator\r\n ? \"1px\"\r\n : \"0px\";\r\n const footerSep = this._effFooterInset\r\n ? \"0px\"\r\n : this._effFooterSeparator\r\n ? \"1px\"\r\n : \"0px\";\r\n this._setVar(\"--_header-separator\", headerSep);\r\n this._setVar(\"--_footer-separator\", footerSep);\r\n\r\n this._setVar(\"--_header-separator-color\", resolveColor(this.headerSeparatorColor));\r\n this._setVar(\"--_footer-separator-color\", resolveColor(this.footerSeparatorColor));\r\n\r\n const headerInsetBorder =\r\n this._effHeaderInset && this._effHeaderSeparator\r\n ? \"1px solid var(--sky-border-light)\"\r\n : \"0 solid transparent\";\r\n const footerInsetBorder =\r\n this._effFooterInset && this._effFooterSeparator\r\n ? \"1px solid var(--sky-border-light)\"\r\n : \"0 solid transparent\";\r\n this._setVar(\"--_header-inset-border\", headerInsetBorder);\r\n this._setVar(\"--_footer-inset-border\", footerInsetBorder);\r\n\r\n this._setVar(\r\n \"--_header-bg\",\r\n this._resolveSectionBg(\r\n this.headerBg,\r\n this._effHeaderInset,\r\n this._effHeaderOverlay\r\n )\r\n );\r\n this._setVar(\r\n \"--_footer-bg\",\r\n this._resolveSectionBg(\r\n this.footerBg,\r\n this._effFooterInset,\r\n this._effFooterOverlay\r\n )\r\n );\r\n this._setVar(\r\n \"--_header-glass-surface\",\r\n this._effHeaderOverlay\r\n ? this._resolveSectionGlassSurface(this.headerBg)\r\n : \"none\"\r\n );\r\n this._setVar(\r\n \"--_footer-glass-surface\",\r\n this._effFooterOverlay\r\n ? this._resolveSectionGlassSurface(this.footerBg)\r\n : \"none\"\r\n );\r\n this._setVar(\r\n \"--_header-backdrop\",\r\n this._effHeaderOverlay\r\n ? SkyCard._composeBackdrop(this.headerBlur)\r\n : \"none\"\r\n );\r\n this._setVar(\r\n \"--_footer-backdrop\",\r\n this._effFooterOverlay\r\n ? SkyCard._composeBackdrop(this.footerBlur)\r\n : \"none\"\r\n );\r\n\r\n this._setVar(\r\n \"--_header-radius\",\r\n resolveRadius(this.headerRadius)\r\n );\r\n this._setVar(\r\n \"--_footer-radius\",\r\n resolveRadius(this.footerRadius)\r\n );\r\n this._setVar(\r\n \"--_header-inset-gap\",\r\n SkyCard.SIZE_MAP[this.headerInsetGap as keyof typeof SkyCard.SIZE_MAP] ??\r\n this.headerInsetGap\r\n );\r\n this._setVar(\r\n \"--_footer-inset-gap\",\r\n SkyCard.SIZE_MAP[this.footerInsetGap as keyof typeof SkyCard.SIZE_MAP] ??\r\n this.footerInsetGap\r\n );\r\n }\r\n /*\r\n Recomputes card variables and section synchronization.\r\n \r\n @returns {void}\r\n */\r\n public refreshLayout(): void {\r\n this._computeEffectiveFlags();\r\n this._applyCardVars();\r\n this._applyPaddingVars();\r\n this._applySectionChrome();\r\n this._syncHeader();\r\n this._syncFooter();\r\n }\r\n\r\n override render() {\r\n const headerLayoutClass = this.headerLayout === \"inline\" ? \"row\" : \"stack\";\r\n const footerLayoutClass = this.footerLayout === \"inline\" ? \"row\" : \"stack\";\r\n const headerClasses = classMap({\r\n section: true,\r\n [headerLayoutClass]: true,\r\n \"overlay-top\": !!this._effHeaderOverlay,\r\n inset: !!this._effHeaderInset,\r\n });\r\n const footerClasses = classMap({\r\n section: true,\r\n [footerLayoutClass]: true,\r\n \"overlay-bottom\": !!this._effFooterOverlay,\r\n inset: !!this._effFooterInset,\r\n });\r\n\r\n return html`\r\n <div class=\"card\" part=\"card\">\r\n <div class=${headerClasses} part=\"header\" id=\"hdr\">\r\n <div class=\"main\">\r\n <slot name=\"title\" id=\"slot-title\"></slot>\r\n <slot name=\"subtitle\" id=\"slot-subtitle\"></slot>\r\n </div>\r\n <slot name=\"actions\" id=\"slot-actions\"></slot>\r\n </div>\r\n\r\n <slot></slot>\r\n\r\n <div class=${footerClasses} part=\"footer\" id=\"ftr\">\r\n <div class=\"main\">\r\n <slot name=\"footer-title\" id=\"slot-f-title\"></slot>\r\n <slot name=\"footer-subtitle\" id=\"slot-f-subtitle\"></slot>\r\n </div>\r\n <slot name=\"footer-actions\" id=\"slot-f-actions\"></slot>\r\n </div>\r\n </div>\r\n `;\r\n }\r\n}\r\n"],"names":["SkyCard","LitElement","constructor","super","arguments","this","bg","blurLevel","radius","bodyPadding","elevation","outlined","clickable","headerBg","headerBlur","headerPadding","headerLayout","headerInsetGap","headerRadius","headerSeparatorColor","footerBg","footerBlur","footerPadding","footerLayout","footerInsetGap","footerRadius","footerSeparatorColor","padRatio","separators","overlays","insets","_effHeaderSeparator","_effFooterSeparator","_effHeaderOverlay","_effFooterOverlay","_effHeaderInset","_effFooterInset","_varsCache","_composeBackdrop","blur","BLUR_MAP","_composeElevation","level","depth","none","sm","md","lg","firstUpdated","_wireSlotChangeHandlers","_syncHeader","_syncFooter","willUpdate","changed","has","_computeEffectiveFlags","_applyCardVars","_applyPaddingVars","_applySectionChrome","renderRoot","querySelector","addEventListener","hdr","slots","filter","Boolean","some","s","assignedNodes","flatten","length","toggleAttribute","forEach","ftr","_expandPair","sh","_setVar","name","value","style","setProperty","_resolveSectionBg","token","isInset","isOverlay","SECTION_INSET_BG_MAP","BG_MAP","_resolveSectionGlassSurface","GLASS_BG_TIERS","resolveRadius","h","SIZE_MAP","b","f","ratio","Number","isFinite","Math","max","headerSep","footerSep","resolveColor","headerInsetBorder","footerInsetBorder","refreshLayout","render","headerLayoutClass","footerLayoutClass","headerClasses","classMap","section","inset","footerClasses","html","primary","secondary","tertiary","transparent","xs","xl","Set","styles","css","__decorateClass","property","type","String","reflect","prototype","customElement"],"mappings":"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"}