@redvars/peacock 3.8.1 → 3.8.2

package/dist/datasource-B2eRh6Or.js

@@ -0,0 +1,108 @@
+import { e } from './directive-ZPhl09Yt.js';
+import { e as e$1 } from './unsafe-html-Ct0N2_UU.js';
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class t extends e$1{}t.directiveName="unsafeSVG",t.resultType=2;const o=e(t);
+
+// Basic sanitization: remove <script>, <foreignObject>, event handler attributes (on*), and iframes
+function sanitizeSvg(rawSvg) {
+    try {
+        const parser = new DOMParser();
+        const doc = parser.parseFromString(rawSvg, 'image/svg+xml');
+        const scripts = Array.from(doc.querySelectorAll('script'));
+        scripts.forEach(n => n.remove());
+        const foreigns = Array.from(doc.querySelectorAll('foreignObject, iframe'));
+        foreigns.forEach(n => n.remove());
+        const all = Array.from(doc.querySelectorAll('*'));
+        all.forEach(el => {
+            const attrs = Array.from(el.attributes).filter(a => /^on/i.test(a.name));
+            attrs.forEach(a => el.removeAttribute(a.name));
+        });
+        const el = doc.documentElement;
+        if (!el)
+            return '';
+        const serializer = new XMLSerializer();
+        return serializer.serializeToString(el);
+    }
+    catch (e) {
+        return '';
+    }
+}
+
+async function createCacheFetch(name) {
+    let cache = null;
+    // This map tracks requests currently being processed
+    const inFlightRequests = new Map();
+    try {
+        cache = await window.caches.open(name);
+    }
+    catch (e) {
+        console.warn('window.caches access not allowed');
+    }
+    return async (url) => {
+        if (inFlightRequests.has(url)) {
+            return inFlightRequests.get(url);
+        }
+        const fetchPromise = (async () => {
+            const request = new Request(url);
+            if (cache) {
+                const cachedResponse = await cache.match(request);
+                if (cachedResponse) {
+                    return cachedResponse.text();
+                }
+            }
+            const urlObj = new URL(request.url);
+            const isSameOrigin = urlObj.origin === window.location.origin;
+            const response = await fetch(request.url, {
+                method: 'GET',
+                mode: isSameOrigin ? 'no-cors' : 'cors',
+                credentials: isSameOrigin ? 'same-origin' : 'omit',
+            });
+            if (response.status === 404) {
+                console.error(`[Fetch Error] Resource not found (404): ${url}`);
+                return '';
+            }
+            const result = await response.text();
+            if (cache && response.status === 200) {
+                await cache.put(request, new Response(result, {
+                    status: response.status,
+                    statusText: response.statusText,
+                    headers: response.headers,
+                }));
+            }
+            return result;
+        })();
+        inFlightRequests.set(url, fetchPromise);
+        try {
+            return await fetchPromise;
+        }
+        finally {
+            inFlightRequests.delete(url);
+        }
+    };
+}
+
+const PROVIDERS = {
+    'material-symbols': (name) => `https://cdn.jsdelivr.net/npm/@material-symbols/svg-500@0.40.1/outlined/${name}.svg`,
+    carbon: (name) => `https://cdn.jsdelivr.net/npm/@carbon/icons@11.41.0/svg/32/${name}.svg`,
+};
+const cacheFetch = await createCacheFetch('svg-cache');
+async function fetchSVG(url) {
+    if (!url)
+        return '';
+    return cacheFetch(url);
+}
+async function fetchIcon(name, provider = 'material-symbols') {
+    if (!name)
+        return '';
+    if (!PROVIDERS[provider]) {
+        throw new Error(`Provider '${provider}' not found`);
+    }
+    return fetchSVG(PROVIDERS[provider](name));
+}
+
+export { fetchIcon as a, fetchSVG as f, o, sanitizeSvg as s };
+//# sourceMappingURL=datasource-B2eRh6Or.js.map

