@govtechsg/sgds-web-component 2.0.1 → 2.1.0

package/components/Badge/sgds-badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-badge.js","sources":["../../../src/components/Badge/sgds-badge.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport badgeStyle from \"./badge.css\";\nexport type BadgeVariant = \"primary\" | \"secondary\" | \"success\" | \"danger\" | \"warning\" | \"info\" | \"light\" | \"dark\";\n\n/**\n * @summary Badges can be used to highlight important bits of information such as labels, notifications & status.\n * @slot default - slot for badge\n *\n */\nexport class SgdsBadge extends SgdsElement {\n  static styles = [...SgdsElement.styles, badgeStyle];\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `secondary`, `success`, `danger`, `warning`, `info`, `dark`, `light`, `link` */\n  @property({ reflect: true }) variant: BadgeVariant = \"primary\";\n  /**  Visually set badge for lesser color emphasis. Renamed from previous `isLight` prop */\n  @property({ type: Boolean, reflect: true }) outlined = false;\n  /** Visually set badge with rounded corners. */\n  @property({ type: Boolean, reflect: true }) roundedPill = false;\n\n  render() {\n    return html`\n      <span\n        class=\"  \n          ${classMap({\n          badge: true,\n          \"rounded-pill\": this.roundedPill\n        })}\n            \"\n      >\n        <slot name=\"leftIcon\"></slot>\n        <slot></slot>\n        <slot name=\"rightIcon\"></slot>\n      </span>\n    `;\n  }\n}\n\nexport default SgdsBadge;\n"],"names":["badgeStyle"],"mappings":";;;;;;;AAOA;;;;AAIG;AACG,MAAO,SAAU,SAAQ,WAAW,CAAA;AAA1C,IAAA,WAAA,GAAA;;;QAI+B,IAAO,CAAA,OAAA,GAAiB,SAAS,CAAC;;QAEnB,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;;QAEjB,IAAW,CAAA,WAAA,GAAG,KAAK,CAAC;KAkBjE;IAhBC,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;;;AAGH,UAAA,EAAA,QAAQ,CAAC;AACX,YAAA,KAAK,EAAE,IAAI;YACX,cAAc,EAAE,IAAI,CAAC,WAAW;SACjC,CAAC,CAAA;;;;;;;KAOL,CAAC;KACH;;AAxBM,SAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAU,CAArC,CAAuC;AAGvB,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAmC,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,SAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAEnB,UAAA,CAAA;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAkB,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,UAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAEjB,UAAA,CAAA;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAqB,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA;;;;"}
+{"version":3,"file":"sgds-badge.js","sources":["../../../src/components/Badge/sgds-badge.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport badgeStyle from \"./badge.css\";\nexport type BadgeVariant = \"primary\" | \"secondary\" | \"success\" | \"danger\" | \"warning\" | \"info\" | \"light\" | \"dark\";\n\n/**\n * @summary Badges can be used to highlight important bits of information such as labels, notifications & status.\n * @slot default - slot for badge\n *\n */\nexport class SgdsBadge extends SgdsElement {\n  static styles = [...SgdsElement.styles, badgeStyle];\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `secondary`, `success`, `danger`, `warning`, `info`, `dark`, `light`, `link` */\n  @property({ reflect: true }) variant: BadgeVariant = \"primary\";\n  /**  Visually set badge for lesser color emphasis. Renamed from previous `isLight` prop */\n  @property({ type: Boolean, reflect: true }) outlined = false;\n  /** Visually set badge with rounded corners. */\n  @property({ type: Boolean, reflect: true }) roundedPill = false;\n\n  render() {\n    return html`\n      <span\n        class=\"  \n          ${classMap({\n          badge: true,\n          \"rounded-pill\": this.roundedPill\n        })}\n            \"\n      >\n        <slot name=\"leftIcon\"></slot>\n        <slot></slot>\n        <slot name=\"rightIcon\"></slot>\n      </span>\n    `;\n  }\n}\n\nexport default SgdsBadge;\n"],"names":["badgeStyle"],"mappings":";;;;;;;;AAOA;;;;AAIG;AACG,MAAO,SAAU,SAAQ,WAAW,CAAA;AAA1C,IAAA,WAAA,GAAA;;;QAI+B,IAAO,CAAA,OAAA,GAAiB,SAAS,CAAC;;QAEnB,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;;QAEjB,IAAW,CAAA,WAAA,GAAG,KAAK,CAAC;KAkBjE;IAhBC,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;;;AAGH,UAAA,EAAA,QAAQ,CAAC;AACX,YAAA,KAAK,EAAE,IAAI;YACX,cAAc,EAAE,IAAI,CAAC,WAAW;SACjC,CAAC,CAAA;;;;;;;KAOL,CAAC;KACH;;AAxBM,SAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAU,CAArC,CAAuC;AAGvB,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAmC,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,SAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAEnB,UAAA,CAAA;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAkB,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,UAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAEjB,UAAA,CAAA;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAqB,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA;;;;"}

package/components/Breadcrumb/breadcrumb-item.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Breadcrumb/breadcrumb-item.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb-item.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"breadcrumb-item.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/components/Breadcrumb/breadcrumb-item.js

@@ -1,3 +1,4 @@
+'use client';
 import { css } from 'lit';
 
 var css_248z = css`:host{font-size:var(--sgds-body-font-size)}slot[name=separator]::slotted(*){color:var(--sgds-body-color);padding-left:var(--sgds-spacer-3);padding-right:var(--sgds-spacer-3)}:host(:last-of-type) .breadcrumb-item__separator{display:none}.breadcrumb-item.active{color:var(--sgds-body-color)}`;

package/components/Breadcrumb/breadcrumb-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb-item.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"breadcrumb-item.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/components/Breadcrumb/breadcrumb.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Breadcrumb/breadcrumb.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"breadcrumb.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/components/Breadcrumb/breadcrumb.js

@@ -1,3 +1,4 @@
+'use client';
 import { css } from 'lit';
 
 var css_248z = css`.breadcrumb{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:var(--sgds-spacer-0) var(--sgds-spacer-0)}`;

package/components/Breadcrumb/breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"breadcrumb.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/components/Breadcrumb/sgds-breadcrumb-item.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Breadcrumb/sgds-breadcrumb-item.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-breadcrumb-item.cjs.js","sources":["../../../src/components/Breadcrumb/sgds-breadcrumb-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport breadcrumbItemStyle from \"./breadcrumb-item.css\";\nimport anchorStyles from \"../../styles/anchor.css\";\n/**\n * @summary Breadcrumb Item are navigational links used in Breadcrumb component\n *\n * @slot default - The title of the item\n * @slot separator - The individual separator of breadcrumb item can be changed here.\n *\n * @csspart base - The base wrapper of breadcrumb item which is a HTMLListElement.\n * @csspart label -The label of the breadcrumb item. It is either a span or anchor element depending on href attribute\n *\n */\nexport class SgdsBreadcrumbItem extends SgdsElement {\n  static styles = [...SgdsElement.styles, anchorStyles, breadcrumbItemStyle];\n  /** Specifies the url path of the breadcrumb-item. When defined, the breadcrumb-items is a anchor element. When not defined, indicates that the breadcrumb item is active. In such cases, a span element is rendered. */\n  @property({ type: String, reflect: true }) href: string;\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property() target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** The `rel` attribute to use on the link. Only used when `href` is set. */\n  @property() rel = \"noreferrer noopener\";\n\n  render() {\n    const isLink = this.href ? true : false;\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          \"breadcrumb-item\": true,\n          active: !isLink\n        })}\n      >\n        ${isLink\n          ? html`\n              <a\n                part=\"label\"\n                href=\"${this.href}\"\n                rel=${ifDefined(this.target ? this.rel : undefined)}\n                target=${ifDefined(this.target)}\n                ><slot></slot\n              ></a>\n            `\n          : html`<span part=\"label\"><slot></slot></span>`}\n        <slot name=\"separator\" class=\"breadcrumb-item__separator\" aria-hidden=\"true\"></slot>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsBreadcrumbItem;\n"],"names":["SgdsElement","html","classMap","ifDefined","anchorStyles","breadcrumbItemStyle","__decorate","property"],"mappings":";;;;;;;;;;;;;AAOA;;;;;;;;;AASG;AACG,MAAO,kBAAmB,SAAQA,sBAAW,CAAA;AAAnD,IAAA,WAAA,GAAA;;;QAQc,IAAG,CAAA,GAAA,GAAG,qBAAqB,CAAC;KA2BzC;IAzBC,MAAM,GAAA;AACJ,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AACxC,QAAA,OAAOC,QAAI,CAAA,CAAA;;;AAGC,cAAA,EAAAC,oBAAQ,CAAC;AACf,YAAA,iBAAiB,EAAE,IAAI;YACvB,MAAM,EAAE,CAAC,MAAM;SAChB,CAAC,CAAA;;UAEA,MAAM;cACJD,QAAI,CAAA,CAAA;;;AAGQ,sBAAA,EAAA,IAAI,CAAC,IAAI,CAAA;AACX,oBAAA,EAAAE,sBAAS,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,SAAS,CAAC,CAAA;AAC1C,uBAAA,EAAAA,sBAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;;;AAGlC,YAAA,CAAA;cACDF,QAAI,CAAA,CAAyC,uCAAA,CAAA,CAAA;;;KAGpD,CAAC;KACH;;AAjCM,kBAAA,CAAA,MAAM,GAAG,CAAC,GAAGD,sBAAW,CAAC,MAAM,EAAEI,iBAAY,EAAEC,yBAAmB,CAA5D,CAA8D;AAEhCC,gBAAA,CAAA;IAA1CC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAc,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAE5CD,gBAAA,CAAA;AAAX,IAAAC,sBAAQ,EAAE;AAAiD,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGhDD,gBAAA,CAAA;AAAX,IAAAC,sBAAQ,EAAE;AAA6B,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,KAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}
+{"version":3,"file":"sgds-breadcrumb-item.cjs.js","sources":["../../../src/components/Breadcrumb/sgds-breadcrumb-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport breadcrumbItemStyle from \"./breadcrumb-item.css\";\nimport anchorStyles from \"../../styles/anchor.css\";\n/**\n * @summary Breadcrumb Item are navigational links used in Breadcrumb component\n *\n * @slot default - The title of the item\n * @slot separator - The individual separator of breadcrumb item can be changed here.\n *\n * @csspart base - The base wrapper of breadcrumb item which is a HTMLListElement.\n * @csspart label -The label of the breadcrumb item. It is either a span or anchor element depending on href attribute\n *\n */\nexport class SgdsBreadcrumbItem extends SgdsElement {\n  static styles = [...SgdsElement.styles, anchorStyles, breadcrumbItemStyle];\n  /** Specifies the url path of the breadcrumb-item. When defined, the breadcrumb-items is a anchor element. When not defined, indicates that the breadcrumb item is active. In such cases, a span element is rendered. */\n  @property({ type: String, reflect: true }) href: string;\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property() target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** The `rel` attribute to use on the link. Only used when `href` is set. */\n  @property() rel = \"noreferrer noopener\";\n\n  render() {\n    const isLink = this.href ? true : false;\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          \"breadcrumb-item\": true,\n          active: !isLink\n        })}\n      >\n        ${isLink\n          ? html`\n              <a\n                part=\"label\"\n                href=\"${this.href}\"\n                rel=${ifDefined(this.target ? this.rel : undefined)}\n                target=${ifDefined(this.target)}\n                ><slot></slot\n              ></a>\n            `\n          : html`<span part=\"label\"><slot></slot></span>`}\n        <slot name=\"separator\" class=\"breadcrumb-item__separator\" aria-hidden=\"true\"></slot>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsBreadcrumbItem;\n"],"names":["SgdsElement","html","classMap","ifDefined","anchorStyles","breadcrumbItemStyle","__decorate","property"],"mappings":";;;;;;;;;;;;;;AAOA;;;;;;;;;AASG;AACG,MAAO,kBAAmB,SAAQA,sBAAW,CAAA;AAAnD,IAAA,WAAA,GAAA;;;QAQc,IAAG,CAAA,GAAA,GAAG,qBAAqB,CAAC;KA2BzC;IAzBC,MAAM,GAAA;AACJ,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AACxC,QAAA,OAAOC,QAAI,CAAA,CAAA;;;AAGC,cAAA,EAAAC,oBAAQ,CAAC;AACf,YAAA,iBAAiB,EAAE,IAAI;YACvB,MAAM,EAAE,CAAC,MAAM;SAChB,CAAC,CAAA;;UAEA,MAAM;cACJD,QAAI,CAAA,CAAA;;;AAGQ,sBAAA,EAAA,IAAI,CAAC,IAAI,CAAA;AACX,oBAAA,EAAAE,sBAAS,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,SAAS,CAAC,CAAA;AAC1C,uBAAA,EAAAA,sBAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;;;AAGlC,YAAA,CAAA;cACDF,QAAI,CAAA,CAAyC,uCAAA,CAAA,CAAA;;;KAGpD,CAAC;KACH;;AAjCM,kBAAA,CAAA,MAAM,GAAG,CAAC,GAAGD,sBAAW,CAAC,MAAM,EAAEI,iBAAY,EAAEC,yBAAmB,CAA5D,CAA8D;AAEhCC,gBAAA,CAAA;IAA1CC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAc,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAE5CD,gBAAA,CAAA;AAAX,IAAAC,sBAAQ,EAAE;AAAiD,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGhDD,gBAAA,CAAA;AAAX,IAAAC,sBAAQ,EAAE;AAA6B,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,KAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}

package/components/Breadcrumb/sgds-breadcrumb-item.js

@@ -1,3 +1,4 @@
+'use client';
 import { __decorate } from 'tslib';
 import { html } from 'lit';
 import { property } from 'lit/decorators.js';

package/components/Breadcrumb/sgds-breadcrumb-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-breadcrumb-item.js","sources":["../../../src/components/Breadcrumb/sgds-breadcrumb-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport breadcrumbItemStyle from \"./breadcrumb-item.css\";\nimport anchorStyles from \"../../styles/anchor.css\";\n/**\n * @summary Breadcrumb Item are navigational links used in Breadcrumb component\n *\n * @slot default - The title of the item\n * @slot separator - The individual separator of breadcrumb item can be changed here.\n *\n * @csspart base - The base wrapper of breadcrumb item which is a HTMLListElement.\n * @csspart label -The label of the breadcrumb item. It is either a span or anchor element depending on href attribute\n *\n */\nexport class SgdsBreadcrumbItem extends SgdsElement {\n  static styles = [...SgdsElement.styles, anchorStyles, breadcrumbItemStyle];\n  /** Specifies the url path of the breadcrumb-item. When defined, the breadcrumb-items is a anchor element. When not defined, indicates that the breadcrumb item is active. In such cases, a span element is rendered. */\n  @property({ type: String, reflect: true }) href: string;\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property() target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** The `rel` attribute to use on the link. Only used when `href` is set. */\n  @property() rel = \"noreferrer noopener\";\n\n  render() {\n    const isLink = this.href ? true : false;\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          \"breadcrumb-item\": true,\n          active: !isLink\n        })}\n      >\n        ${isLink\n          ? html`\n              <a\n                part=\"label\"\n                href=\"${this.href}\"\n                rel=${ifDefined(this.target ? this.rel : undefined)}\n                target=${ifDefined(this.target)}\n                ><slot></slot\n              ></a>\n            `\n          : html`<span part=\"label\"><slot></slot></span>`}\n        <slot name=\"separator\" class=\"breadcrumb-item__separator\" aria-hidden=\"true\"></slot>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsBreadcrumbItem;\n"],"names":["anchorStyles","breadcrumbItemStyle"],"mappings":";;;;;;;;;AAOA;;;;;;;;;AASG;AACG,MAAO,kBAAmB,SAAQ,WAAW,CAAA;AAAnD,IAAA,WAAA,GAAA;;;QAQc,IAAG,CAAA,GAAA,GAAG,qBAAqB,CAAC;KA2BzC;IAzBC,MAAM,GAAA;AACJ,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AACxC,QAAA,OAAO,IAAI,CAAA,CAAA;;;AAGC,cAAA,EAAA,QAAQ,CAAC;AACf,YAAA,iBAAiB,EAAE,IAAI;YACvB,MAAM,EAAE,CAAC,MAAM;SAChB,CAAC,CAAA;;UAEA,MAAM;cACJ,IAAI,CAAA,CAAA;;;AAGQ,sBAAA,EAAA,IAAI,CAAC,IAAI,CAAA;AACX,oBAAA,EAAA,SAAS,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,SAAS,CAAC,CAAA;AAC1C,uBAAA,EAAA,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;;;AAGlC,YAAA,CAAA;cACD,IAAI,CAAA,CAAyC,uCAAA,CAAA,CAAA;;;KAGpD,CAAC;KACH;;AAjCM,kBAAA,CAAA,MAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAY,EAAEC,UAAmB,CAA5D,CAA8D;AAEhC,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAc,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAE5C,UAAA,CAAA;AAAX,IAAA,QAAQ,EAAE;AAAiD,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGhD,UAAA,CAAA;AAAX,IAAA,QAAQ,EAAE;AAA6B,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,KAAA,EAAA,KAAA,CAAA,CAAA;;;;"}
+{"version":3,"file":"sgds-breadcrumb-item.js","sources":["../../../src/components/Breadcrumb/sgds-breadcrumb-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport breadcrumbItemStyle from \"./breadcrumb-item.css\";\nimport anchorStyles from \"../../styles/anchor.css\";\n/**\n * @summary Breadcrumb Item are navigational links used in Breadcrumb component\n *\n * @slot default - The title of the item\n * @slot separator - The individual separator of breadcrumb item can be changed here.\n *\n * @csspart base - The base wrapper of breadcrumb item which is a HTMLListElement.\n * @csspart label -The label of the breadcrumb item. It is either a span or anchor element depending on href attribute\n *\n */\nexport class SgdsBreadcrumbItem extends SgdsElement {\n  static styles = [...SgdsElement.styles, anchorStyles, breadcrumbItemStyle];\n  /** Specifies the url path of the breadcrumb-item. When defined, the breadcrumb-items is a anchor element. When not defined, indicates that the breadcrumb item is active. In such cases, a span element is rendered. */\n  @property({ type: String, reflect: true }) href: string;\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property() target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** The `rel` attribute to use on the link. Only used when `href` is set. */\n  @property() rel = \"noreferrer noopener\";\n\n  render() {\n    const isLink = this.href ? true : false;\n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          \"breadcrumb-item\": true,\n          active: !isLink\n        })}\n      >\n        ${isLink\n          ? html`\n              <a\n                part=\"label\"\n                href=\"${this.href}\"\n                rel=${ifDefined(this.target ? this.rel : undefined)}\n                target=${ifDefined(this.target)}\n                ><slot></slot\n              ></a>\n            `\n          : html`<span part=\"label\"><slot></slot></span>`}\n        <slot name=\"separator\" class=\"breadcrumb-item__separator\" aria-hidden=\"true\"></slot>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsBreadcrumbItem;\n"],"names":["anchorStyles","breadcrumbItemStyle"],"mappings":";;;;;;;;;;AAOA;;;;;;;;;AASG;AACG,MAAO,kBAAmB,SAAQ,WAAW,CAAA;AAAnD,IAAA,WAAA,GAAA;;;QAQc,IAAG,CAAA,GAAA,GAAG,qBAAqB,CAAC;KA2BzC;IAzBC,MAAM,GAAA;AACJ,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AACxC,QAAA,OAAO,IAAI,CAAA,CAAA;;;AAGC,cAAA,EAAA,QAAQ,CAAC;AACf,YAAA,iBAAiB,EAAE,IAAI;YACvB,MAAM,EAAE,CAAC,MAAM;SAChB,CAAC,CAAA;;UAEA,MAAM;cACJ,IAAI,CAAA,CAAA;;;AAGQ,sBAAA,EAAA,IAAI,CAAC,IAAI,CAAA;AACX,oBAAA,EAAA,SAAS,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,SAAS,CAAC,CAAA;AAC1C,uBAAA,EAAA,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;;;AAGlC,YAAA,CAAA;cACD,IAAI,CAAA,CAAyC,uCAAA,CAAA,CAAA;;;KAGpD,CAAC;KACH;;AAjCM,kBAAA,CAAA,MAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAY,EAAEC,UAAmB,CAA5D,CAA8D;AAEhC,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAc,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAE5C,UAAA,CAAA;AAAX,IAAA,QAAQ,EAAE;AAAiD,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGhD,UAAA,CAAA;AAAX,IAAA,QAAQ,EAAE;AAA6B,CAAA,EAAA,kBAAA,CAAA,SAAA,EAAA,KAAA,EAAA,KAAA,CAAA,CAAA;;;;"}

