@diwacopilot/components 1.0.0

package/dist/esm/input-styles-c4f4fa96.js

@@ -0,0 +1,222 @@
+import { b as getHoverCapableStyle, a as getReducedMotionStyle } from './styles-e5a47a2d.js';
+
+/**
+ * Returns the shared Shadow DOM CSS for all diwa-input-* components.
+ *
+ * NOTE: Border and background live on .input-wrapper so start/end slot content
+ * shares the same bordered box as the native input. This also prevents Tailwind
+ * v4 preflight from stripping padding set directly on :host.
+ */
+const getInputCss = (state, _disabled, _readonly, compact, hasStart, hasEnd, hasSuffix) => {
+    const borderColor = state === 'error'
+        ? 'var(--diwa-notification-error)'
+        : state === 'success'
+            ? 'var(--diwa-notification-success)'
+            : 'var(--diwa-input-border)';
+    const messageColor = state === 'error'
+        ? 'var(--diwa-notification-error)'
+        : state === 'success'
+            ? 'var(--diwa-notification-success)'
+            : 'var(--diwa-text-secondary)';
+    const inputHeight = compact
+        ? 'var(--diwa-touch-target-min-size-compact, 32px)'
+        : 'var(--diwa-input-height, var(--diwa-touch-target-min-size, 44px))';
+    const paddingLeft = hasStart ? '4px' : 'var(--diwa-input-padding-x, 12px)';
+    const paddingRight = (hasEnd || hasSuffix) ? '4px' : 'var(--diwa-input-padding-x, 12px)';
+    return `
+  /* ── Host ──────────────────────────────────────────────────────────── */
+
+  :host {
+    display: block;
+    font-family: var(--diwa-font-family-base);
+    outline: none;
+  }
+
+  :host([hidden]) {
+    display: none;
+  }
+
+  /* ── Root layout ────────────────────────────────────────────────────── */
+
+  .root {
+    display: flex;
+    flex-direction: column;
+    gap: var(--diwa-space-2);
+  }
+
+  /* ── Label row ──────────────────────────────────────────────────────── */
+
+  .label-row {
+    display: flex;
+    align-items: baseline;
+    gap: var(--diwa-space-1);
+  }
+
+  .label {
+    display: block;
+    font-size: var(--diwa-font-size-sm);
+    font-weight: var(--diwa-font-weight-semibold);
+    color: var(--diwa-text-secondary);
+    line-height: var(--diwa-line-height-normal);
+    cursor: default;
+  }
+
+  .required {
+    color: var(--diwa-notification-error);
+    font-weight: var(--diwa-font-weight-semibold);
+  }
+
+  /* ── Input wrapper (owns border + background) ───────────────────────── */
+
+  .input-wrapper {
+    position: relative;
+    display: flex;
+    align-items: center;
+    height: ${inputHeight};
+    background: var(--diwa-input-bg, var(--diwa-bg-input));
+    border: var(--diwa-border-width-thin) solid ${borderColor};
+    border-radius: var(--diwa-input-radius, var(--diwa-radius-md));
+    box-sizing: border-box;
+    overflow: hidden;
+    transition: border-color var(--diwa-transition-fast), background var(--diwa-transition-fast), box-shadow var(--diwa-transition-fast);
+  }
+
+  ${getHoverCapableStyle('.input-wrapper:not(:has(input:disabled)):not(:has(input[readonly]))', `border-color: ${state === 'none' ? 'var(--diwa-border-hover)' : borderColor};`)}
+
+  /* Focus — border and ring become visible on keyboard navigation */
+  .input-wrapper:focus-within {
+    border-color: var(--diwa-border-focus);
+    box-shadow: 0 0 0 var(--diwa-focus-ring-width) var(--diwa-border-focus);
+  }
+
+  /* Disabled */
+  .input-wrapper:has(input:disabled) {
+    opacity: var(--diwa-opacity-disabled);
+    cursor: not-allowed;
+    pointer-events: none;
+  }
+
+  /* Read-only */
+  .input-wrapper:has(input[readonly]) {
+    background: var(--diwa-bg-surface);
+    border-style: dashed;
+    cursor: default;
+  }
+
+  /* ── Start / End slot containers ────────────────────────────────────── */
+
+  .slot-start {
+    display: flex;
+    align-items: center;
+    padding-left: var(--diwa-input-padding-x, 12px);
+    color: var(--diwa-text-secondary);
+    flex-shrink: 0;
+  }
+
+  .slot-end {
+    display: flex;
+    align-items: center;
+    padding-right: var(--diwa-input-padding-x, 12px);
+    color: var(--diwa-text-secondary);
+    flex-shrink: 0;
+  }
+
+  /* ── Native input ───────────────────────────────────────────────────── */
+
+  input.input {
+    flex: 1;
+    min-width: 0;
+    height: 100%;
+    padding: 0 ${paddingRight} 0 ${paddingLeft};
+    background: transparent;
+    border: none;
+    box-sizing: border-box;
+    appearance: none;
+    -webkit-appearance: none;
+    outline: none;
+    margin: 0;
+    font-family: inherit;
+    font-size: var(--diwa-font-size-base);
+    color: var(--diwa-text-primary);
+    line-height: var(--diwa-line-height-normal);
+  }
+
+  input.input::placeholder {
+    color: var(--diwa-text-disabled);
+    opacity: 1;
+  }
+
+  /* Number — hide native spinners */
+  input.input[type="number"]::-webkit-inner-spin-button,
+  input.input[type="number"]::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+  }
+  input.input[type="number"] { -moz-appearance: textfield; }
+
+  /* Search — hide browser-native clear button */
+  input.input[type="search"]::-webkit-search-cancel-button {
+    -webkit-appearance: none;
+    appearance: none;
+  }
+
+  /* Date / time — hide native picker icon in webkit */
+  input.input[type="date"]::-webkit-calendar-picker-indicator,
+  input.input[type="time"]::-webkit-calendar-picker-indicator,
+  input.input[type="month"]::-webkit-calendar-picker-indicator,
+  input.input[type="week"]::-webkit-calendar-picker-indicator {
+    opacity: 0.5;
+    cursor: pointer;
+  }
+
+  /* ── Suffix button (password toggle / search clear) ─────────────────── */
+
+  .suffix-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    height: 100%;
+    min-width: ${compact ? 'var(--diwa-touch-target-min-size-compact, 32px)' : 'var(--diwa-touch-target-min-size, 44px)'};
+    padding: 0 var(--diwa-space-3);
+    background: none;
+    border: none;
+    margin: 0;
+    cursor: pointer;
+    color: var(--diwa-text-secondary);
+    line-height: 0;
+    transition: color var(--diwa-transition-fast);
+  }
+
+  ${getHoverCapableStyle('.suffix-btn', 'color: var(--diwa-text-primary);')}
+
+  .suffix-btn:focus-visible {
+    outline: var(--diwa-focus-ring-width) solid var(--diwa-border-focus);
+    outline-offset: -2px;
+  }
+
+  /* ── Description ────────────────────────────────────────────────── */
+
+  .description {
+    font-size: var(--diwa-font-size-sm);
+    color: var(--diwa-text-secondary);
+    margin: 0;
+    line-height: var(--diwa-line-height-normal);
+  }
+
+  /* ── Message (state-coloured) ───────────────────────────────────── */
+
+  .message {
+    font-size: var(--diwa-font-size-sm);
+    color: ${messageColor};
+    margin: 0;
+    line-height: var(--diwa-line-height-normal);
+  }
+
+  ${getReducedMotionStyle('.input-wrapper', '.suffix-btn')}
+`;
+};
+
+export { getInputCss as g };
+
+//# sourceMappingURL=input-styles-c4f4fa96.js.map