package/dist/datasource-B2eRh6Or.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datasource-B2eRh6Or.js","sources":["../node_modules/lit-html/directives/unsafe-svg.js","../../src/__internal/utils/sanitize-svg.ts","../../src/__internal/utils/cache-fetch.ts","../../src/icon/datasource.ts"],"sourcesContent":["import{directive as s}from\"../directive.js\";import{UnsafeHTMLDirective as e}from\"./unsafe-html.js\";\n/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */class t extends e{}t.directiveName=\"unsafeSVG\",t.resultType=2;const o=s(t);export{o as unsafeSVG};\n//# sourceMappingURL=unsafe-svg.js.map\n","// Basic sanitization: remove <script>, <foreignObject>, event handler attributes (on*), and iframes\nexport function sanitizeSvg(rawSvg: string) {\n  try {\n    const parser = new DOMParser();\n    const doc = parser.parseFromString(rawSvg, 'image/svg+xml');\n\n    const scripts = Array.from(doc.querySelectorAll('script'));\n    scripts.forEach(n => n.remove());\n\n    const foreigns = Array.from(doc.querySelectorAll('foreignObject, iframe'));\n    foreigns.forEach(n => n.remove());\n\n    const all = Array.from(doc.querySelectorAll('*'));\n    all.forEach(el => {\n      const attrs = Array.from(el.attributes).filter(a => /^on/i.test(a.name));\n      attrs.forEach(a => el.removeAttribute(a.name));\n    });\n\n    const el = doc.documentElement;\n    if (!el) return '';\n\n    const serializer = new XMLSerializer();\n    return serializer.serializeToString(el);\n  } catch (e) {\n    return '';\n  }\n}","export async function createCacheFetch(name: string) {\n  let cache: Cache | null = null;\n  // This map tracks requests currently being processed\n  const inFlightRequests = new Map<string, Promise<string>>();\n\n  try {\n    cache = await window.caches.open(name);\n  } catch (e) {\n    console.warn('window.caches access not allowed');\n  }\n\n  return async (url: string): Promise<string> => {\n    if (inFlightRequests.has(url)) {\n      return inFlightRequests.get(url)!;\n    }\n\n    const fetchPromise = (async () => {\n      const request = new Request(url);\n\n      if (cache) {\n        const cachedResponse = await cache.match(request);\n        if (cachedResponse) {\n          return cachedResponse.text();\n        }\n      }\n\n      const urlObj = new URL(request.url);\n      const isSameOrigin = urlObj.origin === window.location.origin;\n\n      const response = await fetch(request.url, {\n        method: 'GET',\n        mode: isSameOrigin ? 'no-cors' : 'cors',\n        credentials: isSameOrigin ? 'same-origin' : 'omit',\n      });\n\n      if (response.status === 404) {\n        console.error(`[Fetch Error] Resource not found (404): ${url}`);\n        return '';\n      }\n\n      const result = await response.text();\n\n      if (cache && response.status === 200) {\n        await cache.put(\n          request,\n          new Response(result, {\n            status: response.status,\n            statusText: response.statusText,\n            headers: response.headers,\n          }),\n        );\n      }\n\n      return result;\n    })();\n\n    inFlightRequests.set(url, fetchPromise);\n\n    try {\n      return await fetchPromise;\n    } finally {\n      inFlightRequests.delete(url);\n    }\n  };\n}","import { createCacheFetch } from '@/__internal/utils/cache-fetch.js';\n\nconst PROVIDERS: Record<string, (name: string) => string> = {\n  'material-symbols': (name: string) =>\n    `https://cdn.jsdelivr.net/npm/@material-symbols/svg-500@0.40.1/outlined/${name}.svg`,\n  carbon: (name: string) =>\n    `https://cdn.jsdelivr.net/npm/@carbon/icons@11.41.0/svg/32/${name}.svg`,\n};\n\nconst cacheFetch = await createCacheFetch('svg-cache');\n\nexport async function fetchSVG(url: string) {\n  if (!url) return '';\n  return cacheFetch(url);\n}\n\nexport async function fetchIcon(\n  name: string,\n  provider: string = 'material-symbols',\n) {\n  if (!name) return '';\n\n  if (!PROVIDERS[provider]) {\n    throw new Error(`Provider '${provider}' not found`);\n  }\n\n  return fetchSVG(PROVIDERS[provider](name));\n}\n"],"names":["e","s"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/dispatch-event-utils-CuEqjlPT.js.map

@@ -1 +1 @@
-{"version":3,"file":"dispatch-event-utils-CuEqjlPT.js","sources":["../../src/__utils/dispatch-event-utils.ts"],"sourcesContent":["\n/**\n * Dispatches a click event to the given element that triggers a native action,\n * but is not composed and therefore is not seen outside the element.\n *\n * This is useful for responding to an external click event on the host element\n * that should trigger an internal action like a button click.\n *\n * Note, a helper is provided because setting this up correctly is a bit tricky.\n * In particular, calling `click` on an element creates a composed event, which\n * is not desirable, and a manually dispatched event must specifically be a\n * `MouseEvent` to trigger a native action.\n *\n * @example\n * hostClickListener = (event: MouseEvent) {\n *   if (isActivationClick(event)) {\n *     this.dispatchActivationClick(this.buttonElement);\n *   }\n * }\n *\n */\nexport function dispatchActivationClick(element: HTMLElement) {\n  const event = new MouseEvent('click', { bubbles: true });\n  element.dispatchEvent(event);\n  return event;\n}\n\n// Ignore events for one microtask only.\nlet isSquelchingEvents = false;\nasync function __squelchEventsForMicrotask() {\n  isSquelchingEvents = true;\n  // Need to pause for just one microtask.\n  // tslint:disable-next-line\n  await null;\n  isSquelchingEvents = false;\n}\n\n// TODO(https://bugzilla.mozilla.org/show_bug.cgi?id=1804576)\n//  Remove when Firefox bug is addressed.\nfunction __squelchEvent(event: Event) {\n  const squelched = isSquelchingEvents;\n  if (squelched) {\n    event.preventDefault();\n    event.stopImmediatePropagation();\n  }\n  __squelchEventsForMicrotask();\n  return squelched;\n}\n\n/**\n * Returns true if the click event should trigger an activation behavior. The\n * behavior is defined by the element and is whatever it should do when\n * clicked.\n *\n * Typically when an element needs to handle a click, the click is generated\n * from within the element and an event listener within the element implements\n * the needed behavior; however, it's possible to fire a click directly\n * at the element that the element should handle. This method helps\n * distinguish these \"external\" clicks.\n *\n * An \"external\" click can be triggered in a number of ways: via a click\n * on an associated label for a form  associated element, calling\n * `element.click()`, or calling\n * `element.dispatchEvent(new MouseEvent('click', ...))`.\n *\n * Also works around Firefox issue\n * https://bugzilla.mozilla.org/show_bug.cgi?id=1804576 by squelching\n * events for a microtask after called.\n *\n * @example\n * hostClickListener = (event: MouseEvent) {\n *   if (isActivationClick(event)) {\n *     this.dispatchActivationClick(this.buttonElement);\n *   }\n * }\n *\n */\nexport function isActivationClick(event: Event) {\n  // Event must start at the event target.\n  if (event.currentTarget !== event.target) {\n    return false;\n  }\n  // Event must not be retargeted from shadowRoot.\n  if (event.composedPath()[0] !== event.target) {\n    return false;\n  }\n \n  // Target must not be disabled; this should only occur for a synthetically\n  // dispatched click.\n  if ((event.target as EventTarget & { disabled: boolean }).disabled) {\n    return false;\n  }\n  // This is an activation if the event should not be squelched.\n  return !__squelchEvent(event);\n}\n\n/**\n * Re-dispatches an event from the provided element.\n *\n * This function is useful for forwarding non-composed events, such as `change`\n * events.\n *\n * @example\n * class MyInput extends LitElement {\n *   render() {\n *     return html`<input @change=${this.redispatchEvent}>`;\n *   }\n *\n *   protected redispatchEvent(event: Event) {\n *     redispatchEvent(this, event);\n *   }\n * }\n *\n * @param element The element to dispatch the event from.\n * @param event The event to re-dispatch.\n * @return Whether or not the event was dispatched (if cancelable).\n */\nexport function redispatchEvent(element: Element, event: Event) {\n  // For bubbling events in SSR light DOM (or composed), stop their propagation\n  // and dispatch the copy.\n  if (event.bubbles && (!element.shadowRoot || event.composed)) {\n    event.stopPropagation();\n  }\n\n  const copy = Reflect.construct(event.constructor, [event.type, event]);\n  const dispatched = element.dispatchEvent(copy);\n  if (!dispatched) {\n    event.preventDefault();\n  }\n\n  return dispatched;\n}\n"],"names":[],"mappings":"AACA;;;;;;;;;;;;;;;;;;;AAmBG;AACG,SAAU,uBAAuB,CAAC,OAAoB,EAAA;AAC1D,IAAA,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACxD,IAAA,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC;AAC5B,IAAA,OAAO,KAAK;AACd;AAEA;AACA,IAAI,kBAAkB,GAAG,KAAK;AAC9B,eAAe,2BAA2B,GAAA;IACxC,kBAAkB,GAAG,IAAI;;;AAGzB,IAAA,MAAM,IAAI;IACV,kBAAkB,GAAG,KAAK;AAC5B;AAEA;AACA;AACA,SAAS,cAAc,CAAC,KAAY,EAAA;IAClC,MAAM,SAAS,GAAG,kBAAkB;IACpC,IAAI,SAAS,EAAE;QACb,KAAK,CAAC,cAAc,EAAE;QACtB,KAAK,CAAC,wBAAwB,EAAE;IAClC;AACA,IAAA,2BAA2B,EAAE;AAC7B,IAAA,OAAO,SAAS;AAClB;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BG;AACG,SAAU,iBAAiB,CAAC,KAAY,EAAA;;IAE5C,IAAI,KAAK,CAAC,aAAa,KAAK,KAAK,CAAC,MAAM,EAAE;AACxC,QAAA,OAAO,KAAK;IACd;;AAEA,IAAA,IAAI,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,MAAM,EAAE;AAC5C,QAAA,OAAO,KAAK;IACd;;;AAIA,IAAA,IAAK,KAAK,CAAC,MAA8C,CAAC,QAAQ,EAAE;AAClE,QAAA,OAAO,KAAK;IACd;;AAEA,IAAA,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC;AAC/B;AAEA;;;;;;;;;;;;;;;;;;;;AAoBG;AACG,SAAU,eAAe,CAAC,OAAgB,EAAE,KAAY,EAAA;;;AAG5D,IAAA,IAAI,KAAK,CAAC,OAAO,KAAK,CAAC,OAAO,CAAC,UAAU,IAAI,KAAK,CAAC,QAAQ,CAAC,EAAE;QAC5D,KAAK,CAAC,eAAe,EAAE;IACzB;AAEA,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IACtE,MAAM,UAAU,GAAG,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC;IAC9C,IAAI,CAAC,UAAU,EAAE;QACf,KAAK,CAAC,cAAc,EAAE;IACxB;AAEA,IAAA,OAAO,UAAU;AACnB;;;;"}
+{"version":3,"file":"dispatch-event-utils-CuEqjlPT.js","sources":["../../src/__internal/utils/dispatch-event-utils.ts"],"sourcesContent":["\n/**\n * Dispatches a click event to the given element that triggers a native action,\n * but is not composed and therefore is not seen outside the element.\n *\n * This is useful for responding to an external click event on the host element\n * that should trigger an internal action like a button click.\n *\n * Note, a helper is provided because setting this up correctly is a bit tricky.\n * In particular, calling `click` on an element creates a composed event, which\n * is not desirable, and a manually dispatched event must specifically be a\n * `MouseEvent` to trigger a native action.\n *\n * @example\n * hostClickListener = (event: MouseEvent) {\n *   if (isActivationClick(event)) {\n *     this.dispatchActivationClick(this.buttonElement);\n *   }\n * }\n *\n */\nexport function dispatchActivationClick(element: HTMLElement) {\n  const event = new MouseEvent('click', { bubbles: true });\n  element.dispatchEvent(event);\n  return event;\n}\n\n// Ignore events for one microtask only.\nlet isSquelchingEvents = false;\nasync function __squelchEventsForMicrotask() {\n  isSquelchingEvents = true;\n  // Need to pause for just one microtask.\n  // tslint:disable-next-line\n  await null;\n  isSquelchingEvents = false;\n}\n\n// TODO(https://bugzilla.mozilla.org/show_bug.cgi?id=1804576)\n//  Remove when Firefox bug is addressed.\nfunction __squelchEvent(event: Event) {\n  const squelched = isSquelchingEvents;\n  if (squelched) {\n    event.preventDefault();\n    event.stopImmediatePropagation();\n  }\n  __squelchEventsForMicrotask();\n  return squelched;\n}\n\n/**\n * Returns true if the click event should trigger an activation behavior. The\n * behavior is defined by the element and is whatever it should do when\n * clicked.\n *\n * Typically when an element needs to handle a click, the click is generated\n * from within the element and an event listener within the element implements\n * the needed behavior; however, it's possible to fire a click directly\n * at the element that the element should handle. This method helps\n * distinguish these \"external\" clicks.\n *\n * An \"external\" click can be triggered in a number of ways: via a click\n * on an associated label for a form  associated element, calling\n * `element.click()`, or calling\n * `element.dispatchEvent(new MouseEvent('click', ...))`.\n *\n * Also works around Firefox issue\n * https://bugzilla.mozilla.org/show_bug.cgi?id=1804576 by squelching\n * events for a microtask after called.\n *\n * @example\n * hostClickListener = (event: MouseEvent) {\n *   if (isActivationClick(event)) {\n *     this.dispatchActivationClick(this.buttonElement);\n *   }\n * }\n *\n */\nexport function isActivationClick(event: Event) {\n  // Event must start at the event target.\n  if (event.currentTarget !== event.target) {\n    return false;\n  }\n  // Event must not be retargeted from shadowRoot.\n  if (event.composedPath()[0] !== event.target) {\n    return false;\n  }\n \n  // Target must not be disabled; this should only occur for a synthetically\n  // dispatched click.\n  if ((event.target as EventTarget & { disabled: boolean }).disabled) {\n    return false;\n  }\n  // This is an activation if the event should not be squelched.\n  return !__squelchEvent(event);\n}\n\n/**\n * Re-dispatches an event from the provided element.\n *\n * This function is useful for forwarding non-composed events, such as `change`\n * events.\n *\n * @example\n * class MyInput extends LitElement {\n *   render() {\n *     return html`<input @change=${this.redispatchEvent}>`;\n *   }\n *\n *   protected redispatchEvent(event: Event) {\n *     redispatchEvent(this, event);\n *   }\n * }\n *\n * @param element The element to dispatch the event from.\n * @param event The event to re-dispatch.\n * @return Whether or not the event was dispatched (if cancelable).\n */\nexport function redispatchEvent(element: Element, event: Event) {\n  // For bubbling events in SSR light DOM (or composed), stop their propagation\n  // and dispatch the copy.\n  if (event.bubbles && (!element.shadowRoot || event.composed)) {\n    event.stopPropagation();\n  }\n\n  const copy = Reflect.construct(event.constructor, [event.type, event]);\n  const dispatched = element.dispatchEvent(copy);\n  if (!dispatched) {\n    event.preventDefault();\n  }\n\n  return dispatched;\n}\n"],"names":[],"mappings":"AACA;;;;;;;;;;;;;;;;;;;AAmBG;AACG,SAAU,uBAAuB,CAAC,OAAoB,EAAA;AAC1D,IAAA,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACxD,IAAA,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC;AAC5B,IAAA,OAAO,KAAK;AACd;AAEA;AACA,IAAI,kBAAkB,GAAG,KAAK;AAC9B,eAAe,2BAA2B,GAAA;IACxC,kBAAkB,GAAG,IAAI;;;AAGzB,IAAA,MAAM,IAAI;IACV,kBAAkB,GAAG,KAAK;AAC5B;AAEA;AACA;AACA,SAAS,cAAc,CAAC,KAAY,EAAA;IAClC,MAAM,SAAS,GAAG,kBAAkB;IACpC,IAAI,SAAS,EAAE;QACb,KAAK,CAAC,cAAc,EAAE;QACtB,KAAK,CAAC,wBAAwB,EAAE;IAClC;AACA,IAAA,2BAA2B,EAAE;AAC7B,IAAA,OAAO,SAAS;AAClB;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BG;AACG,SAAU,iBAAiB,CAAC,KAAY,EAAA;;IAE5C,IAAI,KAAK,CAAC,aAAa,KAAK,KAAK,CAAC,MAAM,EAAE;AACxC,QAAA,OAAO,KAAK;IACd;;AAEA,IAAA,IAAI,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,MAAM,EAAE;AAC5C,QAAA,OAAO,KAAK;IACd;;;AAIA,IAAA,IAAK,KAAK,CAAC,MAA8C,CAAC,QAAQ,EAAE;AAClE,QAAA,OAAO,KAAK;IACd;;AAEA,IAAA,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC;AAC/B;AAEA;;;;;;;;;;;;;;;;;;;;AAoBG;AACG,SAAU,eAAe,CAAC,OAAgB,EAAE,KAAY,EAAA;;;AAG5D,IAAA,IAAI,KAAK,CAAC,OAAO,KAAK,CAAC,OAAO,CAAC,UAAU,IAAI,KAAK,CAAC,QAAQ,CAAC,EAAE;QAC5D,KAAK,CAAC,eAAe,EAAE;IACzB;AAEA,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IACtE,MAAM,UAAU,GAAG,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC;IAC9C,IAAI,CAAC,UAAU,EAAE;QACf,KAAK,CAAC,cAAc,EAAE;IACxB;AAEA,IAAA,OAAO,UAAU;AACnB;;;;"}

package/dist/divider.js

@@ -0,0 +1,135 @@
+import { i, _ as __decorate, I as IndividualComponent, a as i$1, b } from './IndividualComponent-Bdwyrvd6.js';
+import { n } from './property-B49QQ8pS.js';
+import { r } from './state-DkTK9EGF.js';
+import { e } from './class-map-DG7CA1et.js';
+import { o as observerSlotChangesWithCallback } from './observe-slot-change-DPxaZrZF.js';
+import './directive-ZPhl09Yt.js';
+
+var css_248z = i`* {
+  box-sizing: border-box;
+}
+
+.screen-reader-only {
+  display: none !important;
+}
+
+[hidden] {
+  display: none !important;
+}
+
+:host {
+  display: block;
+  --divider-color: var(--color-outline-variant);
+  --divider-spacing: var(--spacing-200);
+  --divider-line-thickness: 1px;
+}
+
+.divider {
+  display: flex;
+  margin: 0;
+  font-family: var(--typography-body-medium-font-family) !important;
+  font-size: var(--typography-body-medium-font-size) !important;
+  font-weight: var(--typography-body-medium-font-weight) !important;
+  line-height: var(--typography-body-medium-line-height) !important;
+  letter-spacing: var(--typography-body-medium-letter-spacing) !important;
+  color: var(--divider-color);
+  --_line-border: var(--divider-line-thickness) solid var(--divider-color);
+}
+.divider:not(.vertical) {
+  width: 100%;
+  padding: var(--divider-spacing) 0;
+  align-items: center;
+  justify-content: center;
+}
+.divider:not(.vertical) .line {
+  width: 100%;
+  border-top: var(--_line-border);
+}
+.divider:not(.vertical).slot-has-content .slot-container {
+  padding: 0 var(--spacing-200);
+}
+.divider.vertical {
+  height: 100%;
+  padding: 0 var(--divider-spacing);
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+.divider.vertical .line {
+  height: 100%;
+  border-right: var(--_line-border);
+}
+.divider.vertical.slot-has-content .slot-container {
+  padding: var(--spacing-200) 0;
+}
+
+:host(:not([vertical])) {
+  width: auto;
+}
+
+:host([vertical]) {
+  height: auto;
+}`;
+
+/**
+ * @label Divider
+ * @tag wc-divider
+ * @rawTag divider
+ *
+ * @summary The divider component is used to visually separate content.
+ * @overview
+ *  - Dividers are used to separate content into clear groups, making it easier for users to scan and understand the information presented.
+ *  - They can be oriented either vertically or horizontally, depending on the layout requirements.
+ *
+ * @cssprop --divider-color - Controls the color of the divider.
+ * @cssprop --divider-padding - Controls the padding of the divider.
+ *
+ * @example
+ * ```html
+ * <wc-divider style="width: 12rem;">or</wc-divider>
+ * ```
+ * @tags display
+ */
+let Divider = class Divider extends i$1 {
+    constructor() {
+        super(...arguments);
+        /** When true, renders the divider vertically. Defaults to horizontal. */
+        this.vertical = false;
+        /** True when the default slot contains content, used to show the label variant. */
+        this.slotHasContent = false;
+    }
+    firstUpdated() {
+        observerSlotChangesWithCallback(this.renderRoot.querySelector('slot'), hasContent => {
+            this.slotHasContent = hasContent;
+            this.requestUpdate();
+        });
+    }
+    render() {
+        return b `<div
+      class=${e({
+            divider: true,
+            vertical: this.vertical,
+            'slot-has-content': this.slotHasContent,
+        })}
+    >
+      <div class="line"></div>
+      <div class="slot-container">
+        <slot></slot>
+      </div>
+      <div class="line"></div>
+    </div>`;
+    }
+};
+Divider.styles = [css_248z];
+__decorate([
+    n({ type: Boolean, reflect: true })
+], Divider.prototype, "vertical", void 0);
+__decorate([
+    r()
+], Divider.prototype, "slotHasContent", void 0);
+Divider = __decorate([
+    IndividualComponent
+], Divider);
+
+export { Divider };
+//# sourceMappingURL=divider.js.map

package/dist/divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.js","sources":["../../src/divider/divider.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { observerSlotChangesWithCallback } from '@/__internal/utils/observe-slot-change.js';\n\nimport styles from './divider.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Divider\n * @tag wc-divider\n * @rawTag divider\n *\n * @summary The divider component is used to visually separate content.\n * @overview\n *  - Dividers are used to separate content into clear groups, making it easier for users to scan and understand the information presented.\n *  - They can be oriented either vertically or horizontally, depending on the layout requirements.\n *\n * @cssprop --divider-color - Controls the color of the divider.\n * @cssprop --divider-padding - Controls the padding of the divider.\n *\n * @example\n * ```html\n * <wc-divider style=\"width: 12rem;\">or</wc-divider>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class Divider extends LitElement {\n  static styles = [styles];\n\n  /** When true, renders the divider vertically. Defaults to horizontal. */\n  @property({ type: Boolean, reflect: true }) vertical = false;\n\n  /** True when the default slot contains content, used to show the label variant. */\n  @state()\n  slotHasContent = false;\n\n  firstUpdated() {\n    observerSlotChangesWithCallback(\n      this.renderRoot.querySelector('slot'),\n      hasContent => {\n        this.slotHasContent = hasContent;\n        this.requestUpdate();\n      },\n    );\n  }\n\n  render() {\n    return html`<div\n      class=${classMap({\n        divider: true,\n        vertical: this.vertical,\n        'slot-has-content': this.slotHasContent,\n      })}\n    >\n      <div class=\"line\"></div>\n      <div class=\"slot-container\">\n        <slot></slot>\n      </div>\n      <div class=\"line\"></div>\n    </div>`;\n  }\n}\n"],"names":["LitElement","html","classMap","styles","property","state"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;;;;;;;;;;;;;;;;;;AAkBG;AAEI,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQA,GAAU,CAAA;AAAhC,IAAA,WAAA,GAAA;;;QAIuC,IAAA,CAAA,QAAQ,GAAG,KAAK;;QAI5D,IAAA,CAAA,cAAc,GAAG,KAAK;IA2BxB;IAzBE,YAAY,GAAA;AACV,QAAA,+BAA+B,CAC7B,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAAC,EACrC,UAAU,IAAG;AACX,YAAA,IAAI,CAAC,cAAc,GAAG,UAAU;YAChC,IAAI,CAAC,aAAa,EAAE;AACtB,QAAA,CAAC,CACF;IACH;IAEA,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA,CAAA;AACD,YAAA,EAAAC,CAAQ,CAAC;AACf,YAAA,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,kBAAkB,EAAE,IAAI,CAAC,cAAc;SACxC,CAAC;;;;;;;WAOG;IACT;;AAjCO,OAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAGoB,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAmB,CAAA,EAAA,OAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAI7D,UAAA,CAAA;AADC,IAAAC,CAAK;AACiB,CAAA,EAAA,OAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,MAAA,CAAA;AARZ,OAAO,GAAA,UAAA,CAAA;IADnB;AACY,CAAA,EAAA,OAAO,CAmCnB;;;;"}

package/dist/dropdown-button.js

@@ -1,8 +1,9 @@
-import { a as i, _ as __decorate, I as IndividualComponent, i as i$1, b } from './IndividualComponent-DUINtMGK.js';
-import { n } from './property-1psGvXOq.js';
-import { r } from './state-DwbEjqVk.js';
-import { e } from './query-QBcUV-L_.js';
-import { e as e$1 } from './class-map-YU7g0o3B.js';
+import { i, _ as __decorate, I as IndividualComponent, a as i$1, b } from './IndividualComponent-Bdwyrvd6.js';
+import { n } from './property-B49QQ8pS.js';
+import { r } from './state-DkTK9EGF.js';
+import { e } from './query-CHb9Ft_d.js';
+import { e as e$1 } from './class-map-DG7CA1et.js';
+import './base-Cl6v8-BZ.js';
 import './directive-ZPhl09Yt.js';
 
 var css_248z = i`* {
@@ -13,6 +14,10 @@ var css_248z = i`* {
   display: none !important;
 }
 
+[hidden] {
+  display: none !important;
+}
+
 :host {
   display: inline-flex;
   position: relative;
@@ -154,7 +159,7 @@ let DropdownButton = class DropdownButton extends i$1 {
         size=${this.size}
         variant=${this.variant}
         color=${this.color}
-        icon-align="end"
+        trailing-icon
         ?disabled=${this.disabled}
         .configAria=${{
             'aria-haspopup': 'menu',

package/dist/dropdown-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-button.js","sources":["../../src/dropdown-button/dropdown-button.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './dropdown-button.scss';\n\n/**\n * @label Dropdown Button\n * @tag wc-dropdown-button\n * @rawTag dropdown-button\n *\n * @summary A button that opens a dropdown menu when clicked.\n * @overview\n * <p>The dropdown button combines a single button with a dropdown menu. Clicking the button toggles a menu of actions or options. It follows M3 Material Design, keeping a compact control while exposing related actions on demand.</p>\n *\n * @cssprop --dropdown-button-container-shape: Defines the border radius of the dropdown button container shape.\n *\n * @fires {CustomEvent} toggle-menu - Dispatched when the dropdown menu is opened or closed.\n *\n * @example\n * ```html\n * <wc-dropdown-button>\n *   Actions\n *   <wc-menu-item slot=\"menu\">Edit</wc-menu-item>\n *   <wc-menu-item slot=\"menu\">Delete</wc-menu-item>\n * </wc-dropdown-button>\n * ```\n * @tags controls\n */\n@IndividualComponent\nexport class DropdownButton extends LitElement {\n  static override styles = [styles];\n\n  /**\n   * Button size.\n   * Possible values are `\"xs\"`, `\"sm\"`, `\"md\"`, `\"lg\"`, `\"xl\"`. Defaults to `\"sm\"`.\n   */\n  @property({ reflect: true }) size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n\n  /**\n   * The visual style of the dropdown button.\n   *\n   * Possible variant values:\n   * `\"filled\"` is a filled button.\n   * `\"outlined\"` is an outlined button.\n   * `\"text\"` is a transparent button.\n   * `\"tonal\"` is a light color button.\n   * `\"elevated\"` is an elevated button.\n   */\n  @property({ reflect: true }) variant:\n    | 'elevated'\n    | 'filled'\n    | 'tonal'\n    | 'outlined'\n    | 'text' = 'filled';\n\n  /**\n   * Defines the primary color of the dropdown button.\n   */\n  @property({ reflect: true }) color:\n    | 'primary'\n    | 'secondary'\n    | 'tertiary'\n    | 'success'\n    | 'danger'\n    | 'warning'\n    | 'surface'\n    | 'on-surface' = 'primary';\n\n  /**\n   * Whether the dropdown button is disabled.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /**\n   * Menu placement relative to the button.\n   * Possible values are `\"bottom-start\"`, `\"bottom-end\"`, `\"top-start\"`, `\"top-end\"`. Defaults to `\"bottom-start\"`.\n   */\n  @property({ reflect: true }) placement:\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'top-start'\n    | 'top-end' = 'bottom-start';\n\n  @state() private _menuOpen = false;\n\n  @query('.trigger-button') private readonly _triggerButton!: HTMLElement & {\n    focus: () => void;\n  };\n\n  @query('wc-menu') private readonly _menu!: HTMLElement & {\n    open: boolean;\n    anchorElement: HTMLElement | null;\n    show: () => void;\n    close: () => void;\n    focus: () => void;\n  };\n\n  private _menuId = `dropdown-menu-${Math.random().toString(36).slice(2, 9)}`;\n\n  override focus() {\n    this._triggerButton?.focus();\n  }\n\n  private _onButtonClick(event: MouseEvent) {\n    event.stopPropagation();\n    if (this.disabled) return;\n\n    if (this._menuOpen) {\n      this._menu?.close();\n    } else {\n      this._menu.anchorElement = this;\n      this._menu?.show();\n    }\n  }\n\n  private _onMenuOpened = () => {\n    this._menuOpen = true;\n    this.dispatchEvent(\n      new CustomEvent('toggle-menu', {\n        detail: { open: true },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  };\n\n  private _onMenuClosed = () => {\n    this._menuOpen = false;\n    this.dispatchEvent(\n      new CustomEvent('toggle-menu', {\n        detail: { open: false },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  };\n\n  private _onKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) return;\n\n    if (event.key === 'ArrowDown' && !this._menuOpen) {\n      event.preventDefault();\n      this._menu.anchorElement = this;\n      this._menu?.show();\n      requestAnimationFrame(() => this._menu?.focus());\n    }\n\n    if (event.key === 'Escape' && this._menuOpen) {\n      this._menu?.close();\n      this._triggerButton?.focus();\n    }\n  };\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('keydown', this._onKeyDown);\n  }\n\n  override disconnectedCallback() {\n    this.removeEventListener('keydown', this._onKeyDown);\n    super.disconnectedCallback();\n  }\n\n  override render() {\n    const buttonClasses = {\n      'trigger-button': true,\n      active: this._menuOpen,\n      disabled: this.disabled,\n    };\n\n    return html`\n      <wc-button\n        class=${classMap(buttonClasses)}\n        size=${this.size}\n        variant=${this.variant}\n        color=${this.color}\n        icon-align=\"end\"\n        ?disabled=${this.disabled}\n        .configAria=${{\n          'aria-haspopup': 'menu',\n          'aria-expanded': String(this._menuOpen),\n          'aria-controls': this._menuId,\n        }}\n        @click=${this._onButtonClick}\n      >\n        <slot></slot>\n        <wc-icon\n          slot=\"icon\"\n          name=\"arrow_drop_down\"\n          class=\"dropdown-icon\"\n          aria-hidden=\"true\"\n        ></wc-icon>\n      </wc-button>\n\n      <wc-menu\n        id=${this._menuId}\n        placement=${this.placement}\n        @opened=${this._onMenuOpened}\n        @closed=${this._onMenuClosed}\n      >\n        <slot name=\"menu\"></slot>\n      </wc-menu>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","styles","property","state","query"],"mappings":"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"}
+{"version":3,"file":"dropdown-button.js","sources":["../../src/dropdown-button/dropdown-button.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './dropdown-button.scss';\n\n/**\n * @label Dropdown Button\n * @tag wc-dropdown-button\n * @rawTag dropdown-button\n *\n * @summary A button that opens a dropdown menu when clicked.\n * @overview\n * <p>The dropdown button combines a single button with a dropdown menu. Clicking the button toggles a menu of actions or options. It follows M3 Material Design, keeping a compact control while exposing related actions on demand.</p>\n *\n * @cssprop --dropdown-button-container-shape: Defines the border radius of the dropdown button container shape.\n *\n * @fires {CustomEvent} toggle-menu - Dispatched when the dropdown menu is opened or closed.\n *\n * @example\n * ```html\n * <wc-dropdown-button>\n *   Actions\n *   <wc-menu-item slot=\"menu\">Edit</wc-menu-item>\n *   <wc-menu-item slot=\"menu\">Delete</wc-menu-item>\n * </wc-dropdown-button>\n * ```\n * @tags controls\n */\n@IndividualComponent\nexport class DropdownButton extends LitElement {\n  static override styles = [styles];\n\n  /**\n   * Button size.\n   * Possible values are `\"xs\"`, `\"sm\"`, `\"md\"`, `\"lg\"`, `\"xl\"`. Defaults to `\"sm\"`.\n   */\n  @property({ reflect: true }) size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n\n  /**\n   * The visual style of the dropdown button.\n   *\n   * Possible variant values:\n   * `\"filled\"` is a filled button.\n   * `\"outlined\"` is an outlined button.\n   * `\"text\"` is a transparent button.\n   * `\"tonal\"` is a light color button.\n   * `\"elevated\"` is an elevated button.\n   */\n  @property({ reflect: true }) variant:\n    | 'elevated'\n    | 'filled'\n    | 'tonal'\n    | 'outlined'\n    | 'text' = 'filled';\n\n  /**\n   * Defines the primary color of the dropdown button.\n   */\n  @property({ reflect: true }) color:\n    | 'primary'\n    | 'secondary'\n    | 'tertiary'\n    | 'success'\n    | 'danger'\n    | 'warning'\n    | 'surface'\n    | 'on-surface' = 'primary';\n\n  /**\n   * Whether the dropdown button is disabled.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /**\n   * Menu placement relative to the button.\n   * Possible values are `\"bottom-start\"`, `\"bottom-end\"`, `\"top-start\"`, `\"top-end\"`. Defaults to `\"bottom-start\"`.\n   */\n  @property({ reflect: true }) placement:\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'top-start'\n    | 'top-end' = 'bottom-start';\n\n  @state() private _menuOpen = false;\n\n  @query('.trigger-button') private readonly _triggerButton!: HTMLElement & {\n    focus: () => void;\n  };\n\n  @query('wc-menu') private readonly _menu!: HTMLElement & {\n    open: boolean;\n    anchorElement: HTMLElement | null;\n    show: () => void;\n    close: () => void;\n    focus: () => void;\n  };\n\n  private _menuId = `dropdown-menu-${Math.random().toString(36).slice(2, 9)}`;\n\n  override focus() {\n    this._triggerButton?.focus();\n  }\n\n  private _onButtonClick(event: MouseEvent) {\n    event.stopPropagation();\n    if (this.disabled) return;\n\n    if (this._menuOpen) {\n      this._menu?.close();\n    } else {\n      this._menu.anchorElement = this;\n      this._menu?.show();\n    }\n  }\n\n  private _onMenuOpened = () => {\n    this._menuOpen = true;\n    this.dispatchEvent(\n      new CustomEvent('toggle-menu', {\n        detail: { open: true },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  };\n\n  private _onMenuClosed = () => {\n    this._menuOpen = false;\n    this.dispatchEvent(\n      new CustomEvent('toggle-menu', {\n        detail: { open: false },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  };\n\n  private _onKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) return;\n\n    if (event.key === 'ArrowDown' && !this._menuOpen) {\n      event.preventDefault();\n      this._menu.anchorElement = this;\n      this._menu?.show();\n      requestAnimationFrame(() => this._menu?.focus());\n    }\n\n    if (event.key === 'Escape' && this._menuOpen) {\n      this._menu?.close();\n      this._triggerButton?.focus();\n    }\n  };\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('keydown', this._onKeyDown);\n  }\n\n  override disconnectedCallback() {\n    this.removeEventListener('keydown', this._onKeyDown);\n    super.disconnectedCallback();\n  }\n\n  override render() {\n    const buttonClasses = {\n      'trigger-button': true,\n      active: this._menuOpen,\n      disabled: this.disabled,\n    };\n\n    return html`\n      <wc-button\n        class=${classMap(buttonClasses)}\n        size=${this.size}\n        variant=${this.variant}\n        color=${this.color}\n        trailing-icon\n        ?disabled=${this.disabled}\n        .configAria=${{\n          'aria-haspopup': 'menu',\n          'aria-expanded': String(this._menuOpen),\n          'aria-controls': this._menuId,\n        }}\n        @click=${this._onButtonClick}\n      >\n        <slot></slot>\n        <wc-icon\n          slot=\"icon\"\n          name=\"arrow_drop_down\"\n          class=\"dropdown-icon\"\n          aria-hidden=\"true\"\n        ></wc-icon>\n      </wc-button>\n\n      <wc-menu\n        id=${this._menuId}\n        placement=${this.placement}\n        @opened=${this._onMenuOpened}\n        @closed=${this._onMenuClosed}\n      >\n        <slot name=\"menu\"></slot>\n      </wc-menu>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","styles","property","state","query"],"mappings":"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"}