package/components/Breadcrumb/sgds-breadcrumb.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Breadcrumb/sgds-breadcrumb.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-breadcrumb.cjs.js","sources":["../../../src/components/Breadcrumb/sgds-breadcrumb.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport type SgdsBreadcrumbItem from \"./sgds-breadcrumb-item\";\nimport breadcrumbStyle from \"./breadcrumb.css\";\n/**\n * @summary Breadcrumbs help users to navigate and understand where they are on the current website or service.\n *\n * @slot default - The slot to pass in custom elements of `SgdsBreadcrumbItems`.\n * @slot separator - Defines all the separator of `SgdsBreadcrumbItems`. Defaults to \"/\"\n *\n * @csspart base - The nav element wrapper of `SgdsBreadcrumb`\n *\n */\nexport class SgdsBreadcrumb extends SgdsElement {\n  static styles = [...SgdsElement.styles, breadcrumbStyle];\n  /** The aria-label of nav element within breadcrumb component. */\n  @property({ type: String }) ariaLabel = \"breadcrumb\";\n\n  /**@internal */\n  @query(\"slot\") defaultSlot: HTMLSlotElement;\n  /**@internal */\n  @query('slot[name=\"separator\"]') separatorSlot: HTMLSlotElement;\n\n  // Generates a clone of the separator element to use for each breadcrumb item\n  private _getSeparator() {\n    const separator = this.separatorSlot.assignedElements({ flatten: true })[0] as HTMLElement;\n\n    // Clone it, remove ids, and slot it\n    const clone = separator.cloneNode(true) as HTMLElement;\n    [clone, ...clone.querySelectorAll(\"[id]\")].forEach(el => el.removeAttribute(\"id\"));\n    clone.setAttribute(\"data-default\", \"\");\n    clone.slot = \"separator\";\n\n    return clone;\n  }\n\n  private _handleSlotChange() {\n    const items = [...this.defaultSlot.assignedElements({ flatten: true })].filter(\n      item => item.tagName.toLowerCase() === \"sgds-breadcrumb-item\"\n    ) as SgdsBreadcrumbItem[];\n\n    items.forEach((item, index) => {\n      // Append separators to each item if they don't already have one\n      const separator = item.querySelector('[slot=\"separator\"]');\n      if (separator === null) {\n        // No separator exists, add one\n        item.append(this._getSeparator());\n      } else if (separator.hasAttribute(\"data-default\")) {\n        // A default separator exists, replace it\n        separator.replaceWith(this._getSeparator());\n      } else {\n        // The user provided a custom separator, leave it alone\n      }\n\n      // The last breadcrumb item is the \"current page\"\n\n      if (index === items.length - 1) {\n        item.setAttribute(\"aria-current\", \"page\");\n      } else {\n        item.removeAttribute(\"aria-current\");\n      }\n    });\n  }\n\n  render() {\n    return html`\n      <nav aria-label=${ifDefined(this.ariaLabel)} part=\"base\">\n        <div class=\"breadcrumb\">\n          <slot @slotchange=${this._handleSlotChange}></slot>\n          <slot name=\"separator\" hidden aria-hidden=\"true\">\n            <span>/</span>\n          </slot>\n        </div>\n      </nav>\n    `;\n  }\n}\n\nexport default SgdsBreadcrumb;\n"],"names":["SgdsElement","html","ifDefined","breadcrumbStyle","__decorate","property","query"],"mappings":";;;;;;;;;;;AAMA;;;;;;;;AAQG;AACG,MAAO,cAAe,SAAQA,sBAAW,CAAA;AAA/C,IAAA,WAAA,GAAA;;;QAG8B,IAAS,CAAA,SAAA,GAAG,YAAY,CAAC;KA4DtD;;IApDS,aAAa,GAAA;AACnB,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAgB,CAAC;;QAG3F,MAAM,KAAK,GAAG,SAAS,CAAC,SAAS,CAAC,IAAI,CAAgB,CAAC;QACvD,CAAC,KAAK,EAAE,GAAG,KAAK,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;AACnF,QAAA,KAAK,CAAC,YAAY,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC;AACvC,QAAA,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC;AAEzB,QAAA,OAAO,KAAK,CAAC;KACd;IAEO,iBAAiB,GAAA;AACvB,QAAA,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CAC5E,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,sBAAsB,CACtC,CAAC;QAE1B,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;;YAE5B,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;AAC3D,YAAA,IAAI,SAAS,KAAK,IAAI,EAAE;;gBAEtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;aACnC;AAAM,iBAAA,IAAI,SAAS,CAAC,YAAY,CAAC,cAAc,CAAC,EAAE;;gBAEjD,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;aAC7C;iBAAM,CAEN;;YAID,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AAC9B,gBAAA,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;aAC3C;iBAAM;AACL,gBAAA,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;aACtC;AACH,SAAC,CAAC,CAAC;KACJ;IAED,MAAM,GAAA;AACJ,QAAA,OAAOC,kBAAI,CAAA,CAAA;AACS,sBAAA,EAAAC,sBAAS,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;;AAEnB,4BAAA,EAAA,IAAI,CAAC,iBAAiB,CAAA;;;;;;KAM/C,CAAC;KACH;;AA7DM,cAAM,CAAA,MAAA,GAAG,CAAC,GAAGF,sBAAW,CAAC,MAAM,EAAEG,qBAAe,CAA1C,CAA4C;AAE7BC,gBAAA,CAAA;AAA3B,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AAA0B,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGtCD,gBAAA,CAAA;IAAdE,mBAAK,CAAC,MAAM,CAAC;AAA8B,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAEXF,gBAAA,CAAA;IAAhCE,mBAAK,CAAC,wBAAwB,CAAC;AAAgC,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,eAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}
+{"version":3,"file":"sgds-breadcrumb.cjs.js","sources":["../../../src/components/Breadcrumb/sgds-breadcrumb.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport type SgdsBreadcrumbItem from \"./sgds-breadcrumb-item\";\nimport breadcrumbStyle from \"./breadcrumb.css\";\n/**\n * @summary Breadcrumbs help users to navigate and understand where they are on the current website or service.\n *\n * @slot default - The slot to pass in custom elements of `SgdsBreadcrumbItems`.\n * @slot separator - Defines all the separator of `SgdsBreadcrumbItems`. Defaults to \"/\"\n *\n * @csspart base - The nav element wrapper of `SgdsBreadcrumb`\n *\n */\nexport class SgdsBreadcrumb extends SgdsElement {\n  static styles = [...SgdsElement.styles, breadcrumbStyle];\n  /** The aria-label of nav element within breadcrumb component. */\n  @property({ type: String }) ariaLabel = \"breadcrumb\";\n\n  /**@internal */\n  @query(\"slot\") defaultSlot: HTMLSlotElement;\n  /**@internal */\n  @query('slot[name=\"separator\"]') separatorSlot: HTMLSlotElement;\n\n  // Generates a clone of the separator element to use for each breadcrumb item\n  private _getSeparator() {\n    const separator = this.separatorSlot.assignedElements({ flatten: true })[0] as HTMLElement;\n\n    // Clone it, remove ids, and slot it\n    const clone = separator.cloneNode(true) as HTMLElement;\n    [clone, ...clone.querySelectorAll(\"[id]\")].forEach(el => el.removeAttribute(\"id\"));\n    clone.setAttribute(\"data-default\", \"\");\n    clone.slot = \"separator\";\n\n    return clone;\n  }\n\n  private _handleSlotChange() {\n    const items = [...this.defaultSlot.assignedElements({ flatten: true })].filter(\n      item => item.tagName.toLowerCase() === \"sgds-breadcrumb-item\"\n    ) as SgdsBreadcrumbItem[];\n\n    items.forEach((item, index) => {\n      // Append separators to each item if they don't already have one\n      const separator = item.querySelector('[slot=\"separator\"]');\n      if (separator === null) {\n        // No separator exists, add one\n        item.append(this._getSeparator());\n      } else if (separator.hasAttribute(\"data-default\")) {\n        // A default separator exists, replace it\n        separator.replaceWith(this._getSeparator());\n      } else {\n        // The user provided a custom separator, leave it alone\n      }\n\n      // The last breadcrumb item is the \"current page\"\n\n      if (index === items.length - 1) {\n        item.setAttribute(\"aria-current\", \"page\");\n      } else {\n        item.removeAttribute(\"aria-current\");\n      }\n    });\n  }\n\n  render() {\n    return html`\n      <nav aria-label=${ifDefined(this.ariaLabel)} part=\"base\">\n        <div class=\"breadcrumb\">\n          <slot @slotchange=${this._handleSlotChange}></slot>\n          <slot name=\"separator\" hidden aria-hidden=\"true\">\n            <span>/</span>\n          </slot>\n        </div>\n      </nav>\n    `;\n  }\n}\n\nexport default SgdsBreadcrumb;\n"],"names":["SgdsElement","html","ifDefined","breadcrumbStyle","__decorate","property","query"],"mappings":";;;;;;;;;;;;AAMA;;;;;;;;AAQG;AACG,MAAO,cAAe,SAAQA,sBAAW,CAAA;AAA/C,IAAA,WAAA,GAAA;;;QAG8B,IAAS,CAAA,SAAA,GAAG,YAAY,CAAC;KA4DtD;;IApDS,aAAa,GAAA;AACnB,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAgB,CAAC;;QAG3F,MAAM,KAAK,GAAG,SAAS,CAAC,SAAS,CAAC,IAAI,CAAgB,CAAC;QACvD,CAAC,KAAK,EAAE,GAAG,KAAK,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;AACnF,QAAA,KAAK,CAAC,YAAY,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC;AACvC,QAAA,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC;AAEzB,QAAA,OAAO,KAAK,CAAC;KACd;IAEO,iBAAiB,GAAA;AACvB,QAAA,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CAC5E,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,sBAAsB,CACtC,CAAC;QAE1B,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;;YAE5B,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;AAC3D,YAAA,IAAI,SAAS,KAAK,IAAI,EAAE;;gBAEtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;aACnC;AAAM,iBAAA,IAAI,SAAS,CAAC,YAAY,CAAC,cAAc,CAAC,EAAE;;gBAEjD,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;aAC7C;iBAAM,CAEN;;YAID,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AAC9B,gBAAA,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;aAC3C;iBAAM;AACL,gBAAA,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;aACtC;AACH,SAAC,CAAC,CAAC;KACJ;IAED,MAAM,GAAA;AACJ,QAAA,OAAOC,kBAAI,CAAA,CAAA;AACS,sBAAA,EAAAC,sBAAS,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;;AAEnB,4BAAA,EAAA,IAAI,CAAC,iBAAiB,CAAA;;;;;;KAM/C,CAAC;KACH;;AA7DM,cAAM,CAAA,MAAA,GAAG,CAAC,GAAGF,sBAAW,CAAC,MAAM,EAAEG,qBAAe,CAA1C,CAA4C;AAE7BC,gBAAA,CAAA;AAA3B,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AAA0B,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGtCD,gBAAA,CAAA;IAAdE,mBAAK,CAAC,MAAM,CAAC;AAA8B,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAEXF,gBAAA,CAAA;IAAhCE,mBAAK,CAAC,wBAAwB,CAAC;AAAgC,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,eAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}

package/components/Breadcrumb/sgds-breadcrumb.js

@@ -1,3 +1,4 @@
+'use client';
 import { __decorate } from 'tslib';
 import { property, query } from 'lit/decorators.js';
 import { ifDefined } from 'lit/directives/if-defined.js';

package/components/Breadcrumb/sgds-breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-breadcrumb.js","sources":["../../../src/components/Breadcrumb/sgds-breadcrumb.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport type SgdsBreadcrumbItem from \"./sgds-breadcrumb-item\";\nimport breadcrumbStyle from \"./breadcrumb.css\";\n/**\n * @summary Breadcrumbs help users to navigate and understand where they are on the current website or service.\n *\n * @slot default - The slot to pass in custom elements of `SgdsBreadcrumbItems`.\n * @slot separator - Defines all the separator of `SgdsBreadcrumbItems`. Defaults to \"/\"\n *\n * @csspart base - The nav element wrapper of `SgdsBreadcrumb`\n *\n */\nexport class SgdsBreadcrumb extends SgdsElement {\n  static styles = [...SgdsElement.styles, breadcrumbStyle];\n  /** The aria-label of nav element within breadcrumb component. */\n  @property({ type: String }) ariaLabel = \"breadcrumb\";\n\n  /**@internal */\n  @query(\"slot\") defaultSlot: HTMLSlotElement;\n  /**@internal */\n  @query('slot[name=\"separator\"]') separatorSlot: HTMLSlotElement;\n\n  // Generates a clone of the separator element to use for each breadcrumb item\n  private _getSeparator() {\n    const separator = this.separatorSlot.assignedElements({ flatten: true })[0] as HTMLElement;\n\n    // Clone it, remove ids, and slot it\n    const clone = separator.cloneNode(true) as HTMLElement;\n    [clone, ...clone.querySelectorAll(\"[id]\")].forEach(el => el.removeAttribute(\"id\"));\n    clone.setAttribute(\"data-default\", \"\");\n    clone.slot = \"separator\";\n\n    return clone;\n  }\n\n  private _handleSlotChange() {\n    const items = [...this.defaultSlot.assignedElements({ flatten: true })].filter(\n      item => item.tagName.toLowerCase() === \"sgds-breadcrumb-item\"\n    ) as SgdsBreadcrumbItem[];\n\n    items.forEach((item, index) => {\n      // Append separators to each item if they don't already have one\n      const separator = item.querySelector('[slot=\"separator\"]');\n      if (separator === null) {\n        // No separator exists, add one\n        item.append(this._getSeparator());\n      } else if (separator.hasAttribute(\"data-default\")) {\n        // A default separator exists, replace it\n        separator.replaceWith(this._getSeparator());\n      } else {\n        // The user provided a custom separator, leave it alone\n      }\n\n      // The last breadcrumb item is the \"current page\"\n\n      if (index === items.length - 1) {\n        item.setAttribute(\"aria-current\", \"page\");\n      } else {\n        item.removeAttribute(\"aria-current\");\n      }\n    });\n  }\n\n  render() {\n    return html`\n      <nav aria-label=${ifDefined(this.ariaLabel)} part=\"base\">\n        <div class=\"breadcrumb\">\n          <slot @slotchange=${this._handleSlotChange}></slot>\n          <slot name=\"separator\" hidden aria-hidden=\"true\">\n            <span>/</span>\n          </slot>\n        </div>\n      </nav>\n    `;\n  }\n}\n\nexport default SgdsBreadcrumb;\n"],"names":["breadcrumbStyle"],"mappings":";;;;;;;AAMA;;;;;;;;AAQG;AACG,MAAO,cAAe,SAAQ,WAAW,CAAA;AAA/C,IAAA,WAAA,GAAA;;;QAG8B,IAAS,CAAA,SAAA,GAAG,YAAY,CAAC;KA4DtD;;IApDS,aAAa,GAAA;AACnB,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAgB,CAAC;;QAG3F,MAAM,KAAK,GAAG,SAAS,CAAC,SAAS,CAAC,IAAI,CAAgB,CAAC;QACvD,CAAC,KAAK,EAAE,GAAG,KAAK,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;AACnF,QAAA,KAAK,CAAC,YAAY,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC;AACvC,QAAA,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC;AAEzB,QAAA,OAAO,KAAK,CAAC;KACd;IAEO,iBAAiB,GAAA;AACvB,QAAA,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CAC5E,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,sBAAsB,CACtC,CAAC;QAE1B,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;;YAE5B,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;AAC3D,YAAA,IAAI,SAAS,KAAK,IAAI,EAAE;;gBAEtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;aACnC;AAAM,iBAAA,IAAI,SAAS,CAAC,YAAY,CAAC,cAAc,CAAC,EAAE;;gBAEjD,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;aAC7C;iBAAM,CAEN;;YAID,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AAC9B,gBAAA,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;aAC3C;iBAAM;AACL,gBAAA,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;aACtC;AACH,SAAC,CAAC,CAAC;KACJ;IAED,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;AACS,sBAAA,EAAA,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;;AAEnB,4BAAA,EAAA,IAAI,CAAC,iBAAiB,CAAA;;;;;;KAM/C,CAAC;KACH;;AA7DM,cAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAe,CAA1C,CAA4C;AAE7B,UAAA,CAAA;AAA3B,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AAA0B,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGtC,UAAA,CAAA;IAAd,KAAK,CAAC,MAAM,CAAC;AAA8B,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAEX,UAAA,CAAA;IAAhC,KAAK,CAAC,wBAAwB,CAAC;AAAgC,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,eAAA,EAAA,KAAA,CAAA,CAAA;;;;"}
+{"version":3,"file":"sgds-breadcrumb.js","sources":["../../../src/components/Breadcrumb/sgds-breadcrumb.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport type SgdsBreadcrumbItem from \"./sgds-breadcrumb-item\";\nimport breadcrumbStyle from \"./breadcrumb.css\";\n/**\n * @summary Breadcrumbs help users to navigate and understand where they are on the current website or service.\n *\n * @slot default - The slot to pass in custom elements of `SgdsBreadcrumbItems`.\n * @slot separator - Defines all the separator of `SgdsBreadcrumbItems`. Defaults to \"/\"\n *\n * @csspart base - The nav element wrapper of `SgdsBreadcrumb`\n *\n */\nexport class SgdsBreadcrumb extends SgdsElement {\n  static styles = [...SgdsElement.styles, breadcrumbStyle];\n  /** The aria-label of nav element within breadcrumb component. */\n  @property({ type: String }) ariaLabel = \"breadcrumb\";\n\n  /**@internal */\n  @query(\"slot\") defaultSlot: HTMLSlotElement;\n  /**@internal */\n  @query('slot[name=\"separator\"]') separatorSlot: HTMLSlotElement;\n\n  // Generates a clone of the separator element to use for each breadcrumb item\n  private _getSeparator() {\n    const separator = this.separatorSlot.assignedElements({ flatten: true })[0] as HTMLElement;\n\n    // Clone it, remove ids, and slot it\n    const clone = separator.cloneNode(true) as HTMLElement;\n    [clone, ...clone.querySelectorAll(\"[id]\")].forEach(el => el.removeAttribute(\"id\"));\n    clone.setAttribute(\"data-default\", \"\");\n    clone.slot = \"separator\";\n\n    return clone;\n  }\n\n  private _handleSlotChange() {\n    const items = [...this.defaultSlot.assignedElements({ flatten: true })].filter(\n      item => item.tagName.toLowerCase() === \"sgds-breadcrumb-item\"\n    ) as SgdsBreadcrumbItem[];\n\n    items.forEach((item, index) => {\n      // Append separators to each item if they don't already have one\n      const separator = item.querySelector('[slot=\"separator\"]');\n      if (separator === null) {\n        // No separator exists, add one\n        item.append(this._getSeparator());\n      } else if (separator.hasAttribute(\"data-default\")) {\n        // A default separator exists, replace it\n        separator.replaceWith(this._getSeparator());\n      } else {\n        // The user provided a custom separator, leave it alone\n      }\n\n      // The last breadcrumb item is the \"current page\"\n\n      if (index === items.length - 1) {\n        item.setAttribute(\"aria-current\", \"page\");\n      } else {\n        item.removeAttribute(\"aria-current\");\n      }\n    });\n  }\n\n  render() {\n    return html`\n      <nav aria-label=${ifDefined(this.ariaLabel)} part=\"base\">\n        <div class=\"breadcrumb\">\n          <slot @slotchange=${this._handleSlotChange}></slot>\n          <slot name=\"separator\" hidden aria-hidden=\"true\">\n            <span>/</span>\n          </slot>\n        </div>\n      </nav>\n    `;\n  }\n}\n\nexport default SgdsBreadcrumb;\n"],"names":["breadcrumbStyle"],"mappings":";;;;;;;;AAMA;;;;;;;;AAQG;AACG,MAAO,cAAe,SAAQ,WAAW,CAAA;AAA/C,IAAA,WAAA,GAAA;;;QAG8B,IAAS,CAAA,SAAA,GAAG,YAAY,CAAC;KA4DtD;;IApDS,aAAa,GAAA;AACnB,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAgB,CAAC;;QAG3F,MAAM,KAAK,GAAG,SAAS,CAAC,SAAS,CAAC,IAAI,CAAgB,CAAC;QACvD,CAAC,KAAK,EAAE,GAAG,KAAK,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;AACnF,QAAA,KAAK,CAAC,YAAY,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC;AACvC,QAAA,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC;AAEzB,QAAA,OAAO,KAAK,CAAC;KACd;IAEO,iBAAiB,GAAA;AACvB,QAAA,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CAC5E,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,sBAAsB,CACtC,CAAC;QAE1B,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;;YAE5B,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;AAC3D,YAAA,IAAI,SAAS,KAAK,IAAI,EAAE;;gBAEtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;aACnC;AAAM,iBAAA,IAAI,SAAS,CAAC,YAAY,CAAC,cAAc,CAAC,EAAE;;gBAEjD,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;aAC7C;iBAAM,CAEN;;YAID,IAAI,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AAC9B,gBAAA,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;aAC3C;iBAAM;AACL,gBAAA,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;aACtC;AACH,SAAC,CAAC,CAAC;KACJ;IAED,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;AACS,sBAAA,EAAA,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;;AAEnB,4BAAA,EAAA,IAAI,CAAC,iBAAiB,CAAA;;;;;;KAM/C,CAAC;KACH;;AA7DM,cAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAe,CAA1C,CAA4C;AAE7B,UAAA,CAAA;AAA3B,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AAA0B,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGtC,UAAA,CAAA;IAAd,KAAK,CAAC,MAAM,CAAC;AAA8B,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAEX,UAAA,CAAA;IAAhC,KAAK,CAAC,wBAAwB,CAAC;AAAgC,CAAA,EAAA,cAAA,CAAA,SAAA,EAAA,eAAA,EAAA,KAAA,CAAA,CAAA;;;;"}

