@mhmo91/schmancy 0.9.16 → 0.9.18

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 (101) hide show
  1. package/custom-elements.json +111 -51
  2. package/dist/agent/schmancy.agent.js +288 -38
  3. package/dist/agent/schmancy.agent.js.map +1 -1
  4. package/dist/agent/schmancy.manifest.json +332 -25
  5. package/dist/breadcrumb.cjs.map +1 -1
  6. package/dist/breadcrumb.js.map +1 -1
  7. package/dist/card-BslSqOsf.cjs.map +1 -1
  8. package/dist/card-CEdgK9nb.js.map +1 -1
  9. package/dist/details-B8p62xmR.cjs.map +1 -1
  10. package/dist/details-CCW52lzz.js.map +1 -1
  11. package/dist/dialog.cjs.map +1 -1
  12. package/dist/dialog.js.map +1 -1
  13. package/dist/divider-CbEWg3G_.js.map +1 -1
  14. package/dist/divider-JyyFw_3J.cjs.map +1 -1
  15. package/dist/dropdown.cjs.map +1 -1
  16. package/dist/dropdown.js.map +1 -1
  17. package/dist/expand-BmwIPNjq.cjs.map +1 -1
  18. package/dist/expand-bFa_qVDT.js.map +1 -1
  19. package/dist/handover/agent-runtime-followups.md +1 -1
  20. package/dist/handover/agent-runtime-v1.md +3 -3
  21. package/dist/list-BpjKUOzM.js.map +1 -1
  22. package/dist/list-CMWHu6cV.cjs.map +1 -1
  23. package/dist/menu-BIBUgS1T.js.map +1 -1
  24. package/dist/menu-DS8Iz4fJ.cjs.map +1 -1
  25. package/dist/navigation-rail.cjs.map +1 -1
  26. package/dist/navigation-rail.js.map +1 -1
  27. package/dist/page.cjs.map +1 -1
  28. package/dist/page.js.map +1 -1
  29. package/dist/scroll-CdmXRXh2.js.map +1 -1
  30. package/dist/scroll-V1rAZ9fK.cjs.map +1 -1
  31. package/dist/sheet-DdlZhnDG.cjs.map +1 -1
  32. package/dist/sheet-LFVo5iN4.js.map +1 -1
  33. package/dist/src-C7niWYur.js.map +1 -1
  34. package/dist/src-I4M33WK2.cjs.map +1 -1
  35. package/dist/surface-0XM4DBaT.js.map +1 -1
  36. package/dist/surface-B6DA01kL.cjs.map +1 -1
  37. package/dist/theme-Cq_c9IO3.js.map +1 -1
  38. package/dist/theme-DU5yXaV-.cjs.map +1 -1
  39. package/dist/tree.cjs.map +1 -1
  40. package/dist/tree.js.map +1 -1
  41. package/package.json +1 -1
  42. package/src/breadcrumb/breadcrumb.ts +14 -4
  43. package/src/card/actions.ts +9 -0
  44. package/src/card/card.ts +18 -0
  45. package/src/card/content.ts +9 -0
  46. package/src/card/media.ts +6 -0
  47. package/src/details/details.ts +12 -0
  48. package/src/dialog/dialog.component.ts +9 -9
  49. package/src/divider/divider.ts +11 -0
  50. package/src/dropdown/dropdown-component.ts +13 -1
  51. package/src/dropdown/dropdown-content.ts +11 -3
  52. package/src/expand/expand-root.component.ts +12 -0
  53. package/src/expand/expand.component.ts +14 -0
  54. package/src/layout/scroll/scroll.ts +5 -1
  55. package/src/list/list-item.ts +10 -0
  56. package/src/list/list.ts +7 -8
  57. package/src/menu/menu-item.ts +13 -0
  58. package/src/menu/menu.ts +10 -22
  59. package/src/nav-drawer/appbar.ts +11 -0
  60. package/src/nav-drawer/content.ts +11 -0
  61. package/src/nav-drawer/drawer.ts +15 -0
  62. package/src/nav-drawer/navbar.ts +14 -0
  63. package/src/navigation-bar/navigation-bar-item.ts +3 -4
  64. package/src/navigation-bar/navigation-bar.ts +3 -9
  65. package/src/navigation-rail/navigation-rail-item.ts +3 -7
  66. package/src/navigation-rail/navigation-rail.ts +12 -8
  67. package/src/page/page.ts +8 -11
  68. package/src/sheet/sheet.ts +17 -0
  69. package/src/surface/surface.ts +4 -10
  70. package/src/theme/theme.component.ts +10 -15
  71. package/src/tree/tree.ts +12 -0
  72. package/types/src/breadcrumb/breadcrumb.d.ts +14 -4
  73. package/types/src/card/actions.d.ts +9 -0
  74. package/types/src/card/card.d.ts +18 -0
  75. package/types/src/card/content.d.ts +9 -0
  76. package/types/src/card/media.d.ts +6 -0
  77. package/types/src/details/details.d.ts +12 -0
  78. package/types/src/dialog/dialog.component.d.ts +9 -9
  79. package/types/src/divider/divider.d.ts +11 -0
  80. package/types/src/dropdown/dropdown-component.d.ts +13 -1
  81. package/types/src/dropdown/dropdown-content.d.ts +11 -3
  82. package/types/src/expand/expand-root.component.d.ts +12 -0
  83. package/types/src/expand/expand.component.d.ts +14 -0
  84. package/types/src/layout/scroll/scroll.d.ts +5 -1
  85. package/types/src/list/list-item.d.ts +10 -0
  86. package/types/src/list/list.d.ts +7 -8
  87. package/types/src/menu/menu-item.d.ts +13 -0
  88. package/types/src/menu/menu.d.ts +10 -22
  89. package/types/src/nav-drawer/appbar.d.ts +11 -0
  90. package/types/src/nav-drawer/content.d.ts +11 -0
  91. package/types/src/nav-drawer/drawer.d.ts +15 -0
  92. package/types/src/nav-drawer/navbar.d.ts +14 -0
  93. package/types/src/navigation-bar/navigation-bar-item.d.ts +3 -4
  94. package/types/src/navigation-bar/navigation-bar.d.ts +3 -9
  95. package/types/src/navigation-rail/navigation-rail-item.d.ts +3 -7
  96. package/types/src/navigation-rail/navigation-rail.d.ts +12 -8
  97. package/types/src/page/page.d.ts +8 -11
  98. package/types/src/sheet/sheet.d.ts +17 -0
  99. package/types/src/surface/surface.d.ts +4 -10
  100. package/types/src/theme/theme.component.d.ts +10 -15
  101. package/types/src/tree/tree.d.ts +12 -0