package/dist/esm/input-styles-c4f4fa96.js.map

@@ -0,0 +1 @@
+{"file":"input-styles-c4f4fa96.js","mappings":";;AAGA;;;;;;;MAOa,WAAW,GAAG,CACzB,KAAsB,EACtB,SAAkB,EAClB,SAAkB,EAClB,OAAgB,EAChB,QAAiB,EACjB,MAAe,EACf,SAAkB;IAElB,MAAM,WAAW,GACf,KAAK,KAAK,OAAO;UACb,gCAAgC;UAChC,KAAK,KAAK,SAAS;cACjB,kCAAkC;cAClC,0BAA0B,CAAC;IAEnC,MAAM,YAAY,GAChB,KAAK,KAAK,OAAO;UACb,gCAAgC;UAChC,KAAK,KAAK,SAAS;cACjB,kCAAkC;cAClC,4BAA4B,CAAC;IAErC,MAAM,WAAW,GAAG,OAAO;UACvB,iDAAiD;UACjD,mEAAmE,CAAC;IACxE,MAAM,WAAW,GAAG,QAAQ,GAAG,KAAK,GAAG,mCAAmC,CAAC;IAC3E,MAAM,YAAY,GAAG,CAAC,MAAM,IAAI,SAAS,IAAI,KAAK,GAAG,mCAAmC,CAAC;IAEzF,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAiDK,WAAW;;kDAEyB,WAAW;;;;;;;IAOzD,oBAAoB,CACpB,qEAAqE,EACrE,iBAAiB,KAAK,KAAK,MAAM,GAAG,0BAA0B,GAAG,WAAW,GAAG,CAChF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA8Cc,YAAY,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAkD7B,OAAO,GAAG,iDAAiD,GAAG,yCAAyC;;;;;;;;;;;IAWpH,oBAAoB,CAAC,aAAa,EAAE,kCAAkC,CAAC;;;;;;;;;;;;;;;;;;;;aAoB9D,YAAY;;;;;IAKrB,qBAAqB,CAAC,gBAAgB,EAAE,aAAa,CAAC;CACzD,CAAC;AACF;;;;","names":[],"sources":["src/components/diwa-input/input-styles.ts"],"sourcesContent":["import type { InputFieldState } from './types';\nimport { getHoverCapableStyle, getReducedMotionStyle } from '../../utils/styles';\n\n/**\n * Returns the shared Shadow DOM CSS for all diwa-input-* components.\n *\n * NOTE: Border and background live on .input-wrapper so start/end slot content\n * shares the same bordered box as the native input. This also prevents Tailwind\n * v4 preflight from stripping padding set directly on :host.\n */\nexport const getInputCss = (\n  state: InputFieldState,\n  _disabled: boolean,\n  _readonly: boolean,\n  compact: boolean,\n  hasStart: boolean,\n  hasEnd: boolean,\n  hasSuffix: boolean,\n): string => {\n  const borderColor =\n    state === 'error'\n      ? 'var(--diwa-notification-error)'\n      : state === 'success'\n        ? 'var(--diwa-notification-success)'\n        : 'var(--diwa-input-border)';\n\n  const messageColor =\n    state === 'error'\n      ? 'var(--diwa-notification-error)'\n      : state === 'success'\n        ? 'var(--diwa-notification-success)'\n        : 'var(--diwa-text-secondary)';\n\n  const inputHeight = compact\n    ? 'var(--diwa-touch-target-min-size-compact, 32px)'\n    : 'var(--diwa-input-height, var(--diwa-touch-target-min-size, 44px))';\n  const paddingLeft = hasStart ? '4px' : 'var(--diwa-input-padding-x, 12px)';\n  const paddingRight = (hasEnd || hasSuffix) ? '4px' : 'var(--diwa-input-padding-x, 12px)';\n\n  return `\n  /* ── Host ──────────────────────────────────────────────────────────── */\n\n  :host {\n    display: block;\n    font-family: var(--diwa-font-family-base);\n    outline: none;\n  }\n\n  :host([hidden]) {\n    display: none;\n  }\n\n  /* ── Root layout ────────────────────────────────────────────────────── */\n\n  .root {\n    display: flex;\n    flex-direction: column;\n    gap: var(--diwa-space-2);\n  }\n\n  /* ── Label row ──────────────────────────────────────────────────────── */\n\n  .label-row {\n    display: flex;\n    align-items: baseline;\n    gap: var(--diwa-space-1);\n  }\n\n  .label {\n    display: block;\n    font-size: var(--diwa-font-size-sm);\n    font-weight: var(--diwa-font-weight-semibold);\n    color: var(--diwa-text-secondary);\n    line-height: var(--diwa-line-height-normal);\n    cursor: default;\n  }\n\n  .required {\n    color: var(--diwa-notification-error);\n    font-weight: var(--diwa-font-weight-semibold);\n  }\n\n  /* ── Input wrapper (owns border + background) ───────────────────────── */\n\n  .input-wrapper {\n    position: relative;\n    display: flex;\n    align-items: center;\n    height: ${inputHeight};\n    background: var(--diwa-input-bg, var(--diwa-bg-input));\n    border: var(--diwa-border-width-thin) solid ${borderColor};\n    border-radius: var(--diwa-input-radius, var(--diwa-radius-md));\n    box-sizing: border-box;\n    overflow: hidden;\n    transition: border-color var(--diwa-transition-fast), background var(--diwa-transition-fast), box-shadow var(--diwa-transition-fast);\n  }\n\n  ${getHoverCapableStyle(\n    '.input-wrapper:not(:has(input:disabled)):not(:has(input[readonly]))',\n    `border-color: ${state === 'none' ? 'var(--diwa-border-hover)' : borderColor};`,\n  )}\n\n  /* Focus — border and ring become visible on keyboard navigation */\n  .input-wrapper:focus-within {\n    border-color: var(--diwa-border-focus);\n    box-shadow: 0 0 0 var(--diwa-focus-ring-width) var(--diwa-border-focus);\n  }\n\n  /* Disabled */\n  .input-wrapper:has(input:disabled) {\n    opacity: var(--diwa-opacity-disabled);\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n\n  /* Read-only */\n  .input-wrapper:has(input[readonly]) {\n    background: var(--diwa-bg-surface);\n    border-style: dashed;\n    cursor: default;\n  }\n\n  /* ── Start / End slot containers ────────────────────────────────────── */\n\n  .slot-start {\n    display: flex;\n    align-items: center;\n    padding-left: var(--diwa-input-padding-x, 12px);\n    color: var(--diwa-text-secondary);\n    flex-shrink: 0;\n  }\n\n  .slot-end {\n    display: flex;\n    align-items: center;\n    padding-right: var(--diwa-input-padding-x, 12px);\n    color: var(--diwa-text-secondary);\n    flex-shrink: 0;\n  }\n\n  /* ── Native input ───────────────────────────────────────────────────── */\n\n  input.input {\n    flex: 1;\n    min-width: 0;\n    height: 100%;\n    padding: 0 ${paddingRight} 0 ${paddingLeft};\n    background: transparent;\n    border: none;\n    box-sizing: border-box;\n    appearance: none;\n    -webkit-appearance: none;\n    outline: none;\n    margin: 0;\n    font-family: inherit;\n    font-size: var(--diwa-font-size-base);\n    color: var(--diwa-text-primary);\n    line-height: var(--diwa-line-height-normal);\n  }\n\n  input.input::placeholder {\n    color: var(--diwa-text-disabled);\n    opacity: 1;\n  }\n\n  /* Number — hide native spinners */\n  input.input[type=\"number\"]::-webkit-inner-spin-button,\n  input.input[type=\"number\"]::-webkit-outer-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  input.input[type=\"number\"] { -moz-appearance: textfield; }\n\n  /* Search — hide browser-native clear button */\n  input.input[type=\"search\"]::-webkit-search-cancel-button {\n    -webkit-appearance: none;\n    appearance: none;\n  }\n\n  /* Date / time — hide native picker icon in webkit */\n  input.input[type=\"date\"]::-webkit-calendar-picker-indicator,\n  input.input[type=\"time\"]::-webkit-calendar-picker-indicator,\n  input.input[type=\"month\"]::-webkit-calendar-picker-indicator,\n  input.input[type=\"week\"]::-webkit-calendar-picker-indicator {\n    opacity: 0.5;\n    cursor: pointer;\n  }\n\n  /* ── Suffix button (password toggle / search clear) ─────────────────── */\n\n  .suffix-btn {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    height: 100%;\n    min-width: ${compact ? 'var(--diwa-touch-target-min-size-compact, 32px)' : 'var(--diwa-touch-target-min-size, 44px)'};\n    padding: 0 var(--diwa-space-3);\n    background: none;\n    border: none;\n    margin: 0;\n    cursor: pointer;\n    color: var(--diwa-text-secondary);\n    line-height: 0;\n    transition: color var(--diwa-transition-fast);\n  }\n\n  ${getHoverCapableStyle('.suffix-btn', 'color: var(--diwa-text-primary);')}\n\n  .suffix-btn:focus-visible {\n    outline: var(--diwa-focus-ring-width) solid var(--diwa-border-focus);\n    outline-offset: -2px;\n  }\n\n  /* ── Description ────────────────────────────────────────────────── */\n\n  .description {\n    font-size: var(--diwa-font-size-sm);\n    color: var(--diwa-text-secondary);\n    margin: 0;\n    line-height: var(--diwa-line-height-normal);\n  }\n\n  /* ── Message (state-coloured) ───────────────────────────────────── */\n\n  .message {\n    font-size: var(--diwa-font-size-sm);\n    color: ${messageColor};\n    margin: 0;\n    line-height: var(--diwa-line-height-normal);\n  }\n\n  ${getReducedMotionStyle('.input-wrapper', '.suffix-btn')}\n`;\n};\n"],"version":3}