package/components/Button/button.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Button/button.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"button.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/components/Button/button.js

@@ -1,3 +1,4 @@
+'use client';
 import { css } from 'lit';
 
 var css_248z = css`:host{--btn-border-radius:var(--sgds-border-radius);display:inline-block}button:focus:not(:focus-visible){outline:0}:host([variant=primary]) .btn{--btn-color:var(--sgds-white);--btn-bg:var(--sgds-primary-filled);--btn-border-color:var(--sgds-primary-filled);--btn-hover-bg:var(--sgds-primary-700);--btn-focus-box-shadow-color:var(--sgds-primary-300);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--btn-hover-bg);--btn-hover-color:var(--sgds-white)}:host([variant=secondary]) .btn{--btn-color:var(--sgds-white);--btn-bg:var(--sgds-secondary-filled);--btn-border-color:var(--sgds-secondary-filled);--btn-hover-bg:var(--sgds-secondary-700);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--btn-hover-bg);--btn-focus-box-shadow-color:var(--sgds-secondary-300);--btn-hover-color:var(--sgds-white)}:host([variant=warning]) .btn{--btn-color:var(--sgds-white);--btn-bg:var(--sgds-warning-filled);--btn-hover-bg:var(--sgds-warning-700);--btn-border-color:var(--sgds-warning-filled);--btn-hover-color:var(--sgds-white);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--btn-hover-bg);--btn-focus-box-shadow-color:var(--sgds-warning-300)}:host([variant=danger]) .btn{--btn-color:var(--sgds-white);--btn-bg:var(--sgds-danger-filled);--btn-hover-bg:var(--sgds-danger-700);--btn-border-color:var(--sgds-danger-filled);--btn-hover-color:var(--sgds-white);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--btn-hover-bg);--btn-focus-box-shadow-color:var(--sgds-danger-300)}:host([variant=success]) .btn{--btn-color:var(--sgds-white);--btn-bg:var(--sgds-success-filled);--btn-hover-bg:var(--sgds-success-700);--btn-border-color:var(--sgds-success-filled);--btn-hover-color:var(--sgds-white);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--btn-hover-bg);--btn-focus-box-shadow-color:var(--sgds-success-300)}:host([variant=info]) .btn{--btn-color:var(--sgds-white);--btn-bg:var(--sgds-info-filled);--btn-hover-bg:var(--sgds-info-700);--btn-border-color:var(--sgds-info-filled);--btn-hover-color:var(--sgds-white);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--btn-hover-bg);--btn-focus-box-shadow-color:var(--sgds-info-300)}:host([variant=light]) .btn{--btn-color:var(--sgds-dark);--btn-bg:var(--sgds-light-filled);--btn-border-color:var(--sgds-light-filled);--btn-hover-bg:var(--sgds-gray-200);--btn-hover-color:var(--sgds-dark);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--btn-hover-bg);--btn-active-border-color:var(--sgds-gray-200);--btn-focus-box-shadow-color:var(--sgds-gray-500)}:host([variant=dark]) .btn{--btn-color:var(--sgds-white);--btn-bg:var(--sgds-dark-filled);--btn-border-color:var(--sgds-dark-filled);--btn-hover-bg:var(--sgds-gray-700);--btn-hover-color:var(--sgds-white);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--btn-hover-bg);--btn-active-border-color:var(--sgds-gray-700);--btn-focus-box-shadow-color:var(--sgds-gray-500)}:host([variant=link]) .btn{--btn-color:var(--sgds-link);--btn-bg:transparent;--btn-border-color:transparent;--btn-hover-bg:transparent;--btn-hover-color:var(--sgds-info-700);--btn-active-color:var(--sgds-info-700);--btn-active-bg:var(--btn-hover-bg);--btn-focus-box-shadow-color:var(--sgds-info-300);--btn-disabled-color:var(--sgds-disabled-color)}:host([variant=outlined]){--btn-color:var(--sgds-primary-text-emphasis);--btn-bg:var(--sgds-white);--btn-border-color:var(--sgds-primary);--btn-hover-bg:var(--sgds-primary-filled);--btn-hover-color:var(--sgds-white);--btn-focus-box-shadow-color:var(--sgds-primary-300);--btn-active-bg:var(--sgds-primary-filled);--btn-active-border-color:var(--sgds-primary-filled);--btn-active-color:var(--sgds-white)}:host([variant=outline-primary]) .btn{--btn-color:var(--sgds-primary-text-emphasis);--btn-bg:var(--sgds-primary-bg-subtle);--btn-border-color:var(--sgds-primary-border-subtle);--btn-hover-color:var(--sgds-white);--btn-hover-bg:var(--sgds-primary-filled);--btn-hover-border-color:var(--sgds-primary-filled);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--sgds-primary-filled);--btn-active-border-color:var(--sgds-primary-filled);--btn-focus-box-shadow-color:var(--sgds-primary-300)}:host([variant=outline-secondary]) .btn{--btn-color:var(--sgds-secondary-text-emphasis);--btn-bg:var(--sgds-secondary-bg-subtle);--btn-border-color:var(--sgds-secondary-border-subtle);--btn-hover-color:var(--sgds-white);--btn-hover-bg:var(--sgds-secondary-filled);--btn-hover-border-color:var(--sgds-secondary-filled);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--sgds-secondary-filled);--btn-active-border-color:var(--sgds-secondary-filled);--btn-focus-box-shadow-color:var(--sgds-secondary-300)}:host([variant=outline-warning]) .btn{--btn-color:var(--sgds-warning-text-emphasis);--btn-bg:var(--sgds-warning-bg-subtle);--btn-border-color:var(--sgds-warning-border-subtle);--btn-hover-color:var(--sgds-white);--btn-hover-bg:var(--sgds-warning-filled);--btn-hover-border-color:var(--sgds-warning-filled);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--sgds-warning-filled);--btn-active-border-color:var(--sgds-warning-filled);--btn-focus-box-shadow-color:var(--sgds-warning-300)}:host([variant=outline-danger]) .btn{--btn-color:var(--sgds-danger-text-emphasis);--btn-bg:var(--sgds-danger-bg-subtle);--btn-border-color:var(--sgds-danger-border-subtle);--btn-hover-color:var(--sgds-white);--btn-hover-bg:var(--sgds-danger-filled);--btn-hover-border-color:var(--sgds-danger-filled);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--sgds-danger-filled);--btn-active-border-color:var(--sgds-danger-filled);--btn-focus-box-shadow-color:var(--sgds-danger-300)}:host([variant=outline-success]) .btn{--btn-color:var(--sgds-success-text-emphasis);--btn-bg:var(--sgds-success-bg-subtle);--btn-border-color:var(--sgds-success-border-subtle);--btn-hover-color:var(--sgds-white);--btn-hover-bg:var(--sgds-success-filled);--btn-hover-border-color:var(--sgds-success-filled);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--sgds-success-filled);--btn-active-border-color:var(--sgds-success-filled);--btn-focus-box-shadow-color:var(--sgds-success-300)}:host([variant=outline-info]) .btn{--btn-color:var(--sgds-info-text-emphasis);--btn-bg:var(--sgds-info-bg-subtle);--btn-border-color:var(--sgds-info-border-subtle);--btn-hover-color:var(--sgds-white);--btn-hover-bg:var(--sgds-info-filled);--btn-hover-border-color:var(--sgds-info-filled);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--sgds-info-filled);--btn-active-border-color:var(--sgds-info-filled);--btn-focus-box-shadow-color:var(--sgds-info-300)}:host([variant=outline-light]) .btn{--btn-color:var(--sgds-light-text-emphasis);--btn-bg:var(--sgds-light-bg-subtle);--btn-border-color:var(--sgds-light-border-subtle);--btn-hover-color:var(--sgds-light-text-emphasis);--btn-hover-bg:var(--sgds-gray-200);--btn-hover-border-color:var(--sgds-gray-300);--btn-active-color:var(--sgds-light-text-emphasis);--btn-active-bg:var(--sgds-gray-200);--btn-active-border-color:var(--sgds-light-border-subtle);--btn-focus-box-shadow-color:var(--sgds-gray-500)}:host([variant=outline-dark]) .btn{--btn-color:var(--sgds-white);--btn-bg:var(--sgds-dark-filled);--btn-border-color:var(--sgds-dark-filled);--btn-hover-color:var(--sgds-white);--btn-hover-bg:var(--sgds-gray-700);--btn-active-color:var(--sgds-white);--btn-active-bg:var(--sgds-gray-700);--btn-active-border-color:var(--sgds-gray-700);--btn-focus-box-shadow-color:var(--sgds-gray-500);--btn-disabled-color:var(--sgds-white)}.btn{--btn-padding-x:var(--sgds-input-btn-padding-x);--btn-padding-y:var(--sgds-input-btn-padding-y);--btn-font-family:var(--sgds-font-sans-serif);--btn-font-size:1rem;--btn-font-weight:400;--btn-line-height:var(--sgds-line-height-lg);--btn-border-width:var(--sgds-border-width);background-color:var(--btn-bg);border:var(--btn-border-width) solid var(--btn-border-color);border-radius:var(--btn-border-radius);color:var(--btn-color);cursor:pointer;display:inline-block;font-family:var(--btn-font-family);font-size:var(--btn-font-size);font-weight:var(--btn-font-weight);line-height:var(--btn-line-height);padding:var(--btn-padding-y) var(--btn-padding-x);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn:hover{--btn-hover-color:var(--sgds-white);background-color:var(--btn-hover-bg);color:var(--btn-hover-color)}.btn:focus-visible{--btn-focus-box-shadow-color:var(--sgds-gray-500);--btn-focus-box-shadow:0px 0px 0px var(--sgds-focus-width,0.13rem) var(--btn-focus-box-shadow-color);--btn-hover-color:var(--sgds-white);background-color:var(--btn-hover-bg);border-color:var(--btn-hover-border-color);box-shadow:var(--btn-focus-box-shadow);color:var(--btn-hover-color);outline:0}.btn.active{--btn-active-color:light-dark(var(--sgds-white),var(--sgds-black));--btn-active-bg:light-dark(var(--sgds-black),var(--sgds-white));--btn-active-border-color:transparent;background-color:var(--btn-active-bg);border-color:var(--btn-active-border-color);color:var(--btn-active-color)}.btn.disabled,.btn:disabled{--btn-disabled-color:var(--btn-color);--btn-disabled-opacity:var(--sgds-disabled-opacity);color:var(--btn-disabled-color);cursor:not-allowed;opacity:var(--btn-disabled-opacity)}.btn-link{text-decoration:underline;text-underline-offset:.25rem}.btn-link:hover{color:var(--btn-hover-color)}.btn-lg{--btn-padding-y:0.5rem;--btn-padding-x:1rem;--btn-font-size:1.25rem;--btn-border-radius:var(--sgds-border-radius-lg)}.btn-sm{--btn-padding-y:0.25rem;--btn-padding-x:0.5rem;--btn-font-size:0.875rem;--btn-border-radius:var(--sgds-border-radius-sm)}slot[name=leftIcon]::slotted(*){padding-right:var(--sgds-spacer-2)}slot[name=rightIcon]::slotted(*){padding-left:var(--sgds-spacer-2)}`;