@@ -1 +1 @@
1
- {"version":3,"file":"breadcrumb.cjs","names":[],"sources":["../src/breadcrumb/breadcrumb.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * Breadcrumb navigation container. Wraps a list of `schmancy-breadcrumb-item`\n * elements with the correct ARIA landmark and semantics.\n *\n * @element schmancy-breadcrumb\n * @slot - Default slot for `<schmancy-breadcrumb-item>` children.\n * @attr separator - Character or string rendered between items. Default `/`.\n * @csspart separator - The separator element.\n */\n@customElement('schmancy-breadcrumb')\nexport class SchmancyBreadcrumb extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n\tnav {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\talign-items: center;\n\t\tgap: 0.25rem;\n\t}\n\t.sep {\n\t\tcolor: var(--schmancy-sys-color-surface-onVariant, #79747e);\n\t\tuser-select: none;\n\t\tpadding: 0 0.25rem;\n\t}\n\t::slotted(schmancy-breadcrumb-item:last-of-type) {\n\t\tfont-weight: 500;\n\t}\n`) {\n\t@property({ type: String }) separator = '/'\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tif (!this.hasAttribute('aria-label')) this.setAttribute('aria-label', 'Breadcrumb')\n\t}\n\n\trender() {\n\t\t// Render separators between slotted items by manipulating after render.\n\t\t// The simpler approach uses the CSS adjacent-sibling pattern so the\n\t\t// separator is visually present without affecting the accessible name.\n\t\treturn html`\n\t\t\t<nav role=\"navigation\">\n\t\t\t\t<slot @slotchange=${() => this._insertSeparators()}></slot>\n\t\t\t</nav>\n\t\t`\n\t}\n\n\tprivate _insertSeparators() {\n\t\tconst slot = this.shadowRoot?.querySelector('slot') as HTMLSlotElement | null\n\t\tif (!slot) return\n\t\tconst items = slot.assignedElements({ flatten: true })\n\t\t// Remove any previously-inserted separators.\n\t\tthis.querySelectorAll('[data-schmancy-sep]').forEach(el => el.remove())\n\t\titems.forEach((el, idx) => {\n\t\t\tif (idx === items.length - 1) return\n\t\t\tconst sep = document.createElement('span')\n\t\t\tsep.setAttribute('data-schmancy-sep', '')\n\t\t\tsep.setAttribute('aria-hidden', 'true')\n\t\t\tsep.setAttribute('part', 'separator')\n\t\t\tsep.className = 'sep'\n\t\t\tsep.textContent = this.separator\n\t\t\tel.insertAdjacentElement('afterend', sep)\n\t\t})\n\t}\n}\n\n/**\n * Individual breadcrumb item. Renders as a link when `href` is provided,\n * otherwise as a plain span (represents the current page).\n *\n * @element schmancy-breadcrumb-item\n * @slot - Label content.\n * @attr href - If set, renders as an anchor.\n * @attr current - Marks as `aria-current=\"page\"`.\n */\n@customElement('schmancy-breadcrumb-item')\nexport class SchmancyBreadcrumbItem extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline-block;\n\t}\n\ta, span {\n\t\tcolor: inherit;\n\t\ttext-decoration: none;\n\t}\n\ta:hover {\n\t\ttext-decoration: underline;\n\t}\n`) {\n\t@property({ type: String }) href = ''\n\t@property({ type: Boolean, reflect: true }) current = false\n\n\trender() {\n\t\tif (this.href && !this.current) {\n\t\t\treturn html`<a href=${this.href}><slot></slot></a>`\n\t\t}\n\t\treturn html`<span aria-current=${this.current ? 'page' : 'false'}><slot></slot></span>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-breadcrumb': SchmancyBreadcrumb\n\t\t'schmancy-breadcrumb-item': SchmancyBreadcrumbItem\n\t}\n}\n"],"mappings":"qQAcO,IAAA,EAAA,cAAiC,EAAA,EAAgB,EAAA,GAAG;;;;;;;;;;;;;;;;;;gDAmBlB,IAExC,mBAAA,CACC,MAAM,mBAAA,CACD,KAAK,aAAa,aAAA,EAAe,KAAK,aAAa,aAAc,aAAA,CAGvE,QAAA,CAIC,MAAO,GAAA,IAAI;;4BAEiB,KAAK,mBAAA,CAAA;;IAKlC,mBAAA,CACC,IAAM,EAAO,KAAK,YAAY,cAAc,OAAA,CAC5C,GAAA,CAAK,EAAM,OACX,IAAM,EAAQ,EAAK,iBAAiB,CAAE,QAAA,CAAS,EAAA,CAAA,CAE/C,KAAK,iBAAiB,sBAAA,CAAuB,QAAQ,GAAM,EAAG,QAAA,CAAA,CAC9D,EAAM,SAAS,EAAI,IAAA,CAClB,GAAI,IAAQ,EAAM,OAAS,EAAG,OAC9B,IAAM,EAAM,SAAS,cAAc,OAAA,CACnC,EAAI,aAAa,oBAAqB,GAAA,CACtC,EAAI,aAAa,cAAe,OAAA,CAChC,EAAI,aAAa,OAAQ,YAAA,CACzB,EAAI,UAAY,MAChB,EAAI,YAAc,KAAK,UACvB,EAAG,sBAAsB,WAAY,EAAA,EAAA,GAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAhC7B,CAAE,KAAM,OAAA,CAAA,CAAA,CAAS,EAAA,UAAA,YAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eApBb,sBAAA,CAAA,CAAsB,EAAA,CAmE9B,IAAA,EAAA,cAAqC,EAAA,EAAgB,EAAA,GAAG;;;;;;;;;;;2CAY3B,GAAA,KAAA,QAAA,CACmB,EAEtD,QAAA,CACC,OAAI,KAAK,MAAA,CAAS,KAAK,QACf,EAAA,IAAI,WAAW,KAAK,KAAA,oBAErB,EAAA,IAAI,sBAAsB,KAAK,QAAU,OAAS,QAAA,yBAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAPhD,CAAE,KAAM,OAAA,CAAA,CAAA,CAAS,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UACjB,CAAE,KAAM,QAAS,QAAA,CAAS,EAAA,CAAA,CAAA,CAAO,EAAA,UAAA,UAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eAd7B,2BAAA,CAAA,CAA2B,EAAA,CAAA,OAAA,eAAA,QAAA,qBAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA,CAAA,OAAA,eAAA,QAAA,yBAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA"}
1
+ {"version":3,"file":"breadcrumb.cjs","names":[],"sources":["../src/breadcrumb/breadcrumb.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * Breadcrumb trail — navigation history from root to current page. Renders schmancy-breadcrumb-item children with separators between.\n *\n * @element schmancy-breadcrumb\n * @summary Use for deep hierarchical navigation (file explorer paths, e-commerce category chains, admin settings trees). Last item is styled as the current page automatically.\n * @example\n * <schmancy-breadcrumb separator=\"›\">\n * <schmancy-breadcrumb-item href=\"/\">Home</schmancy-breadcrumb-item>\n * <schmancy-breadcrumb-item href=\"/docs\">Docs</schmancy-breadcrumb-item>\n * <schmancy-breadcrumb-item>Getting started</schmancy-breadcrumb-item>\n * </schmancy-breadcrumb>\n * @platform nav - Styled `<nav aria-label=\"Breadcrumb\">`. Degrades to a plain nav if the tag never registers.\n * @slot - Default slot for `<schmancy-breadcrumb-item>` children.\n * @attr separator - Character or string rendered between items. Default `/`.\n * @csspart separator - The separator element.\n */\n@customElement('schmancy-breadcrumb')\nexport class SchmancyBreadcrumb extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n\tnav {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\talign-items: center;\n\t\tgap: 0.25rem;\n\t}\n\t.sep {\n\t\tcolor: var(--schmancy-sys-color-surface-onVariant, #79747e);\n\t\tuser-select: none;\n\t\tpadding: 0 0.25rem;\n\t}\n\t::slotted(schmancy-breadcrumb-item:last-of-type) {\n\t\tfont-weight: 500;\n\t}\n`) {\n\t@property({ type: String }) separator = '/'\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tif (!this.hasAttribute('aria-label')) this.setAttribute('aria-label', 'Breadcrumb')\n\t}\n\n\trender() {\n\t\t// Render separators between slotted items by manipulating after render.\n\t\t// The simpler approach uses the CSS adjacent-sibling pattern so the\n\t\t// separator is visually present without affecting the accessible name.\n\t\treturn html`\n\t\t\t<nav role=\"navigation\">\n\t\t\t\t<slot @slotchange=${() => this._insertSeparators()}></slot>\n\t\t\t</nav>\n\t\t`\n\t}\n\n\tprivate _insertSeparators() {\n\t\tconst slot = this.shadowRoot?.querySelector('slot') as HTMLSlotElement | null\n\t\tif (!slot) return\n\t\tconst items = slot.assignedElements({ flatten: true })\n\t\t// Remove any previously-inserted separators.\n\t\tthis.querySelectorAll('[data-schmancy-sep]').forEach(el => el.remove())\n\t\titems.forEach((el, idx) => {\n\t\t\tif (idx === items.length - 1) return\n\t\t\tconst sep = document.createElement('span')\n\t\t\tsep.setAttribute('data-schmancy-sep', '')\n\t\t\tsep.setAttribute('aria-hidden', 'true')\n\t\t\tsep.setAttribute('part', 'separator')\n\t\t\tsep.className = 'sep'\n\t\t\tsep.textContent = this.separator\n\t\t\tel.insertAdjacentElement('afterend', sep)\n\t\t})\n\t}\n}\n\n/**\n * Single segment in a schmancy-breadcrumb trail a link when `href` is set, or a plain span (the current page) when omitted.\n *\n * @element schmancy-breadcrumb-item\n * @summary Always nested inside schmancy-breadcrumb. Omit `href` on the current page — it gets aria-current=\"page\" automatically.\n * @example\n * <schmancy-breadcrumb-item href=\"/products\">Products</schmancy-breadcrumb-item>\n * @platform a - Renders an `<a>` or `<span>` depending on href. Degrades to a plain anchor/span if the tag never registers.\n * @slot - Label content.\n * @attr href - If set, renders as an anchor.\n * @attr current - Marks as `aria-current=\"page\"`.\n */\n@customElement('schmancy-breadcrumb-item')\nexport class SchmancyBreadcrumbItem extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline-block;\n\t}\n\ta, span {\n\t\tcolor: inherit;\n\t\ttext-decoration: none;\n\t}\n\ta:hover {\n\t\ttext-decoration: underline;\n\t}\n`) {\n\t@property({ type: String }) href = ''\n\t@property({ type: Boolean, reflect: true }) current = false\n\n\trender() {\n\t\tif (this.href && !this.current) {\n\t\t\treturn html`<a href=${this.href}><slot></slot></a>`\n\t\t}\n\t\treturn html`<span aria-current=${this.current ? 'page' : 'false'}><slot></slot></span>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-breadcrumb': SchmancyBreadcrumb\n\t\t'schmancy-breadcrumb-item': SchmancyBreadcrumbItem\n\t}\n}\n"],"mappings":"qQAqBO,IAAA,EAAA,cAAiC,EAAA,EAAgB,EAAA,GAAG;;;;;;;;;;;;;;;;;;gDAmBlB,IAExC,mBAAA,CACC,MAAM,mBAAA,CACD,KAAK,aAAa,aAAA,EAAe,KAAK,aAAa,aAAc,aAAA,CAGvE,QAAA,CAIC,MAAO,GAAA,IAAI;;4BAEiB,KAAK,mBAAA,CAAA;;IAKlC,mBAAA,CACC,IAAM,EAAO,KAAK,YAAY,cAAc,OAAA,CAC5C,GAAA,CAAK,EAAM,OACX,IAAM,EAAQ,EAAK,iBAAiB,CAAE,QAAA,CAAS,EAAA,CAAA,CAE/C,KAAK,iBAAiB,sBAAA,CAAuB,QAAQ,GAAM,EAAG,QAAA,CAAA,CAC9D,EAAM,SAAS,EAAI,IAAA,CAClB,GAAI,IAAQ,EAAM,OAAS,EAAG,OAC9B,IAAM,EAAM,SAAS,cAAc,OAAA,CACnC,EAAI,aAAa,oBAAqB,GAAA,CACtC,EAAI,aAAa,cAAe,OAAA,CAChC,EAAI,aAAa,OAAQ,YAAA,CACzB,EAAI,UAAY,MAChB,EAAI,YAAc,KAAK,UACvB,EAAG,sBAAsB,WAAY,EAAA,EAAA,GAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAhC7B,CAAE,KAAM,OAAA,CAAA,CAAA,CAAS,EAAA,UAAA,YAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eApBb,sBAAA,CAAA,CAAsB,EAAA,CAsE9B,IAAA,EAAA,cAAqC,EAAA,EAAgB,EAAA,GAAG;;;;;;;;;;;2CAY3B,GAAA,KAAA,QAAA,CACmB,EAEtD,QAAA,CACC,OAAI,KAAK,MAAA,CAAS,KAAK,QACf,EAAA,IAAI,WAAW,KAAK,KAAA,oBAErB,EAAA,IAAI,sBAAsB,KAAK,QAAU,OAAS,QAAA,yBAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAPhD,CAAE,KAAM,OAAA,CAAA,CAAA,CAAS,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UACjB,CAAE,KAAM,QAAS,QAAA,CAAS,EAAA,CAAA,CAAA,CAAO,EAAA,UAAA,UAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eAd7B,2BAAA,CAAA,CAA2B,EAAA,CAAA,OAAA,eAAA,QAAA,qBAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA,CAAA,OAAA,eAAA,QAAA,yBAAA,CAAA,WAAA,CAAA,EAAA,IAAA,UAAA,CAAA,OAAA,GAAA,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"breadcrumb.js","names":[],"sources":["../src/breadcrumb/breadcrumb.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * Breadcrumb navigation container. Wraps a list of `schmancy-breadcrumb-item`\n * elements with the correct ARIA landmark and semantics.\n *\n * @element schmancy-breadcrumb\n * @slot - Default slot for `<schmancy-breadcrumb-item>` children.\n * @attr separator - Character or string rendered between items. Default `/`.\n * @csspart separator - The separator element.\n */\n@customElement('schmancy-breadcrumb')\nexport class SchmancyBreadcrumb extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n\tnav {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\talign-items: center;\n\t\tgap: 0.25rem;\n\t}\n\t.sep {\n\t\tcolor: var(--schmancy-sys-color-surface-onVariant, #79747e);\n\t\tuser-select: none;\n\t\tpadding: 0 0.25rem;\n\t}\n\t::slotted(schmancy-breadcrumb-item:last-of-type) {\n\t\tfont-weight: 500;\n\t}\n`) {\n\t@property({ type: String }) separator = '/'\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tif (!this.hasAttribute('aria-label')) this.setAttribute('aria-label', 'Breadcrumb')\n\t}\n\n\trender() {\n\t\t// Render separators between slotted items by manipulating after render.\n\t\t// The simpler approach uses the CSS adjacent-sibling pattern so the\n\t\t// separator is visually present without affecting the accessible name.\n\t\treturn html`\n\t\t\t<nav role=\"navigation\">\n\t\t\t\t<slot @slotchange=${() => this._insertSeparators()}></slot>\n\t\t\t</nav>\n\t\t`\n\t}\n\n\tprivate _insertSeparators() {\n\t\tconst slot = this.shadowRoot?.querySelector('slot') as HTMLSlotElement | null\n\t\tif (!slot) return\n\t\tconst items = slot.assignedElements({ flatten: true })\n\t\t// Remove any previously-inserted separators.\n\t\tthis.querySelectorAll('[data-schmancy-sep]').forEach(el => el.remove())\n\t\titems.forEach((el, idx) => {\n\t\t\tif (idx === items.length - 1) return\n\t\t\tconst sep = document.createElement('span')\n\t\t\tsep.setAttribute('data-schmancy-sep', '')\n\t\t\tsep.setAttribute('aria-hidden', 'true')\n\t\t\tsep.setAttribute('part', 'separator')\n\t\t\tsep.className = 'sep'\n\t\t\tsep.textContent = this.separator\n\t\t\tel.insertAdjacentElement('afterend', sep)\n\t\t})\n\t}\n}\n\n/**\n * Individual breadcrumb item. Renders as a link when `href` is provided,\n * otherwise as a plain span (represents the current page).\n *\n * @element schmancy-breadcrumb-item\n * @slot - Label content.\n * @attr href - If set, renders as an anchor.\n * @attr current - Marks as `aria-current=\"page\"`.\n */\n@customElement('schmancy-breadcrumb-item')\nexport class SchmancyBreadcrumbItem extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline-block;\n\t}\n\ta, span {\n\t\tcolor: inherit;\n\t\ttext-decoration: none;\n\t}\n\ta:hover {\n\t\ttext-decoration: underline;\n\t}\n`) {\n\t@property({ type: String }) href = ''\n\t@property({ type: Boolean, reflect: true }) current = false\n\n\trender() {\n\t\tif (this.href && !this.current) {\n\t\t\treturn html`<a href=${this.href}><slot></slot></a>`\n\t\t}\n\t\treturn html`<span aria-current=${this.current ? 'page' : 'false'}><slot></slot></span>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-breadcrumb': SchmancyBreadcrumb\n\t\t'schmancy-breadcrumb-item': SchmancyBreadcrumbItem\n\t}\n}\n"],"mappings":";;;;;AAcO,IAAA,IAAA,cAAiC,EAAgB,CAAG;;;;;;;;;;;;;;;;;;;;gCAmBlB;;CAExC,oBAAA;AACC,QAAM,mBAAA,EACD,KAAK,aAAa,aAAA,IAAe,KAAK,aAAa,cAAc,aAAA;;CAGvE,SAAA;AAIC,SAAO,CAAI;;8BAEiB,KAAK,mBAAA,CAAA;;;;CAKlC,oBAAA;EACC,IAAM,IAAO,KAAK,YAAY,cAAc,OAAA;AAC5C,MAAA,CAAK,EAAM;EACX,IAAM,IAAQ,EAAK,iBAAiB,EAAE,SAAA,CAAS,GAAA,CAAA;AAE/C,OAAK,iBAAiB,sBAAA,CAAuB,SAAQ,MAAM,EAAG,QAAA,CAAA,EAC9D,EAAM,SAAS,GAAI,MAAA;AAClB,OAAI,MAAQ,EAAM,SAAS,EAAG;GAC9B,IAAM,IAAM,SAAS,cAAc,OAAA;AACnC,KAAI,aAAa,qBAAqB,GAAA,EACtC,EAAI,aAAa,eAAe,OAAA,EAChC,EAAI,aAAa,QAAQ,YAAA,EACzB,EAAI,YAAY,OAChB,EAAI,cAAc,KAAK,WACvB,EAAG,sBAAsB,YAAY,EAAA;IAAA;;;AAAA,EAAA,CAhCtC,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,EAAS,EAAA,WAAA,aAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CApB3B,EAAc,sBAAA,CAAA,EAAsB,EAAA;AAmE9B,IAAA,IAAA,cAAqC,EAAgB,CAAG;;;;;;;;;;;;;2BAY3B,IAAA,KAAA,UAAA,CACmB;;CAEtD,SAAA;AACC,SAAI,KAAK,QAAA,CAAS,KAAK,UACf,CAAI,WAAW,KAAK,KAAA,sBAErB,CAAI,sBAAsB,KAAK,UAAU,SAAS,QAAA;;;AAAA,EAAA,CAPzD,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,EAAS,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAC1B,EAAS;CAAE,MAAM;CAAS,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,WAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CAd3C,EAAc,2BAAA,CAAA,EAA2B,EAAA;AAAA,SAAA,KAAA,oBAAA,KAAA"}
1
+ {"version":3,"file":"breadcrumb.js","names":[],"sources":["../src/breadcrumb/breadcrumb.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * Breadcrumb trail — navigation history from root to current page. Renders schmancy-breadcrumb-item children with separators between.\n *\n * @element schmancy-breadcrumb\n * @summary Use for deep hierarchical navigation (file explorer paths, e-commerce category chains, admin settings trees). Last item is styled as the current page automatically.\n * @example\n * <schmancy-breadcrumb separator=\"›\">\n * <schmancy-breadcrumb-item href=\"/\">Home</schmancy-breadcrumb-item>\n * <schmancy-breadcrumb-item href=\"/docs\">Docs</schmancy-breadcrumb-item>\n * <schmancy-breadcrumb-item>Getting started</schmancy-breadcrumb-item>\n * </schmancy-breadcrumb>\n * @platform nav - Styled `<nav aria-label=\"Breadcrumb\">`. Degrades to a plain nav if the tag never registers.\n * @slot - Default slot for `<schmancy-breadcrumb-item>` children.\n * @attr separator - Character or string rendered between items. Default `/`.\n * @csspart separator - The separator element.\n */\n@customElement('schmancy-breadcrumb')\nexport class SchmancyBreadcrumb extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n\tnav {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\talign-items: center;\n\t\tgap: 0.25rem;\n\t}\n\t.sep {\n\t\tcolor: var(--schmancy-sys-color-surface-onVariant, #79747e);\n\t\tuser-select: none;\n\t\tpadding: 0 0.25rem;\n\t}\n\t::slotted(schmancy-breadcrumb-item:last-of-type) {\n\t\tfont-weight: 500;\n\t}\n`) {\n\t@property({ type: String }) separator = '/'\n\n\tconnectedCallback(): void {\n\t\tsuper.connectedCallback()\n\t\tif (!this.hasAttribute('aria-label')) this.setAttribute('aria-label', 'Breadcrumb')\n\t}\n\n\trender() {\n\t\t// Render separators between slotted items by manipulating after render.\n\t\t// The simpler approach uses the CSS adjacent-sibling pattern so the\n\t\t// separator is visually present without affecting the accessible name.\n\t\treturn html`\n\t\t\t<nav role=\"navigation\">\n\t\t\t\t<slot @slotchange=${() => this._insertSeparators()}></slot>\n\t\t\t</nav>\n\t\t`\n\t}\n\n\tprivate _insertSeparators() {\n\t\tconst slot = this.shadowRoot?.querySelector('slot') as HTMLSlotElement | null\n\t\tif (!slot) return\n\t\tconst items = slot.assignedElements({ flatten: true })\n\t\t// Remove any previously-inserted separators.\n\t\tthis.querySelectorAll('[data-schmancy-sep]').forEach(el => el.remove())\n\t\titems.forEach((el, idx) => {\n\t\t\tif (idx === items.length - 1) return\n\t\t\tconst sep = document.createElement('span')\n\t\t\tsep.setAttribute('data-schmancy-sep', '')\n\t\t\tsep.setAttribute('aria-hidden', 'true')\n\t\t\tsep.setAttribute('part', 'separator')\n\t\t\tsep.className = 'sep'\n\t\t\tsep.textContent = this.separator\n\t\t\tel.insertAdjacentElement('afterend', sep)\n\t\t})\n\t}\n}\n\n/**\n * Single segment in a schmancy-breadcrumb trail a link when `href` is set, or a plain span (the current page) when omitted.\n *\n * @element schmancy-breadcrumb-item\n * @summary Always nested inside schmancy-breadcrumb. Omit `href` on the current page — it gets aria-current=\"page\" automatically.\n * @example\n * <schmancy-breadcrumb-item href=\"/products\">Products</schmancy-breadcrumb-item>\n * @platform a - Renders an `<a>` or `<span>` depending on href. Degrades to a plain anchor/span if the tag never registers.\n * @slot - Label content.\n * @attr href - If set, renders as an anchor.\n * @attr current - Marks as `aria-current=\"page\"`.\n */\n@customElement('schmancy-breadcrumb-item')\nexport class SchmancyBreadcrumbItem extends TailwindElement(css`\n\t:host {\n\t\tdisplay: inline-block;\n\t}\n\ta, span {\n\t\tcolor: inherit;\n\t\ttext-decoration: none;\n\t}\n\ta:hover {\n\t\ttext-decoration: underline;\n\t}\n`) {\n\t@property({ type: String }) href = ''\n\t@property({ type: Boolean, reflect: true }) current = false\n\n\trender() {\n\t\tif (this.href && !this.current) {\n\t\t\treturn html`<a href=${this.href}><slot></slot></a>`\n\t\t}\n\t\treturn html`<span aria-current=${this.current ? 'page' : 'false'}><slot></slot></span>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-breadcrumb': SchmancyBreadcrumb\n\t\t'schmancy-breadcrumb-item': SchmancyBreadcrumbItem\n\t}\n}\n"],"mappings":";;;;;AAqBO,IAAA,IAAA,cAAiC,EAAgB,CAAG;;;;;;;;;;;;;;;;;;;;gCAmBlB;;CAExC,oBAAA;AACC,QAAM,mBAAA,EACD,KAAK,aAAa,aAAA,IAAe,KAAK,aAAa,cAAc,aAAA;;CAGvE,SAAA;AAIC,SAAO,CAAI;;8BAEiB,KAAK,mBAAA,CAAA;;;;CAKlC,oBAAA;EACC,IAAM,IAAO,KAAK,YAAY,cAAc,OAAA;AAC5C,MAAA,CAAK,EAAM;EACX,IAAM,IAAQ,EAAK,iBAAiB,EAAE,SAAA,CAAS,GAAA,CAAA;AAE/C,OAAK,iBAAiB,sBAAA,CAAuB,SAAQ,MAAM,EAAG,QAAA,CAAA,EAC9D,EAAM,SAAS,GAAI,MAAA;AAClB,OAAI,MAAQ,EAAM,SAAS,EAAG;GAC9B,IAAM,IAAM,SAAS,cAAc,OAAA;AACnC,KAAI,aAAa,qBAAqB,GAAA,EACtC,EAAI,aAAa,eAAe,OAAA,EAChC,EAAI,aAAa,QAAQ,YAAA,EACzB,EAAI,YAAY,OAChB,EAAI,cAAc,KAAK,WACvB,EAAG,sBAAsB,YAAY,EAAA;IAAA;;;AAAA,EAAA,CAhCtC,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,EAAS,EAAA,WAAA,aAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CApB3B,EAAc,sBAAA,CAAA,EAAsB,EAAA;AAsE9B,IAAA,IAAA,cAAqC,EAAgB,CAAG;;;;;;;;;;;;;2BAY3B,IAAA,KAAA,UAAA,CACmB;;CAEtD,SAAA;AACC,SAAI,KAAK,QAAA,CAAS,KAAK,UACf,CAAI,WAAW,KAAK,KAAA,sBAErB,CAAI,sBAAsB,KAAK,UAAU,SAAS,QAAA;;;AAAA,EAAA,CAPzD,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,EAAS,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAC1B,EAAS;CAAE,MAAM;CAAS,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,WAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CAd3C,EAAc,2BAAA,CAAA,EAA2B,EAAA;AAAA,SAAA,KAAA,oBAAA,KAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"card-BslSqOsf.cjs","names":[],"sources":["../src/card/actions.ts","../src/card/card.ts","../src/card/content.ts","../src/card/media.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-action\n * @slot - The content of the action\n */\n@customElement('schmancy-card-action')\nexport default class SchmancyCardAction extends TailwindElement(css`\n\t:host {\n\t\tdisplay: flex;\n\t\tgap: 0.5rem;\n\t\tpadding: 0.5rem 1rem;\n\t\talign-items: center;\n\t\tjustify-content: flex-end;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-action': SchmancyCardAction\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\n@customElement('schmancy-card')\nexport default class SchmancyCard extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tborder-radius: var(--schmancy-sys-shape-corner-medium);\n\t\ttransition:\n\t\t\tbox-shadow var(--schmancy-sys-motion-duration-short4) var(--schmancy-sys-motion-easing-standard),\n\t\t\ttransform 300ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t\toutline: none;\n\t}\n\n\t/* Type variants */\n\t:host([type='elevated']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-low);\n\t\tbox-shadow: var(--schmancy-sys-elevation-1);\n\t}\n\t:host([type='filled']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-highest);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\t:host([type='outlined']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-default);\n\t\tborder: 1px solid var(--schmancy-sys-color-outlineVariant);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\n\t/* Interactive states */\n\t:host([interactive]) {\n\t\tcursor: pointer;\n\t\t-webkit-tap-highlight-color: transparent;\n\t}\n\t:host([interactive]:focus-visible:not([disabled])) {\n\t\toutline: 2px solid var(--schmancy-sys-color-primary-default);\n\t\toutline-offset: 2px;\n\t}\n\t:host([disabled]) {\n\t\tpointer-events: none;\n\t\topacity: var(--schmancy-sys-state-disabled-opacity);\n\t}\n\n\t/* Hover elevations — luminous glow + lift */\n\t:host([type='elevated'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-2),\n\t\t\t0 4px 24px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 12%, transparent);\n\t\ttransform: translateY(-2px);\n\t}\n\t:host([type='filled'][interactive]:hover:not([disabled])),\n\t:host([type='outlined'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-1),\n\t\t\t0 4px 20px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 10%, transparent);\n\t\ttransform: translateY(-1px);\n\t}\n\n\t/* Active state — kinetic compress */\n\t:host([interactive]:active:not([disabled])) {\n\t\ttransform: scale(0.98);\n\t\ttransition-duration: 100ms;\n\t}\n\n\t/* Dragged state */\n\t:host([dragged]) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-3),\n\t\t\t0 8px 32px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t\ttransform: translateY(-4px);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host([interactive]:hover:not([disabled])),\n\t\t:host([interactive]:active:not([disabled])),\n\t\t:host([dragged]) {\n\t\t\ttransform: none;\n\t\t}\n\t}\n\n\t@keyframes ripple {\n\t\tto {\n\t\t\ttransform: scale(4);\n\t\t\topacity: 0;\n\t\t}\n\t}\n`) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t/**\n\t * The visual style of the card.\n\t * @default 'elevated'\n\t */\n\t@property({ reflect: true })\n\ttype: 'elevated' | 'filled' | 'outlined' = 'elevated'\n\n\t/**\n\t * Makes the card interactive (clickable).\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tinteractive = false\n\n\t/**\n\t * Disables the card.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled = false\n\n\t/**\n\t * Indicates the card is being dragged.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdragged = false\n\n\t/**\n\t * URL to navigate to when card is clicked (makes it act like a link).\n\t */\n\t@property()\n\thref?: string\n\n\t/**\n\t * Target for the link navigation.\n\t */\n\t@property()\n\ttarget?: string\n\n\t/**\n\t * ARIA role for accessibility.\n\t */\n\t@property({ attribute: 'role' })\n\toverride role = 'article'\n\n\t/**\n\t * ARIA label for accessibility.\n\t */\n\t@property({ attribute: 'aria-label' })\n\toverride ariaLabel: string = ''\n\n\t// Internal state for interaction feedback\n\t@state() pressed = false\n\t@state() private ripples: Array<{ x: number; y: number; id: number }> = []\n\n\tprivate nextRippleId = 0\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis._updateAriaAttributes()\n\t}\n\n\tupdated(changedProperties: Map<string, any>) {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('interactive') || changedProperties.has('disabled')) {\n\t\t\tthis._updateAriaAttributes()\n\t\t}\n\t}\n\n\t// Consolidate ARIA attribute updates\n\tprivate _updateAriaAttributes() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\tif (isInteractive) {\n\t\t\tthis.setAttribute('tabindex', '0')\n\t\t\tif (!this.role || this.role === 'article') {\n\t\t\t\tthis.role = this.href ? 'link' : 'button'\n\t\t\t}\n\t\t} else {\n\t\t\tthis.removeAttribute('tabindex')\n\t\t\tif (this.role === 'button' || this.role === 'link') {\n\t\t\t\tthis.role = 'article'\n\t\t\t}\n\t\t}\n\t}\n\n\t// Shared ripple creation logic\n\tprivate _addRipple(x: number, y: number) {\n\t\tconst id = this.nextRippleId++\n\t\tthis.ripples = [...this.ripples, { x, y, id }]\n\n\t\t// Remove ripple after animation completes\n\t\tsetTimeout(() => {\n\t\t\tthis.ripples = this.ripples.filter(r => r.id !== id)\n\t\t}, 600) // M3 medium duration\n\t}\n\n\t// Shared navigation logic\n\tprivate _navigate() {\n\t\tif (!this.href) return\n\n\t\tif (this.target === '_blank') {\n\t\t\twindow.open(this.href, '_blank')\n\t\t} else {\n\t\t\twindow.location.href = this.href\n\t\t}\n\t}\n\n\t// Combined action trigger (ripple + navigate + event)\n\tprivate _triggerAction(x: number, y: number) {\n\t\tthis._addRipple(x, y)\n\t\tthis._navigate()\n\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('schmancy-click', {\n\t\t\t\tdetail: { value: this.type },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate handleClick = (e: MouseEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tconst rect = this.getBoundingClientRect()\n\t\tthis._triggerAction(e.clientX - rect.left, e.clientY - rect.top)\n\t}\n\n\tprivate handleKeyDown = (e: KeyboardEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\te.preventDefault()\n\t\t\tthis._setPressed(true)\n\n\t\t\t// Simulate click at center\n\t\t\tconst rect = this.getBoundingClientRect()\n\t\t\tthis._triggerAction(rect.width / 2, rect.height / 2)\n\t\t}\n\t}\n\n\tprivate handleKeyUp = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\tthis._setPressed(false)\n\t\t}\n\t}\n\n\t// Consolidate pressed state management\n\tprivate _setPressed(pressed: boolean) {\n\t\tthis.pressed = pressed\n\t\tif (pressed) {\n\t\t\tthis.setAttribute('pressed', '')\n\t\t} else {\n\t\t\tthis.removeAttribute('pressed')\n\t\t}\n\t}\n\n\tprivate handleMouseDown = () => {\n\t\tif (this.disabled || !this.interactive) return\n\t\tthis._setPressed(true)\n\t}\n\n\tprivate handleMouseUp = () => this._setPressed(false)\n\tprivate handleMouseLeave = () => this._setPressed(false)\n\n\tprotected render() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\t${isInteractive ? cursorGlow({ radius: 200, intensity: 0.1 }) : ''}\n\t\t\t\tclass=\"relative w-full h-full rounded-xl ${isInteractive ? 'cursor-pointer' : ''}\"\n\t\t\t\t@click=${this.handleClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\t@keyup=${this.handleKeyUp}\n\t\t\t\t@mousedown=${this.handleMouseDown}\n\t\t\t\t@mouseup=${this.handleMouseUp}\n\t\t\t\t@mouseleave=${this.handleMouseLeave}\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\taria-disabled=${this.disabled ? 'true' : 'false'}\n\t\t\t>\n\t\t\t\t<!-- State layer -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"absolute inset-0 rounded-xl pointer-events-none transition-opacity duration-200 bg-surface-on ${!isInteractive\n\t\t\t\t\t\t? 'opacity-0'\n\t\t\t\t\t\t: this.pressed\n\t\t\t\t\t\t\t? 'opacity-[var(--schmancy-sys-state-pressed-opacity)]'\n\t\t\t\t\t\t\t: 'opacity-0 hover:opacity-[var(--schmancy-sys-state-hover-opacity)] focus-visible:opacity-[var(--schmancy-sys-state-focus-opacity)]'}\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- Ripples -->\n\t\t\t\t${this.interactive && this.ripples.length\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<div class=\"absolute inset-0 rounded-xl overflow-hidden pointer-events-none\">\n\t\t\t\t\t\t\t\t${this.ripples.map(\n\t\t\t\t\t\t\t\t\tr => html`\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"absolute rounded-full scale-0 animate-[ripple_600ms_linear] bg-surface-on opacity-[0.12] w-5 h-5 -ml-2.5 -mt-2.5\"\n\t\t\t\t\t\t\t\t\t\t\tstyle=\"left: ${r.x}px; top: ${r.y}px\"\n\t\t\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t`\n\t\t\t\t\t: ''}\n\n\t\t\t\t<!-- Content -->\n\t\t\t\t<div class=\"relative h-full w-full rounded-xl\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card': SchmancyCard\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-content\n */\n@customElement('schmancy-card-content')\nexport default class SchmancyCardContent extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tpadding: 1rem;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-content': SchmancyCardContent\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-media\n */\n@customElement('schmancy-card-media')\nexport default class SchmancyCardMedia extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\theight: 200px;\n\t\toverflow: hidden;\n\t}\n\t\n\t/* Allow height to be overridden when used in flex/grid layouts */\n\t:host-context(.h-full) {\n\t\theight: 100%;\n\t}\n\t\n\t::slotted(img),\n\timg {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tobject-position: center;\n\t}\n\t\n\t/* Object fit styles based on fit attribute */\n\t:host([fit=\"contain\"]) img,\n\t:host([fit=\"contain\"]) ::slotted(img) {\n\t\tobject-fit: contain;\n\t}\n\t\n\t:host([fit=\"cover\"]) img,\n\t:host([fit=\"cover\"]) ::slotted(img) {\n\t\tobject-fit: cover;\n\t}\n\t\n\t:host([fit=\"fill\"]) img,\n\t:host([fit=\"fill\"]) ::slotted(img) {\n\t\tobject-fit: fill;\n\t}\n\t\n\t:host([fit=\"none\"]) img,\n\t:host([fit=\"none\"]) ::slotted(img) {\n\t\tobject-fit: none;\n\t}\n\t\n\t:host([fit=\"scale-down\"]) img,\n\t:host([fit=\"scale-down\"]) ::slotted(img) {\n\t\tobject-fit: scale-down;\n\t}\n`) {\n\t@property({ type: String, reflect: true })\n\tsrc: string = ''\n\n\t@property({ type: String, reflect: true })\n\tfit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' = 'contain'\n\t\n\t@property({ type: String })\n\talt: string = ''\n\n\tprotected render(): unknown {\n\t\t// If src is provided, render an img element\n\t\t// Otherwise, allow users to slot their own content\n\t\treturn this.src \n\t\t\t? html`<img src=\"${this.src}\" alt=\"${this.alt}\" />` \n\t\t\t: html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-media': SchmancyCardMedia\n\t}\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"card-BslSqOsf.cjs","names":[],"sources":["../src/card/actions.ts","../src/card/card.ts","../src/card/content.ts","../src/card/media.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * Action row of a schmancy-card — holds the card's buttons / links (typically aligned bottom-right).\n *\n * @element schmancy-card-action\n * @summary Always nested inside schmancy-card. Holds the primary + secondary CTAs for the card.\n * @example\n * <schmancy-card-action>\n * <schmancy-button variant=\"text\">Cancel</schmancy-button>\n * <schmancy-button variant=\"filled\">Save</schmancy-button>\n * </schmancy-card-action>\n * @platform div - Styled flex container. Degrades to a plain div if the tag never registers.\n * @slot - The content of the action\n */\n@customElement('schmancy-card-action')\nexport default class SchmancyCardAction extends TailwindElement(css`\n\t:host {\n\t\tdisplay: flex;\n\t\tgap: 0.5rem;\n\t\tpadding: 0.5rem 1rem;\n\t\talign-items: center;\n\t\tjustify-content: flex-end;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-action': SchmancyCardAction\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\n/**\n * Material Design card — a surface-level container for grouping related content with media / content / actions slots.\n *\n * @element schmancy-card\n * @summary Use for discrete pieces of content that appear in a list (a product, a note, a message). Combine with schmancy-card-media / schmancy-card-content / schmancy-card-action children.\n * @example\n * <schmancy-card type=\"elevated\" href=\"/items/42\">\n * <schmancy-card-media src=\"/thumb.jpg\" alt=\"Thumbnail\"></schmancy-card-media>\n * <schmancy-card-content>\n * <h3>Title</h3>\n * <p>One-line description of the card's content.</p>\n * </schmancy-card-content>\n * <schmancy-card-action>\n * <schmancy-button variant=\"text\">Open</schmancy-button>\n * </schmancy-card-action>\n * </schmancy-card>\n * @platform div - Styled `<div>`; becomes an `<a>` when `href` is set so the whole card is a single interactive surface. Degrades to a plain div/a if the tag never registers.\n */\n@customElement('schmancy-card')\nexport default class SchmancyCard extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tborder-radius: var(--schmancy-sys-shape-corner-medium);\n\t\ttransition:\n\t\t\tbox-shadow var(--schmancy-sys-motion-duration-short4) var(--schmancy-sys-motion-easing-standard),\n\t\t\ttransform 300ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t\toutline: none;\n\t}\n\n\t/* Type variants */\n\t:host([type='elevated']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-low);\n\t\tbox-shadow: var(--schmancy-sys-elevation-1);\n\t}\n\t:host([type='filled']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-highest);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\t:host([type='outlined']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-default);\n\t\tborder: 1px solid var(--schmancy-sys-color-outlineVariant);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\n\t/* Interactive states */\n\t:host([interactive]) {\n\t\tcursor: pointer;\n\t\t-webkit-tap-highlight-color: transparent;\n\t}\n\t:host([interactive]:focus-visible:not([disabled])) {\n\t\toutline: 2px solid var(--schmancy-sys-color-primary-default);\n\t\toutline-offset: 2px;\n\t}\n\t:host([disabled]) {\n\t\tpointer-events: none;\n\t\topacity: var(--schmancy-sys-state-disabled-opacity);\n\t}\n\n\t/* Hover elevations — luminous glow + lift */\n\t:host([type='elevated'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-2),\n\t\t\t0 4px 24px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 12%, transparent);\n\t\ttransform: translateY(-2px);\n\t}\n\t:host([type='filled'][interactive]:hover:not([disabled])),\n\t:host([type='outlined'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-1),\n\t\t\t0 4px 20px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 10%, transparent);\n\t\ttransform: translateY(-1px);\n\t}\n\n\t/* Active state — kinetic compress */\n\t:host([interactive]:active:not([disabled])) {\n\t\ttransform: scale(0.98);\n\t\ttransition-duration: 100ms;\n\t}\n\n\t/* Dragged state */\n\t:host([dragged]) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-3),\n\t\t\t0 8px 32px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t\ttransform: translateY(-4px);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host([interactive]:hover:not([disabled])),\n\t\t:host([interactive]:active:not([disabled])),\n\t\t:host([dragged]) {\n\t\t\ttransform: none;\n\t\t}\n\t}\n\n\t@keyframes ripple {\n\t\tto {\n\t\t\ttransform: scale(4);\n\t\t\topacity: 0;\n\t\t}\n\t}\n`) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t/**\n\t * The visual style of the card.\n\t * @default 'elevated'\n\t */\n\t@property({ reflect: true })\n\ttype: 'elevated' | 'filled' | 'outlined' = 'elevated'\n\n\t/**\n\t * Makes the card interactive (clickable).\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tinteractive = false\n\n\t/**\n\t * Disables the card.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled = false\n\n\t/**\n\t * Indicates the card is being dragged.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdragged = false\n\n\t/**\n\t * URL to navigate to when card is clicked (makes it act like a link).\n\t */\n\t@property()\n\thref?: string\n\n\t/**\n\t * Target for the link navigation.\n\t */\n\t@property()\n\ttarget?: string\n\n\t/**\n\t * ARIA role for accessibility.\n\t */\n\t@property({ attribute: 'role' })\n\toverride role = 'article'\n\n\t/**\n\t * ARIA label for accessibility.\n\t */\n\t@property({ attribute: 'aria-label' })\n\toverride ariaLabel: string = ''\n\n\t// Internal state for interaction feedback\n\t@state() pressed = false\n\t@state() private ripples: Array<{ x: number; y: number; id: number }> = []\n\n\tprivate nextRippleId = 0\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis._updateAriaAttributes()\n\t}\n\n\tupdated(changedProperties: Map<string, any>) {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('interactive') || changedProperties.has('disabled')) {\n\t\t\tthis._updateAriaAttributes()\n\t\t}\n\t}\n\n\t// Consolidate ARIA attribute updates\n\tprivate _updateAriaAttributes() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\tif (isInteractive) {\n\t\t\tthis.setAttribute('tabindex', '0')\n\t\t\tif (!this.role || this.role === 'article') {\n\t\t\t\tthis.role = this.href ? 'link' : 'button'\n\t\t\t}\n\t\t} else {\n\t\t\tthis.removeAttribute('tabindex')\n\t\t\tif (this.role === 'button' || this.role === 'link') {\n\t\t\t\tthis.role = 'article'\n\t\t\t}\n\t\t}\n\t}\n\n\t// Shared ripple creation logic\n\tprivate _addRipple(x: number, y: number) {\n\t\tconst id = this.nextRippleId++\n\t\tthis.ripples = [...this.ripples, { x, y, id }]\n\n\t\t// Remove ripple after animation completes\n\t\tsetTimeout(() => {\n\t\t\tthis.ripples = this.ripples.filter(r => r.id !== id)\n\t\t}, 600) // M3 medium duration\n\t}\n\n\t// Shared navigation logic\n\tprivate _navigate() {\n\t\tif (!this.href) return\n\n\t\tif (this.target === '_blank') {\n\t\t\twindow.open(this.href, '_blank')\n\t\t} else {\n\t\t\twindow.location.href = this.href\n\t\t}\n\t}\n\n\t// Combined action trigger (ripple + navigate + event)\n\tprivate _triggerAction(x: number, y: number) {\n\t\tthis._addRipple(x, y)\n\t\tthis._navigate()\n\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('schmancy-click', {\n\t\t\t\tdetail: { value: this.type },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate handleClick = (e: MouseEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tconst rect = this.getBoundingClientRect()\n\t\tthis._triggerAction(e.clientX - rect.left, e.clientY - rect.top)\n\t}\n\n\tprivate handleKeyDown = (e: KeyboardEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\te.preventDefault()\n\t\t\tthis._setPressed(true)\n\n\t\t\t// Simulate click at center\n\t\t\tconst rect = this.getBoundingClientRect()\n\t\t\tthis._triggerAction(rect.width / 2, rect.height / 2)\n\t\t}\n\t}\n\n\tprivate handleKeyUp = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\tthis._setPressed(false)\n\t\t}\n\t}\n\n\t// Consolidate pressed state management\n\tprivate _setPressed(pressed: boolean) {\n\t\tthis.pressed = pressed\n\t\tif (pressed) {\n\t\t\tthis.setAttribute('pressed', '')\n\t\t} else {\n\t\t\tthis.removeAttribute('pressed')\n\t\t}\n\t}\n\n\tprivate handleMouseDown = () => {\n\t\tif (this.disabled || !this.interactive) return\n\t\tthis._setPressed(true)\n\t}\n\n\tprivate handleMouseUp = () => this._setPressed(false)\n\tprivate handleMouseLeave = () => this._setPressed(false)\n\n\tprotected render() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\t${isInteractive ? cursorGlow({ radius: 200, intensity: 0.1 }) : ''}\n\t\t\t\tclass=\"relative w-full h-full rounded-xl ${isInteractive ? 'cursor-pointer' : ''}\"\n\t\t\t\t@click=${this.handleClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\t@keyup=${this.handleKeyUp}\n\t\t\t\t@mousedown=${this.handleMouseDown}\n\t\t\t\t@mouseup=${this.handleMouseUp}\n\t\t\t\t@mouseleave=${this.handleMouseLeave}\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\taria-disabled=${this.disabled ? 'true' : 'false'}\n\t\t\t>\n\t\t\t\t<!-- State layer -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"absolute inset-0 rounded-xl pointer-events-none transition-opacity duration-200 bg-surface-on ${!isInteractive\n\t\t\t\t\t\t? 'opacity-0'\n\t\t\t\t\t\t: this.pressed\n\t\t\t\t\t\t\t? 'opacity-[var(--schmancy-sys-state-pressed-opacity)]'\n\t\t\t\t\t\t\t: 'opacity-0 hover:opacity-[var(--schmancy-sys-state-hover-opacity)] focus-visible:opacity-[var(--schmancy-sys-state-focus-opacity)]'}\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- Ripples -->\n\t\t\t\t${this.interactive && this.ripples.length\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<div class=\"absolute inset-0 rounded-xl overflow-hidden pointer-events-none\">\n\t\t\t\t\t\t\t\t${this.ripples.map(\n\t\t\t\t\t\t\t\t\tr => html`\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"absolute rounded-full scale-0 animate-[ripple_600ms_linear] bg-surface-on opacity-[0.12] w-5 h-5 -ml-2.5 -mt-2.5\"\n\t\t\t\t\t\t\t\t\t\t\tstyle=\"left: ${r.x}px; top: ${r.y}px\"\n\t\t\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t`\n\t\t\t\t\t: ''}\n\n\t\t\t\t<!-- Content -->\n\t\t\t\t<div class=\"relative h-full w-full rounded-xl\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card': SchmancyCard\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * Content region of a schmancy-card — holds the card's headline, supporting text, and inline controls.\n *\n * @element schmancy-card-content\n * @summary Always nested inside schmancy-card. The padded content block between the media and action rows.\n * @example\n * <schmancy-card-content>\n * <h3>Card title</h3>\n * <p>Supporting text that describes the card's subject.</p>\n * </schmancy-card-content>\n * @platform div - Styled `<div>` with padding. Degrades to a plain div if the tag never registers.\n */\n@customElement('schmancy-card-content')\nexport default class SchmancyCardContent extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tpadding: 1rem;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-content': SchmancyCardContent\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * Media region of a schmancy-card — the image / thumbnail at the top of the card.\n *\n * @element schmancy-card-media\n * @summary Always nested inside schmancy-card. Pass `src` + `alt` props or slot an `<img>` / `<video>` for custom media.\n * @example\n * <schmancy-card-media src=\"/thumb.jpg\" alt=\"Product photo\"></schmancy-card-media>\n * @platform img - Renders an `<img>` (or wraps a slotted media element). Degrades to a styled `<img>` if the tag never registers.\n */\n@customElement('schmancy-card-media')\nexport default class SchmancyCardMedia extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\theight: 200px;\n\t\toverflow: hidden;\n\t}\n\t\n\t/* Allow height to be overridden when used in flex/grid layouts */\n\t:host-context(.h-full) {\n\t\theight: 100%;\n\t}\n\t\n\t::slotted(img),\n\timg {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tobject-position: center;\n\t}\n\t\n\t/* Object fit styles based on fit attribute */\n\t:host([fit=\"contain\"]) img,\n\t:host([fit=\"contain\"]) ::slotted(img) {\n\t\tobject-fit: contain;\n\t}\n\t\n\t:host([fit=\"cover\"]) img,\n\t:host([fit=\"cover\"]) ::slotted(img) {\n\t\tobject-fit: cover;\n\t}\n\t\n\t:host([fit=\"fill\"]) img,\n\t:host([fit=\"fill\"]) ::slotted(img) {\n\t\tobject-fit: fill;\n\t}\n\t\n\t:host([fit=\"none\"]) img,\n\t:host([fit=\"none\"]) ::slotted(img) {\n\t\tobject-fit: none;\n\t}\n\t\n\t:host([fit=\"scale-down\"]) img,\n\t:host([fit=\"scale-down\"]) ::slotted(img) {\n\t\tobject-fit: scale-down;\n\t}\n`) {\n\t@property({ type: String, reflect: true })\n\tsrc: string = ''\n\n\t@property({ type: String, reflect: true })\n\tfit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' = 'contain'\n\t\n\t@property({ type: String })\n\talt: string = ''\n\n\tprotected render(): unknown {\n\t\t// If src is provided, render an img element\n\t\t// Otherwise, allow users to slot their own content\n\t\treturn this.src \n\t\t\t? html`<img src=\"${this.src}\" alt=\"${this.alt}\" />` \n\t\t\t: html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-media': SchmancyCardMedia\n\t}\n}\n"],"mappings":"0RAkBe,IAAA,EAAA,cAAiC,EAAA,EAAgB,EAAA,GAAG;;;;;;;;GASlE,QAAA,CACC,MAAO,GAAA,IAAI,kBAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eAXE,uBAAA,CAAA,CAAuB,EAAA,CCQvB,IAAA,EAAA,cAA2B,EAAA,EAAgB,EAAA,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CA+FjB,WAAA,KAAA,YAAA,CAO7B,EAAA,KAAA,SAAA,CAOH,EAAA,KAAA,QAAA,CAOD,EAAA,KAAA,KAkBM,UAAA,KAAA,UAMa,GAAA,KAAA,QAAA,CAGV,EAAA,KAAA,QACqD,EAAA,CAAA,KAAA,aAEjD,EAAA,KAAA,YAmEA,GAAA,CACtB,GAAI,KAAK,UAAA,CAAa,KAAK,YAAa,OAExC,IAAM,EAAO,KAAK,uBAAA,CAClB,KAAK,eAAe,EAAE,QAAU,EAAK,KAAM,EAAE,QAAU,EAAK,IAAA,EAAA,KAAA,cAGpC,GAAA,CACxB,GAAA,CAAI,KAAK,UAAa,KAAK,cAEvB,EAAE,MAAQ,SAAW,EAAE,MAAQ,KAAK,CACvC,EAAE,gBAAA,CACF,KAAK,YAAA,CAAY,EAAA,CAGjB,IAAM,EAAO,KAAK,uBAAA,CAClB,KAAK,eAAe,EAAK,MAAQ,EAAG,EAAK,OAAS,EAAA,GAAA,KAAA,YAI7B,GAAA,CAClB,EAAE,MAAQ,SAAW,EAAE,MAAQ,KAClC,KAAK,YAAA,CAAY,EAAA,EAAA,KAAA,oBAAA,CAAA,CAed,KAAK,UAAa,KAAK,aAC3B,KAAK,YAAA,CAAY,EAAA,EAAA,KAAA,kBAGY,KAAK,YAAA,CAAY,EAAA,CAAA,KAAA,qBACd,KAAK,YAAA,CAAY,EAAA,CAAA,OAAA,KAAA,kBA3Kb,CAAA,GACjC,EAAA,WAAW,kBACd,KAAM,OACN,eAAA,CAAgB,EAAA,CA6DjB,mBAAA,CACC,MAAM,mBAAA,CACN,KAAK,uBAAA,CAGN,QAAQ,EAAA,CACP,MAAM,QAAQ,EAAA,EACV,EAAkB,IAAI,cAAA,EAAkB,EAAkB,IAAI,WAAA,GACjE,KAAK,uBAAA,CAKP,uBAAA,CACuB,KAAK,aAAA,CAAgB,KAAK,UAG/C,KAAK,aAAa,WAAY,IAAA,CACzB,KAAK,MAAQ,KAAK,OAAS,YAC/B,KAAK,KAAO,KAAK,KAAO,OAAS,YAGlC,KAAK,gBAAgB,WAAA,CACjB,KAAK,OAAS,UAAY,KAAK,OAAS,SAC3C,KAAK,KAAO,YAMf,WAAmB,EAAW,EAAA,CAC7B,IAAM,EAAK,KAAK,eAChB,KAAK,QAAU,CAAA,GAAI,KAAK,QAAS,CAAE,EAAA,EAAG,EAAA,EAAG,GAAA,EAAA,CAAA,CAGzC,eAAA,CACC,KAAK,QAAU,KAAK,QAAQ,OAAO,GAAK,EAAE,KAAO,EAAA,EAC/C,IAAA,CAIJ,WAAA,CACM,KAAK,OAEN,KAAK,SAAW,SACnB,OAAO,KAAK,KAAK,KAAM,SAAA,CAEvB,OAAO,SAAS,KAAO,KAAK,MAK9B,eAAuB,EAAW,EAAA,CACjC,KAAK,WAAW,EAAG,EAAA,CACnB,KAAK,WAAA,CAEL,KAAK,cACJ,IAAI,YAAY,iBAAkB,CACjC,OAAQ,CAAE,MAAO,KAAK,KAAA,CACtB,QAAA,CAAS,EACT,SAAA,CAAU,EAAA,CAAA,CAAA,CAgCb,YAAoB,EAAA,CACnB,KAAK,QAAU,EACX,EACH,KAAK,aAAa,UAAW,GAAA,CAE7B,KAAK,gBAAgB,UAAA,CAYvB,QAAA,CACC,IAAM,EAAgB,KAAK,aAAA,CAAgB,KAAK,SAEhD,MAAO,GAAA,IAAI;;MAEP,EAAgB,EAAA,EAAW,CAAE,OAAQ,IAAK,UAAW,GAAA,CAAA,CAAS,GAAA;+CACrB,EAAgB,iBAAmB,GAAA;aACrE,KAAK,YAAA;eACH,KAAK,cAAA;aACP,KAAK,YAAA;iBACD,KAAK,gBAAA;eACP,KAAK,cAAA;kBACF,KAAK,iBAAA;iCACI,KAAK,UAAA,CAAA;oBACZ,KAAK,SAAW,OAAS,QAAA;;;;4GAIgE,EAErG,KAAK,QACJ,sDACA,oIAHD,YAAA;;;;MAOF,KAAK,aAAe,KAAK,QAAQ,OAChC,EAAA,IAAI;;UAED,KAAK,QAAQ,IACd,GAAK,EAAA,IAAI;;;0BAGQ,EAAE,EAAA,WAAa,EAAE,EAAA;;;;QAMpC,GAAA;;;;;;;0BA1MI,CAAE,QAAA,CAAS,EAAA,CAAA,CAAA,CAAO,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAOlB,CAAE,KAAM,QAAS,QAAA,CAAS,EAAA,CAAA,CAAA,CAAO,EAAA,UAAA,cAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAOjC,CAAE,KAAM,QAAS,QAAA,CAAS,EAAA,CAAA,CAAA,CAAO,EAAA,UAAA,WAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAOjC,CAAE,KAAM,QAAS,QAAA,CAAS,EAAA,CAAA,CAAA,CAAO,EAAA,UAAA,UAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,WAAA,CAAA,CAMhC,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,WAAA,CAAA,CAMA,EAAA,UAAA,SAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAMD,CAAE,UAAW,OAAA,CAAA,CAAA,CAAS,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAMtB,CAAE,UAAW,aAAA,CAAA,CAAA,CAAe,EAAA,UAAA,YAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,QAAA,CAAA,CAI9B,EAAA,UAAA,UAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,QAAA,CAAA,CACA,EAAA,UAAA,UAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eAjJM,gBAAA,CAAA,CAAgB,EAAA,CCPhB,IAAA,EAAA,cAAkC,EAAA,EAAgB,EAAA,GAAG;;;;;GAMnE,QAAA,CACC,MAAO,GAAA,IAAI,kBAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eARE,wBAAA,CAAA,CAAwB,EAAA,CCFxB,IAAA,EAAA,cAAgC,EAAA,EAAgB,EAAA,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0CA+CnD,GAAA,KAAA,IAG8C,UAAA,KAAA,IAG9C,GAEd,QAAA,CAGC,OAAO,KAAK,IACT,EAAA,IAAI,aAAa,KAAK,IAAA,SAAa,KAAK,IAAA,MACxC,EAAA,IAAI,kBAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAdE,CAAE,KAAM,OAAQ,QAAA,CAAS,EAAA,CAAA,CAAA,CAAO,EAAA,UAAA,MAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAGhC,CAAE,KAAM,OAAQ,QAAA,CAAS,EAAA,CAAA,CAAA,CAAO,EAAA,UAAA,MAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAGhC,CAAE,KAAM,OAAA,CAAA,CAAA,CAAS,EAAA,UAAA,MAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eArDb,sBAAA,CAAA,CAAsB,EAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"card-CEdgK9nb.js","names":[],"sources":["../src/card/actions.ts","../src/card/card.ts","../src/card/content.ts","../src/card/media.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-action\n * @slot - The content of the action\n */\n@customElement('schmancy-card-action')\nexport default class SchmancyCardAction extends TailwindElement(css`\n\t:host {\n\t\tdisplay: flex;\n\t\tgap: 0.5rem;\n\t\tpadding: 0.5rem 1rem;\n\t\talign-items: center;\n\t\tjustify-content: flex-end;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-action': SchmancyCardAction\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\n@customElement('schmancy-card')\nexport default class SchmancyCard extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tborder-radius: var(--schmancy-sys-shape-corner-medium);\n\t\ttransition:\n\t\t\tbox-shadow var(--schmancy-sys-motion-duration-short4) var(--schmancy-sys-motion-easing-standard),\n\t\t\ttransform 300ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t\toutline: none;\n\t}\n\n\t/* Type variants */\n\t:host([type='elevated']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-low);\n\t\tbox-shadow: var(--schmancy-sys-elevation-1);\n\t}\n\t:host([type='filled']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-highest);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\t:host([type='outlined']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-default);\n\t\tborder: 1px solid var(--schmancy-sys-color-outlineVariant);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\n\t/* Interactive states */\n\t:host([interactive]) {\n\t\tcursor: pointer;\n\t\t-webkit-tap-highlight-color: transparent;\n\t}\n\t:host([interactive]:focus-visible:not([disabled])) {\n\t\toutline: 2px solid var(--schmancy-sys-color-primary-default);\n\t\toutline-offset: 2px;\n\t}\n\t:host([disabled]) {\n\t\tpointer-events: none;\n\t\topacity: var(--schmancy-sys-state-disabled-opacity);\n\t}\n\n\t/* Hover elevations — luminous glow + lift */\n\t:host([type='elevated'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-2),\n\t\t\t0 4px 24px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 12%, transparent);\n\t\ttransform: translateY(-2px);\n\t}\n\t:host([type='filled'][interactive]:hover:not([disabled])),\n\t:host([type='outlined'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-1),\n\t\t\t0 4px 20px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 10%, transparent);\n\t\ttransform: translateY(-1px);\n\t}\n\n\t/* Active state — kinetic compress */\n\t:host([interactive]:active:not([disabled])) {\n\t\ttransform: scale(0.98);\n\t\ttransition-duration: 100ms;\n\t}\n\n\t/* Dragged state */\n\t:host([dragged]) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-3),\n\t\t\t0 8px 32px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t\ttransform: translateY(-4px);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host([interactive]:hover:not([disabled])),\n\t\t:host([interactive]:active:not([disabled])),\n\t\t:host([dragged]) {\n\t\t\ttransform: none;\n\t\t}\n\t}\n\n\t@keyframes ripple {\n\t\tto {\n\t\t\ttransform: scale(4);\n\t\t\topacity: 0;\n\t\t}\n\t}\n`) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t/**\n\t * The visual style of the card.\n\t * @default 'elevated'\n\t */\n\t@property({ reflect: true })\n\ttype: 'elevated' | 'filled' | 'outlined' = 'elevated'\n\n\t/**\n\t * Makes the card interactive (clickable).\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tinteractive = false\n\n\t/**\n\t * Disables the card.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled = false\n\n\t/**\n\t * Indicates the card is being dragged.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdragged = false\n\n\t/**\n\t * URL to navigate to when card is clicked (makes it act like a link).\n\t */\n\t@property()\n\thref?: string\n\n\t/**\n\t * Target for the link navigation.\n\t */\n\t@property()\n\ttarget?: string\n\n\t/**\n\t * ARIA role for accessibility.\n\t */\n\t@property({ attribute: 'role' })\n\toverride role = 'article'\n\n\t/**\n\t * ARIA label for accessibility.\n\t */\n\t@property({ attribute: 'aria-label' })\n\toverride ariaLabel: string = ''\n\n\t// Internal state for interaction feedback\n\t@state() pressed = false\n\t@state() private ripples: Array<{ x: number; y: number; id: number }> = []\n\n\tprivate nextRippleId = 0\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis._updateAriaAttributes()\n\t}\n\n\tupdated(changedProperties: Map<string, any>) {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('interactive') || changedProperties.has('disabled')) {\n\t\t\tthis._updateAriaAttributes()\n\t\t}\n\t}\n\n\t// Consolidate ARIA attribute updates\n\tprivate _updateAriaAttributes() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\tif (isInteractive) {\n\t\t\tthis.setAttribute('tabindex', '0')\n\t\t\tif (!this.role || this.role === 'article') {\n\t\t\t\tthis.role = this.href ? 'link' : 'button'\n\t\t\t}\n\t\t} else {\n\t\t\tthis.removeAttribute('tabindex')\n\t\t\tif (this.role === 'button' || this.role === 'link') {\n\t\t\t\tthis.role = 'article'\n\t\t\t}\n\t\t}\n\t}\n\n\t// Shared ripple creation logic\n\tprivate _addRipple(x: number, y: number) {\n\t\tconst id = this.nextRippleId++\n\t\tthis.ripples = [...this.ripples, { x, y, id }]\n\n\t\t// Remove ripple after animation completes\n\t\tsetTimeout(() => {\n\t\t\tthis.ripples = this.ripples.filter(r => r.id !== id)\n\t\t}, 600) // M3 medium duration\n\t}\n\n\t// Shared navigation logic\n\tprivate _navigate() {\n\t\tif (!this.href) return\n\n\t\tif (this.target === '_blank') {\n\t\t\twindow.open(this.href, '_blank')\n\t\t} else {\n\t\t\twindow.location.href = this.href\n\t\t}\n\t}\n\n\t// Combined action trigger (ripple + navigate + event)\n\tprivate _triggerAction(x: number, y: number) {\n\t\tthis._addRipple(x, y)\n\t\tthis._navigate()\n\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('schmancy-click', {\n\t\t\t\tdetail: { value: this.type },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate handleClick = (e: MouseEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tconst rect = this.getBoundingClientRect()\n\t\tthis._triggerAction(e.clientX - rect.left, e.clientY - rect.top)\n\t}\n\n\tprivate handleKeyDown = (e: KeyboardEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\te.preventDefault()\n\t\t\tthis._setPressed(true)\n\n\t\t\t// Simulate click at center\n\t\t\tconst rect = this.getBoundingClientRect()\n\t\t\tthis._triggerAction(rect.width / 2, rect.height / 2)\n\t\t}\n\t}\n\n\tprivate handleKeyUp = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\tthis._setPressed(false)\n\t\t}\n\t}\n\n\t// Consolidate pressed state management\n\tprivate _setPressed(pressed: boolean) {\n\t\tthis.pressed = pressed\n\t\tif (pressed) {\n\t\t\tthis.setAttribute('pressed', '')\n\t\t} else {\n\t\t\tthis.removeAttribute('pressed')\n\t\t}\n\t}\n\n\tprivate handleMouseDown = () => {\n\t\tif (this.disabled || !this.interactive) return\n\t\tthis._setPressed(true)\n\t}\n\n\tprivate handleMouseUp = () => this._setPressed(false)\n\tprivate handleMouseLeave = () => this._setPressed(false)\n\n\tprotected render() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\t${isInteractive ? cursorGlow({ radius: 200, intensity: 0.1 }) : ''}\n\t\t\t\tclass=\"relative w-full h-full rounded-xl ${isInteractive ? 'cursor-pointer' : ''}\"\n\t\t\t\t@click=${this.handleClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\t@keyup=${this.handleKeyUp}\n\t\t\t\t@mousedown=${this.handleMouseDown}\n\t\t\t\t@mouseup=${this.handleMouseUp}\n\t\t\t\t@mouseleave=${this.handleMouseLeave}\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\taria-disabled=${this.disabled ? 'true' : 'false'}\n\t\t\t>\n\t\t\t\t<!-- State layer -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"absolute inset-0 rounded-xl pointer-events-none transition-opacity duration-200 bg-surface-on ${!isInteractive\n\t\t\t\t\t\t? 'opacity-0'\n\t\t\t\t\t\t: this.pressed\n\t\t\t\t\t\t\t? 'opacity-[var(--schmancy-sys-state-pressed-opacity)]'\n\t\t\t\t\t\t\t: 'opacity-0 hover:opacity-[var(--schmancy-sys-state-hover-opacity)] focus-visible:opacity-[var(--schmancy-sys-state-focus-opacity)]'}\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- Ripples -->\n\t\t\t\t${this.interactive && this.ripples.length\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<div class=\"absolute inset-0 rounded-xl overflow-hidden pointer-events-none\">\n\t\t\t\t\t\t\t\t${this.ripples.map(\n\t\t\t\t\t\t\t\t\tr => html`\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"absolute rounded-full scale-0 animate-[ripple_600ms_linear] bg-surface-on opacity-[0.12] w-5 h-5 -ml-2.5 -mt-2.5\"\n\t\t\t\t\t\t\t\t\t\t\tstyle=\"left: ${r.x}px; top: ${r.y}px\"\n\t\t\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t`\n\t\t\t\t\t: ''}\n\n\t\t\t\t<!-- Content -->\n\t\t\t\t<div class=\"relative h-full w-full rounded-xl\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card': SchmancyCard\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-content\n */\n@customElement('schmancy-card-content')\nexport default class SchmancyCardContent extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tpadding: 1rem;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-content': SchmancyCardContent\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * @element schmancy-card-media\n */\n@customElement('schmancy-card-media')\nexport default class SchmancyCardMedia extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\theight: 200px;\n\t\toverflow: hidden;\n\t}\n\t\n\t/* Allow height to be overridden when used in flex/grid layouts */\n\t:host-context(.h-full) {\n\t\theight: 100%;\n\t}\n\t\n\t::slotted(img),\n\timg {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tobject-position: center;\n\t}\n\t\n\t/* Object fit styles based on fit attribute */\n\t:host([fit=\"contain\"]) img,\n\t:host([fit=\"contain\"]) ::slotted(img) {\n\t\tobject-fit: contain;\n\t}\n\t\n\t:host([fit=\"cover\"]) img,\n\t:host([fit=\"cover\"]) ::slotted(img) {\n\t\tobject-fit: cover;\n\t}\n\t\n\t:host([fit=\"fill\"]) img,\n\t:host([fit=\"fill\"]) ::slotted(img) {\n\t\tobject-fit: fill;\n\t}\n\t\n\t:host([fit=\"none\"]) img,\n\t:host([fit=\"none\"]) ::slotted(img) {\n\t\tobject-fit: none;\n\t}\n\t\n\t:host([fit=\"scale-down\"]) img,\n\t:host([fit=\"scale-down\"]) ::slotted(img) {\n\t\tobject-fit: scale-down;\n\t}\n`) {\n\t@property({ type: String, reflect: true })\n\tsrc: string = ''\n\n\t@property({ type: String, reflect: true })\n\tfit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' = 'contain'\n\t\n\t@property({ type: String })\n\talt: string = ''\n\n\tprotected render(): unknown {\n\t\t// If src is provided, render an img element\n\t\t// Otherwise, allow users to slot their own content\n\t\treturn this.src \n\t\t\t? html`<img src=\"${this.src}\" alt=\"${this.alt}\" />` \n\t\t\t: html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-media': SchmancyCardMedia\n\t}\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"card-CEdgK9nb.js","names":[],"sources":["../src/card/actions.ts","../src/card/card.ts","../src/card/content.ts","../src/card/media.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * Action row of a schmancy-card — holds the card's buttons / links (typically aligned bottom-right).\n *\n * @element schmancy-card-action\n * @summary Always nested inside schmancy-card. Holds the primary + secondary CTAs for the card.\n * @example\n * <schmancy-card-action>\n * <schmancy-button variant=\"text\">Cancel</schmancy-button>\n * <schmancy-button variant=\"filled\">Save</schmancy-button>\n * </schmancy-card-action>\n * @platform div - Styled flex container. Degrades to a plain div if the tag never registers.\n * @slot - The content of the action\n */\n@customElement('schmancy-card-action')\nexport default class SchmancyCardAction extends TailwindElement(css`\n\t:host {\n\t\tdisplay: flex;\n\t\tgap: 0.5rem;\n\t\tpadding: 0.5rem 1rem;\n\t\talign-items: center;\n\t\tjustify-content: flex-end;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-action': SchmancyCardAction\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\n/**\n * Material Design card — a surface-level container for grouping related content with media / content / actions slots.\n *\n * @element schmancy-card\n * @summary Use for discrete pieces of content that appear in a list (a product, a note, a message). Combine with schmancy-card-media / schmancy-card-content / schmancy-card-action children.\n * @example\n * <schmancy-card type=\"elevated\" href=\"/items/42\">\n * <schmancy-card-media src=\"/thumb.jpg\" alt=\"Thumbnail\"></schmancy-card-media>\n * <schmancy-card-content>\n * <h3>Title</h3>\n * <p>One-line description of the card's content.</p>\n * </schmancy-card-content>\n * <schmancy-card-action>\n * <schmancy-button variant=\"text\">Open</schmancy-button>\n * </schmancy-card-action>\n * </schmancy-card>\n * @platform div - Styled `<div>`; becomes an `<a>` when `href` is set so the whole card is a single interactive surface. Degrades to a plain div/a if the tag never registers.\n */\n@customElement('schmancy-card')\nexport default class SchmancyCard extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tborder-radius: var(--schmancy-sys-shape-corner-medium);\n\t\ttransition:\n\t\t\tbox-shadow var(--schmancy-sys-motion-duration-short4) var(--schmancy-sys-motion-easing-standard),\n\t\t\ttransform 300ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\t\toutline: none;\n\t}\n\n\t/* Type variants */\n\t:host([type='elevated']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-low);\n\t\tbox-shadow: var(--schmancy-sys-elevation-1);\n\t}\n\t:host([type='filled']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-highest);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\t:host([type='outlined']) {\n\t\tbackground-color: var(--schmancy-sys-color-surface-default);\n\t\tborder: 1px solid var(--schmancy-sys-color-outlineVariant);\n\t\tbox-shadow: var(--schmancy-sys-elevation-0);\n\t}\n\n\t/* Interactive states */\n\t:host([interactive]) {\n\t\tcursor: pointer;\n\t\t-webkit-tap-highlight-color: transparent;\n\t}\n\t:host([interactive]:focus-visible:not([disabled])) {\n\t\toutline: 2px solid var(--schmancy-sys-color-primary-default);\n\t\toutline-offset: 2px;\n\t}\n\t:host([disabled]) {\n\t\tpointer-events: none;\n\t\topacity: var(--schmancy-sys-state-disabled-opacity);\n\t}\n\n\t/* Hover elevations — luminous glow + lift */\n\t:host([type='elevated'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-2),\n\t\t\t0 4px 24px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 12%, transparent);\n\t\ttransform: translateY(-2px);\n\t}\n\t:host([type='filled'][interactive]:hover:not([disabled])),\n\t:host([type='outlined'][interactive]:hover:not([disabled])) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-1),\n\t\t\t0 4px 20px -6px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 10%, transparent);\n\t\ttransform: translateY(-1px);\n\t}\n\n\t/* Active state — kinetic compress */\n\t:host([interactive]:active:not([disabled])) {\n\t\ttransform: scale(0.98);\n\t\ttransition-duration: 100ms;\n\t}\n\n\t/* Dragged state */\n\t:host([dragged]) {\n\t\tbox-shadow:\n\t\t\tvar(--schmancy-sys-elevation-3),\n\t\t\t0 8px 32px -4px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t\ttransform: translateY(-4px);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host([interactive]:hover:not([disabled])),\n\t\t:host([interactive]:active:not([disabled])),\n\t\t:host([dragged]) {\n\t\t\ttransform: none;\n\t\t}\n\t}\n\n\t@keyframes ripple {\n\t\tto {\n\t\t\ttransform: scale(4);\n\t\t\topacity: 0;\n\t\t}\n\t}\n`) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t/**\n\t * The visual style of the card.\n\t * @default 'elevated'\n\t */\n\t@property({ reflect: true })\n\ttype: 'elevated' | 'filled' | 'outlined' = 'elevated'\n\n\t/**\n\t * Makes the card interactive (clickable).\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tinteractive = false\n\n\t/**\n\t * Disables the card.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled = false\n\n\t/**\n\t * Indicates the card is being dragged.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdragged = false\n\n\t/**\n\t * URL to navigate to when card is clicked (makes it act like a link).\n\t */\n\t@property()\n\thref?: string\n\n\t/**\n\t * Target for the link navigation.\n\t */\n\t@property()\n\ttarget?: string\n\n\t/**\n\t * ARIA role for accessibility.\n\t */\n\t@property({ attribute: 'role' })\n\toverride role = 'article'\n\n\t/**\n\t * ARIA label for accessibility.\n\t */\n\t@property({ attribute: 'aria-label' })\n\toverride ariaLabel: string = ''\n\n\t// Internal state for interaction feedback\n\t@state() pressed = false\n\t@state() private ripples: Array<{ x: number; y: number; id: number }> = []\n\n\tprivate nextRippleId = 0\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis._updateAriaAttributes()\n\t}\n\n\tupdated(changedProperties: Map<string, any>) {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('interactive') || changedProperties.has('disabled')) {\n\t\t\tthis._updateAriaAttributes()\n\t\t}\n\t}\n\n\t// Consolidate ARIA attribute updates\n\tprivate _updateAriaAttributes() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\tif (isInteractive) {\n\t\t\tthis.setAttribute('tabindex', '0')\n\t\t\tif (!this.role || this.role === 'article') {\n\t\t\t\tthis.role = this.href ? 'link' : 'button'\n\t\t\t}\n\t\t} else {\n\t\t\tthis.removeAttribute('tabindex')\n\t\t\tif (this.role === 'button' || this.role === 'link') {\n\t\t\t\tthis.role = 'article'\n\t\t\t}\n\t\t}\n\t}\n\n\t// Shared ripple creation logic\n\tprivate _addRipple(x: number, y: number) {\n\t\tconst id = this.nextRippleId++\n\t\tthis.ripples = [...this.ripples, { x, y, id }]\n\n\t\t// Remove ripple after animation completes\n\t\tsetTimeout(() => {\n\t\t\tthis.ripples = this.ripples.filter(r => r.id !== id)\n\t\t}, 600) // M3 medium duration\n\t}\n\n\t// Shared navigation logic\n\tprivate _navigate() {\n\t\tif (!this.href) return\n\n\t\tif (this.target === '_blank') {\n\t\t\twindow.open(this.href, '_blank')\n\t\t} else {\n\t\t\twindow.location.href = this.href\n\t\t}\n\t}\n\n\t// Combined action trigger (ripple + navigate + event)\n\tprivate _triggerAction(x: number, y: number) {\n\t\tthis._addRipple(x, y)\n\t\tthis._navigate()\n\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('schmancy-click', {\n\t\t\t\tdetail: { value: this.type },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate handleClick = (e: MouseEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tconst rect = this.getBoundingClientRect()\n\t\tthis._triggerAction(e.clientX - rect.left, e.clientY - rect.top)\n\t}\n\n\tprivate handleKeyDown = (e: KeyboardEvent) => {\n\t\tif (this.disabled || !this.interactive) return\n\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\te.preventDefault()\n\t\t\tthis._setPressed(true)\n\n\t\t\t// Simulate click at center\n\t\t\tconst rect = this.getBoundingClientRect()\n\t\t\tthis._triggerAction(rect.width / 2, rect.height / 2)\n\t\t}\n\t}\n\n\tprivate handleKeyUp = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\tthis._setPressed(false)\n\t\t}\n\t}\n\n\t// Consolidate pressed state management\n\tprivate _setPressed(pressed: boolean) {\n\t\tthis.pressed = pressed\n\t\tif (pressed) {\n\t\t\tthis.setAttribute('pressed', '')\n\t\t} else {\n\t\t\tthis.removeAttribute('pressed')\n\t\t}\n\t}\n\n\tprivate handleMouseDown = () => {\n\t\tif (this.disabled || !this.interactive) return\n\t\tthis._setPressed(true)\n\t}\n\n\tprivate handleMouseUp = () => this._setPressed(false)\n\tprivate handleMouseLeave = () => this._setPressed(false)\n\n\tprotected render() {\n\t\tconst isInteractive = this.interactive && !this.disabled\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\t${isInteractive ? cursorGlow({ radius: 200, intensity: 0.1 }) : ''}\n\t\t\t\tclass=\"relative w-full h-full rounded-xl ${isInteractive ? 'cursor-pointer' : ''}\"\n\t\t\t\t@click=${this.handleClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\t@keyup=${this.handleKeyUp}\n\t\t\t\t@mousedown=${this.handleMouseDown}\n\t\t\t\t@mouseup=${this.handleMouseUp}\n\t\t\t\t@mouseleave=${this.handleMouseLeave}\n\t\t\t\taria-label=${ifDefined(this.ariaLabel)}\n\t\t\t\taria-disabled=${this.disabled ? 'true' : 'false'}\n\t\t\t>\n\t\t\t\t<!-- State layer -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"absolute inset-0 rounded-xl pointer-events-none transition-opacity duration-200 bg-surface-on ${!isInteractive\n\t\t\t\t\t\t? 'opacity-0'\n\t\t\t\t\t\t: this.pressed\n\t\t\t\t\t\t\t? 'opacity-[var(--schmancy-sys-state-pressed-opacity)]'\n\t\t\t\t\t\t\t: 'opacity-0 hover:opacity-[var(--schmancy-sys-state-hover-opacity)] focus-visible:opacity-[var(--schmancy-sys-state-focus-opacity)]'}\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- Ripples -->\n\t\t\t\t${this.interactive && this.ripples.length\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<div class=\"absolute inset-0 rounded-xl overflow-hidden pointer-events-none\">\n\t\t\t\t\t\t\t\t${this.ripples.map(\n\t\t\t\t\t\t\t\t\tr => html`\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"absolute rounded-full scale-0 animate-[ripple_600ms_linear] bg-surface-on opacity-[0.12] w-5 h-5 -ml-2.5 -mt-2.5\"\n\t\t\t\t\t\t\t\t\t\t\tstyle=\"left: ${r.x}px; top: ${r.y}px\"\n\t\t\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t`\n\t\t\t\t\t: ''}\n\n\t\t\t\t<!-- Content -->\n\t\t\t\t<div class=\"relative h-full w-full rounded-xl\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card': SchmancyCard\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\n/**\n * Content region of a schmancy-card — holds the card's headline, supporting text, and inline controls.\n *\n * @element schmancy-card-content\n * @summary Always nested inside schmancy-card. The padded content block between the media and action rows.\n * @example\n * <schmancy-card-content>\n * <h3>Card title</h3>\n * <p>Supporting text that describes the card's subject.</p>\n * </schmancy-card-content>\n * @platform div - Styled `<div>` with padding. Degrades to a plain div if the tag never registers.\n */\n@customElement('schmancy-card-content')\nexport default class SchmancyCardContent extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tpadding: 1rem;\n\t}\n`) {\n\tprotected render(): unknown {\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-content': SchmancyCardContent\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\n/**\n * Media region of a schmancy-card — the image / thumbnail at the top of the card.\n *\n * @element schmancy-card-media\n * @summary Always nested inside schmancy-card. Pass `src` + `alt` props or slot an `<img>` / `<video>` for custom media.\n * @example\n * <schmancy-card-media src=\"/thumb.jpg\" alt=\"Product photo\"></schmancy-card-media>\n * @platform img - Renders an `<img>` (or wraps a slotted media element). Degrades to a styled `<img>` if the tag never registers.\n */\n@customElement('schmancy-card-media')\nexport default class SchmancyCardMedia extends TailwindElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\theight: 200px;\n\t\toverflow: hidden;\n\t}\n\t\n\t/* Allow height to be overridden when used in flex/grid layouts */\n\t:host-context(.h-full) {\n\t\theight: 100%;\n\t}\n\t\n\t::slotted(img),\n\timg {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tobject-position: center;\n\t}\n\t\n\t/* Object fit styles based on fit attribute */\n\t:host([fit=\"contain\"]) img,\n\t:host([fit=\"contain\"]) ::slotted(img) {\n\t\tobject-fit: contain;\n\t}\n\t\n\t:host([fit=\"cover\"]) img,\n\t:host([fit=\"cover\"]) ::slotted(img) {\n\t\tobject-fit: cover;\n\t}\n\t\n\t:host([fit=\"fill\"]) img,\n\t:host([fit=\"fill\"]) ::slotted(img) {\n\t\tobject-fit: fill;\n\t}\n\t\n\t:host([fit=\"none\"]) img,\n\t:host([fit=\"none\"]) ::slotted(img) {\n\t\tobject-fit: none;\n\t}\n\t\n\t:host([fit=\"scale-down\"]) img,\n\t:host([fit=\"scale-down\"]) ::slotted(img) {\n\t\tobject-fit: scale-down;\n\t}\n`) {\n\t@property({ type: String, reflect: true })\n\tsrc: string = ''\n\n\t@property({ type: String, reflect: true })\n\tfit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' = 'contain'\n\t\n\t@property({ type: String })\n\talt: string = ''\n\n\tprotected render(): unknown {\n\t\t// If src is provided, render an img element\n\t\t// Otherwise, allow users to slot their own content\n\t\treturn this.src \n\t\t\t? html`<img src=\"${this.src}\" alt=\"${this.alt}\" />` \n\t\t\t: html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-card-media': SchmancyCardMedia\n\t}\n}\n"],"mappings":";;;;;;;AAkBe,IAAA,IAAA,cAAiC,EAAgB,CAAG;;;;;;;;;CASlE,SAAA;AACC,SAAO,CAAI;;;AAAA,IAAA,EAAA,CAXZ,EAAc,uBAAA,CAAA,EAAuB,EAAA;ACQvB,IAAA,IAAA,cAA2B,EAAgB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BA+FjB,YAAA,KAAA,cAAA,CAO7B,GAAA,KAAA,WAAA,CAOH,GAAA,KAAA,UAAA,CAOD,GAAA,KAAA,OAkBM,WAAA,KAAA,YAMa,IAAA,KAAA,UAAA,CAGV,GAAA,KAAA,UACqD,EAAA,EAAA,KAAA,eAEjD,GAAA,KAAA,eAmEA,MAAA;AACtB,OAAI,KAAK,YAAA,CAAa,KAAK,YAAa;GAExC,IAAM,IAAO,KAAK,uBAAA;AAClB,QAAK,eAAe,EAAE,UAAU,EAAK,MAAM,EAAE,UAAU,EAAK,IAAA;KAAA,KAAA,iBAGpC,MAAA;AACxB,OAAA,CAAI,KAAK,YAAa,KAAK,gBAEvB,EAAE,QAAQ,WAAW,EAAE,QAAQ,MAAK;AACvC,MAAE,gBAAA,EACF,KAAK,YAAA,CAAY,EAAA;IAGjB,IAAM,IAAO,KAAK,uBAAA;AAClB,SAAK,eAAe,EAAK,QAAQ,GAAG,EAAK,SAAS,EAAA;;KAAA,KAAA,eAI7B,MAAA;AACR,GAAV,EAAE,QAAQ,WAAW,EAAE,QAAQ,OAClC,KAAK,YAAA,CAAY,EAAA;KAAA,KAAA,wBAAA;AAAA,IAed,KAAK,YAAa,KAAK,eAC3B,KAAK,YAAA,CAAY,EAAA;KAAA,KAAA,sBAGY,KAAK,YAAA,CAAY,EAAA,EAAA,KAAA,yBACd,KAAK,YAAA,CAAY,EAAA;;CAAA;AAAA,OAAA,oBA3Kb;GAAA,GACjC,EAAW;GACd,MAAM;GACN,gBAAA,CAAgB;GAAA;;CA6DjB,oBAAA;AACC,QAAM,mBAAA,EACN,KAAK,uBAAA;;CAGN,QAAQ,GAAA;AACP,QAAM,QAAQ,EAAA,GACV,EAAkB,IAAI,cAAA,IAAkB,EAAkB,IAAI,WAAA,KACjE,KAAK,uBAAA;;CAKP,wBAAA;AACuB,OAAK,eAAA,CAAgB,KAAK,YAG/C,KAAK,aAAa,YAAY,IAAA,EACzB,KAAK,QAAQ,KAAK,SAAS,cAC/B,KAAK,OAAO,KAAK,OAAO,SAAS,cAGlC,KAAK,gBAAgB,WAAA,EACjB,KAAK,SAAS,YAAY,KAAK,SAAS,WAC3C,KAAK,OAAO;;CAMf,WAAmB,GAAW,GAAA;EAC7B,IAAM,IAAK,KAAK;AAChB,OAAK,UAAU,CAAA,GAAI,KAAK,SAAS;GAAE,GAAA;GAAG,GAAA;GAAG,IAAA;GAAA,CAAA,EAGzC,iBAAA;AACC,QAAK,UAAU,KAAK,QAAQ,QAAO,MAAK,EAAE,OAAO,EAAA;KAC/C,IAAA;;CAIJ,YAAA;AACM,OAAK,SAEN,KAAK,WAAW,WACnB,OAAO,KAAK,KAAK,MAAM,SAAA,GAEvB,OAAO,SAAS,OAAO,KAAK;;CAK9B,eAAuB,GAAW,GAAA;AACjC,OAAK,WAAW,GAAG,EAAA,EACnB,KAAK,WAAA,EAEL,KAAK,cACJ,IAAI,YAAY,kBAAkB;GACjC,QAAQ,EAAE,OAAO,KAAK,MAAA;GACtB,SAAA,CAAS;GACT,UAAA,CAAU;GAAA,CAAA,CAAA;;CAgCb,YAAoB,GAAA;AACnB,OAAK,UAAU,GACX,IACH,KAAK,aAAa,WAAW,GAAA,GAE7B,KAAK,gBAAgB,UAAA;;CAYvB,SAAA;EACC,IAAM,IAAgB,KAAK,eAAA,CAAgB,KAAK;AAEhD,SAAO,CAAI;;MAEP,IAAgB,EAAW;GAAE,QAAQ;GAAK,WAAW;GAAA,CAAA,GAAS,GAAA;+CACrB,IAAgB,mBAAmB,GAAA;aACrE,KAAK,YAAA;eACH,KAAK,cAAA;aACP,KAAK,YAAA;iBACD,KAAK,gBAAA;eACP,KAAK,cAAA;kBACF,KAAK,iBAAA;iBACN,EAAU,KAAK,UAAA,CAAA;oBACZ,KAAK,WAAW,SAAS,QAAA;;;;4GAIgE,IAErG,KAAK,UACJ,wDACA,sIAHD,YAAA;;;;MAOF,KAAK,eAAe,KAAK,QAAQ,SAChC,CAAI;;UAED,KAAK,QAAQ,KACd,MAAK,CAAI;;;0BAGQ,EAAE,EAAA,WAAa,EAAE,EAAA;;;;UAMpC,GAAA;;;;;;;;;;GA1ML,EAAS,EAAE,SAAA,CAAS,GAAA,CAAA,CAAA,EAAO,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAO3B,EAAS;CAAE,MAAM;CAAS,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,eAAA,KAAA,EAAA,EAAA,EAAA,CAO1C,EAAS;CAAE,MAAM;CAAS,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,YAAA,KAAA,EAAA,EAAA,EAAA,CAO1C,EAAS;CAAE,MAAM;CAAS,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,WAAA,KAAA,EAAA,EAAA,EAAA,CAM1C,GAAA,CAAA,EAAU,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAMV,GAAA,CAAA,EAAU,EAAA,WAAA,UAAA,KAAA,EAAA,EAAA,EAAA,CAMV,EAAS,EAAE,WAAW,QAAA,CAAA,CAAA,EAAS,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAM/B,EAAS,EAAE,WAAW,cAAA,CAAA,CAAA,EAAe,EAAA,WAAA,aAAA,KAAA,EAAA,EAAA,EAAA,CAIrC,GAAA,CAAA,EAAO,EAAA,WAAA,WAAA,KAAA,EAAA,EAAA,EAAA,CACP,GAAA,CAAA,EAAO,EAAA,WAAA,WAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CAjJR,EAAc,gBAAA,CAAA,EAAgB,EAAA;ACPhB,IAAA,IAAA,cAAkC,EAAgB,CAAG;;;;;;CAMnE,SAAA;AACC,SAAO,CAAI;;;AAAA,IAAA,EAAA,CARZ,EAAc,wBAAA,CAAA,EAAwB,EAAA;ACFxB,IAAA,IAAA,cAAgC,EAAgB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0BA+CnD,IAAA,KAAA,MAG8C,WAAA,KAAA,MAG9C;;CAEd,SAAA;AAGC,SAAO,KAAK,MACT,CAAI,aAAa,KAAK,IAAA,SAAa,KAAK,IAAA,QACxC,CAAI;;;AAAA,EAAA,CAdP,EAAS;CAAE,MAAM;CAAQ,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,OAAA,KAAA,EAAA,EAAA,EAAA,CAGzC,EAAS;CAAE,MAAM;CAAQ,SAAA,CAAS;CAAA,CAAA,CAAA,EAAO,EAAA,WAAA,OAAA,KAAA,EAAA,EAAA,EAAA,CAGzC,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,EAAS,EAAA,WAAA,OAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CArD3B,EAAc,sBAAA,CAAA,EAAsB,EAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"details-B8p62xmR.cjs","names":[],"sources":["../src/details/details.ts"],"sourcesContent":["import { TailwindElement, SurfaceMixin } from '@mixins/index'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { magnetic } from '../directives/magnetic'\nimport { createRef, ref, Ref } from 'lit/directives/ref.js'\nimport { BehaviorSubject, fromEvent, Subscription } from 'rxjs'\nimport { distinctUntilChanged, filter, take, takeUntil, tap } from 'rxjs/operators'\nimport { SPRING_SNAPPY } from '../utils/animation.js'\nimport { reducedMotion$ } from '../directives/reduced-motion'\n\n@customElement('schmancy-details')\nexport default class SchmancyDetails extends SurfaceMixin(\n\tTailwindElement(css`\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t\ttransition: box-shadow 400ms cubic-bezier(0.34, 1.2, 0.64, 1);\n\t\t}\n\n\t\t:host([overlay]) {\n\t\t\tposition: relative;\n\t\t}\n\n\t\t:host([open]) {\n\t\t\tbox-shadow:\n\t\t\t\t0 2px 12px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent),\n\t\t\t\t0 8px 32px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 8%, transparent);\n\t\t\tz-index: 10;\n\t\t}\n\n\t\tdetails {\n\t\t\tbackground: inherit;\n\t\t\tcolor: inherit;\n\t\t\tborder-radius: inherit;\n\t\t}\n\n\t\tsummary::-webkit-details-marker {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\tsummary {\n\t\t\tlist-style: none;\n\t\t\tcolor: inherit;\n\t\t}\n\n\t\t/*\n\t\t * Blackbird 2.1 — CSS-driven collapse/expand\n\t\t *\n\t\t * Single animation system: CSS grid transition handles height,\n\t\t * coordinated opacity fade for buttery smooth feel.\n\t\t * No competing Web Animations API on content.\n\t\t */\n\n\t\t.content-wrapper {\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-rows: 0fr;\n\t\t\toverflow: hidden;\n\t\t\topacity: 0;\n\t\t\ttransition:\n\t\t\t\tgrid-template-rows 400ms cubic-bezier(0.34, 1.2, 0.64, 1),\n\t\t\t\topacity 250ms ease;\n\t\t}\n\n\t\t/* Spring easing when linear() is supported */\n\t\t@supports (animation-timing-function: linear(0, 1)) {\n\t\t\t.content-wrapper {\n\t\t\t\ttransition:\n\t\t\t\t\tgrid-template-rows 400ms linear(\n\t\t\t\t\t\t0, 0.006, 0.025 2.8%, 0.101 6.1%, 0.539 18.9%, 0.721 25.3%, 0.849 31.5%,\n\t\t\t\t\t\t0.937 38.1%, 0.968 41.8%, 0.991 45.7%, 1.006 50%, 1.015 54.8%,\n\t\t\t\t\t\t1.017 63.3%, 1.001\n\t\t\t\t\t),\n\t\t\t\t\topacity 250ms ease;\n\t\t\t}\n\t\t}\n\n\t\t.content-wrapper[data-open='true'] {\n\t\t\tgrid-template-rows: 1fr;\n\t\t\topacity: 1;\n\t\t}\n\n\t\t.content-inner {\n\t\t\tmin-height: 0;\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\t/*\n\t\t * Progressive Enhancement: ::details-content (Chrome 131+)\n\t\t *\n\t\t * When both ::details-content AND interpolate-size are supported,\n\t\t * the browser handles height animation natively — including animated\n\t\t * close via transition-behavior: allow-discrete on content-visibility.\n\t\t * The grid wrapper becomes transparent (display: contents).\n\t\t */\n\t\t@supports selector(::details-content) and (interpolate-size: allow-keywords) {\n\t\t\t:host {\n\t\t\t\tinterpolate-size: allow-keywords;\n\t\t\t}\n\n\t\t\t.content-wrapper {\n\t\t\t\tdisplay: contents;\n\t\t\t}\n\n\t\t\tdetails::details-content {\n\t\t\t\tblock-size: 0;\n\t\t\t\toverflow-y: clip;\n\t\t\t\topacity: 0;\n\t\t\t\ttransition:\n\t\t\t\t\tblock-size 400ms cubic-bezier(0.34, 1.2, 0.64, 1),\n\t\t\t\t\topacity 250ms ease,\n\t\t\t\t\tcontent-visibility 400ms;\n\t\t\t\ttransition-behavior: allow-discrete;\n\t\t\t}\n\n\t\t\tdetails[open]::details-content {\n\t\t\t\tblock-size: auto;\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t}\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\t.content-wrapper {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t\tdetails::details-content {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t}\n\t`),\n) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open' as const,\n\t\tdelegatesFocus: true,\n\t}\n\n\t@property() summary = ''\n\n\t@property({ type: Boolean, reflect: true })\n\tget open() {\n\t\treturn this._open$.value\n\t}\n\tset open(value: boolean) {\n\t\tif (this._open$.value !== value) {\n\t\t\tthis._open$.next(value)\n\t\t}\n\t}\n\n\t@property({ attribute: 'indicator-placement', reflect: true })\n\tindicatorPlacement: 'start' | 'end' = 'end'\n\n\t@property({ type: Boolean, attribute: 'hide-indicator' })\n\thideIndicator = false\n\n\t@property({ type: Number, attribute: 'indicator-rotate' })\n\tindicatorRotate: number = 90\n\n\t@property({ type: Boolean, reflect: true })\n\tlocked = false\n\n\t@property({ type: Boolean, reflect: true })\n\toverlay = false\n\n\t@property({ attribute: 'summary-padding' })\n\tsummaryPadding = 'p-3'\n\n\t@property({ attribute: 'content-padding' })\n\tcontentPadding = 'p-3'\n\n\tprivate _open$ = new BehaviorSubject<boolean>(false)\n\tprivate _indicatorRef: Ref<HTMLElement> = createRef()\n\tprivate _contentRef: Ref<HTMLDivElement> = createRef()\n\tprivate _currentAnimation?: Animation\n\tprivate _indicatorIsOpen = false\n\tprivate _closing = false\n\tprivate _closeSub?: Subscription\n\n\t/** True when browser handles close animation natively via ::details-content */\n\tprivate _nativeAnim =\n\t\ttypeof CSS !== 'undefined' &&\n\t\t!!CSS.supports?.('selector(::details-content)') &&\n\t\t!!CSS.supports?.('interpolate-size', 'allow-keywords')\n\n\t/**\n\t * Lazy rendering: tracks if content has ever been opened.\n\t * Once true, content stays rendered (even when closed) for smooth animations.\n\t */\n\t@state() private _hasOpened = false\n\n\tconstructor() {\n\t\tsuper()\n\t\tthis.type = 'solid'\n\t\tthis.rounded = 'all'\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tthis._open$\n\t\t\t.pipe(\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttap(isOpen => {\n\t\t\t\t\tif (isOpen && !this._hasOpened) {\n\t\t\t\t\t\tthis._hasOpened = true\n\t\t\t\t\t}\n\t\t\t\t\tthis._animateIndicator(isOpen)\n\t\t\t\t\tthis._updateIndicatorSlot()\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(() => this.requestUpdate())\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis._closeSub?.unsubscribe()\n\t}\n\n\trender() {\n\t\tconst isOpen = this._open$.value\n\n\t\tconst detailsClasses = this.classMap({\n\t\t\t'w-full rounded-xl transition-shadow duration-200 ease-out': true,\n\t\t\t'overflow-hidden': !this.overlay,\n\t\t\t'overflow-visible relative': this.overlay,\n\t\t})\n\n\t\tconst summaryClasses = this.classMap({\n\t\t\t[this.summaryPadding]: true,\n\t\t\t'select-none relative flex items-center gap-2 rounded-xl': true,\n\t\t\t'transition-colors duration-150': true,\n\t\t\t'ring-1 ring-inset ring-transparent': true,\n\t\t\t'hover:bg-surface-on/5 active:bg-surface-on/8 hover:ring-outline-variant/40': !this.locked,\n\t\t\t'focus-visible:ring-2 focus-visible:ring-primary-default/50 focus-visible:ring-offset-1': !this.locked,\n\t\t\t'cursor-pointer group': !this.locked,\n\t\t\t'cursor-default': this.locked,\n\t\t\t'flex-row': this.indicatorPlacement === 'start',\n\t\t\t'flex-row-reverse': this.indicatorPlacement === 'end',\n\t\t})\n\n\t\tconst contentClasses = this.classMap({\n\t\t\t[this.contentPadding]: true,\n\t\t\t'text-sm': true,\n\t\t\t'absolute inset-x-0 bg-surface-lowest/55 backdrop-blur-[16px] shadow-2xl rounded-b-xl z-20 border border-surface-on/10':\n\t\t\t\tthis.overlay,\n\t\t})\n\n\t\treturn html`\n\t\t\t<details ?open=${isOpen} @toggle=${this._handleToggle} class=${detailsClasses}>\n\t\t\t\t<summary ${this.locked ? '' : magnetic({ strength: 2, radius: 50 })} ${this.locked ? '' : cursorGlow({ radius: 250, intensity: 0.08 })} class=${summaryClasses} tabindex=${this.locked ? -1 : 0} @click=${this._handleSummaryClick}>\n\t\t\t\t\t${!this.hideIndicator\n\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t${ref(this._indicatorRef)}\n\t\t\t\t\t\t\t\t\tclass=\"flex items-center justify-center w-5 h-5 rounded-full shrink-0 opacity-70 group-hover:opacity-100\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<slot name=\"indicator\" @slotchange=${this._handleIndicatorSlotChange}>\n\t\t\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\t\t\twidth=\"20\"\n\t\t\t\t\t\t\t\t\t\t\theight=\"20\"\n\t\t\t\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\t\t\t\tclass=\"w-5 h-5\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\t\t\td=\"M9 6L15 12L9 18\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t\t\t</slot>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t`\n\t\t\t\t\t\t: ''}\n\n\t\t\t\t\t<span class=\"flex-1 min-w-0\">\n\t\t\t\t\t\t<slot name=\"summary\">${this.summary}</slot>\n\t\t\t\t\t</span>\n\n\t\t\t\t\t<slot name=\"actions\"></slot>\n\t\t\t\t</summary>\n\n\t\t\t\t<div\n\t\t\t\t\t${ref(this._contentRef)}\n\t\t\t\t\tclass=\"content-wrapper\"\n\t\t\t\t\tdata-open=${isOpen && !this._closing}\n\t\t\t\t\taria-hidden=${isOpen ? 'false' : 'true'}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"content-inner\">\n\t\t\t\t\t\t${this._hasOpened\n\t\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t\t<div class=${contentClasses}>\n\t\t\t\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t\t\t\t\t<slot name=\"details\"></slot>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t`\n\t\t\t\t\t\t\t: nothing}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</details>\n\t\t`\n\t}\n\n\tprivate _handleSummaryClick(e: MouseEvent) {\n\t\tif ((e.target as HTMLElement).closest('[slot=\"actions\"]')) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\t\tif (this.locked) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\t\tif (this._closing) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\n\t\t// Native animated path (Chromium 131+): browser handles everything via CSS\n\t\tif (this._nativeAnim) return\n\n\t\t// Fallback: manually animate close via CSS transition, then close native details\n\t\tif (this._open$.value) {\n\t\t\te.preventDefault()\n\t\t\tthis._startClose()\n\t\t}\n\t\t// If closed, let native open happen (handled by _handleToggle)\n\t}\n\n\tprivate _handleToggle(e: Event) {\n\t\te.stopPropagation()\n\n\t\tconst ownDetails = this.shadowRoot?.querySelector('details')\n\t\tif (e.target !== ownDetails) return\n\n\t\tconst newState = ownDetails.open\n\n\t\tif (this._nativeAnim) {\n\t\t\t// Native path: handle both open and close\n\t\t\tif (this._open$.value !== newState) {\n\t\t\t\tthis.open = newState\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: newState })\n\t\t\t}\n\t\t} else {\n\t\t\t// Fallback path: only handle OPEN (close is driven by _startClose)\n\t\t\tif (newState && this._open$.value !== newState) {\n\t\t\t\tthis.open = newState\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: newState })\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Fallback close: trigger CSS grid+opacity transition, then close native <details>.\n\t * The CSS transition (400ms) handles the visual collapse — no WAAPI needed.\n\t */\n\tprivate _startClose() {\n\t\tthis._closing = true\n\t\tthis._closeSub?.unsubscribe()\n\n\t\t// Immediately collapse the grid wrapper via DOM attribute\n\t\tthis._contentRef.value?.setAttribute('data-open', 'false')\n\n\t\t// Animate indicator immediately\n\t\tthis._animateIndicator(false)\n\n\t\t// After CSS transition completes, close native details and update state\n\t\tconst wrapper = this._contentRef.value\n\t\tif (!wrapper) return\n\n\t\tthis._closeSub = fromEvent<TransitionEvent>(wrapper, 'transitionend').pipe(\n\t\t\tfilter(e => e.propertyName === 'grid-template-rows'),\n\t\t\ttake(1),\n\t\t\ttap(() => {\n\t\t\t\tthis._closing = false\n\t\t\t\tthis.open = false\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: false })\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\t}\n\n\tprivate _handleIndicatorSlotChange(e: Event) {\n\t\tconst slot = e.target as HTMLSlotElement\n\t\tslot.assignedElements().forEach(el => {\n\t\t\tel.setAttribute('data-open', String(this._open$.value))\n\t\t})\n\t}\n\n\tprivate _updateIndicatorSlot() {\n\t\tconst slot = this.shadowRoot?.querySelector('slot[name=\"indicator\"]') as HTMLSlotElement | null\n\t\tif (slot) {\n\t\t\tslot.assignedElements().forEach(el => {\n\t\t\t\tel.setAttribute('data-open', String(this._open$.value))\n\t\t\t})\n\t\t}\n\t}\n\n\t/** Idempotent indicator rotation — skips if already at target state */\n\tprivate _animateIndicator(isOpen: boolean) {\n\t\tif (this._indicatorIsOpen === isOpen) return\n\t\tthis._indicatorIsOpen = isOpen\n\n\t\tconst indicator = this._indicatorRef.value\n\t\tif (!indicator || reducedMotion$.value) return\n\n\t\tthis._currentAnimation?.cancel()\n\n\t\tthis._currentAnimation = indicator.animate(\n\t\t\t[\n\t\t\t\t{ transform: `rotate(${isOpen ? '0deg' : `${this.indicatorRotate}deg`})` },\n\t\t\t\t{ transform: `rotate(${isOpen ? `${this.indicatorRotate}deg` : '0deg'})` },\n\t\t\t],\n\t\t\t{\n\t\t\t\tduration: SPRING_SNAPPY.duration,\n\t\t\t\teasing: SPRING_SNAPPY.easingFallback,\n\t\t\t\tfill: 'forwards',\n\t\t\t},\n\t\t)\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-details': SchmancyDetails\n\t}\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"details-B8p62xmR.cjs","names":[],"sources":["../src/details/details.ts"],"sourcesContent":["import { TailwindElement, SurfaceMixin } from '@mixins/index'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { magnetic } from '../directives/magnetic'\nimport { createRef, ref, Ref } from 'lit/directives/ref.js'\nimport { BehaviorSubject, fromEvent, Subscription } from 'rxjs'\nimport { distinctUntilChanged, filter, take, takeUntil, tap } from 'rxjs/operators'\nimport { SPRING_SNAPPY } from '../utils/animation.js'\nimport { reducedMotion$ } from '../directives/reduced-motion'\n\n/**\n * Expandable disclosure panel — a styled `<details>` / `<summary>` pair with animated expand + overlay options.\n *\n * @element schmancy-details\n * @summary Use for progressive-disclosure content: FAQs, collapsible settings sections, accordion-style lists. Prefer schmancy-expand for full-page accordions where only one section can be open at a time.\n * @example\n * <schmancy-details summary=\"Shipping details\">\n * <p>Order ships in 2 business days.</p>\n * </schmancy-details>\n * @platform details toggle - Wraps native `<details>`/`<summary>`. Degrades to the native element if the tag never registers — same keyboard accessibility, just no animation.\n * @fires toggle - When the open state changes (bubbles from the native `<details>`).\n */\n@customElement('schmancy-details')\nexport default class SchmancyDetails extends SurfaceMixin(\n\tTailwindElement(css`\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t\ttransition: box-shadow 400ms cubic-bezier(0.34, 1.2, 0.64, 1);\n\t\t}\n\n\t\t:host([overlay]) {\n\t\t\tposition: relative;\n\t\t}\n\n\t\t:host([open]) {\n\t\t\tbox-shadow:\n\t\t\t\t0 2px 12px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent),\n\t\t\t\t0 8px 32px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 8%, transparent);\n\t\t\tz-index: 10;\n\t\t}\n\n\t\tdetails {\n\t\t\tbackground: inherit;\n\t\t\tcolor: inherit;\n\t\t\tborder-radius: inherit;\n\t\t}\n\n\t\tsummary::-webkit-details-marker {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\tsummary {\n\t\t\tlist-style: none;\n\t\t\tcolor: inherit;\n\t\t}\n\n\t\t/*\n\t\t * Blackbird 2.1 — CSS-driven collapse/expand\n\t\t *\n\t\t * Single animation system: CSS grid transition handles height,\n\t\t * coordinated opacity fade for buttery smooth feel.\n\t\t * No competing Web Animations API on content.\n\t\t */\n\n\t\t.content-wrapper {\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-rows: 0fr;\n\t\t\toverflow: hidden;\n\t\t\topacity: 0;\n\t\t\ttransition:\n\t\t\t\tgrid-template-rows 400ms cubic-bezier(0.34, 1.2, 0.64, 1),\n\t\t\t\topacity 250ms ease;\n\t\t}\n\n\t\t/* Spring easing when linear() is supported */\n\t\t@supports (animation-timing-function: linear(0, 1)) {\n\t\t\t.content-wrapper {\n\t\t\t\ttransition:\n\t\t\t\t\tgrid-template-rows 400ms linear(\n\t\t\t\t\t\t0, 0.006, 0.025 2.8%, 0.101 6.1%, 0.539 18.9%, 0.721 25.3%, 0.849 31.5%,\n\t\t\t\t\t\t0.937 38.1%, 0.968 41.8%, 0.991 45.7%, 1.006 50%, 1.015 54.8%,\n\t\t\t\t\t\t1.017 63.3%, 1.001\n\t\t\t\t\t),\n\t\t\t\t\topacity 250ms ease;\n\t\t\t}\n\t\t}\n\n\t\t.content-wrapper[data-open='true'] {\n\t\t\tgrid-template-rows: 1fr;\n\t\t\topacity: 1;\n\t\t}\n\n\t\t.content-inner {\n\t\t\tmin-height: 0;\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\t/*\n\t\t * Progressive Enhancement: ::details-content (Chrome 131+)\n\t\t *\n\t\t * When both ::details-content AND interpolate-size are supported,\n\t\t * the browser handles height animation natively — including animated\n\t\t * close via transition-behavior: allow-discrete on content-visibility.\n\t\t * The grid wrapper becomes transparent (display: contents).\n\t\t */\n\t\t@supports selector(::details-content) and (interpolate-size: allow-keywords) {\n\t\t\t:host {\n\t\t\t\tinterpolate-size: allow-keywords;\n\t\t\t}\n\n\t\t\t.content-wrapper {\n\t\t\t\tdisplay: contents;\n\t\t\t}\n\n\t\t\tdetails::details-content {\n\t\t\t\tblock-size: 0;\n\t\t\t\toverflow-y: clip;\n\t\t\t\topacity: 0;\n\t\t\t\ttransition:\n\t\t\t\t\tblock-size 400ms cubic-bezier(0.34, 1.2, 0.64, 1),\n\t\t\t\t\topacity 250ms ease,\n\t\t\t\t\tcontent-visibility 400ms;\n\t\t\t\ttransition-behavior: allow-discrete;\n\t\t\t}\n\n\t\t\tdetails[open]::details-content {\n\t\t\t\tblock-size: auto;\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t}\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\t.content-wrapper {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t\tdetails::details-content {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t}\n\t`),\n) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open' as const,\n\t\tdelegatesFocus: true,\n\t}\n\n\t@property() summary = ''\n\n\t@property({ type: Boolean, reflect: true })\n\tget open() {\n\t\treturn this._open$.value\n\t}\n\tset open(value: boolean) {\n\t\tif (this._open$.value !== value) {\n\t\t\tthis._open$.next(value)\n\t\t}\n\t}\n\n\t@property({ attribute: 'indicator-placement', reflect: true })\n\tindicatorPlacement: 'start' | 'end' = 'end'\n\n\t@property({ type: Boolean, attribute: 'hide-indicator' })\n\thideIndicator = false\n\n\t@property({ type: Number, attribute: 'indicator-rotate' })\n\tindicatorRotate: number = 90\n\n\t@property({ type: Boolean, reflect: true })\n\tlocked = false\n\n\t@property({ type: Boolean, reflect: true })\n\toverlay = false\n\n\t@property({ attribute: 'summary-padding' })\n\tsummaryPadding = 'p-3'\n\n\t@property({ attribute: 'content-padding' })\n\tcontentPadding = 'p-3'\n\n\tprivate _open$ = new BehaviorSubject<boolean>(false)\n\tprivate _indicatorRef: Ref<HTMLElement> = createRef()\n\tprivate _contentRef: Ref<HTMLDivElement> = createRef()\n\tprivate _currentAnimation?: Animation\n\tprivate _indicatorIsOpen = false\n\tprivate _closing = false\n\tprivate _closeSub?: Subscription\n\n\t/** True when browser handles close animation natively via ::details-content */\n\tprivate _nativeAnim =\n\t\ttypeof CSS !== 'undefined' &&\n\t\t!!CSS.supports?.('selector(::details-content)') &&\n\t\t!!CSS.supports?.('interpolate-size', 'allow-keywords')\n\n\t/**\n\t * Lazy rendering: tracks if content has ever been opened.\n\t * Once true, content stays rendered (even when closed) for smooth animations.\n\t */\n\t@state() private _hasOpened = false\n\n\tconstructor() {\n\t\tsuper()\n\t\tthis.type = 'solid'\n\t\tthis.rounded = 'all'\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tthis._open$\n\t\t\t.pipe(\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttap(isOpen => {\n\t\t\t\t\tif (isOpen && !this._hasOpened) {\n\t\t\t\t\t\tthis._hasOpened = true\n\t\t\t\t\t}\n\t\t\t\t\tthis._animateIndicator(isOpen)\n\t\t\t\t\tthis._updateIndicatorSlot()\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(() => this.requestUpdate())\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis._closeSub?.unsubscribe()\n\t}\n\n\trender() {\n\t\tconst isOpen = this._open$.value\n\n\t\tconst detailsClasses = this.classMap({\n\t\t\t'w-full rounded-xl transition-shadow duration-200 ease-out': true,\n\t\t\t'overflow-hidden': !this.overlay,\n\t\t\t'overflow-visible relative': this.overlay,\n\t\t})\n\n\t\tconst summaryClasses = this.classMap({\n\t\t\t[this.summaryPadding]: true,\n\t\t\t'select-none relative flex items-center gap-2 rounded-xl': true,\n\t\t\t'transition-colors duration-150': true,\n\t\t\t'ring-1 ring-inset ring-transparent': true,\n\t\t\t'hover:bg-surface-on/5 active:bg-surface-on/8 hover:ring-outline-variant/40': !this.locked,\n\t\t\t'focus-visible:ring-2 focus-visible:ring-primary-default/50 focus-visible:ring-offset-1': !this.locked,\n\t\t\t'cursor-pointer group': !this.locked,\n\t\t\t'cursor-default': this.locked,\n\t\t\t'flex-row': this.indicatorPlacement === 'start',\n\t\t\t'flex-row-reverse': this.indicatorPlacement === 'end',\n\t\t})\n\n\t\tconst contentClasses = this.classMap({\n\t\t\t[this.contentPadding]: true,\n\t\t\t'text-sm': true,\n\t\t\t'absolute inset-x-0 bg-surface-lowest/55 backdrop-blur-[16px] shadow-2xl rounded-b-xl z-20 border border-surface-on/10':\n\t\t\t\tthis.overlay,\n\t\t})\n\n\t\treturn html`\n\t\t\t<details ?open=${isOpen} @toggle=${this._handleToggle} class=${detailsClasses}>\n\t\t\t\t<summary ${this.locked ? '' : magnetic({ strength: 2, radius: 50 })} ${this.locked ? '' : cursorGlow({ radius: 250, intensity: 0.08 })} class=${summaryClasses} tabindex=${this.locked ? -1 : 0} @click=${this._handleSummaryClick}>\n\t\t\t\t\t${!this.hideIndicator\n\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t${ref(this._indicatorRef)}\n\t\t\t\t\t\t\t\t\tclass=\"flex items-center justify-center w-5 h-5 rounded-full shrink-0 opacity-70 group-hover:opacity-100\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<slot name=\"indicator\" @slotchange=${this._handleIndicatorSlotChange}>\n\t\t\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\t\t\twidth=\"20\"\n\t\t\t\t\t\t\t\t\t\t\theight=\"20\"\n\t\t\t\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\t\t\t\tclass=\"w-5 h-5\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\t\t\td=\"M9 6L15 12L9 18\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t\t\t</slot>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t`\n\t\t\t\t\t\t: ''}\n\n\t\t\t\t\t<span class=\"flex-1 min-w-0\">\n\t\t\t\t\t\t<slot name=\"summary\">${this.summary}</slot>\n\t\t\t\t\t</span>\n\n\t\t\t\t\t<slot name=\"actions\"></slot>\n\t\t\t\t</summary>\n\n\t\t\t\t<div\n\t\t\t\t\t${ref(this._contentRef)}\n\t\t\t\t\tclass=\"content-wrapper\"\n\t\t\t\t\tdata-open=${isOpen && !this._closing}\n\t\t\t\t\taria-hidden=${isOpen ? 'false' : 'true'}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"content-inner\">\n\t\t\t\t\t\t${this._hasOpened\n\t\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t\t<div class=${contentClasses}>\n\t\t\t\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t\t\t\t\t<slot name=\"details\"></slot>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t`\n\t\t\t\t\t\t\t: nothing}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</details>\n\t\t`\n\t}\n\n\tprivate _handleSummaryClick(e: MouseEvent) {\n\t\tif ((e.target as HTMLElement).closest('[slot=\"actions\"]')) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\t\tif (this.locked) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\t\tif (this._closing) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\n\t\t// Native animated path (Chromium 131+): browser handles everything via CSS\n\t\tif (this._nativeAnim) return\n\n\t\t// Fallback: manually animate close via CSS transition, then close native details\n\t\tif (this._open$.value) {\n\t\t\te.preventDefault()\n\t\t\tthis._startClose()\n\t\t}\n\t\t// If closed, let native open happen (handled by _handleToggle)\n\t}\n\n\tprivate _handleToggle(e: Event) {\n\t\te.stopPropagation()\n\n\t\tconst ownDetails = this.shadowRoot?.querySelector('details')\n\t\tif (e.target !== ownDetails) return\n\n\t\tconst newState = ownDetails.open\n\n\t\tif (this._nativeAnim) {\n\t\t\t// Native path: handle both open and close\n\t\t\tif (this._open$.value !== newState) {\n\t\t\t\tthis.open = newState\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: newState })\n\t\t\t}\n\t\t} else {\n\t\t\t// Fallback path: only handle OPEN (close is driven by _startClose)\n\t\t\tif (newState && this._open$.value !== newState) {\n\t\t\t\tthis.open = newState\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: newState })\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Fallback close: trigger CSS grid+opacity transition, then close native <details>.\n\t * The CSS transition (400ms) handles the visual collapse — no WAAPI needed.\n\t */\n\tprivate _startClose() {\n\t\tthis._closing = true\n\t\tthis._closeSub?.unsubscribe()\n\n\t\t// Immediately collapse the grid wrapper via DOM attribute\n\t\tthis._contentRef.value?.setAttribute('data-open', 'false')\n\n\t\t// Animate indicator immediately\n\t\tthis._animateIndicator(false)\n\n\t\t// After CSS transition completes, close native details and update state\n\t\tconst wrapper = this._contentRef.value\n\t\tif (!wrapper) return\n\n\t\tthis._closeSub = fromEvent<TransitionEvent>(wrapper, 'transitionend').pipe(\n\t\t\tfilter(e => e.propertyName === 'grid-template-rows'),\n\t\t\ttake(1),\n\t\t\ttap(() => {\n\t\t\t\tthis._closing = false\n\t\t\t\tthis.open = false\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: false })\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\t}\n\n\tprivate _handleIndicatorSlotChange(e: Event) {\n\t\tconst slot = e.target as HTMLSlotElement\n\t\tslot.assignedElements().forEach(el => {\n\t\t\tel.setAttribute('data-open', String(this._open$.value))\n\t\t})\n\t}\n\n\tprivate _updateIndicatorSlot() {\n\t\tconst slot = this.shadowRoot?.querySelector('slot[name=\"indicator\"]') as HTMLSlotElement | null\n\t\tif (slot) {\n\t\t\tslot.assignedElements().forEach(el => {\n\t\t\t\tel.setAttribute('data-open', String(this._open$.value))\n\t\t\t})\n\t\t}\n\t}\n\n\t/** Idempotent indicator rotation — skips if already at target state */\n\tprivate _animateIndicator(isOpen: boolean) {\n\t\tif (this._indicatorIsOpen === isOpen) return\n\t\tthis._indicatorIsOpen = isOpen\n\n\t\tconst indicator = this._indicatorRef.value\n\t\tif (!indicator || reducedMotion$.value) return\n\n\t\tthis._currentAnimation?.cancel()\n\n\t\tthis._currentAnimation = indicator.animate(\n\t\t\t[\n\t\t\t\t{ transform: `rotate(${isOpen ? '0deg' : `${this.indicatorRotate}deg`})` },\n\t\t\t\t{ transform: `rotate(${isOpen ? `${this.indicatorRotate}deg` : '0deg'})` },\n\t\t\t],\n\t\t\t{\n\t\t\t\tduration: SPRING_SNAPPY.duration,\n\t\t\t\teasing: SPRING_SNAPPY.easingFallback,\n\t\t\t\tfill: 'forwards',\n\t\t\t},\n\t\t)\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-details': SchmancyDetails\n\t}\n}\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"details-CCW52lzz.js","names":[],"sources":["../src/details/details.ts"],"sourcesContent":["import { TailwindElement, SurfaceMixin } from '@mixins/index'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { magnetic } from '../directives/magnetic'\nimport { createRef, ref, Ref } from 'lit/directives/ref.js'\nimport { BehaviorSubject, fromEvent, Subscription } from 'rxjs'\nimport { distinctUntilChanged, filter, take, takeUntil, tap } from 'rxjs/operators'\nimport { SPRING_SNAPPY } from '../utils/animation.js'\nimport { reducedMotion$ } from '../directives/reduced-motion'\n\n@customElement('schmancy-details')\nexport default class SchmancyDetails extends SurfaceMixin(\n\tTailwindElement(css`\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t\ttransition: box-shadow 400ms cubic-bezier(0.34, 1.2, 0.64, 1);\n\t\t}\n\n\t\t:host([overlay]) {\n\t\t\tposition: relative;\n\t\t}\n\n\t\t:host([open]) {\n\t\t\tbox-shadow:\n\t\t\t\t0 2px 12px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent),\n\t\t\t\t0 8px 32px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 8%, transparent);\n\t\t\tz-index: 10;\n\t\t}\n\n\t\tdetails {\n\t\t\tbackground: inherit;\n\t\t\tcolor: inherit;\n\t\t\tborder-radius: inherit;\n\t\t}\n\n\t\tsummary::-webkit-details-marker {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\tsummary {\n\t\t\tlist-style: none;\n\t\t\tcolor: inherit;\n\t\t}\n\n\t\t/*\n\t\t * Blackbird 2.1 — CSS-driven collapse/expand\n\t\t *\n\t\t * Single animation system: CSS grid transition handles height,\n\t\t * coordinated opacity fade for buttery smooth feel.\n\t\t * No competing Web Animations API on content.\n\t\t */\n\n\t\t.content-wrapper {\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-rows: 0fr;\n\t\t\toverflow: hidden;\n\t\t\topacity: 0;\n\t\t\ttransition:\n\t\t\t\tgrid-template-rows 400ms cubic-bezier(0.34, 1.2, 0.64, 1),\n\t\t\t\topacity 250ms ease;\n\t\t}\n\n\t\t/* Spring easing when linear() is supported */\n\t\t@supports (animation-timing-function: linear(0, 1)) {\n\t\t\t.content-wrapper {\n\t\t\t\ttransition:\n\t\t\t\t\tgrid-template-rows 400ms linear(\n\t\t\t\t\t\t0, 0.006, 0.025 2.8%, 0.101 6.1%, 0.539 18.9%, 0.721 25.3%, 0.849 31.5%,\n\t\t\t\t\t\t0.937 38.1%, 0.968 41.8%, 0.991 45.7%, 1.006 50%, 1.015 54.8%,\n\t\t\t\t\t\t1.017 63.3%, 1.001\n\t\t\t\t\t),\n\t\t\t\t\topacity 250ms ease;\n\t\t\t}\n\t\t}\n\n\t\t.content-wrapper[data-open='true'] {\n\t\t\tgrid-template-rows: 1fr;\n\t\t\topacity: 1;\n\t\t}\n\n\t\t.content-inner {\n\t\t\tmin-height: 0;\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\t/*\n\t\t * Progressive Enhancement: ::details-content (Chrome 131+)\n\t\t *\n\t\t * When both ::details-content AND interpolate-size are supported,\n\t\t * the browser handles height animation natively — including animated\n\t\t * close via transition-behavior: allow-discrete on content-visibility.\n\t\t * The grid wrapper becomes transparent (display: contents).\n\t\t */\n\t\t@supports selector(::details-content) and (interpolate-size: allow-keywords) {\n\t\t\t:host {\n\t\t\t\tinterpolate-size: allow-keywords;\n\t\t\t}\n\n\t\t\t.content-wrapper {\n\t\t\t\tdisplay: contents;\n\t\t\t}\n\n\t\t\tdetails::details-content {\n\t\t\t\tblock-size: 0;\n\t\t\t\toverflow-y: clip;\n\t\t\t\topacity: 0;\n\t\t\t\ttransition:\n\t\t\t\t\tblock-size 400ms cubic-bezier(0.34, 1.2, 0.64, 1),\n\t\t\t\t\topacity 250ms ease,\n\t\t\t\t\tcontent-visibility 400ms;\n\t\t\t\ttransition-behavior: allow-discrete;\n\t\t\t}\n\n\t\t\tdetails[open]::details-content {\n\t\t\t\tblock-size: auto;\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t}\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\t.content-wrapper {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t\tdetails::details-content {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t}\n\t`),\n) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open' as const,\n\t\tdelegatesFocus: true,\n\t}\n\n\t@property() summary = ''\n\n\t@property({ type: Boolean, reflect: true })\n\tget open() {\n\t\treturn this._open$.value\n\t}\n\tset open(value: boolean) {\n\t\tif (this._open$.value !== value) {\n\t\t\tthis._open$.next(value)\n\t\t}\n\t}\n\n\t@property({ attribute: 'indicator-placement', reflect: true })\n\tindicatorPlacement: 'start' | 'end' = 'end'\n\n\t@property({ type: Boolean, attribute: 'hide-indicator' })\n\thideIndicator = false\n\n\t@property({ type: Number, attribute: 'indicator-rotate' })\n\tindicatorRotate: number = 90\n\n\t@property({ type: Boolean, reflect: true })\n\tlocked = false\n\n\t@property({ type: Boolean, reflect: true })\n\toverlay = false\n\n\t@property({ attribute: 'summary-padding' })\n\tsummaryPadding = 'p-3'\n\n\t@property({ attribute: 'content-padding' })\n\tcontentPadding = 'p-3'\n\n\tprivate _open$ = new BehaviorSubject<boolean>(false)\n\tprivate _indicatorRef: Ref<HTMLElement> = createRef()\n\tprivate _contentRef: Ref<HTMLDivElement> = createRef()\n\tprivate _currentAnimation?: Animation\n\tprivate _indicatorIsOpen = false\n\tprivate _closing = false\n\tprivate _closeSub?: Subscription\n\n\t/** True when browser handles close animation natively via ::details-content */\n\tprivate _nativeAnim =\n\t\ttypeof CSS !== 'undefined' &&\n\t\t!!CSS.supports?.('selector(::details-content)') &&\n\t\t!!CSS.supports?.('interpolate-size', 'allow-keywords')\n\n\t/**\n\t * Lazy rendering: tracks if content has ever been opened.\n\t * Once true, content stays rendered (even when closed) for smooth animations.\n\t */\n\t@state() private _hasOpened = false\n\n\tconstructor() {\n\t\tsuper()\n\t\tthis.type = 'solid'\n\t\tthis.rounded = 'all'\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tthis._open$\n\t\t\t.pipe(\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttap(isOpen => {\n\t\t\t\t\tif (isOpen && !this._hasOpened) {\n\t\t\t\t\t\tthis._hasOpened = true\n\t\t\t\t\t}\n\t\t\t\t\tthis._animateIndicator(isOpen)\n\t\t\t\t\tthis._updateIndicatorSlot()\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(() => this.requestUpdate())\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis._closeSub?.unsubscribe()\n\t}\n\n\trender() {\n\t\tconst isOpen = this._open$.value\n\n\t\tconst detailsClasses = this.classMap({\n\t\t\t'w-full rounded-xl transition-shadow duration-200 ease-out': true,\n\t\t\t'overflow-hidden': !this.overlay,\n\t\t\t'overflow-visible relative': this.overlay,\n\t\t})\n\n\t\tconst summaryClasses = this.classMap({\n\t\t\t[this.summaryPadding]: true,\n\t\t\t'select-none relative flex items-center gap-2 rounded-xl': true,\n\t\t\t'transition-colors duration-150': true,\n\t\t\t'ring-1 ring-inset ring-transparent': true,\n\t\t\t'hover:bg-surface-on/5 active:bg-surface-on/8 hover:ring-outline-variant/40': !this.locked,\n\t\t\t'focus-visible:ring-2 focus-visible:ring-primary-default/50 focus-visible:ring-offset-1': !this.locked,\n\t\t\t'cursor-pointer group': !this.locked,\n\t\t\t'cursor-default': this.locked,\n\t\t\t'flex-row': this.indicatorPlacement === 'start',\n\t\t\t'flex-row-reverse': this.indicatorPlacement === 'end',\n\t\t})\n\n\t\tconst contentClasses = this.classMap({\n\t\t\t[this.contentPadding]: true,\n\t\t\t'text-sm': true,\n\t\t\t'absolute inset-x-0 bg-surface-lowest/55 backdrop-blur-[16px] shadow-2xl rounded-b-xl z-20 border border-surface-on/10':\n\t\t\t\tthis.overlay,\n\t\t})\n\n\t\treturn html`\n\t\t\t<details ?open=${isOpen} @toggle=${this._handleToggle} class=${detailsClasses}>\n\t\t\t\t<summary ${this.locked ? '' : magnetic({ strength: 2, radius: 50 })} ${this.locked ? '' : cursorGlow({ radius: 250, intensity: 0.08 })} class=${summaryClasses} tabindex=${this.locked ? -1 : 0} @click=${this._handleSummaryClick}>\n\t\t\t\t\t${!this.hideIndicator\n\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t${ref(this._indicatorRef)}\n\t\t\t\t\t\t\t\t\tclass=\"flex items-center justify-center w-5 h-5 rounded-full shrink-0 opacity-70 group-hover:opacity-100\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<slot name=\"indicator\" @slotchange=${this._handleIndicatorSlotChange}>\n\t\t\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\t\t\twidth=\"20\"\n\t\t\t\t\t\t\t\t\t\t\theight=\"20\"\n\t\t\t\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\t\t\t\tclass=\"w-5 h-5\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\t\t\td=\"M9 6L15 12L9 18\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t\t\t</slot>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t`\n\t\t\t\t\t\t: ''}\n\n\t\t\t\t\t<span class=\"flex-1 min-w-0\">\n\t\t\t\t\t\t<slot name=\"summary\">${this.summary}</slot>\n\t\t\t\t\t</span>\n\n\t\t\t\t\t<slot name=\"actions\"></slot>\n\t\t\t\t</summary>\n\n\t\t\t\t<div\n\t\t\t\t\t${ref(this._contentRef)}\n\t\t\t\t\tclass=\"content-wrapper\"\n\t\t\t\t\tdata-open=${isOpen && !this._closing}\n\t\t\t\t\taria-hidden=${isOpen ? 'false' : 'true'}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"content-inner\">\n\t\t\t\t\t\t${this._hasOpened\n\t\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t\t<div class=${contentClasses}>\n\t\t\t\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t\t\t\t\t<slot name=\"details\"></slot>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t`\n\t\t\t\t\t\t\t: nothing}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</details>\n\t\t`\n\t}\n\n\tprivate _handleSummaryClick(e: MouseEvent) {\n\t\tif ((e.target as HTMLElement).closest('[slot=\"actions\"]')) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\t\tif (this.locked) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\t\tif (this._closing) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\n\t\t// Native animated path (Chromium 131+): browser handles everything via CSS\n\t\tif (this._nativeAnim) return\n\n\t\t// Fallback: manually animate close via CSS transition, then close native details\n\t\tif (this._open$.value) {\n\t\t\te.preventDefault()\n\t\t\tthis._startClose()\n\t\t}\n\t\t// If closed, let native open happen (handled by _handleToggle)\n\t}\n\n\tprivate _handleToggle(e: Event) {\n\t\te.stopPropagation()\n\n\t\tconst ownDetails = this.shadowRoot?.querySelector('details')\n\t\tif (e.target !== ownDetails) return\n\n\t\tconst newState = ownDetails.open\n\n\t\tif (this._nativeAnim) {\n\t\t\t// Native path: handle both open and close\n\t\t\tif (this._open$.value !== newState) {\n\t\t\t\tthis.open = newState\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: newState })\n\t\t\t}\n\t\t} else {\n\t\t\t// Fallback path: only handle OPEN (close is driven by _startClose)\n\t\t\tif (newState && this._open$.value !== newState) {\n\t\t\t\tthis.open = newState\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: newState })\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Fallback close: trigger CSS grid+opacity transition, then close native <details>.\n\t * The CSS transition (400ms) handles the visual collapse — no WAAPI needed.\n\t */\n\tprivate _startClose() {\n\t\tthis._closing = true\n\t\tthis._closeSub?.unsubscribe()\n\n\t\t// Immediately collapse the grid wrapper via DOM attribute\n\t\tthis._contentRef.value?.setAttribute('data-open', 'false')\n\n\t\t// Animate indicator immediately\n\t\tthis._animateIndicator(false)\n\n\t\t// After CSS transition completes, close native details and update state\n\t\tconst wrapper = this._contentRef.value\n\t\tif (!wrapper) return\n\n\t\tthis._closeSub = fromEvent<TransitionEvent>(wrapper, 'transitionend').pipe(\n\t\t\tfilter(e => e.propertyName === 'grid-template-rows'),\n\t\t\ttake(1),\n\t\t\ttap(() => {\n\t\t\t\tthis._closing = false\n\t\t\t\tthis.open = false\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: false })\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\t}\n\n\tprivate _handleIndicatorSlotChange(e: Event) {\n\t\tconst slot = e.target as HTMLSlotElement\n\t\tslot.assignedElements().forEach(el => {\n\t\t\tel.setAttribute('data-open', String(this._open$.value))\n\t\t})\n\t}\n\n\tprivate _updateIndicatorSlot() {\n\t\tconst slot = this.shadowRoot?.querySelector('slot[name=\"indicator\"]') as HTMLSlotElement | null\n\t\tif (slot) {\n\t\t\tslot.assignedElements().forEach(el => {\n\t\t\t\tel.setAttribute('data-open', String(this._open$.value))\n\t\t\t})\n\t\t}\n\t}\n\n\t/** Idempotent indicator rotation — skips if already at target state */\n\tprivate _animateIndicator(isOpen: boolean) {\n\t\tif (this._indicatorIsOpen === isOpen) return\n\t\tthis._indicatorIsOpen = isOpen\n\n\t\tconst indicator = this._indicatorRef.value\n\t\tif (!indicator || reducedMotion$.value) return\n\n\t\tthis._currentAnimation?.cancel()\n\n\t\tthis._currentAnimation = indicator.animate(\n\t\t\t[\n\t\t\t\t{ transform: `rotate(${isOpen ? '0deg' : `${this.indicatorRotate}deg`})` },\n\t\t\t\t{ transform: `rotate(${isOpen ? `${this.indicatorRotate}deg` : '0deg'})` },\n\t\t\t],\n\t\t\t{\n\t\t\t\tduration: SPRING_SNAPPY.duration,\n\t\t\t\teasing: SPRING_SNAPPY.easingFallback,\n\t\t\t\tfill: 'forwards',\n\t\t\t},\n\t\t)\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-details': SchmancyDetails\n\t}\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"details-CCW52lzz.js","names":[],"sources":["../src/details/details.ts"],"sourcesContent":["import { TailwindElement, SurfaceMixin } from '@mixins/index'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { cursorGlow } from '../directives/cursor-glow'\nimport { magnetic } from '../directives/magnetic'\nimport { createRef, ref, Ref } from 'lit/directives/ref.js'\nimport { BehaviorSubject, fromEvent, Subscription } from 'rxjs'\nimport { distinctUntilChanged, filter, take, takeUntil, tap } from 'rxjs/operators'\nimport { SPRING_SNAPPY } from '../utils/animation.js'\nimport { reducedMotion$ } from '../directives/reduced-motion'\n\n/**\n * Expandable disclosure panel — a styled `<details>` / `<summary>` pair with animated expand + overlay options.\n *\n * @element schmancy-details\n * @summary Use for progressive-disclosure content: FAQs, collapsible settings sections, accordion-style lists. Prefer schmancy-expand for full-page accordions where only one section can be open at a time.\n * @example\n * <schmancy-details summary=\"Shipping details\">\n * <p>Order ships in 2 business days.</p>\n * </schmancy-details>\n * @platform details toggle - Wraps native `<details>`/`<summary>`. Degrades to the native element if the tag never registers — same keyboard accessibility, just no animation.\n * @fires toggle - When the open state changes (bubbles from the native `<details>`).\n */\n@customElement('schmancy-details')\nexport default class SchmancyDetails extends SurfaceMixin(\n\tTailwindElement(css`\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t\ttransition: box-shadow 400ms cubic-bezier(0.34, 1.2, 0.64, 1);\n\t\t}\n\n\t\t:host([overlay]) {\n\t\t\tposition: relative;\n\t\t}\n\n\t\t:host([open]) {\n\t\t\tbox-shadow:\n\t\t\t\t0 2px 12px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent),\n\t\t\t\t0 8px 32px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 8%, transparent);\n\t\t\tz-index: 10;\n\t\t}\n\n\t\tdetails {\n\t\t\tbackground: inherit;\n\t\t\tcolor: inherit;\n\t\t\tborder-radius: inherit;\n\t\t}\n\n\t\tsummary::-webkit-details-marker {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\tsummary {\n\t\t\tlist-style: none;\n\t\t\tcolor: inherit;\n\t\t}\n\n\t\t/*\n\t\t * Blackbird 2.1 — CSS-driven collapse/expand\n\t\t *\n\t\t * Single animation system: CSS grid transition handles height,\n\t\t * coordinated opacity fade for buttery smooth feel.\n\t\t * No competing Web Animations API on content.\n\t\t */\n\n\t\t.content-wrapper {\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-rows: 0fr;\n\t\t\toverflow: hidden;\n\t\t\topacity: 0;\n\t\t\ttransition:\n\t\t\t\tgrid-template-rows 400ms cubic-bezier(0.34, 1.2, 0.64, 1),\n\t\t\t\topacity 250ms ease;\n\t\t}\n\n\t\t/* Spring easing when linear() is supported */\n\t\t@supports (animation-timing-function: linear(0, 1)) {\n\t\t\t.content-wrapper {\n\t\t\t\ttransition:\n\t\t\t\t\tgrid-template-rows 400ms linear(\n\t\t\t\t\t\t0, 0.006, 0.025 2.8%, 0.101 6.1%, 0.539 18.9%, 0.721 25.3%, 0.849 31.5%,\n\t\t\t\t\t\t0.937 38.1%, 0.968 41.8%, 0.991 45.7%, 1.006 50%, 1.015 54.8%,\n\t\t\t\t\t\t1.017 63.3%, 1.001\n\t\t\t\t\t),\n\t\t\t\t\topacity 250ms ease;\n\t\t\t}\n\t\t}\n\n\t\t.content-wrapper[data-open='true'] {\n\t\t\tgrid-template-rows: 1fr;\n\t\t\topacity: 1;\n\t\t}\n\n\t\t.content-inner {\n\t\t\tmin-height: 0;\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\t/*\n\t\t * Progressive Enhancement: ::details-content (Chrome 131+)\n\t\t *\n\t\t * When both ::details-content AND interpolate-size are supported,\n\t\t * the browser handles height animation natively — including animated\n\t\t * close via transition-behavior: allow-discrete on content-visibility.\n\t\t * The grid wrapper becomes transparent (display: contents).\n\t\t */\n\t\t@supports selector(::details-content) and (interpolate-size: allow-keywords) {\n\t\t\t:host {\n\t\t\t\tinterpolate-size: allow-keywords;\n\t\t\t}\n\n\t\t\t.content-wrapper {\n\t\t\t\tdisplay: contents;\n\t\t\t}\n\n\t\t\tdetails::details-content {\n\t\t\t\tblock-size: 0;\n\t\t\t\toverflow-y: clip;\n\t\t\t\topacity: 0;\n\t\t\t\ttransition:\n\t\t\t\t\tblock-size 400ms cubic-bezier(0.34, 1.2, 0.64, 1),\n\t\t\t\t\topacity 250ms ease,\n\t\t\t\t\tcontent-visibility 400ms;\n\t\t\t\ttransition-behavior: allow-discrete;\n\t\t\t}\n\n\t\t\tdetails[open]::details-content {\n\t\t\t\tblock-size: auto;\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t}\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\t.content-wrapper {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t\tdetails::details-content {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t}\n\t`),\n) {\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tmode: 'open' as const,\n\t\tdelegatesFocus: true,\n\t}\n\n\t@property() summary = ''\n\n\t@property({ type: Boolean, reflect: true })\n\tget open() {\n\t\treturn this._open$.value\n\t}\n\tset open(value: boolean) {\n\t\tif (this._open$.value !== value) {\n\t\t\tthis._open$.next(value)\n\t\t}\n\t}\n\n\t@property({ attribute: 'indicator-placement', reflect: true })\n\tindicatorPlacement: 'start' | 'end' = 'end'\n\n\t@property({ type: Boolean, attribute: 'hide-indicator' })\n\thideIndicator = false\n\n\t@property({ type: Number, attribute: 'indicator-rotate' })\n\tindicatorRotate: number = 90\n\n\t@property({ type: Boolean, reflect: true })\n\tlocked = false\n\n\t@property({ type: Boolean, reflect: true })\n\toverlay = false\n\n\t@property({ attribute: 'summary-padding' })\n\tsummaryPadding = 'p-3'\n\n\t@property({ attribute: 'content-padding' })\n\tcontentPadding = 'p-3'\n\n\tprivate _open$ = new BehaviorSubject<boolean>(false)\n\tprivate _indicatorRef: Ref<HTMLElement> = createRef()\n\tprivate _contentRef: Ref<HTMLDivElement> = createRef()\n\tprivate _currentAnimation?: Animation\n\tprivate _indicatorIsOpen = false\n\tprivate _closing = false\n\tprivate _closeSub?: Subscription\n\n\t/** True when browser handles close animation natively via ::details-content */\n\tprivate _nativeAnim =\n\t\ttypeof CSS !== 'undefined' &&\n\t\t!!CSS.supports?.('selector(::details-content)') &&\n\t\t!!CSS.supports?.('interpolate-size', 'allow-keywords')\n\n\t/**\n\t * Lazy rendering: tracks if content has ever been opened.\n\t * Once true, content stays rendered (even when closed) for smooth animations.\n\t */\n\t@state() private _hasOpened = false\n\n\tconstructor() {\n\t\tsuper()\n\t\tthis.type = 'solid'\n\t\tthis.rounded = 'all'\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tthis._open$\n\t\t\t.pipe(\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttap(isOpen => {\n\t\t\t\t\tif (isOpen && !this._hasOpened) {\n\t\t\t\t\t\tthis._hasOpened = true\n\t\t\t\t\t}\n\t\t\t\t\tthis._animateIndicator(isOpen)\n\t\t\t\t\tthis._updateIndicatorSlot()\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(() => this.requestUpdate())\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis._closeSub?.unsubscribe()\n\t}\n\n\trender() {\n\t\tconst isOpen = this._open$.value\n\n\t\tconst detailsClasses = this.classMap({\n\t\t\t'w-full rounded-xl transition-shadow duration-200 ease-out': true,\n\t\t\t'overflow-hidden': !this.overlay,\n\t\t\t'overflow-visible relative': this.overlay,\n\t\t})\n\n\t\tconst summaryClasses = this.classMap({\n\t\t\t[this.summaryPadding]: true,\n\t\t\t'select-none relative flex items-center gap-2 rounded-xl': true,\n\t\t\t'transition-colors duration-150': true,\n\t\t\t'ring-1 ring-inset ring-transparent': true,\n\t\t\t'hover:bg-surface-on/5 active:bg-surface-on/8 hover:ring-outline-variant/40': !this.locked,\n\t\t\t'focus-visible:ring-2 focus-visible:ring-primary-default/50 focus-visible:ring-offset-1': !this.locked,\n\t\t\t'cursor-pointer group': !this.locked,\n\t\t\t'cursor-default': this.locked,\n\t\t\t'flex-row': this.indicatorPlacement === 'start',\n\t\t\t'flex-row-reverse': this.indicatorPlacement === 'end',\n\t\t})\n\n\t\tconst contentClasses = this.classMap({\n\t\t\t[this.contentPadding]: true,\n\t\t\t'text-sm': true,\n\t\t\t'absolute inset-x-0 bg-surface-lowest/55 backdrop-blur-[16px] shadow-2xl rounded-b-xl z-20 border border-surface-on/10':\n\t\t\t\tthis.overlay,\n\t\t})\n\n\t\treturn html`\n\t\t\t<details ?open=${isOpen} @toggle=${this._handleToggle} class=${detailsClasses}>\n\t\t\t\t<summary ${this.locked ? '' : magnetic({ strength: 2, radius: 50 })} ${this.locked ? '' : cursorGlow({ radius: 250, intensity: 0.08 })} class=${summaryClasses} tabindex=${this.locked ? -1 : 0} @click=${this._handleSummaryClick}>\n\t\t\t\t\t${!this.hideIndicator\n\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t${ref(this._indicatorRef)}\n\t\t\t\t\t\t\t\t\tclass=\"flex items-center justify-center w-5 h-5 rounded-full shrink-0 opacity-70 group-hover:opacity-100\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<slot name=\"indicator\" @slotchange=${this._handleIndicatorSlotChange}>\n\t\t\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\t\t\twidth=\"20\"\n\t\t\t\t\t\t\t\t\t\t\theight=\"20\"\n\t\t\t\t\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\t\t\t\tclass=\"w-5 h-5\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\t\t\td=\"M9 6L15 12L9 18\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t\t\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t\t\t</slot>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t`\n\t\t\t\t\t\t: ''}\n\n\t\t\t\t\t<span class=\"flex-1 min-w-0\">\n\t\t\t\t\t\t<slot name=\"summary\">${this.summary}</slot>\n\t\t\t\t\t</span>\n\n\t\t\t\t\t<slot name=\"actions\"></slot>\n\t\t\t\t</summary>\n\n\t\t\t\t<div\n\t\t\t\t\t${ref(this._contentRef)}\n\t\t\t\t\tclass=\"content-wrapper\"\n\t\t\t\t\tdata-open=${isOpen && !this._closing}\n\t\t\t\t\taria-hidden=${isOpen ? 'false' : 'true'}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"content-inner\">\n\t\t\t\t\t\t${this._hasOpened\n\t\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t\t<div class=${contentClasses}>\n\t\t\t\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t\t\t\t\t<slot name=\"details\"></slot>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t`\n\t\t\t\t\t\t\t: nothing}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</details>\n\t\t`\n\t}\n\n\tprivate _handleSummaryClick(e: MouseEvent) {\n\t\tif ((e.target as HTMLElement).closest('[slot=\"actions\"]')) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\t\tif (this.locked) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\t\tif (this._closing) {\n\t\t\te.preventDefault()\n\t\t\treturn\n\t\t}\n\n\t\t// Native animated path (Chromium 131+): browser handles everything via CSS\n\t\tif (this._nativeAnim) return\n\n\t\t// Fallback: manually animate close via CSS transition, then close native details\n\t\tif (this._open$.value) {\n\t\t\te.preventDefault()\n\t\t\tthis._startClose()\n\t\t}\n\t\t// If closed, let native open happen (handled by _handleToggle)\n\t}\n\n\tprivate _handleToggle(e: Event) {\n\t\te.stopPropagation()\n\n\t\tconst ownDetails = this.shadowRoot?.querySelector('details')\n\t\tif (e.target !== ownDetails) return\n\n\t\tconst newState = ownDetails.open\n\n\t\tif (this._nativeAnim) {\n\t\t\t// Native path: handle both open and close\n\t\t\tif (this._open$.value !== newState) {\n\t\t\t\tthis.open = newState\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: newState })\n\t\t\t}\n\t\t} else {\n\t\t\t// Fallback path: only handle OPEN (close is driven by _startClose)\n\t\t\tif (newState && this._open$.value !== newState) {\n\t\t\t\tthis.open = newState\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: newState })\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Fallback close: trigger CSS grid+opacity transition, then close native <details>.\n\t * The CSS transition (400ms) handles the visual collapse — no WAAPI needed.\n\t */\n\tprivate _startClose() {\n\t\tthis._closing = true\n\t\tthis._closeSub?.unsubscribe()\n\n\t\t// Immediately collapse the grid wrapper via DOM attribute\n\t\tthis._contentRef.value?.setAttribute('data-open', 'false')\n\n\t\t// Animate indicator immediately\n\t\tthis._animateIndicator(false)\n\n\t\t// After CSS transition completes, close native details and update state\n\t\tconst wrapper = this._contentRef.value\n\t\tif (!wrapper) return\n\n\t\tthis._closeSub = fromEvent<TransitionEvent>(wrapper, 'transitionend').pipe(\n\t\t\tfilter(e => e.propertyName === 'grid-template-rows'),\n\t\t\ttake(1),\n\t\t\ttap(() => {\n\t\t\t\tthis._closing = false\n\t\t\t\tthis.open = false\n\t\t\t\tthis.dispatchScopedEvent('toggle', { open: false })\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\t}\n\n\tprivate _handleIndicatorSlotChange(e: Event) {\n\t\tconst slot = e.target as HTMLSlotElement\n\t\tslot.assignedElements().forEach(el => {\n\t\t\tel.setAttribute('data-open', String(this._open$.value))\n\t\t})\n\t}\n\n\tprivate _updateIndicatorSlot() {\n\t\tconst slot = this.shadowRoot?.querySelector('slot[name=\"indicator\"]') as HTMLSlotElement | null\n\t\tif (slot) {\n\t\t\tslot.assignedElements().forEach(el => {\n\t\t\t\tel.setAttribute('data-open', String(this._open$.value))\n\t\t\t})\n\t\t}\n\t}\n\n\t/** Idempotent indicator rotation — skips if already at target state */\n\tprivate _animateIndicator(isOpen: boolean) {\n\t\tif (this._indicatorIsOpen === isOpen) return\n\t\tthis._indicatorIsOpen = isOpen\n\n\t\tconst indicator = this._indicatorRef.value\n\t\tif (!indicator || reducedMotion$.value) return\n\n\t\tthis._currentAnimation?.cancel()\n\n\t\tthis._currentAnimation = indicator.animate(\n\t\t\t[\n\t\t\t\t{ transform: `rotate(${isOpen ? '0deg' : `${this.indicatorRotate}deg`})` },\n\t\t\t\t{ transform: `rotate(${isOpen ? `${this.indicatorRotate}deg` : '0deg'})` },\n\t\t\t],\n\t\t\t{\n\t\t\t\tduration: SPRING_SNAPPY.duration,\n\t\t\t\teasing: SPRING_SNAPPY.easingFallback,\n\t\t\t\tfill: 'forwards',\n\t\t\t},\n\t\t)\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-details': SchmancyDetails\n\t}\n}\n"],"mappings":"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"}