package/dist/esm/loader-circle-300f00a4.js

@@ -0,0 +1,12 @@
+/**
+ * @license lucide v0.577.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+const LoaderCircle = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }]];
+
+export { LoaderCircle as L };
+
+//# sourceMappingURL=loader-circle-300f00a4.js.map

package/dist/esm/loader-circle-300f00a4.js.map

@@ -0,0 +1 @@
+{"file":"loader-circle-300f00a4.js","mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACK,MAAC,YAAY,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,6BAA6B,EAAE,CAAC;;;;","names":[],"sources":["../node_modules/lucide/dist/esm/icons/loader-circle.js"],"sourcesContent":["/**\n * @license lucide v0.577.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst LoaderCircle = [[\"path\", { d: \"M21 12a9 9 0 1 1-6.219-8.56\" }]];\n\nexport { LoaderCircle as default };\n//# sourceMappingURL=loader-circle.js.map\n"],"version":3}

package/dist/esm/loader.js

@@ -0,0 +1,13 @@
+import { b as bootstrapLazy } from './index-3fa02c74.js';
+export { s as setNonce } from './index-3fa02c74.js';
+import { g as globalScripts } from './app-globals-0f993ce5.js';
+
+const defineCustomElements = async (win, options) => {
+  if (typeof window === 'undefined') return undefined;
+  await globalScripts();
+  return bootstrapLazy(JSON.parse("[[\"diwa-flyout\",[[1,\"diwa-flyout\",{\"theme\":[513],\"open\":[1540],\"position\":[513],\"backdrop\":[1],\"heading\":[1]},[[8,\"keydown\",\"onKeyDown\"]],{\"open\":[\"onOpenChange\"]}]]],[\"diwa-inline-notification\",[[1,\"diwa-inline-notification\",{\"theme\":[513],\"state\":[513],\"heading\":[1],\"description\":[1],\"dismissButton\":[4,\"dismiss-button\"],\"actionLabel\":[1,\"action-label\"],\"actionLoading\":[4,\"action-loading\"]}]]],[\"diwa-accordion\",[[17,\"diwa-accordion\",{\"theme\":[513],\"heading\":[1],\"headingTag\":[1,\"heading-tag\"],\"open\":[516],\"compact\":[516]}]]],[\"diwa-button\",[[17,\"diwa-button\",{\"theme\":[513],\"variant\":[513],\"size\":[513],\"type\":[1],\"disabled\":[516],\"loading\":[516],\"href\":[1],\"target\":[1],\"name\":[1],\"value\":[1],\"label\":[1],\"hideLabel\":[516,\"hide-label\"],\"icon\":[1]}]]],[\"diwa-input-password\",[[17,\"diwa-input-password\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"showToggle\":[4,\"show-toggle\"],\"_hasStart\":[32],\"_hasEnd\":[32],\"showPassword\":[32]}]]],[\"diwa-input-search\",[[17,\"diwa-input-search\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"showClearButton\":[4,\"show-clear-button\"],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-link\",[[17,\"diwa-link\",{\"theme\":[513],\"variant\":[513],\"href\":[1],\"target\":[1],\"download\":[1],\"rel\":[1],\"icon\":[1],\"hideLabel\":[516,\"hide-label\"],\"compact\":[516],\"label\":[1],\"disabled\":[516]}]]],[\"diwa-link-pure\",[[17,\"diwa-link-pure\",{\"theme\":[513],\"href\":[1],\"target\":[1],\"download\":[1],\"rel\":[1],\"icon\":[1],\"hideLabel\":[516,\"hide-label\"],\"active\":[516],\"underline\":[516],\"size\":[513],\"alignLabel\":[513,\"align-label\"],\"stretch\":[516],\"label\":[1]}]]],[\"diwa-switch\",[[17,\"diwa-switch\",{\"checked\":[516],\"disabled\":[516],\"loading\":[516],\"alignLabel\":[1,\"align-label\"],\"compact\":[516],\"theme\":[513]}]]],[\"diwa-tag\",[[1,\"diwa-tag\",{\"variant\":[513],\"compact\":[516],\"icon\":[1],\"theme\":[513]}]]],[\"diwa-toast\",[[1,\"diwa-toast\",{\"theme\":[513],\"messages\":[32],\"addMessage\":[64]}]]],[\"diwa-badge\",[[1,\"diwa-badge\",{\"variant\":[513],\"size\":[513],\"label\":[1],\"theme\":[513]}]]],[\"diwa-checkbox\",[[17,\"diwa-checkbox\",{\"theme\":[513],\"label\":[1],\"name\":[1],\"value\":[1],\"checked\":[1540],\"indeterminate\":[516],\"disabled\":[516],\"required\":[4],\"state\":[513],\"message\":[1],\"compact\":[516],\"hideLabel\":[516,\"hide-label\"]},null,{\"indeterminate\":[\"watchIndeterminate\"]}]]],[\"diwa-divider\",[[1,\"diwa-divider\",{\"theme\":[513],\"orientation\":[513]}]]],[\"diwa-input\",[[17,\"diwa-input\",{\"type\":[1],\"label\":[1],\"placeholder\":[1],\"value\":[1025],\"required\":[4],\"disabled\":[516],\"readonly\":[516],\"state\":[513],\"hint\":[1],\"autocomplete\":[1],\"name\":[1],\"inputId\":[1,\"input-id\"],\"theme\":[513]}]]],[\"diwa-input-date\",[[17,\"diwa-input-date\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"min\":[1],\"max\":[1],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-input-email\",[[17,\"diwa-input-email\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-input-month\",[[17,\"diwa-input-month\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"min\":[1],\"max\":[1],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-input-number\",[[17,\"diwa-input-number\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"min\":[2],\"max\":[2],\"step\":[2],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-input-tel\",[[17,\"diwa-input-tel\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-input-text\",[[17,\"diwa-input-text\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"maxLength\":[2,\"max-length\"],\"minLength\":[2,\"min-length\"],\"spellCheck\":[4,\"spell-check\"],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-input-time\",[[17,\"diwa-input-time\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"min\":[1],\"max\":[1],\"step\":[2],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-input-url\",[[17,\"diwa-input-url\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-input-week\",[[17,\"diwa-input-week\",{\"label\":[1],\"description\":[1],\"message\":[1],\"state\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"disabled\":[516],\"required\":[516],\"readonly\":[516],\"hideLabel\":[4,\"hide-label\"],\"compact\":[4],\"autoComplete\":[1,\"auto-complete\"],\"theme\":[1],\"min\":[1],\"max\":[1],\"_hasStart\":[32],\"_hasEnd\":[32]}]]],[\"diwa-modal\",[[17,\"diwa-modal\",{\"theme\":[513],\"open\":[516],\"heading\":[1],\"dismissButton\":[4,\"dismiss-button\"],\"disableBackdropClick\":[4,\"disable-backdrop-click\"],\"backdrop\":[1],\"_hasFooter\":[32],\"_hasHeader\":[32]},[[8,\"keydown\",\"onKeyDown\"]],{\"open\":[\"onOpenChange\"]}]]],[\"diwa-multi-select\",[[17,\"diwa-multi-select\",{\"theme\":[513],\"label\":[1],\"description\":[1],\"name\":[1],\"value\":[1040],\"state\":[513],\"message\":[1],\"hideLabel\":[516,\"hide-label\"],\"disabled\":[516],\"required\":[4],\"compact\":[516],\"dropdownDirection\":[1,\"dropdown-direction\"],\"isOpen\":[32],\"filterText\":[32],\"hasFilterResults\":[32],\"dropdownClass\":[32],\"open\":[64],\"close\":[64]},[[0,\"diwaMultiSelectOptionUpdate\",\"onOptionUpdate\"],[0,\"slotchange\",\"onSlotChange\"]],{\"theme\":[\"onThemeChange\"],\"compact\":[\"onCompactChange\"],\"value\":[\"onValueChange\"],\"isOpen\":[\"onIsOpenChange\"]}]]],[\"diwa-multi-select-option\",[[17,\"diwa-multi-select-option\",{\"value\":[513],\"disabled\":[516],\"selected\":[1540],\"highlighted\":[1540],\"compact\":[1540],\"theme\":[1025],\"setFocus\":[64]},null,{\"selected\":[\"handlePropChange\"],\"highlighted\":[\"handlePropChange\"],\"disabled\":[\"handlePropChange\"]}]]],[\"diwa-pagination\",[[17,\"diwa-pagination\",{\"theme\":[513],\"totalItemsCount\":[2,\"total-items-count\"],\"itemsPerPage\":[2,\"items-per-page\"],\"activePage\":[1026,\"active-page\"],\"showLastPage\":[4,\"show-last-page\"],\"intl\":[16]}]]],[\"diwa-pin-code\",[[17,\"diwa-pin-code\",{\"label\":[1],\"description\":[1],\"state\":[1],\"message\":[1],\"length\":[2],\"value\":[1],\"type\":[1],\"required\":[516],\"disabled\":[516],\"compact\":[4],\"hideLabel\":[4,\"hide-label\"],\"theme\":[513]}]]],[\"diwa-popover\",[[17,\"diwa-popover\",{\"direction\":[1],\"description\":[1],\"theme\":[513],\"isOpen\":[32]},[[8,\"keydown\",\"handleGlobalKeydown\"],[9,\"pointerdown\",\"handleGlobalPointerDown\"]]]]],[\"diwa-radio-group\",[[1,\"diwa-radio-group\",{\"theme\":[513],\"label\":[1],\"description\":[1],\"value\":[1537],\"direction\":[513],\"required\":[4],\"disabled\":[516],\"state\":[513],\"message\":[1],\"compact\":[516],\"hideLabel\":[516,\"hide-label\"],\"name\":[1]},[[0,\"diwa-radio-select\",\"handleItemSelect\"]]]]],[\"diwa-radio-group-item\",[[17,\"diwa-radio-group-item\",{\"theme\":[513],\"value\":[513],\"checked\":[1540],\"name\":[1537],\"disabled\":[516],\"compact\":[516]},null,{\"checked\":[\"handleCheckedChange\"]}]]],[\"diwa-scroller\",[[1,\"diwa-scroller\",{\"alignScrollIndicator\":[1,\"align-scroll-indicator\"],\"scrollbar\":[4],\"theme\":[513],\"hasOverflow\":[32],\"canScrollLeft\":[32],\"canScrollRight\":[32]},[[9,\"resize\",\"handleWindowResize\"]]]]],[\"diwa-segmented-control\",[[1,\"diwa-segmented-control\",{\"theme\":[513],\"value\":[1537],\"disabled\":[516],\"compact\":[516]},[[0,\"diwa-segment-select\",\"handleItemSelect\"]]]]],[\"diwa-segmented-control-item\",[[17,\"diwa-segmented-control-item\",{\"theme\":[513],\"value\":[513],\"selected\":[1540],\"disabled\":[516],\"compact\":[516]}]]],[\"diwa-select\",[[17,\"diwa-select\",{\"theme\":[513],\"label\":[1],\"description\":[1],\"name\":[1],\"value\":[1025],\"state\":[513],\"message\":[1],\"hideLabel\":[516,\"hide-label\"],\"disabled\":[516],\"required\":[4],\"compact\":[516],\"dropdownDirection\":[1,\"dropdown-direction\"],\"isOpen\":[32],\"hasFilterResults\":[32],\"dropdownClass\":[32],\"open\":[64],\"close\":[64]},[[0,\"diwaSelectOptionUpdate\",\"onOptionUpdate\"],[0,\"slotchange\",\"onSlotChange\"]],{\"theme\":[\"onThemeChange\"],\"value\":[\"onValueChange\"],\"isOpen\":[\"onIsOpenChange\"]}]]],[\"diwa-select-option\",[[17,\"diwa-select-option\",{\"value\":[513],\"disabled\":[516],\"selected\":[1540],\"highlighted\":[1540],\"theme\":[1025],\"setFocus\":[64]}]]],[\"diwa-stepper-horizontal\",[[1,\"diwa-stepper-horizontal\",{\"theme\":[513],\"activeStepIndex\":[1026,\"active-step-index\"]},null,{\"activeStepIndex\":[\"handleIndexChange\"]}]]],[\"diwa-stepper-horizontal-item\",[[1,\"diwa-stepper-horizontal-item\",{\"theme\":[513],\"label\":[1],\"sublabel\":[1],\"state\":[1537],\"stepNumber\":[1026,\"step-number\"],\"isLast\":[1028,\"is-last\"]}]]],[\"diwa-table\",[[1,\"diwa-table\",{\"theme\":[513],\"caption\":[1],\"compact\":[4],\"layout\":[1],\"bordered\":[4],\"striped\":[4]},[[0,\"diwaTableUpdate\",\"handleTableUpdate\"]]]]],[\"diwa-table-body\",[[1,\"diwa-table-body\",{\"theme\":[513]}]]],[\"diwa-table-cell\",[[1,\"diwa-table-cell\",{\"theme\":[513],\"multiline\":[4]}]]],[\"diwa-table-head\",[[1,\"diwa-table-head\",{\"theme\":[513]}]]],[\"diwa-table-head-cell\",[[1,\"diwa-table-head-cell\",{\"theme\":[513],\"sort\":[16],\"hideLabel\":[4,\"hide-label\"],\"multiline\":[4]}]]],[\"diwa-table-row\",[[1,\"diwa-table-row\",{\"theme\":[513]}]]],[\"diwa-tabs\",[[1,\"diwa-tabs\",{\"theme\":[513],\"activeTabIndex\":[1026,\"active-tab-index\"]},null,{\"activeTabIndex\":[\"handleIndexChange\"]}]]],[\"diwa-tabs-bar\",[[1,\"diwa-tabs-bar\",{\"theme\":[513],\"activeTabIndex\":[1026,\"active-tab-index\"]},[[0,\"click\",\"handleClick\"],[0,\"keydown\",\"handleKeydown\"]],{\"activeTabIndex\":[\"handleIndexChange\"]}]]],[\"diwa-tabs-item\",[[1,\"diwa-tabs-item\",{\"theme\":[513],\"label\":[1],\"active\":[1540]}]]],[\"diwa-tag-dismissible\",[[17,\"diwa-tag-dismissible\",{\"variant\":[513],\"compact\":[516],\"label\":[1],\"theme\":[513]}]]],[\"diwa-text\",[[1,\"diwa-text\",{\"theme\":[513],\"tag\":[513],\"size\":[513],\"weight\":[513],\"align\":[513],\"color\":[513],\"ellipsis\":[516]}]]],[\"diwa-text-list\",[[1,\"diwa-text-list\",{\"theme\":[513],\"type\":[513]}]]],[\"diwa-text-list-item\",[[1,\"diwa-text-list-item\",{\"theme\":[513]}]]],[\"diwa-textarea\",[[17,\"diwa-textarea\",{\"label\":[1],\"description\":[1],\"state\":[1],\"message\":[1],\"name\":[1],\"value\":[1025],\"placeholder\":[1],\"required\":[4],\"disabled\":[516],\"readOnly\":[516,\"read-only\"],\"maxLength\":[2,\"max-length\"],\"minLength\":[2,\"min-length\"],\"rows\":[2],\"resize\":[1],\"compact\":[4],\"hideLabel\":[4,\"hide-label\"],\"theme\":[513]}]]],[\"diwa-spinner\",[[1,\"diwa-spinner\",{\"size\":[513],\"theme\":[513],\"label\":[1]}]]],[\"diwa-toast-item\",[[17,\"diwa-toast-item\",{\"theme\":[513],\"text\":[1],\"state\":[513]}]]],[\"diwa-icon\",[[1,\"diwa-icon\",{\"name\":[1],\"size\":[2],\"color\":[1],\"label\":[1],\"theme\":[513]}]]],[\"diwa-button-pure\",[[17,\"diwa-button-pure\",{\"theme\":[513],\"size\":[513],\"icon\":[1],\"disabled\":[516],\"loading\":[516],\"hideLabel\":[516,\"hide-label\"],\"active\":[516],\"underline\":[516],\"alignLabel\":[513,\"align-label\"],\"stretch\":[516],\"type\":[1],\"name\":[1],\"value\":[1],\"href\":[1],\"target\":[1],\"label\":[1]}]]]]"), options);
+};
+
+export { defineCustomElements };
+
+//# sourceMappingURL=loader.js.map

package/dist/esm/loader.js.map

@@ -0,0 +1 @@
+{"file":"loader.js","mappings":";;;;AAGY,MAAC,oBAAoB,GAAG,OAAO,GAAG,EAAE,OAAO,KAAK;AAC5D,EAAE,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,OAAO,SAAS,CAAC;AACtD,EAAE,MAAM,aAAa,EAAE,CAAC;AACxB,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D;;;;","names":[],"sources":["@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = async (win, options) => {\n  if (typeof window === 'undefined') return undefined;\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n};\n"],"version":3}

package/dist/esm/styles-e5a47a2d.js

@@ -0,0 +1,73 @@
+/**
+ * src/utils/styles.ts
+ * ===================
+ * Shared CSS-in-JS utilities reused across all Diwa web components.
+ *
+ * Mirrors the PDS shared style-building helper pattern found in:
+ *   packages/components/src/styles/
+ *
+ * Every exported function returns a CSS string fragment.
+ * Compose them inside a component's getComponentCss() function.
+ */
+/**
+ * Returns standard focus-visible ring CSS for the given inner selector.
+ *
+ * Used inside Shadow DOM <style> tags where :host selectors are scoped.
+ * Provides both the :host(:focus-visible) path (keyboard delegation via
+ * shadow.delegatesFocus) and the direct :focus-visible path on the element.
+ *
+ * WCAG 2.4.7 (AA) — all interactive elements must have a visible focus indicator.
+ * WCAG 2.4.11 (AA 2.2) — focus must be at least 2px with ≥3:1 contrast ratio.
+ *
+ * @param selector — CSS selector for the inner interactive element (e.g. '.inner')
+ */
+const getFocusStyle = (selector) => `
+  :host(:focus-visible) ${selector},
+  ${selector}:focus-visible {
+    outline: var(--diwa-focus-ring-width) solid var(--diwa-border-focus);
+    outline-offset: var(--diwa-focus-ring-offset);
+  }
+
+  ${selector}:focus:not(:focus-visible) {
+    outline: none;
+  }
+`;
+/**
+ * Returns a hover rule that only applies on pointer-capable devices.
+ *
+ * Prevents hover-only visuals from leaking onto touch-only devices where
+ * :hover can get "stuck" after tap.
+ */
+const getHoverCapableStyle = (selector, declarations) => `
+  @media (hover: hover) and (pointer: fine) {
+    ${selector}:hover {
+      ${declarations}
+    }
+  }
+`;
+/**
+ * Returns a @media (prefers-reduced-motion) override block for the given selectors.
+ *
+ * WCAG 2.3.3 (AAA) / WCAG 2.2.2 (AA): each animated component must include its
+ * own reduced-motion block because the global reset in app.css cannot cross the
+ * Shadow DOM boundary.
+ *
+ * @param selectors — one or more CSS selectors whose transitions/animations should
+ *                    be suppressed when the user requests reduced motion.
+ */
+const getReducedMotionStyle = (...selectors) => {
+    const selList = selectors.join(', ');
+    return `
+  @media (prefers-reduced-motion: reduce) {
+    ${selList} {
+      animation-duration: 0.01ms !important;
+      animation-iteration-count: 1 !important;
+      transition-duration: 0.01ms !important;
+    }
+  }
+`;
+};
+
+export { getReducedMotionStyle as a, getHoverCapableStyle as b, getFocusStyle as g };
+
+//# sourceMappingURL=styles-e5a47a2d.js.map