package/components/Button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/components/Button/sgds-button.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Button/sgds-button.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-button.cjs.js","sources":["../../../src/components/Button/sgds-button.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html, literal } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport buttonStyles from \"./button.css\";\nimport anchorStyles from \"../../styles/anchor.css\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"success\"\n  | \"danger\"\n  | \"warning\"\n  | \"info\"\n  | \"light\"\n  | \"dark\"\n  | \"link\"\n  | \"outlined\"\n  | \"outline-primary\"\n  | \"outline-secondary\"\n  | \"outline-success\"\n  | \"outline-danger\"\n  | \"outline-warning\"\n  | \"outline-info\"\n  | \"outline-light\"\n  | \"outline-dark\";\n\n/**\n * @summary Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.\n *\n * @slot default - The button's label.\n * @slot leftIcon - The slot for icon to the left of the button text\n * @slot rightIcon - The slot for icon to the right of the button text\n *\n * @event sgds-blur - Emitted when the button is not focused.\n * @event sgds-focus - Emitted when the button is focused.\n *\n * @cssprop --btn-border-radius - Border radius of the button\n *\n */\nexport class SgdsButton extends SgdsElement {\n  static styles = [...SgdsElement.styles, anchorStyles, buttonStyles];\n\n  @query(\".btn\") private button: HTMLButtonElement | HTMLLinkElement;\n\n  /** @internal */\n  private readonly formSubmitController = new FormSubmitController(this, {\n    form: (input: HTMLInputElement) => {\n      // Buttons support a form attribute that points to an arbitrary form, so if this attribute it set we need to query\n      // the form from the same root using its id\n      if (input.hasAttribute(\"form\")) {\n        const doc = input.getRootNode() as Document | ShadowRoot;\n        const formId = input.getAttribute(\"form\");\n        return doc.getElementById(formId) as HTMLFormElement;\n      }\n\n      // Fall back to the closest containing form\n      return input.closest(\"form\");\n    }\n  });\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `outlined` and `danger`. @deprecated The following variants are deprecated from v2.0 and will be removed from v3 onwards: `secondary`, `success`, `warning`, `info`, `dark`, `light`, `link` as well as those prefixed by `outline-*` */\n  @property({ reflect: true }) variant: ButtonVariant = \"primary\";\n\n  /** Specifies a large or small button */\n  @property({ reflect: true }) size: \"sm\" | \"lg\";\n\n  /** Manually set the visual state of the button to `:active` */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server */\n  @property({ type: String, reflect: true }) type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n  @property({ type: String, reflect: true }) href: string;\n\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property({ type: String, reflect: true }) target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n  @property({ type: String, reflect: true }) download: string;\n\n  /**\n   * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n   * value of this attribute must be an id of a form in the same document or shadow root as the button.\n   */\n  @property({ type: String, reflect: true }) form: string;\n\n  /** Used to override the form owner's `action` attribute. */\n  @property({ type: String, reflect: true, attribute: \"formaction\" }) formAction: string;\n\n  /** Used to override the form owner's `method` attribute.  */\n  @property({ type: String, reflect: true, attribute: \"formmethod\" }) formMethod: \"post\" | \"get\";\n\n  /** Used to override the form owner's `novalidate` attribute. */\n  @property({ attribute: \"formnovalidate\", type: Boolean, reflect: true })\n  formNoValidate: boolean;\n\n  /** Used to override the form owner's `target` attribute. */\n  @property({ type: String, reflect: true, attribute: \"formtarget\" }) formTarget:\n    | \"_self\"\n    | \"_blank\"\n    | \"_parent\"\n    | \"_top\"\n    | string;\n\n  /** The aria-label attribute to passed to button element when necessary */\n  @property({ type: String }) ariaLabel: string;\n\n  /** Sets focus on the button. */\n  public focus(options?: FocusOptions) {\n    this.button.focus(options);\n  }\n\n  /** Simulates a click on the button. */\n  public click() {\n    this.button.click();\n  }\n\n  /** Removes focus from the button. */\n  public blur() {\n    this.button.blur();\n  }\n\n  handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this._clickHandler);\n    this.addEventListener(\"click\", this._clickHandler);\n  }\n\n  private _clickHandler = () => {\n    if (this.type === \"submit\") {\n      this.formSubmitController.submit(this);\n    }\n    if (this.type === \"reset\") {\n      this.formSubmitController.reset(this);\n    }\n  };\n\n  render() {\n    const isLink = this.href;\n    const tag = isLink ? literal`a` : literal`button`;\n    return html`\n      <${tag}\n        class=\"sgds btn ${classMap({\n          disabled: this.disabled,\n          active: this.active,\n          [`btn-${this.size}`]: this.size,\n          \"btn-link\": this.variant === \"link\"\n        })}\"\n        ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n        type=${ifDefined(isLink ? undefined : this.type)}\n        href=${ifDefined(isLink ? this.href : undefined)}\n        target=${ifDefined(isLink ? this.target : undefined)}\n        download=${ifDefined(isLink ? this.download : undefined)}\n        rel=${ifDefined(isLink && this.target === \"_blank\" ? \"noreferrer noopener\" : undefined)}\n        role=${ifDefined(isLink ? \"button\" : undefined)}\n        aria-disabled=${this.disabled ? \"true\" : \"false\"}\n        tabindex=${this.disabled ? \"-1\" : \"0\"}\n        @click=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n        aria-label=${ifDefined(this.ariaLabel)}\n      >\n      <slot name=\"leftIcon\"></slot>\n      <slot></slot>\n      <slot name=\"rightIcon\"></slot>\n      </${tag}>\n    `;\n  }\n}\n\nexport default SgdsButton;\n"],"names":["SgdsElement","FormSubmitController","literal","html","classMap","ifDefined","anchorStyles","buttonStyles","__decorate","query","property"],"mappings":"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"}
+{"version":3,"file":"sgds-button.cjs.js","sources":["../../../src/components/Button/sgds-button.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html, literal } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport buttonStyles from \"./button.css\";\nimport anchorStyles from \"../../styles/anchor.css\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"success\"\n  | \"danger\"\n  | \"warning\"\n  | \"info\"\n  | \"light\"\n  | \"dark\"\n  | \"link\"\n  | \"outlined\"\n  | \"outline-primary\"\n  | \"outline-secondary\"\n  | \"outline-success\"\n  | \"outline-danger\"\n  | \"outline-warning\"\n  | \"outline-info\"\n  | \"outline-light\"\n  | \"outline-dark\";\n\n/**\n * @summary Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.\n *\n * @slot default - The button's label.\n * @slot leftIcon - The slot for icon to the left of the button text\n * @slot rightIcon - The slot for icon to the right of the button text\n *\n * @event sgds-blur - Emitted when the button is not focused.\n * @event sgds-focus - Emitted when the button is focused.\n *\n * @cssprop --btn-border-radius - Border radius of the button\n *\n */\nexport class SgdsButton extends SgdsElement {\n  static styles = [...SgdsElement.styles, anchorStyles, buttonStyles];\n\n  @query(\".btn\") private button: HTMLButtonElement | HTMLLinkElement;\n\n  /** @internal */\n  private readonly formSubmitController = new FormSubmitController(this, {\n    form: (input: HTMLInputElement) => {\n      // Buttons support a form attribute that points to an arbitrary form, so if this attribute it set we need to query\n      // the form from the same root using its id\n      if (input.hasAttribute(\"form\")) {\n        const doc = input.getRootNode() as Document | ShadowRoot;\n        const formId = input.getAttribute(\"form\");\n        return doc.getElementById(formId) as HTMLFormElement;\n      }\n\n      // Fall back to the closest containing form\n      return input.closest(\"form\");\n    }\n  });\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `outlined` and `danger`. @deprecated The following variants are deprecated from v2.0 and will be removed from v3 onwards: `secondary`, `success`, `warning`, `info`, `dark`, `light`, `link` as well as those prefixed by `outline-*` */\n  @property({ reflect: true }) variant: ButtonVariant = \"primary\";\n\n  /** Specifies a large or small button */\n  @property({ reflect: true }) size: \"sm\" | \"lg\";\n\n  /** Manually set the visual state of the button to `:active` */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server */\n  @property({ type: String, reflect: true }) type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n  @property({ type: String, reflect: true }) href: string;\n\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property({ type: String, reflect: true }) target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n  @property({ type: String, reflect: true }) download: string;\n\n  /**\n   * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n   * value of this attribute must be an id of a form in the same document or shadow root as the button.\n   */\n  @property({ type: String, reflect: true }) form: string;\n\n  /** Used to override the form owner's `action` attribute. */\n  @property({ type: String, reflect: true, attribute: \"formaction\" }) formAction: string;\n\n  /** Used to override the form owner's `method` attribute.  */\n  @property({ type: String, reflect: true, attribute: \"formmethod\" }) formMethod: \"post\" | \"get\";\n\n  /** Used to override the form owner's `novalidate` attribute. */\n  @property({ attribute: \"formnovalidate\", type: Boolean, reflect: true })\n  formNoValidate: boolean;\n\n  /** Used to override the form owner's `target` attribute. */\n  @property({ type: String, reflect: true, attribute: \"formtarget\" }) formTarget:\n    | \"_self\"\n    | \"_blank\"\n    | \"_parent\"\n    | \"_top\"\n    | string;\n\n  /** The aria-label attribute to passed to button element when necessary */\n  @property({ type: String }) ariaLabel: string;\n\n  /** Sets focus on the button. */\n  public focus(options?: FocusOptions) {\n    this.button.focus(options);\n  }\n\n  /** Simulates a click on the button. */\n  public click() {\n    this.button.click();\n  }\n\n  /** Removes focus from the button. */\n  public blur() {\n    this.button.blur();\n  }\n\n  handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this._clickHandler);\n    this.addEventListener(\"click\", this._clickHandler);\n  }\n\n  private _clickHandler = () => {\n    if (this.type === \"submit\") {\n      this.formSubmitController.submit(this);\n    }\n    if (this.type === \"reset\") {\n      this.formSubmitController.reset(this);\n    }\n  };\n\n  render() {\n    const isLink = this.href;\n    const tag = isLink ? literal`a` : literal`button`;\n    return html`\n      <${tag}\n        class=\"sgds btn ${classMap({\n          disabled: this.disabled,\n          active: this.active,\n          [`btn-${this.size}`]: this.size,\n          \"btn-link\": this.variant === \"link\"\n        })}\"\n        ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n        type=${ifDefined(isLink ? undefined : this.type)}\n        href=${ifDefined(isLink ? this.href : undefined)}\n        target=${ifDefined(isLink ? this.target : undefined)}\n        download=${ifDefined(isLink ? this.download : undefined)}\n        rel=${ifDefined(isLink && this.target === \"_blank\" ? \"noreferrer noopener\" : undefined)}\n        role=${ifDefined(isLink ? \"button\" : undefined)}\n        aria-disabled=${this.disabled ? \"true\" : \"false\"}\n        tabindex=${this.disabled ? \"-1\" : \"0\"}\n        @click=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n        aria-label=${ifDefined(this.ariaLabel)}\n      >\n      <slot name=\"leftIcon\"></slot>\n      <slot></slot>\n      <slot name=\"rightIcon\"></slot>\n      </${tag}>\n    `;\n  }\n}\n\nexport default SgdsButton;\n"],"names":["SgdsElement","FormSubmitController","literal","html","classMap","ifDefined","anchorStyles","buttonStyles","__decorate","query","property"],"mappings":"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"}

package/components/Button/sgds-button.js

@@ -1,3 +1,4 @@
+'use client';
 import { __decorate } from 'tslib';
 import { query, property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';

package/components/Button/sgds-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-button.js","sources":["../../../src/components/Button/sgds-button.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html, literal } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport buttonStyles from \"./button.css\";\nimport anchorStyles from \"../../styles/anchor.css\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"success\"\n  | \"danger\"\n  | \"warning\"\n  | \"info\"\n  | \"light\"\n  | \"dark\"\n  | \"link\"\n  | \"outlined\"\n  | \"outline-primary\"\n  | \"outline-secondary\"\n  | \"outline-success\"\n  | \"outline-danger\"\n  | \"outline-warning\"\n  | \"outline-info\"\n  | \"outline-light\"\n  | \"outline-dark\";\n\n/**\n * @summary Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.\n *\n * @slot default - The button's label.\n * @slot leftIcon - The slot for icon to the left of the button text\n * @slot rightIcon - The slot for icon to the right of the button text\n *\n * @event sgds-blur - Emitted when the button is not focused.\n * @event sgds-focus - Emitted when the button is focused.\n *\n * @cssprop --btn-border-radius - Border radius of the button\n *\n */\nexport class SgdsButton extends SgdsElement {\n  static styles = [...SgdsElement.styles, anchorStyles, buttonStyles];\n\n  @query(\".btn\") private button: HTMLButtonElement | HTMLLinkElement;\n\n  /** @internal */\n  private readonly formSubmitController = new FormSubmitController(this, {\n    form: (input: HTMLInputElement) => {\n      // Buttons support a form attribute that points to an arbitrary form, so if this attribute it set we need to query\n      // the form from the same root using its id\n      if (input.hasAttribute(\"form\")) {\n        const doc = input.getRootNode() as Document | ShadowRoot;\n        const formId = input.getAttribute(\"form\");\n        return doc.getElementById(formId) as HTMLFormElement;\n      }\n\n      // Fall back to the closest containing form\n      return input.closest(\"form\");\n    }\n  });\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `outlined` and `danger`. @deprecated The following variants are deprecated from v2.0 and will be removed from v3 onwards: `secondary`, `success`, `warning`, `info`, `dark`, `light`, `link` as well as those prefixed by `outline-*` */\n  @property({ reflect: true }) variant: ButtonVariant = \"primary\";\n\n  /** Specifies a large or small button */\n  @property({ reflect: true }) size: \"sm\" | \"lg\";\n\n  /** Manually set the visual state of the button to `:active` */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server */\n  @property({ type: String, reflect: true }) type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n  @property({ type: String, reflect: true }) href: string;\n\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property({ type: String, reflect: true }) target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n  @property({ type: String, reflect: true }) download: string;\n\n  /**\n   * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n   * value of this attribute must be an id of a form in the same document or shadow root as the button.\n   */\n  @property({ type: String, reflect: true }) form: string;\n\n  /** Used to override the form owner's `action` attribute. */\n  @property({ type: String, reflect: true, attribute: \"formaction\" }) formAction: string;\n\n  /** Used to override the form owner's `method` attribute.  */\n  @property({ type: String, reflect: true, attribute: \"formmethod\" }) formMethod: \"post\" | \"get\";\n\n  /** Used to override the form owner's `novalidate` attribute. */\n  @property({ attribute: \"formnovalidate\", type: Boolean, reflect: true })\n  formNoValidate: boolean;\n\n  /** Used to override the form owner's `target` attribute. */\n  @property({ type: String, reflect: true, attribute: \"formtarget\" }) formTarget:\n    | \"_self\"\n    | \"_blank\"\n    | \"_parent\"\n    | \"_top\"\n    | string;\n\n  /** The aria-label attribute to passed to button element when necessary */\n  @property({ type: String }) ariaLabel: string;\n\n  /** Sets focus on the button. */\n  public focus(options?: FocusOptions) {\n    this.button.focus(options);\n  }\n\n  /** Simulates a click on the button. */\n  public click() {\n    this.button.click();\n  }\n\n  /** Removes focus from the button. */\n  public blur() {\n    this.button.blur();\n  }\n\n  handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this._clickHandler);\n    this.addEventListener(\"click\", this._clickHandler);\n  }\n\n  private _clickHandler = () => {\n    if (this.type === \"submit\") {\n      this.formSubmitController.submit(this);\n    }\n    if (this.type === \"reset\") {\n      this.formSubmitController.reset(this);\n    }\n  };\n\n  render() {\n    const isLink = this.href;\n    const tag = isLink ? literal`a` : literal`button`;\n    return html`\n      <${tag}\n        class=\"sgds btn ${classMap({\n          disabled: this.disabled,\n          active: this.active,\n          [`btn-${this.size}`]: this.size,\n          \"btn-link\": this.variant === \"link\"\n        })}\"\n        ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n        type=${ifDefined(isLink ? undefined : this.type)}\n        href=${ifDefined(isLink ? this.href : undefined)}\n        target=${ifDefined(isLink ? this.target : undefined)}\n        download=${ifDefined(isLink ? this.download : undefined)}\n        rel=${ifDefined(isLink && this.target === \"_blank\" ? \"noreferrer noopener\" : undefined)}\n        role=${ifDefined(isLink ? \"button\" : undefined)}\n        aria-disabled=${this.disabled ? \"true\" : \"false\"}\n        tabindex=${this.disabled ? \"-1\" : \"0\"}\n        @click=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n        aria-label=${ifDefined(this.ariaLabel)}\n      >\n      <slot name=\"leftIcon\"></slot>\n      <slot></slot>\n      <slot name=\"rightIcon\"></slot>\n      </${tag}>\n    `;\n  }\n}\n\nexport default SgdsButton;\n"],"names":["anchorStyles","buttonStyles"],"mappings":";;;;;;;;;;AA6BA;;;;;;;;;;;;AAYG;AACG,MAAO,UAAW,SAAQ,WAAW,CAAA;AAA3C,IAAA,WAAA,GAAA;;;AAMmB,QAAA,IAAA,CAAA,oBAAoB,GAAG,IAAI,oBAAoB,CAAC,IAAI,EAAE;AACrE,YAAA,IAAI,EAAE,CAAC,KAAuB,KAAI;;;AAGhC,gBAAA,IAAI,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE;AAC9B,oBAAA,MAAM,GAAG,GAAG,KAAK,CAAC,WAAW,EAA2B,CAAC;oBACzD,MAAM,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;AAC1C,oBAAA,OAAO,GAAG,CAAC,cAAc,CAAC,MAAM,CAAoB,CAAC;iBACtD;;AAGD,gBAAA,OAAO,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;aAC9B;AACF,SAAA,CAAC,CAAC;;QAG0B,IAAO,CAAA,OAAA,GAAkB,SAAS,CAAC;;QAMpB,IAAM,CAAA,MAAA,GAAG,KAAK,CAAC;;QAGf,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;;QAGlB,IAAI,CAAA,IAAA,GAAkC,QAAQ,CAAC;QAwElF,IAAa,CAAA,aAAA,GAAG,MAAK;AAC3B,YAAA,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;AAC1B,gBAAA,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;aACxC;AACD,YAAA,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;AACzB,gBAAA,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;aACvC;AACH,SAAC,CAAC;KAiCH;;AAzEQ,IAAA,KAAK,CAAC,OAAsB,EAAA;AACjC,QAAA,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;KAC5B;;IAGM,KAAK,GAAA;AACV,QAAA,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;KACrB;;IAGM,IAAI,GAAA;AACT,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;KACpB;IAED,UAAU,GAAA;AACR,QAAA,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;KACxB;IAED,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;KACzB;AAED,IAAA,WAAW,CAAC,KAAiB,EAAA;AAC3B,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,OAAO;SACR;QAED,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QACtD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;KACpD;IAWD,MAAM,GAAA;AACJ,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC;AACzB,QAAA,MAAM,GAAG,GAAG,MAAM,GAAG,OAAO,CAAA,CAAA,CAAA,CAAG,GAAG,OAAO,CAAA,QAAQ,CAAC;AAClD,QAAA,OAAO,IAAI,CAAA,CAAA;SACN,GAAG,CAAA;AACc,wBAAA,EAAA,QAAQ,CAAC;YACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,MAAM,EAAE,IAAI,CAAC,MAAM;YACnB,CAAC,CAAA,IAAA,EAAO,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI,CAAC,IAAI;AAC/B,YAAA,UAAU,EAAE,IAAI,CAAC,OAAO,KAAK,MAAM;SACpC,CAAC,CAAA;AACU,kBAAA,EAAA,SAAS,CAAC,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAA;AAClD,aAAA,EAAA,SAAS,CAAC,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,CAAA;AACzC,aAAA,EAAA,SAAS,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI,GAAG,SAAS,CAAC,CAAA;AACvC,eAAA,EAAA,SAAS,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;AACzC,iBAAA,EAAA,SAAS,CAAC,MAAM,GAAG,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC,CAAA;AAClD,YAAA,EAAA,SAAS,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,KAAK,QAAQ,GAAG,qBAAqB,GAAG,SAAS,CAAC,CAAA;eAChF,SAAS,CAAC,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC,CAAA;wBAC/B,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;mBACrC,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,GAAG,CAAA;AAC5B,eAAA,EAAA,IAAI,CAAC,WAAW,CAAA;AAChB,eAAA,EAAA,IAAI,CAAC,WAAW,CAAA;AACjB,cAAA,EAAA,IAAI,CAAC,UAAU,CAAA;AACV,mBAAA,EAAA,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;;;;;UAKpC,GAAG,CAAA;KACR,CAAC;KACH;;AAhJM,UAAA,CAAA,MAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAY,EAAEC,UAAY,CAArD,CAAuD;AAE7C,UAAA,CAAA;IAAtB,KAAK,CAAC,MAAM,CAAC;AAAqD,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAmBtC,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAoC,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,SAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGnC,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAmB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGH,UAAA,CAAA;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAgB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGf,UAAA,CAAA;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAkB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,UAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGlB,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAgD,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAG/C,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAc,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGb,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAiD,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGhD,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAkB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,UAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAMjB,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAc,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGY,UAAA,CAAA;AAAnE,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;AAAoB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,YAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGnB,UAAA,CAAA;AAAnE,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;AAA4B,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,YAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAI/F,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAChD,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAG4C,UAAA,CAAA;AAAnE,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;AAKxD,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,YAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGiB,UAAA,CAAA;AAA3B,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AAAmB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,WAAA,EAAA,KAAA,CAAA,CAAA;;;;"}
+{"version":3,"file":"sgds-button.js","sources":["../../../src/components/Button/sgds-button.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html, literal } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport buttonStyles from \"./button.css\";\nimport anchorStyles from \"../../styles/anchor.css\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"success\"\n  | \"danger\"\n  | \"warning\"\n  | \"info\"\n  | \"light\"\n  | \"dark\"\n  | \"link\"\n  | \"outlined\"\n  | \"outline-primary\"\n  | \"outline-secondary\"\n  | \"outline-success\"\n  | \"outline-danger\"\n  | \"outline-warning\"\n  | \"outline-info\"\n  | \"outline-light\"\n  | \"outline-dark\";\n\n/**\n * @summary Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.\n *\n * @slot default - The button's label.\n * @slot leftIcon - The slot for icon to the left of the button text\n * @slot rightIcon - The slot for icon to the right of the button text\n *\n * @event sgds-blur - Emitted when the button is not focused.\n * @event sgds-focus - Emitted when the button is focused.\n *\n * @cssprop --btn-border-radius - Border radius of the button\n *\n */\nexport class SgdsButton extends SgdsElement {\n  static styles = [...SgdsElement.styles, anchorStyles, buttonStyles];\n\n  @query(\".btn\") private button: HTMLButtonElement | HTMLLinkElement;\n\n  /** @internal */\n  private readonly formSubmitController = new FormSubmitController(this, {\n    form: (input: HTMLInputElement) => {\n      // Buttons support a form attribute that points to an arbitrary form, so if this attribute it set we need to query\n      // the form from the same root using its id\n      if (input.hasAttribute(\"form\")) {\n        const doc = input.getRootNode() as Document | ShadowRoot;\n        const formId = input.getAttribute(\"form\");\n        return doc.getElementById(formId) as HTMLFormElement;\n      }\n\n      // Fall back to the closest containing form\n      return input.closest(\"form\");\n    }\n  });\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `outlined` and `danger`. @deprecated The following variants are deprecated from v2.0 and will be removed from v3 onwards: `secondary`, `success`, `warning`, `info`, `dark`, `light`, `link` as well as those prefixed by `outline-*` */\n  @property({ reflect: true }) variant: ButtonVariant = \"primary\";\n\n  /** Specifies a large or small button */\n  @property({ reflect: true }) size: \"sm\" | \"lg\";\n\n  /** Manually set the visual state of the button to `:active` */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server */\n  @property({ type: String, reflect: true }) type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n  @property({ type: String, reflect: true }) href: string;\n\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property({ type: String, reflect: true }) target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n  @property({ type: String, reflect: true }) download: string;\n\n  /**\n   * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n   * value of this attribute must be an id of a form in the same document or shadow root as the button.\n   */\n  @property({ type: String, reflect: true }) form: string;\n\n  /** Used to override the form owner's `action` attribute. */\n  @property({ type: String, reflect: true, attribute: \"formaction\" }) formAction: string;\n\n  /** Used to override the form owner's `method` attribute.  */\n  @property({ type: String, reflect: true, attribute: \"formmethod\" }) formMethod: \"post\" | \"get\";\n\n  /** Used to override the form owner's `novalidate` attribute. */\n  @property({ attribute: \"formnovalidate\", type: Boolean, reflect: true })\n  formNoValidate: boolean;\n\n  /** Used to override the form owner's `target` attribute. */\n  @property({ type: String, reflect: true, attribute: \"formtarget\" }) formTarget:\n    | \"_self\"\n    | \"_blank\"\n    | \"_parent\"\n    | \"_top\"\n    | string;\n\n  /** The aria-label attribute to passed to button element when necessary */\n  @property({ type: String }) ariaLabel: string;\n\n  /** Sets focus on the button. */\n  public focus(options?: FocusOptions) {\n    this.button.focus(options);\n  }\n\n  /** Simulates a click on the button. */\n  public click() {\n    this.button.click();\n  }\n\n  /** Removes focus from the button. */\n  public blur() {\n    this.button.blur();\n  }\n\n  handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this._clickHandler);\n    this.addEventListener(\"click\", this._clickHandler);\n  }\n\n  private _clickHandler = () => {\n    if (this.type === \"submit\") {\n      this.formSubmitController.submit(this);\n    }\n    if (this.type === \"reset\") {\n      this.formSubmitController.reset(this);\n    }\n  };\n\n  render() {\n    const isLink = this.href;\n    const tag = isLink ? literal`a` : literal`button`;\n    return html`\n      <${tag}\n        class=\"sgds btn ${classMap({\n          disabled: this.disabled,\n          active: this.active,\n          [`btn-${this.size}`]: this.size,\n          \"btn-link\": this.variant === \"link\"\n        })}\"\n        ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n        type=${ifDefined(isLink ? undefined : this.type)}\n        href=${ifDefined(isLink ? this.href : undefined)}\n        target=${ifDefined(isLink ? this.target : undefined)}\n        download=${ifDefined(isLink ? this.download : undefined)}\n        rel=${ifDefined(isLink && this.target === \"_blank\" ? \"noreferrer noopener\" : undefined)}\n        role=${ifDefined(isLink ? \"button\" : undefined)}\n        aria-disabled=${this.disabled ? \"true\" : \"false\"}\n        tabindex=${this.disabled ? \"-1\" : \"0\"}\n        @click=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n        aria-label=${ifDefined(this.ariaLabel)}\n      >\n      <slot name=\"leftIcon\"></slot>\n      <slot></slot>\n      <slot name=\"rightIcon\"></slot>\n      </${tag}>\n    `;\n  }\n}\n\nexport default SgdsButton;\n"],"names":["anchorStyles","buttonStyles"],"mappings":"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"}