package/dist/esm/styles-e5a47a2d.js.map

@@ -0,0 +1 @@
+{"file":"styles-e5a47a2d.js","mappings":"AAAA;;;;;;;;;;;AAeA;;;;;;;;;;;;MAYa,aAAa,GAAG,CAAC,QAAgB,KAAa;0BACjC,QAAQ;IAC9B,QAAQ;;;;;IAKR,QAAQ;;;EAGV;AAEF;;;;;;MAMa,oBAAoB,GAAG,CAAC,QAAgB,EAAE,YAAoB,KAAa;;MAElF,QAAQ;QACN,YAAY;;;EAGlB;AAEF;;;;;;;;;;MAUa,qBAAqB,GAAG,CAAC,GAAG,SAAmB;IAC1D,MAAM,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACrC,OAAO;;MAEH,OAAO;;;;;;CAMZ,CAAC;AACF;;;;","names":[],"sources":["src/utils/styles.ts"],"sourcesContent":["/**\r\n * src/utils/styles.ts\r\n * ===================\r\n * Shared CSS-in-JS utilities reused across all Diwa web components.\r\n *\r\n * Mirrors the PDS shared style-building helper pattern found in:\r\n *   packages/components/src/styles/\r\n *\r\n * Every exported function returns a CSS string fragment.\r\n * Compose them inside a component's getComponentCss() function.\r\n */\r\n\r\n/** Theme identifiers — match the [data-theme] values used in app.css. */\r\nexport type Theme = 'light' | 'dark';\r\n\r\n/**\r\n * Returns standard focus-visible ring CSS for the given inner selector.\r\n *\r\n * Used inside Shadow DOM <style> tags where :host selectors are scoped.\r\n * Provides both the :host(:focus-visible) path (keyboard delegation via\r\n * shadow.delegatesFocus) and the direct :focus-visible path on the element.\r\n *\r\n * WCAG 2.4.7 (AA) — all interactive elements must have a visible focus indicator.\r\n * WCAG 2.4.11 (AA 2.2) — focus must be at least 2px with ≥3:1 contrast ratio.\r\n *\r\n * @param selector — CSS selector for the inner interactive element (e.g. '.inner')\r\n */\r\nexport const getFocusStyle = (selector: string): string => `\n  :host(:focus-visible) ${selector},\n  ${selector}:focus-visible {\n    outline: var(--diwa-focus-ring-width) solid var(--diwa-border-focus);\n    outline-offset: var(--diwa-focus-ring-offset);\n  }\n\n  ${selector}:focus:not(:focus-visible) {\n    outline: none;\n  }\n`;\n\n/**\n * Returns a hover rule that only applies on pointer-capable devices.\n *\n * Prevents hover-only visuals from leaking onto touch-only devices where\n * :hover can get \"stuck\" after tap.\n */\nexport const getHoverCapableStyle = (selector: string, declarations: string): string => `\n  @media (hover: hover) and (pointer: fine) {\n    ${selector}:hover {\n      ${declarations}\n    }\n  }\n`;\n\r\n/**\r\n * Returns a @media (prefers-reduced-motion) override block for the given selectors.\r\n *\r\n * WCAG 2.3.3 (AAA) / WCAG 2.2.2 (AA): each animated component must include its\r\n * own reduced-motion block because the global reset in app.css cannot cross the\r\n * Shadow DOM boundary.\r\n *\r\n * @param selectors — one or more CSS selectors whose transitions/animations should\r\n *                    be suppressed when the user requests reduced motion.\r\n */\r\nexport const getReducedMotionStyle = (...selectors: string[]): string => {\r\n  const selList = selectors.join(', ');\r\n  return `\r\n  @media (prefers-reduced-motion: reduce) {\r\n    ${selList} {\r\n      animation-duration: 0.01ms !important;\r\n      animation-iteration-count: 1 !important;\r\n      transition-duration: 0.01ms !important;\r\n    }\r\n  }\r\n`;\r\n};\r\n"],"version":3}