package/components/Card/card.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Card/card.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"card.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"card.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/components/Card/card.js

@@ -1,3 +1,4 @@
+'use client';
 import { css } from 'lit';
 
 var css_248z = css`::slotted(.stretched-link):before{bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:1}`;

package/components/Card/card.js.map

@@ -1 +1 @@
-{"version":3,"file":"card.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"card.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/components/Card/sgds-card.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Card/sgds-card.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-card.cjs.js","sources":["../../../src/components/Card/sgds-card.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport cardStyle from \"./card.css\";\n\n/**\n * @summary Cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot card-title - The title of the card\n * @slot card-text - The paragrapher text of the card\n * @slot card-image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot card-link - Accepts an anchor element. Only a single element is allowed to be passed in.\n *\n *\n * @csspart base - The card base wrapper\n * @csspart body - The card body\n * @csspart title - The card title\n * @csspart text - The card text\n *\n */\nexport class SgdsCard extends CardElement {\n  static styles = [...CardElement.styles, cardStyle];\n\n  /** Extends the link passed in slot[name=\"link\"] to the entire card */\n  @property({ type: Boolean }) stretchedLink = false;\n\n  handleLinkSlotChange(e: Event) {\n    const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLLinkElement>;\n    if (childNodes.length > 1) {\n      return console.error(\"Multiple elements passed into SgdsCard's link slot\");\n    }\n    if (this.stretchedLink) {\n      childNodes[0].classList.add(\"stretched-link\");\n    }\n    return;\n  }\n\n  handleImgSlotChange(e: Event) {\n    const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n    if (childNodes.length > 1) {\n      return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n    }\n  }\n  render() {\n    return html`\n      <div\n        class=\"${classMap({\n          sgds: true,\n          card: true,\n          [`text-${this.textColor}`]: this.textColor,\n          [`bg-${this.bgColor}`]: this.bgColor,\n          [`border-${this.borderColor}`]: this.borderColor\n        })}\n        \"\n        part=\"base\"\n      >\n        <slot name=\"card-image\" @slotchange=${this.handleImgSlotChange}></slot>\n        <div class=\"card-body\" part=\"body\">\n          <h3 class=\"card-title \" part=\"title\"><slot name=\"card-title\"></slot></h3>\n          <p class=\"card-text\" part=\"text\">\n            <slot name=\"card-text\"></slot>\n          </p>\n          <slot name=\"card-link\" @slotchange=${this.handleLinkSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsCard;\n"],"names":["CardElement","html","classMap","cardStyle","__decorate","property"],"mappings":";;;;;;;;;;;AAMA;;;;;;;;;;;;;AAaG;AACG,MAAO,QAAS,SAAQA,uBAAW,CAAA;AAAzC,IAAA,WAAA,GAAA;;;QAI+B,IAAa,CAAA,aAAA,GAAG,KAAK,CAAC;KA2CpD;AAzCC,IAAA,oBAAoB,CAAC,CAAQ,EAAA;AAC3B,QAAA,MAAM,UAAU,GAAI,CAAC,CAAC,MAA0B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAA2B,CAAC;AAC5G,QAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACzB,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC,CAAC;SAC5E;AACD,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,UAAU,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;SAC/C;QACD,OAAO;KACR;AAED,IAAA,mBAAmB,CAAC,CAAQ,EAAA;AAC1B,QAAA,MAAM,UAAU,GAAI,CAAC,CAAC,MAA0B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAiC,CAAC;AAClH,QAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACzB,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC,qDAAqD,CAAC,CAAC;SAC7E;KACF;IACD,MAAM,GAAA;AACJ,QAAA,OAAOC,QAAI,CAAA,CAAA;;AAEE,eAAA,EAAAC,oBAAQ,CAAC;AAChB,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,IAAI,EAAE,IAAI;YACV,CAAC,CAAA,KAAA,EAAQ,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS;YAC1C,CAAC,CAAA,GAAA,EAAM,IAAI,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,OAAO;YACpC,CAAC,CAAA,OAAA,EAAU,IAAI,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,WAAW;SACjD,CAAC,CAAA;;;;AAIoC,4CAAA,EAAA,IAAI,CAAC,mBAAmB,CAAA;;;;;;AAMvB,6CAAA,EAAA,IAAI,CAAC,oBAAoB,CAAA;;;KAGnE,CAAC;KACH;;AA7CM,QAAM,CAAA,MAAA,GAAG,CAAC,GAAGF,uBAAW,CAAC,MAAM,EAAEG,eAAS,CAApC,CAAsC;AAGtBC,gBAAA,CAAA;AAA5B,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAuB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,eAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}
+{"version":3,"file":"sgds-card.cjs.js","sources":["../../../src/components/Card/sgds-card.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport cardStyle from \"./card.css\";\n\n/**\n * @summary Cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot card-title - The title of the card\n * @slot card-text - The paragrapher text of the card\n * @slot card-image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot card-link - Accepts an anchor element. Only a single element is allowed to be passed in.\n *\n *\n * @csspart base - The card base wrapper\n * @csspart body - The card body\n * @csspart title - The card title\n * @csspart text - The card text\n *\n */\nexport class SgdsCard extends CardElement {\n  static styles = [...CardElement.styles, cardStyle];\n\n  /** Extends the link passed in slot[name=\"link\"] to the entire card */\n  @property({ type: Boolean }) stretchedLink = false;\n\n  handleLinkSlotChange(e: Event) {\n    const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLLinkElement>;\n    if (childNodes.length > 1) {\n      return console.error(\"Multiple elements passed into SgdsCard's link slot\");\n    }\n    if (this.stretchedLink) {\n      childNodes[0].classList.add(\"stretched-link\");\n    }\n    return;\n  }\n\n  handleImgSlotChange(e: Event) {\n    const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n    if (childNodes.length > 1) {\n      return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n    }\n  }\n  render() {\n    return html`\n      <div\n        class=\"${classMap({\n          sgds: true,\n          card: true,\n          [`text-${this.textColor}`]: this.textColor,\n          [`bg-${this.bgColor}`]: this.bgColor,\n          [`border-${this.borderColor}`]: this.borderColor\n        })}\n        \"\n        part=\"base\"\n      >\n        <slot name=\"card-image\" @slotchange=${this.handleImgSlotChange}></slot>\n        <div class=\"card-body\" part=\"body\">\n          <h3 class=\"card-title \" part=\"title\"><slot name=\"card-title\"></slot></h3>\n          <p class=\"card-text\" part=\"text\">\n            <slot name=\"card-text\"></slot>\n          </p>\n          <slot name=\"card-link\" @slotchange=${this.handleLinkSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsCard;\n"],"names":["CardElement","html","classMap","cardStyle","__decorate","property"],"mappings":";;;;;;;;;;;;AAMA;;;;;;;;;;;;;AAaG;AACG,MAAO,QAAS,SAAQA,uBAAW,CAAA;AAAzC,IAAA,WAAA,GAAA;;;QAI+B,IAAa,CAAA,aAAA,GAAG,KAAK,CAAC;KA2CpD;AAzCC,IAAA,oBAAoB,CAAC,CAAQ,EAAA;AAC3B,QAAA,MAAM,UAAU,GAAI,CAAC,CAAC,MAA0B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAA2B,CAAC;AAC5G,QAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACzB,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC,CAAC;SAC5E;AACD,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,UAAU,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;SAC/C;QACD,OAAO;KACR;AAED,IAAA,mBAAmB,CAAC,CAAQ,EAAA;AAC1B,QAAA,MAAM,UAAU,GAAI,CAAC,CAAC,MAA0B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAiC,CAAC;AAClH,QAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACzB,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC,qDAAqD,CAAC,CAAC;SAC7E;KACF;IACD,MAAM,GAAA;AACJ,QAAA,OAAOC,QAAI,CAAA,CAAA;;AAEE,eAAA,EAAAC,oBAAQ,CAAC;AAChB,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,IAAI,EAAE,IAAI;YACV,CAAC,CAAA,KAAA,EAAQ,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS;YAC1C,CAAC,CAAA,GAAA,EAAM,IAAI,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,OAAO;YACpC,CAAC,CAAA,OAAA,EAAU,IAAI,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,WAAW;SACjD,CAAC,CAAA;;;;AAIoC,4CAAA,EAAA,IAAI,CAAC,mBAAmB,CAAA;;;;;;AAMvB,6CAAA,EAAA,IAAI,CAAC,oBAAoB,CAAA;;;KAGnE,CAAC;KACH;;AA7CM,QAAM,CAAA,MAAA,GAAG,CAAC,GAAGF,uBAAW,CAAC,MAAM,EAAEG,eAAS,CAApC,CAAsC;AAGtBC,gBAAA,CAAA;AAA5B,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAuB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,eAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}

package/components/Card/sgds-card.js

@@ -1,3 +1,4 @@
+'use client';
 import { __decorate } from 'tslib';
 import { html } from 'lit';
 import { property } from 'lit/decorators.js';

package/components/Card/sgds-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-card.js","sources":["../../../src/components/Card/sgds-card.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport cardStyle from \"./card.css\";\n\n/**\n * @summary Cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot card-title - The title of the card\n * @slot card-text - The paragrapher text of the card\n * @slot card-image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot card-link - Accepts an anchor element. Only a single element is allowed to be passed in.\n *\n *\n * @csspart base - The card base wrapper\n * @csspart body - The card body\n * @csspart title - The card title\n * @csspart text - The card text\n *\n */\nexport class SgdsCard extends CardElement {\n  static styles = [...CardElement.styles, cardStyle];\n\n  /** Extends the link passed in slot[name=\"link\"] to the entire card */\n  @property({ type: Boolean }) stretchedLink = false;\n\n  handleLinkSlotChange(e: Event) {\n    const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLLinkElement>;\n    if (childNodes.length > 1) {\n      return console.error(\"Multiple elements passed into SgdsCard's link slot\");\n    }\n    if (this.stretchedLink) {\n      childNodes[0].classList.add(\"stretched-link\");\n    }\n    return;\n  }\n\n  handleImgSlotChange(e: Event) {\n    const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n    if (childNodes.length > 1) {\n      return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n    }\n  }\n  render() {\n    return html`\n      <div\n        class=\"${classMap({\n          sgds: true,\n          card: true,\n          [`text-${this.textColor}`]: this.textColor,\n          [`bg-${this.bgColor}`]: this.bgColor,\n          [`border-${this.borderColor}`]: this.borderColor\n        })}\n        \"\n        part=\"base\"\n      >\n        <slot name=\"card-image\" @slotchange=${this.handleImgSlotChange}></slot>\n        <div class=\"card-body\" part=\"body\">\n          <h3 class=\"card-title \" part=\"title\"><slot name=\"card-title\"></slot></h3>\n          <p class=\"card-text\" part=\"text\">\n            <slot name=\"card-text\"></slot>\n          </p>\n          <slot name=\"card-link\" @slotchange=${this.handleLinkSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsCard;\n"],"names":["cardStyle"],"mappings":";;;;;;;AAMA;;;;;;;;;;;;;AAaG;AACG,MAAO,QAAS,SAAQ,WAAW,CAAA;AAAzC,IAAA,WAAA,GAAA;;;QAI+B,IAAa,CAAA,aAAA,GAAG,KAAK,CAAC;KA2CpD;AAzCC,IAAA,oBAAoB,CAAC,CAAQ,EAAA;AAC3B,QAAA,MAAM,UAAU,GAAI,CAAC,CAAC,MAA0B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAA2B,CAAC;AAC5G,QAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACzB,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC,CAAC;SAC5E;AACD,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,UAAU,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;SAC/C;QACD,OAAO;KACR;AAED,IAAA,mBAAmB,CAAC,CAAQ,EAAA;AAC1B,QAAA,MAAM,UAAU,GAAI,CAAC,CAAC,MAA0B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAiC,CAAC;AAClH,QAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACzB,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC,qDAAqD,CAAC,CAAC;SAC7E;KACF;IACD,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;;AAEE,eAAA,EAAA,QAAQ,CAAC;AAChB,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,IAAI,EAAE,IAAI;YACV,CAAC,CAAA,KAAA,EAAQ,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS;YAC1C,CAAC,CAAA,GAAA,EAAM,IAAI,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,OAAO;YACpC,CAAC,CAAA,OAAA,EAAU,IAAI,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,WAAW;SACjD,CAAC,CAAA;;;;AAIoC,4CAAA,EAAA,IAAI,CAAC,mBAAmB,CAAA;;;;;;AAMvB,6CAAA,EAAA,IAAI,CAAC,oBAAoB,CAAA;;;KAGnE,CAAC;KACH;;AA7CM,QAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAS,CAApC,CAAsC;AAGtB,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAuB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,eAAA,EAAA,KAAA,CAAA,CAAA;;;;"}
+{"version":3,"file":"sgds-card.js","sources":["../../../src/components/Card/sgds-card.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport cardStyle from \"./card.css\";\n\n/**\n * @summary Cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot card-title - The title of the card\n * @slot card-text - The paragrapher text of the card\n * @slot card-image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot card-link - Accepts an anchor element. Only a single element is allowed to be passed in.\n *\n *\n * @csspart base - The card base wrapper\n * @csspart body - The card body\n * @csspart title - The card title\n * @csspart text - The card text\n *\n */\nexport class SgdsCard extends CardElement {\n  static styles = [...CardElement.styles, cardStyle];\n\n  /** Extends the link passed in slot[name=\"link\"] to the entire card */\n  @property({ type: Boolean }) stretchedLink = false;\n\n  handleLinkSlotChange(e: Event) {\n    const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLLinkElement>;\n    if (childNodes.length > 1) {\n      return console.error(\"Multiple elements passed into SgdsCard's link slot\");\n    }\n    if (this.stretchedLink) {\n      childNodes[0].classList.add(\"stretched-link\");\n    }\n    return;\n  }\n\n  handleImgSlotChange(e: Event) {\n    const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n    if (childNodes.length > 1) {\n      return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n    }\n  }\n  render() {\n    return html`\n      <div\n        class=\"${classMap({\n          sgds: true,\n          card: true,\n          [`text-${this.textColor}`]: this.textColor,\n          [`bg-${this.bgColor}`]: this.bgColor,\n          [`border-${this.borderColor}`]: this.borderColor\n        })}\n        \"\n        part=\"base\"\n      >\n        <slot name=\"card-image\" @slotchange=${this.handleImgSlotChange}></slot>\n        <div class=\"card-body\" part=\"body\">\n          <h3 class=\"card-title \" part=\"title\"><slot name=\"card-title\"></slot></h3>\n          <p class=\"card-text\" part=\"text\">\n            <slot name=\"card-text\"></slot>\n          </p>\n          <slot name=\"card-link\" @slotchange=${this.handleLinkSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsCard;\n"],"names":["cardStyle"],"mappings":";;;;;;;;AAMA;;;;;;;;;;;;;AAaG;AACG,MAAO,QAAS,SAAQ,WAAW,CAAA;AAAzC,IAAA,WAAA,GAAA;;;QAI+B,IAAa,CAAA,aAAA,GAAG,KAAK,CAAC;KA2CpD;AAzCC,IAAA,oBAAoB,CAAC,CAAQ,EAAA;AAC3B,QAAA,MAAM,UAAU,GAAI,CAAC,CAAC,MAA0B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAA2B,CAAC;AAC5G,QAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACzB,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC,oDAAoD,CAAC,CAAC;SAC5E;AACD,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,UAAU,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;SAC/C;QACD,OAAO;KACR;AAED,IAAA,mBAAmB,CAAC,CAAQ,EAAA;AAC1B,QAAA,MAAM,UAAU,GAAI,CAAC,CAAC,MAA0B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAiC,CAAC;AAClH,QAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACzB,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC,qDAAqD,CAAC,CAAC;SAC7E;KACF;IACD,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;;AAEE,eAAA,EAAA,QAAQ,CAAC;AAChB,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,IAAI,EAAE,IAAI;YACV,CAAC,CAAA,KAAA,EAAQ,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS;YAC1C,CAAC,CAAA,GAAA,EAAM,IAAI,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,OAAO;YACpC,CAAC,CAAA,OAAA,EAAU,IAAI,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,WAAW;SACjD,CAAC,CAAA;;;;AAIoC,4CAAA,EAAA,IAAI,CAAC,mBAAmB,CAAA;;;;;;AAMvB,6CAAA,EAAA,IAAI,CAAC,oBAAoB,CAAA;;;KAGnE,CAAC;KACH;;AA7CM,QAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAS,CAApC,CAAsC;AAGtB,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAuB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,eAAA,EAAA,KAAA,CAAA,CAAA;;;;"}

package/components/Checkbox/checkbox.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Checkbox/checkbox.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"checkbox.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/components/Checkbox/checkbox.js

@@ -1,3 +1,4 @@
+'use client';
 import { css } from 'lit';
 
 var css_248z = css`:host([checked]) .form-check{--sgds-form-border-color:var(--sgds-form-bg);--sgds-form-bg:var(--sgds-info-filled)}:host(:focus-visible){outline:none}input{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}.form-check{display:block;margin-bottom:var(--sgds-spacer-2);min-height:2rem}.form-check .form-check-input{margin-right:var(--sgds-form-input-margin-right)}.form-check-input{appearance:none;background-color:var(--sgds-form-bg);background-image:var(--sgds-radio-bg-image);background-position:50%;background-repeat:no-repeat;background-size:contain;border:var(--sgds-form-border-width) solid var(--sgds-border-color);flex-shrink:0;height:1.125em;margin-top:.4375em;vertical-align:top;width:1.125em}.form-check-input[type=checkbox]{border-radius:.25em}.form-check-input:focus{border-color:var(--sgds-form-border-color);box-shadow:var(--sgds-form-focus-box-shadow);outline:0}.form-check-input:checked,.form-check-input[checked]{background-color:var(--sgds-form-bg);border-color:var(--sgds-form-border-color)}.form-check-input:disabled{border-color:var(--sgds-border-color);cursor:not-allowed;filter:none;opacity:var(--sgds-disabled-opacity)}.form-check-input.is-invalid{border-color:var(--sgds-form-invalid-color)}.form-check-input.is-invalid:checked{background-color:var(--sgds-form-invalid-color)}.form-check-input.is-invalid:focus{box-shadow:var(--sgds-form-focus-invalid-box-shadow)}.form-check-input.is-invalid~.form-check-label{color:var(--sgds-form-invalid-color)}.form-check-inline{display:inline-block;margin-bottom:0;margin-right:var(--sgds-form-inline-margin-right);vertical-align:text-top}:host([last-of-type]) .form-check{margin-bottom:0}.form-check-input:checked[type=checkbox]{--sgds-radio-bg-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z'/%3E%3C/svg%3E")}`;