package/dist/index.cjs.js

@@ -0,0 +1 @@
+module.exports = require('./cjs/index.cjs.js');

package/dist/index.js

@@ -0,0 +1 @@
+export * from './esm/index.js';

package/dist/types/components/diwa-accordion/diwa-accordion-styles.d.ts

@@ -0,0 +1,13 @@
+/**
+ * diwa-accordion-styles.ts
+ * =========================
+ * CSS-in-JS styles for <diwa-accordion>.
+ *
+ * Animation technique: CSS `grid-template-rows: 0fr ↔ 1fr` — smoothly
+ * collapses/expands the content without requiring fixed heights.
+ *
+ * The inner wrapper uses `visibility: hidden` when closed so keyboard focus
+ * cannot reach interactive content inside a collapsed panel.
+ */
+export declare const getComponentCss: () => string;
+//# sourceMappingURL=diwa-accordion-styles.d.ts.map

package/dist/types/components/diwa-accordion/diwa-accordion.d.ts

@@ -0,0 +1,62 @@
+import { type EventEmitter } from '../../stencil-public-runtime';
+import type { AccordionHeadingTag } from './types';
+import type { Theme } from '../../utils/styles';
+/**
+ * @component diwa-accordion
+ *
+ * A controlled, animated accordion panel. The consumer is responsible
+ * for toggling the `open` prop in response to the `update` event —
+ * the same controlled pattern used throughout PDS.
+ *
+ * Accessibility:
+ *   - Heading tag wraps the toggle button (ARIA Authoring Practices §3.1)
+ *   - Button has `aria-expanded` and `aria-controls` pointing to the panel
+ *   - Panel has `role="region"` and `aria-labelledby` the button id
+ *   - `visibility: hidden` when closed keeps interactive slot content
+ *     out of the keyboard tab order
+ *
+ * Usage:
+ *   <diwa-accordion heading="What is this?" open={false} onUpdate={e => open = e.detail.open}>
+ *     Content here.
+ *   </diwa-accordion>
+ *
+ * @slot default — Collapsible content rendered inside the panel.
+ */
+export declare class DiwaAccordion {
+    host: HTMLDiwaAccordionElement;
+    private readonly uid;
+    private get buttonId();
+    private get panelId();
+    /** Per-component theme override (`light` / `dark`). */
+    theme: Theme;
+    /** Visible heading text rendered inside the toggle button. */
+    heading: string;
+    /** Semantic heading level for the toggle button wrapper. */
+    headingTag: AccordionHeadingTag;
+    /**
+     * Whether the accordion panel is currently open.
+     *
+     * This is a **controlled** prop: the component always reflects
+     * its `open` state outward via the `update` event, but never
+     * mutates the prop internally. The consumer must update it.
+     */
+    open: boolean;
+    /** Reduces padding and font size for denser UI contexts. */
+    compact: boolean;
+    /**
+     * Emitted when the user clicks the header toggle button.
+     *
+     * `event.detail.open` is the **requested** next state.
+     * The consumer must set the `open` prop accordingly:
+     *
+     * ```html
+     * <diwa-accordion onUpdate={e => this.open = e.detail.open} />
+     * ```
+     */
+    update: EventEmitter<{
+        open: boolean;
+    }>;
+    private handleToggle;
+    render(): any;
+}
+//# sourceMappingURL=diwa-accordion.d.ts.map

package/dist/types/components/diwa-accordion/types.d.ts

@@ -0,0 +1,3 @@
+/** Valid heading tag levels for the accordion's visible heading. */
+export type AccordionHeadingTag = 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+//# sourceMappingURL=types.d.ts.map

package/dist/types/components/diwa-badge/diwa-badge-styles.d.ts

@@ -0,0 +1,2 @@
+export declare const getComponentCss: () => string;
+//# sourceMappingURL=diwa-badge-styles.d.ts.map

package/dist/types/components/diwa-badge/diwa-badge.d.ts

@@ -0,0 +1,38 @@
+import type { BadgeSize, BadgeVariant } from "./types";
+import type { Theme } from '../../utils/styles';
+/**
+ * @component diwa-badge
+ *
+ * A compact, pill-shaped label used to convey status, counts, or metadata.
+ * Renders as an inline element with full Shadow DOM encapsulation.
+ *
+ * Design token override API (set on :root or any ancestor):
+ *   --diwa-badge-radius          Border radius (defaults to --diwa-radius-full)
+ *   --diwa-badge-padding-x       Horizontal padding for md size
+ *   --diwa-badge-padding-x-sm    Horizontal padding for sm size
+ *   --diwa-badge-font-size       Font size for md size
+ *   --diwa-badge-font-size-sm    Font size for sm size
+ *   --diwa-badge-font-weight     Font weight
+ *
+ * Usage:
+ *   <diwa-badge variant="success">Active</diwa-badge>
+ *   <diwa-badge variant="danger" size="sm">3 errors</diwa-badge>
+ *   <diwa-badge variant="neutral">Draft</diwa-badge>
+ *
+ * @slot default — Badge label content (text or mixed inline content)
+ */
+export declare class DiwaBadge {
+    /** Semantic colour variant. Determines background and text colour. */
+    variant: BadgeVariant;
+    /** Size tier — controls height, padding, and font-size. */
+    size: BadgeSize;
+    /**
+     * Accessible label. Use when slot content alone is insufficient
+     * (e.g., a numeric count without surrounding context).
+     */
+    label?: string;
+    /** Per-component theme override. */
+    theme: Theme;
+    render(): any;
+}
+//# sourceMappingURL=diwa-badge.d.ts.map

package/dist/types/components/diwa-badge/types.d.ts

@@ -0,0 +1,10 @@
+/**
+ * diwa-badge — Public TypeScript interfaces
+ * ==========================================
+ * Exported so framework wrapper packages and consumers can share these types.
+ */
+/** Visual variant of the badge. Maps to semantic colour roles. */
+export type BadgeVariant = "neutral" | "accent" | "success" | "warning" | "danger";
+/** Size tier. Controls height, padding, and font-size. */
+export type BadgeSize = "sm" | "md";
+//# sourceMappingURL=types.d.ts.map

package/dist/types/components/diwa-button/diwa-button-styles.d.ts

@@ -0,0 +1,29 @@
+/**
+ * diwa-button-styles.ts
+ * ======================
+ * CSS-in-JS style function for <diwa-button>.
+ *
+ * Returns a complete, scoped CSS string injected into the component's Shadow DOM
+ * via a <style innerHTML={...}> element in render(). This follows the shared
+ * Diwa component styling architecture used across web components.
+ *
+ * All colour values use CSS custom properties (--diwa-*) — raw values are never
+ * hardcoded. This means theming is entirely handled by the token cascade: when the
+ * host element carries data-theme="light", the [data-theme="light"] overrides
+ * defined in app.css cascade into the Shadow DOM via custom property inheritance.
+ *
+ * The function accepts the full prop surface for future conditional optimisation
+ * (e.g. generating only variant- or size-specific CSS to reduce payload), but
+ * currently outputs the complete ruleset regardless of prop values.
+ */
+import type { ButtonSize, ButtonVariant } from './types';
+/**
+ * Generates scoped CSS for the <diwa-button> shadow tree.
+ *
+ * @param _variant  — current ButtonVariant (reserved for conditional CSS)
+ * @param _size     — current ButtonSize    (reserved for conditional CSS)
+ * @param _disabled — disabled state        (reserved for conditional CSS)
+ * @param _loading  — loading state         (reserved for conditional CSS)
+ */
+export declare const getComponentCss: (_variant: ButtonVariant, _size: ButtonSize, _disabled: boolean, _loading: boolean) => string;
+//# sourceMappingURL=diwa-button-styles.d.ts.map

package/dist/types/components/diwa-button/diwa-button-utils.d.ts

@@ -0,0 +1,42 @@
+/**
+ * diwa-button-utils.ts
+ * =====================
+ * Utility types and helper functions for <diwa-button>.
+ *
+ * Mirrors the PDS pattern used in:
+ *   packages/components/src/components/button/button-utils.ts
+ *
+ * Separating ARIA logic into a dedicated utility file keeps the main component
+ * lean and makes the accessibility mapping independently testable.
+ */
+/**
+ * ARIA attributes applied to the inner interactive element (<button> or <a>).
+ * All keys are optional — only set when semantically appropriate.
+ */
+export interface ButtonAriaAttributes {
+    /** Accessible text label — overrides slot content for AT. */
+    'aria-label'?: string;
+    /** Signals that the button is performing an async operation. */
+    'aria-busy'?: 'true';
+    /** Used on <a> elements (which have no native disabled attribute). */
+    'aria-disabled'?: 'true';
+}
+/**
+ * Assembles ARIA attributes for the inner interactive element.
+ *
+ * Decision table:
+ * - `aria-label`    → set when `label` prop is provided (icon-only or supplemental name)
+ * - `aria-busy`     → set when `loading` is true (announces async activity to AT)
+ * - `aria-disabled` → set when disabled **and** the element is an <a> (links have no
+ *                     native disabled — we simulate it with aria + tabIndex=-1)
+ *
+ * For native <button>: disabled/loading are expressed via the `disabled` HTML attribute
+ * (handled in the calling component's render), so `aria-disabled` is not needed there.
+ *
+ * @param disabled — whether the button interaction is blocked
+ * @param loading  — whether the button is performing an async operation
+ * @param label    — accessible label string (optional)
+ * @param isLink   — true when the component renders as <a> (href is provided)
+ */
+export declare const getButtonAriaAttributes: (disabled: boolean, loading: boolean, label: string | undefined, isLink: boolean) => ButtonAriaAttributes;
+//# sourceMappingURL=diwa-button-utils.d.ts.map