package/components/Checkbox/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"checkbox.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/components/Checkbox/sgds-checkbox.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/Checkbox/sgds-checkbox.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-checkbox.cjs.js","sources":["../../../src/components/Checkbox/sgds-checkbox.ts"],"sourcesContent":["import FormCheckElement from \"../../base/form-check-element\";\nimport genId from \"../../utils/generateId\";\nimport checkboxStyle from \"./checkbox.css\";\nimport feedbackStyle from \"../../styles/feedback.css\";\nimport formLabelStyle from \"../../styles/form-label.css\";\n/**\n * @summary Checkbox component is used when you require users to select multiple items from a list.\n *\n * @slot default - The label of checkbox.\n *\n * @event sgds-change - Emitted when the checked state changes.\n *\n */\nexport class SgdsCheckbox extends FormCheckElement {\n  static styles = [...FormCheckElement.styles, feedbackStyle, formLabelStyle, checkboxStyle];\n\n  constructor() {\n    super();\n    /** @internal */\n    this._inputId = genId(\"checkbox\");\n  }\n}\n\nexport default SgdsCheckbox;\n"],"names":["FormCheckElement","genId","feedbackStyle","formLabelStyle","checkboxStyle"],"mappings":";;;;;;;;;;AAKA;;;;;;;AAOG;AACG,MAAO,YAAa,SAAQA,iCAAgB,CAAA;AAGhD,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE,CAAC;;AAER,QAAA,IAAI,CAAC,QAAQ,GAAGC,qBAAK,CAAC,UAAU,CAAC,CAAC;KACnC;;AANM,YAAA,CAAA,MAAM,GAAG,CAAC,GAAGD,iCAAgB,CAAC,MAAM,EAAEE,mBAAa,EAAEC,oBAAc,EAAEC,mBAAa,CAAC;;;;;"}
+{"version":3,"file":"sgds-checkbox.cjs.js","sources":["../../../src/components/Checkbox/sgds-checkbox.ts"],"sourcesContent":["import FormCheckElement from \"../../base/form-check-element\";\nimport genId from \"../../utils/generateId\";\nimport checkboxStyle from \"./checkbox.css\";\nimport feedbackStyle from \"../../styles/feedback.css\";\nimport formLabelStyle from \"../../styles/form-label.css\";\n/**\n * @summary Checkbox component is used when you require users to select multiple items from a list.\n *\n * @slot default - The label of checkbox.\n *\n * @event sgds-change - Emitted when the checked state changes.\n *\n */\nexport class SgdsCheckbox extends FormCheckElement {\n  static styles = [...FormCheckElement.styles, feedbackStyle, formLabelStyle, checkboxStyle];\n\n  constructor() {\n    super();\n    /** @internal */\n    this._inputId = genId(\"checkbox\");\n  }\n}\n\nexport default SgdsCheckbox;\n"],"names":["FormCheckElement","genId","feedbackStyle","formLabelStyle","checkboxStyle"],"mappings":";;;;;;;;;;;AAKA;;;;;;;AAOG;AACG,MAAO,YAAa,SAAQA,iCAAgB,CAAA;AAGhD,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE,CAAC;;AAER,QAAA,IAAI,CAAC,QAAQ,GAAGC,qBAAK,CAAC,UAAU,CAAC,CAAC;KACnC;;AANM,YAAA,CAAA,MAAM,GAAG,CAAC,GAAGD,iCAAgB,CAAC,MAAM,EAAEE,mBAAa,EAAEC,oBAAc,EAAEC,mBAAa,CAAC;;;;;"}

package/components/Checkbox/sgds-checkbox.js

@@ -1,3 +1,4 @@
+'use client';
 import { FormCheckElement } from '../../base/form-check-element.js';
 import genId from '../../utils/generateId.js';
 import css_248z$2 from './checkbox.js';

package/components/Checkbox/sgds-checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-checkbox.js","sources":["../../../src/components/Checkbox/sgds-checkbox.ts"],"sourcesContent":["import FormCheckElement from \"../../base/form-check-element\";\nimport genId from \"../../utils/generateId\";\nimport checkboxStyle from \"./checkbox.css\";\nimport feedbackStyle from \"../../styles/feedback.css\";\nimport formLabelStyle from \"../../styles/form-label.css\";\n/**\n * @summary Checkbox component is used when you require users to select multiple items from a list.\n *\n * @slot default - The label of checkbox.\n *\n * @event sgds-change - Emitted when the checked state changes.\n *\n */\nexport class SgdsCheckbox extends FormCheckElement {\n  static styles = [...FormCheckElement.styles, feedbackStyle, formLabelStyle, checkboxStyle];\n\n  constructor() {\n    super();\n    /** @internal */\n    this._inputId = genId(\"checkbox\");\n  }\n}\n\nexport default SgdsCheckbox;\n"],"names":["feedbackStyle","formLabelStyle","checkboxStyle"],"mappings":";;;;;;AAKA;;;;;;;AAOG;AACG,MAAO,YAAa,SAAQ,gBAAgB,CAAA;AAGhD,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE,CAAC;;AAER,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC;KACnC;;AANM,YAAA,CAAA,MAAM,GAAG,CAAC,GAAG,gBAAgB,CAAC,MAAM,EAAEA,QAAa,EAAEC,UAAc,EAAEC,UAAa,CAAC;;;;"}
+{"version":3,"file":"sgds-checkbox.js","sources":["../../../src/components/Checkbox/sgds-checkbox.ts"],"sourcesContent":["import FormCheckElement from \"../../base/form-check-element\";\nimport genId from \"../../utils/generateId\";\nimport checkboxStyle from \"./checkbox.css\";\nimport feedbackStyle from \"../../styles/feedback.css\";\nimport formLabelStyle from \"../../styles/form-label.css\";\n/**\n * @summary Checkbox component is used when you require users to select multiple items from a list.\n *\n * @slot default - The label of checkbox.\n *\n * @event sgds-change - Emitted when the checked state changes.\n *\n */\nexport class SgdsCheckbox extends FormCheckElement {\n  static styles = [...FormCheckElement.styles, feedbackStyle, formLabelStyle, checkboxStyle];\n\n  constructor() {\n    super();\n    /** @internal */\n    this._inputId = genId(\"checkbox\");\n  }\n}\n\nexport default SgdsCheckbox;\n"],"names":["feedbackStyle","formLabelStyle","checkboxStyle"],"mappings":";;;;;;;AAKA;;;;;;;AAOG;AACG,MAAO,YAAa,SAAQ,gBAAgB,CAAA;AAGhD,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE,CAAC;;AAER,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC;KACnC;;AANM,YAAA,CAAA,MAAM,GAAG,CAAC,GAAG,gBAAgB,CAAC,MAAM,EAAEA,QAAa,EAAEC,UAAc,EAAEC,UAAa,CAAC;;;;"}

package/components/ComboBox/combo-box.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/components/ComboBox/combo-box.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"combo-box.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"combo-box.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/components/ComboBox/combo-box.js

@@ -1,3 +1,4 @@
+'use client';
 import { css } from 'lit';
 
 var css_248z = css`.sgds.combobox .form-control-icon{align-items:center;display:flex;font-size:1rem;height:3rem;justify-content:center;position:absolute;width:3rem;z-index:4}.sgds.combobox{align-items:stretch;display:flex;flex-wrap:wrap;justify-content:flex-end;position:relative;width:-webkit-fill-available;width:-moz-available}.sgds.combobox .dropdown-toggle{width:100%}.sgds.combobox>.dropdown-menu{min-width:100%}.form-control-icon{bottom:0}`;

package/components/ComboBox/combo-box.js.map

@@ -1 +1 @@
-{"version":3,"file":"combo-box.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"combo-box.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/components/ComboBox/sgds-combo-box.cjs.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });