@govtechsg/sgds-web-component 3.0.3 → 3.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Card/index.umd.js +1 -0
- package/components/Card/index.umd.js.map +1 -1
- package/components/Card/sgds-card.d.ts +1 -0
- package/components/Card/sgds-card.js +1 -0
- package/components/Card/sgds-card.js.map +1 -1
- package/components/DescriptionList/description-list.js +1 -1
- package/components/DescriptionList/index.umd.js +5 -2
- package/components/DescriptionList/index.umd.js.map +1 -1
- package/components/DescriptionList/sgds-description-list-group.js +4 -1
- package/components/DescriptionList/sgds-description-list-group.js.map +1 -1
- package/components/index.umd.js +6 -2
- package/components/index.umd.js.map +1 -1
- package/css/grid.css +4 -4
- package/index.umd.js +6 -2
- package/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/react/components/Card/sgds-card.cjs.js +1 -0
- package/react/components/Card/sgds-card.cjs.js.map +1 -1
- package/react/components/Card/sgds-card.js +1 -0
- package/react/components/Card/sgds-card.js.map +1 -1
- package/react/components/DescriptionList/description-list.cjs.js +1 -1
- package/react/components/DescriptionList/description-list.js +1 -1
- package/react/components/DescriptionList/sgds-description-list-group.cjs.js +4 -1
- package/react/components/DescriptionList/sgds-description-list-group.cjs.js.map +1 -1
- package/react/components/DescriptionList/sgds-description-list-group.js +4 -1
- package/react/components/DescriptionList/sgds-description-list-group.js.map +1 -1
package/package.json
CHANGED
|
@@ -13,6 +13,7 @@ var card = require('./card.cjs.js');
|
|
|
13
13
|
/**
|
|
14
14
|
* @summary Cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.
|
|
15
15
|
* @slot image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.
|
|
16
|
+
* @slot icon - Accepts an icon element to visually represent the card. Only a single element is allowed to be passed in.
|
|
16
17
|
* @slot subtitle - The subtitle of the card
|
|
17
18
|
* @slot title - The title of the card
|
|
18
19
|
* @slot description - The paragrapher text of the card
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-card.cjs.js","sources":["../../../../src/components/Card/sgds-card.ts"],"sourcesContent":["import { html, literal } from \"lit/static-html.js\";\nimport { property, query, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport cardStyle from \"./card.css\";\n\nexport type CardImageAdjustment = \"default\" | \"padding around\" | \"aspect ratio\";\nexport type CardImagePosition = \"before\" | \"after\";\nexport type CardOrientation = \"vertical\" | \"horizontal\";\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 image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot link - Accepts an anchor element. Only a single element is allowed to be passed in.\n */\nexport class SgdsCard extends CardElement {\n static styles = [...CardElement.styles, cardStyle];\n\n /** @internal */\n @query(\"a.card\") card: HTMLAnchorElement;\n\n /** @internal */\n @queryAssignedNodes({ slot: \"image\", flatten: true })\n _imageNode!: Array<Node>;\n /** @internal */\n @queryAssignedNodes({ slot: \"icon\", flatten: true })\n _iconNode!: Array<Node>;\n /** @internal */\n @queryAssignedNodes({ slot: \"link\", flatten: true })\n _linkNode!: Array<Node>;\n\n /** Extends the link passed in slot[name=\"link\"] to the entire card */\n @property({ type: Boolean, reflect: true }) stretchedLink = false;\n\n /** Disables the card */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Sets the orientation of the card. Available options: `vertical`, `horizontal` */\n @property({ type: String, reflect: true }) orientation: CardOrientation = \"vertical\";\n\n /** Sets the image position of the card. Available options: `before`, `after` */\n @property({ type: String, reflect: true }) imagePosition: CardImagePosition = \"before\";\n\n /** Sets the orientation of the card. Available options: `default`, `padding around`, `aspect ratio` */\n @property({ type: String, reflect: true }) imageAdjustment: CardImageAdjustment = \"default\";\n\n protected firstUpdated() {\n if (this._imageNode.length === 0) {\n const icon = this.shadowRoot.querySelector(\".card-image\") as HTMLDivElement;\n icon.style.display = \"none\";\n }\n if (this._iconNode.length === 0) {\n const icon = this.shadowRoot.querySelector(\".card-icon\") as HTMLDivElement;\n icon.style.display = \"none\";\n }\n if (this.disabled && this._linkNode.length > 0) {\n const hyperlink = (this._linkNode[0] as HTMLLinkElement).querySelector(\"a\");\n hyperlink.setAttribute(\"disabled\", \"true\");\n hyperlink.removeAttribute(\"href\");\n }\n }\n\n handleTitleSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLElement>;\n\n if (this.stretchedLink && childNodes[0] instanceof HTMLAnchorElement) {\n const hyperlink = childNodes[0].querySelector(\"a\") || childNodes[0];\n hyperlink.removeAttribute(\"href\");\n }\n return;\n }\n\n handleLinkSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as\n | Array<HTMLLinkElement>\n | Array<HTMLAnchorElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's link slot\");\n }\n\n if (this.stretchedLink) {\n const hyperlink = childNodes[0].querySelector(\"a\") || childNodes[0];\n this.card.setAttribute(\"href\", hyperlink.href);\n const linkSlot = this.shadowRoot.querySelector(\"slot[name='link']\") as HTMLSlotElement;\n linkSlot.style.display = \"none\";\n }\n return;\n }\n\n handleImgSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink || this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"card ${classMap({\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n <div class=\"card-image\">\n <slot name=\"image\" @slotchange=${this.handleImgSlotChange}></slot>\n </div>\n <div class=\"card-icon\">\n <slot name=\"icon\"></slot>\n </div>\n <div class=\"card-body\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <p class=\"card-text\">\n <slot name=\"description\"></slot>\n </p>\n <slot name=\"link\" @slotchange=${this.handleLinkSlotChange}></slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsCard;\n"],"names":["CardElement","literal","html","classMap","cardStyle","__decorate","query","queryAssignedNodes","property"],"mappings":";;;;;;;;;;;;AAUA
|
|
1
|
+
{"version":3,"file":"sgds-card.cjs.js","sources":["../../../../src/components/Card/sgds-card.ts"],"sourcesContent":["import { html, literal } from \"lit/static-html.js\";\nimport { property, query, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport cardStyle from \"./card.css\";\n\nexport type CardImageAdjustment = \"default\" | \"padding around\" | \"aspect ratio\";\nexport type CardImagePosition = \"before\" | \"after\";\nexport type CardOrientation = \"vertical\" | \"horizontal\";\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 image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot icon - Accepts an icon element to visually represent the card. Only a single element is allowed to be passed in.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot link - Accepts an anchor element. Only a single element is allowed to be passed in.\n */\nexport class SgdsCard extends CardElement {\n static styles = [...CardElement.styles, cardStyle];\n\n /** @internal */\n @query(\"a.card\") card: HTMLAnchorElement;\n\n /** @internal */\n @queryAssignedNodes({ slot: \"image\", flatten: true })\n _imageNode!: Array<Node>;\n /** @internal */\n @queryAssignedNodes({ slot: \"icon\", flatten: true })\n _iconNode!: Array<Node>;\n /** @internal */\n @queryAssignedNodes({ slot: \"link\", flatten: true })\n _linkNode!: Array<Node>;\n\n /** Extends the link passed in slot[name=\"link\"] to the entire card */\n @property({ type: Boolean, reflect: true }) stretchedLink = false;\n\n /** Disables the card */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Sets the orientation of the card. Available options: `vertical`, `horizontal` */\n @property({ type: String, reflect: true }) orientation: CardOrientation = \"vertical\";\n\n /** Sets the image position of the card. Available options: `before`, `after` */\n @property({ type: String, reflect: true }) imagePosition: CardImagePosition = \"before\";\n\n /** Sets the orientation of the card. Available options: `default`, `padding around`, `aspect ratio` */\n @property({ type: String, reflect: true }) imageAdjustment: CardImageAdjustment = \"default\";\n\n protected firstUpdated() {\n if (this._imageNode.length === 0) {\n const icon = this.shadowRoot.querySelector(\".card-image\") as HTMLDivElement;\n icon.style.display = \"none\";\n }\n if (this._iconNode.length === 0) {\n const icon = this.shadowRoot.querySelector(\".card-icon\") as HTMLDivElement;\n icon.style.display = \"none\";\n }\n if (this.disabled && this._linkNode.length > 0) {\n const hyperlink = (this._linkNode[0] as HTMLLinkElement).querySelector(\"a\");\n hyperlink.setAttribute(\"disabled\", \"true\");\n hyperlink.removeAttribute(\"href\");\n }\n }\n\n handleTitleSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLElement>;\n\n if (this.stretchedLink && childNodes[0] instanceof HTMLAnchorElement) {\n const hyperlink = childNodes[0].querySelector(\"a\") || childNodes[0];\n hyperlink.removeAttribute(\"href\");\n }\n return;\n }\n\n handleLinkSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as\n | Array<HTMLLinkElement>\n | Array<HTMLAnchorElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's link slot\");\n }\n\n if (this.stretchedLink) {\n const hyperlink = childNodes[0].querySelector(\"a\") || childNodes[0];\n this.card.setAttribute(\"href\", hyperlink.href);\n const linkSlot = this.shadowRoot.querySelector(\"slot[name='link']\") as HTMLSlotElement;\n linkSlot.style.display = \"none\";\n }\n return;\n }\n\n handleImgSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink || this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"card ${classMap({\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n <div class=\"card-image\">\n <slot name=\"image\" @slotchange=${this.handleImgSlotChange}></slot>\n </div>\n <div class=\"card-icon\">\n <slot name=\"icon\"></slot>\n </div>\n <div class=\"card-body\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <p class=\"card-text\">\n <slot name=\"description\"></slot>\n </p>\n <slot name=\"link\" @slotchange=${this.handleLinkSlotChange}></slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsCard;\n"],"names":["CardElement","literal","html","classMap","cardStyle","__decorate","query","queryAssignedNodes","property"],"mappings":"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"}
|
|
@@ -9,6 +9,7 @@ import css_248z from './card.js';
|
|
|
9
9
|
/**
|
|
10
10
|
* @summary Cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.
|
|
11
11
|
* @slot image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.
|
|
12
|
+
* @slot icon - Accepts an icon element to visually represent the card. Only a single element is allowed to be passed in.
|
|
12
13
|
* @slot subtitle - The subtitle of the card
|
|
13
14
|
* @slot title - The title of the card
|
|
14
15
|
* @slot description - The paragrapher text of the card
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-card.js","sources":["../../../../src/components/Card/sgds-card.ts"],"sourcesContent":["import { html, literal } from \"lit/static-html.js\";\nimport { property, query, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport cardStyle from \"./card.css\";\n\nexport type CardImageAdjustment = \"default\" | \"padding around\" | \"aspect ratio\";\nexport type CardImagePosition = \"before\" | \"after\";\nexport type CardOrientation = \"vertical\" | \"horizontal\";\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 image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot link - Accepts an anchor element. Only a single element is allowed to be passed in.\n */\nexport class SgdsCard extends CardElement {\n static styles = [...CardElement.styles, cardStyle];\n\n /** @internal */\n @query(\"a.card\") card: HTMLAnchorElement;\n\n /** @internal */\n @queryAssignedNodes({ slot: \"image\", flatten: true })\n _imageNode!: Array<Node>;\n /** @internal */\n @queryAssignedNodes({ slot: \"icon\", flatten: true })\n _iconNode!: Array<Node>;\n /** @internal */\n @queryAssignedNodes({ slot: \"link\", flatten: true })\n _linkNode!: Array<Node>;\n\n /** Extends the link passed in slot[name=\"link\"] to the entire card */\n @property({ type: Boolean, reflect: true }) stretchedLink = false;\n\n /** Disables the card */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Sets the orientation of the card. Available options: `vertical`, `horizontal` */\n @property({ type: String, reflect: true }) orientation: CardOrientation = \"vertical\";\n\n /** Sets the image position of the card. Available options: `before`, `after` */\n @property({ type: String, reflect: true }) imagePosition: CardImagePosition = \"before\";\n\n /** Sets the orientation of the card. Available options: `default`, `padding around`, `aspect ratio` */\n @property({ type: String, reflect: true }) imageAdjustment: CardImageAdjustment = \"default\";\n\n protected firstUpdated() {\n if (this._imageNode.length === 0) {\n const icon = this.shadowRoot.querySelector(\".card-image\") as HTMLDivElement;\n icon.style.display = \"none\";\n }\n if (this._iconNode.length === 0) {\n const icon = this.shadowRoot.querySelector(\".card-icon\") as HTMLDivElement;\n icon.style.display = \"none\";\n }\n if (this.disabled && this._linkNode.length > 0) {\n const hyperlink = (this._linkNode[0] as HTMLLinkElement).querySelector(\"a\");\n hyperlink.setAttribute(\"disabled\", \"true\");\n hyperlink.removeAttribute(\"href\");\n }\n }\n\n handleTitleSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLElement>;\n\n if (this.stretchedLink && childNodes[0] instanceof HTMLAnchorElement) {\n const hyperlink = childNodes[0].querySelector(\"a\") || childNodes[0];\n hyperlink.removeAttribute(\"href\");\n }\n return;\n }\n\n handleLinkSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as\n | Array<HTMLLinkElement>\n | Array<HTMLAnchorElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's link slot\");\n }\n\n if (this.stretchedLink) {\n const hyperlink = childNodes[0].querySelector(\"a\") || childNodes[0];\n this.card.setAttribute(\"href\", hyperlink.href);\n const linkSlot = this.shadowRoot.querySelector(\"slot[name='link']\") as HTMLSlotElement;\n linkSlot.style.display = \"none\";\n }\n return;\n }\n\n handleImgSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink || this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"card ${classMap({\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n <div class=\"card-image\">\n <slot name=\"image\" @slotchange=${this.handleImgSlotChange}></slot>\n </div>\n <div class=\"card-icon\">\n <slot name=\"icon\"></slot>\n </div>\n <div class=\"card-body\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <p class=\"card-text\">\n <slot name=\"description\"></slot>\n </p>\n <slot name=\"link\" @slotchange=${this.handleLinkSlotChange}></slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsCard;\n"],"names":["cardStyle"],"mappings":";;;;;;;;AAUA
|
|
1
|
+
{"version":3,"file":"sgds-card.js","sources":["../../../../src/components/Card/sgds-card.ts"],"sourcesContent":["import { html, literal } from \"lit/static-html.js\";\nimport { property, query, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport cardStyle from \"./card.css\";\n\nexport type CardImageAdjustment = \"default\" | \"padding around\" | \"aspect ratio\";\nexport type CardImagePosition = \"before\" | \"after\";\nexport type CardOrientation = \"vertical\" | \"horizontal\";\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 image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot icon - Accepts an icon element to visually represent the card. Only a single element is allowed to be passed in.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot link - Accepts an anchor element. Only a single element is allowed to be passed in.\n */\nexport class SgdsCard extends CardElement {\n static styles = [...CardElement.styles, cardStyle];\n\n /** @internal */\n @query(\"a.card\") card: HTMLAnchorElement;\n\n /** @internal */\n @queryAssignedNodes({ slot: \"image\", flatten: true })\n _imageNode!: Array<Node>;\n /** @internal */\n @queryAssignedNodes({ slot: \"icon\", flatten: true })\n _iconNode!: Array<Node>;\n /** @internal */\n @queryAssignedNodes({ slot: \"link\", flatten: true })\n _linkNode!: Array<Node>;\n\n /** Extends the link passed in slot[name=\"link\"] to the entire card */\n @property({ type: Boolean, reflect: true }) stretchedLink = false;\n\n /** Disables the card */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Sets the orientation of the card. Available options: `vertical`, `horizontal` */\n @property({ type: String, reflect: true }) orientation: CardOrientation = \"vertical\";\n\n /** Sets the image position of the card. Available options: `before`, `after` */\n @property({ type: String, reflect: true }) imagePosition: CardImagePosition = \"before\";\n\n /** Sets the orientation of the card. Available options: `default`, `padding around`, `aspect ratio` */\n @property({ type: String, reflect: true }) imageAdjustment: CardImageAdjustment = \"default\";\n\n protected firstUpdated() {\n if (this._imageNode.length === 0) {\n const icon = this.shadowRoot.querySelector(\".card-image\") as HTMLDivElement;\n icon.style.display = \"none\";\n }\n if (this._iconNode.length === 0) {\n const icon = this.shadowRoot.querySelector(\".card-icon\") as HTMLDivElement;\n icon.style.display = \"none\";\n }\n if (this.disabled && this._linkNode.length > 0) {\n const hyperlink = (this._linkNode[0] as HTMLLinkElement).querySelector(\"a\");\n hyperlink.setAttribute(\"disabled\", \"true\");\n hyperlink.removeAttribute(\"href\");\n }\n }\n\n handleTitleSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLElement>;\n\n if (this.stretchedLink && childNodes[0] instanceof HTMLAnchorElement) {\n const hyperlink = childNodes[0].querySelector(\"a\") || childNodes[0];\n hyperlink.removeAttribute(\"href\");\n }\n return;\n }\n\n handleLinkSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as\n | Array<HTMLLinkElement>\n | Array<HTMLAnchorElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's link slot\");\n }\n\n if (this.stretchedLink) {\n const hyperlink = childNodes[0].querySelector(\"a\") || childNodes[0];\n this.card.setAttribute(\"href\", hyperlink.href);\n const linkSlot = this.shadowRoot.querySelector(\"slot[name='link']\") as HTMLSlotElement;\n linkSlot.style.display = \"none\";\n }\n return;\n }\n\n handleImgSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink || this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"card ${classMap({\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n <div class=\"card-image\">\n <slot name=\"image\" @slotchange=${this.handleImgSlotChange}></slot>\n </div>\n <div class=\"card-icon\">\n <slot name=\"icon\"></slot>\n </div>\n <div class=\"card-body\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <p class=\"card-text\">\n <slot name=\"description\"></slot>\n </p>\n <slot name=\"link\" @slotchange=${this.handleLinkSlotChange}></slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsCard;\n"],"names":["cardStyle"],"mappings":"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"}
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
|
|
6
6
|
var lit = require('lit');
|
|
7
7
|
|
|
8
|
-
var css_248z = lit.css`:host([bordered]) .container:last-child{border-bottom:none}:host([stacked]) .container{align-items:flex-start;flex-direction:column;gap:var(--sgds-gap-xs);justify-content:flex-start}.container{align-items:flex-start;border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);display:flex;gap:var(--sgds-gap-xs);justify-content:space-between;padding:var(--sgds-padding-lg) var(--sgds-padding-xl)}.data-container,.label-container{flex:1}.label{color:var(--sgds-color-default);font-weight:var(--sgds-font-weight-semibold)}.data,.label{font-size:var(--sgds-font-size-2)}.data{color:var(--sgds-color-subtle);font-weight:var(--sgds-font-weight-regular);margin:0}`;
|
|
8
|
+
var css_248z = lit.css`:host([bordered][islastchild]) .container:last-child{border-bottom:none}:host([stacked]) .container{align-items:flex-start;flex-direction:column;gap:var(--sgds-gap-xs);justify-content:flex-start}.container{align-items:flex-start;border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);display:flex;gap:var(--sgds-gap-xs);justify-content:space-between;padding:var(--sgds-padding-lg) var(--sgds-padding-xl)}.data-container,.label-container{flex:1}.label{color:var(--sgds-color-default);font-weight:var(--sgds-font-weight-semibold)}.data,.label{font-size:var(--sgds-font-size-2)}.data{color:var(--sgds-color-subtle);font-weight:var(--sgds-font-weight-regular);margin:0}`;
|
|
9
9
|
|
|
10
10
|
exports["default"] = css_248z;
|
|
11
11
|
//# sourceMappingURL=description-list.cjs.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { css } from 'lit';
|
|
3
3
|
|
|
4
|
-
var css_248z = css`:host([bordered]) .container:last-child{border-bottom:none}:host([stacked]) .container{align-items:flex-start;flex-direction:column;gap:var(--sgds-gap-xs);justify-content:flex-start}.container{align-items:flex-start;border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);display:flex;gap:var(--sgds-gap-xs);justify-content:space-between;padding:var(--sgds-padding-lg) var(--sgds-padding-xl)}.data-container,.label-container{flex:1}.label{color:var(--sgds-color-default);font-weight:var(--sgds-font-weight-semibold)}.data,.label{font-size:var(--sgds-font-size-2)}.data{color:var(--sgds-color-subtle);font-weight:var(--sgds-font-weight-regular);margin:0}`;
|
|
4
|
+
var css_248z = css`:host([bordered][islastchild]) .container:last-child{border-bottom:none}:host([stacked]) .container{align-items:flex-start;flex-direction:column;gap:var(--sgds-gap-xs);justify-content:flex-start}.container{align-items:flex-start;border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);display:flex;gap:var(--sgds-gap-xs);justify-content:space-between;padding:var(--sgds-padding-lg) var(--sgds-padding-xl)}.data-container,.label-container{flex:1}.label{color:var(--sgds-color-default);font-weight:var(--sgds-font-weight-semibold)}.data,.label{font-size:var(--sgds-font-size-2)}.data{color:var(--sgds-color-subtle);font-weight:var(--sgds-font-weight-regular);margin:0}`;
|
|
5
5
|
|
|
6
6
|
export { css_248z as default };
|
|
7
7
|
//# sourceMappingURL=description-list.js.map
|
|
@@ -38,7 +38,7 @@ class SgdsDescriptionListGroup extends sgdsElement["default"] {
|
|
|
38
38
|
_updateDescriptionLists() {
|
|
39
39
|
if (!this._descriptionLists)
|
|
40
40
|
return;
|
|
41
|
-
this._descriptionLists.forEach(descriptionList => {
|
|
41
|
+
this._descriptionLists.forEach((descriptionList, index) => {
|
|
42
42
|
if (this.stacked) {
|
|
43
43
|
descriptionList.setAttribute("stacked", "");
|
|
44
44
|
}
|
|
@@ -51,6 +51,9 @@ class SgdsDescriptionListGroup extends sgdsElement["default"] {
|
|
|
51
51
|
else {
|
|
52
52
|
descriptionList.removeAttribute("bordered");
|
|
53
53
|
}
|
|
54
|
+
if (index === this._descriptionLists.length - 1) {
|
|
55
|
+
descriptionList.setAttribute("isLastChild", "");
|
|
56
|
+
}
|
|
54
57
|
});
|
|
55
58
|
}
|
|
56
59
|
updated(_changedProperties) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-description-list-group.cjs.js","sources":["../../../../src/components/DescriptionList/sgds-description-list-group.ts"],"sourcesContent":["import { html, nothing, PropertyValues } from \"lit\";\nimport { property, queryAssignedElements } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport descriptionListGroupStyle from \"./description-list-group.css\";\nimport { HasSlotController } from \"../../utils/slot\";\n\n/**\n * @summary Description List Group organizes multiple description lists.\n *\n * @slot default - The slot for `description-list` components\n * @slot title - Slot for the title content\n * @slot description - Slot for the description content\n *\n */\nexport class SgdsDescriptionListGroup extends SgdsElement {\n static styles = [...SgdsElement.styles, descriptionListGroupStyle];\n\n /** When true, adds a border around the entire group. */\n @property({ type: Boolean, reflect: true }) bordered = false;\n\n /** When true, the description lists are displayed in a stacked layout. */\n @property({ type: Boolean, reflect: true }) stacked = false;\n\n @queryAssignedElements({ flatten: true })\n private _descriptionLists!: HTMLElement[];\n\n /** @internal */\n private readonly hasSlotController = new HasSlotController(this, \"title\", \"description\");\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute(\"role\", \"list\");\n this.updateComplete.then(() => {\n this._updateDescriptionLists();\n });\n }\n\n private _updateDescriptionLists() {\n if (!this._descriptionLists) return;\n this._descriptionLists.forEach(descriptionList => {\n if (this.stacked) {\n descriptionList.setAttribute(\"stacked\", \"\");\n } else {\n descriptionList.removeAttribute(\"stacked\");\n }\n if (this.bordered) {\n descriptionList.setAttribute(\"bordered\", \"\");\n } else {\n descriptionList.removeAttribute(\"bordered\");\n }\n });\n }\n\n protected updated(_changedProperties: PropertyValues) {\n if (_changedProperties.has(\"stacked\")) {\n this._updateDescriptionLists();\n }\n if (_changedProperties.has(\"bordered\")) {\n this._updateDescriptionLists();\n }\n }\n\n render() {\n const hasTitleSlot = this.hasSlotController.test(\"title\");\n const hasDescriptionSlot = this.hasSlotController.test(\"description\");\n return html`\n <div class=\"container\" part=\"base\">\n ${hasTitleSlot || hasDescriptionSlot\n ? html`\n <div class=\"header\">\n ${hasTitleSlot\n ? html` <div class=\"title\">\n <slot name=\"title\"></slot>\n </div>`\n : nothing}\n ${hasDescriptionSlot\n ? html`\n <div class=\"description\">\n <slot name=\"description\"></slot>\n </div>\n `\n : nothing}\n </div>\n `\n : nothing}\n <div>\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n\nexport default SgdsDescriptionListGroup;\n"],"names":["SgdsElement","HasSlotController","html","nothing","descriptionListGroupStyle","__decorate","property","queryAssignedElements"],"mappings":";;;;;;;;;;;;AAMA;;;;;;;AAOG;AACG,MAAO,wBAAyB,SAAQA,sBAAW,CAAA;AAAzD,IAAA,WAAA,GAAA;;;QAI8C,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;;QAGjB,IAAO,CAAA,OAAA,GAAG,KAAK,CAAC;;QAM3C,IAAiB,CAAA,iBAAA,GAAG,IAAIC,sBAAiB,CAAC,IAAI,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"sgds-description-list-group.cjs.js","sources":["../../../../src/components/DescriptionList/sgds-description-list-group.ts"],"sourcesContent":["import { html, nothing, PropertyValues } from \"lit\";\nimport { property, queryAssignedElements } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport descriptionListGroupStyle from \"./description-list-group.css\";\nimport { HasSlotController } from \"../../utils/slot\";\n\n/**\n * @summary Description List Group organizes multiple description lists.\n *\n * @slot default - The slot for `description-list` components\n * @slot title - Slot for the title content\n * @slot description - Slot for the description content\n *\n */\nexport class SgdsDescriptionListGroup extends SgdsElement {\n static styles = [...SgdsElement.styles, descriptionListGroupStyle];\n\n /** When true, adds a border around the entire group. */\n @property({ type: Boolean, reflect: true }) bordered = false;\n\n /** When true, the description lists are displayed in a stacked layout. */\n @property({ type: Boolean, reflect: true }) stacked = false;\n\n @queryAssignedElements({ flatten: true })\n private _descriptionLists!: HTMLElement[];\n\n /** @internal */\n private readonly hasSlotController = new HasSlotController(this, \"title\", \"description\");\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute(\"role\", \"list\");\n this.updateComplete.then(() => {\n this._updateDescriptionLists();\n });\n }\n\n private _updateDescriptionLists() {\n if (!this._descriptionLists) return;\n this._descriptionLists.forEach((descriptionList, index) => {\n if (this.stacked) {\n descriptionList.setAttribute(\"stacked\", \"\");\n } else {\n descriptionList.removeAttribute(\"stacked\");\n }\n if (this.bordered) {\n descriptionList.setAttribute(\"bordered\", \"\");\n } else {\n descriptionList.removeAttribute(\"bordered\");\n }\n\n if (index === this._descriptionLists.length - 1) {\n descriptionList.setAttribute(\"isLastChild\", \"\");\n }\n });\n }\n\n protected updated(_changedProperties: PropertyValues) {\n if (_changedProperties.has(\"stacked\")) {\n this._updateDescriptionLists();\n }\n if (_changedProperties.has(\"bordered\")) {\n this._updateDescriptionLists();\n }\n }\n\n render() {\n const hasTitleSlot = this.hasSlotController.test(\"title\");\n const hasDescriptionSlot = this.hasSlotController.test(\"description\");\n return html`\n <div class=\"container\" part=\"base\">\n ${hasTitleSlot || hasDescriptionSlot\n ? html`\n <div class=\"header\">\n ${hasTitleSlot\n ? html` <div class=\"title\">\n <slot name=\"title\"></slot>\n </div>`\n : nothing}\n ${hasDescriptionSlot\n ? html`\n <div class=\"description\">\n <slot name=\"description\"></slot>\n </div>\n `\n : nothing}\n </div>\n `\n : nothing}\n <div>\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n\nexport default SgdsDescriptionListGroup;\n"],"names":["SgdsElement","HasSlotController","html","nothing","descriptionListGroupStyle","__decorate","property","queryAssignedElements"],"mappings":"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"}
|
|
@@ -34,7 +34,7 @@ class SgdsDescriptionListGroup extends SgdsElement {
|
|
|
34
34
|
_updateDescriptionLists() {
|
|
35
35
|
if (!this._descriptionLists)
|
|
36
36
|
return;
|
|
37
|
-
this._descriptionLists.forEach(descriptionList => {
|
|
37
|
+
this._descriptionLists.forEach((descriptionList, index) => {
|
|
38
38
|
if (this.stacked) {
|
|
39
39
|
descriptionList.setAttribute("stacked", "");
|
|
40
40
|
}
|
|
@@ -47,6 +47,9 @@ class SgdsDescriptionListGroup extends SgdsElement {
|
|
|
47
47
|
else {
|
|
48
48
|
descriptionList.removeAttribute("bordered");
|
|
49
49
|
}
|
|
50
|
+
if (index === this._descriptionLists.length - 1) {
|
|
51
|
+
descriptionList.setAttribute("isLastChild", "");
|
|
52
|
+
}
|
|
50
53
|
});
|
|
51
54
|
}
|
|
52
55
|
updated(_changedProperties) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-description-list-group.js","sources":["../../../../src/components/DescriptionList/sgds-description-list-group.ts"],"sourcesContent":["import { html, nothing, PropertyValues } from \"lit\";\nimport { property, queryAssignedElements } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport descriptionListGroupStyle from \"./description-list-group.css\";\nimport { HasSlotController } from \"../../utils/slot\";\n\n/**\n * @summary Description List Group organizes multiple description lists.\n *\n * @slot default - The slot for `description-list` components\n * @slot title - Slot for the title content\n * @slot description - Slot for the description content\n *\n */\nexport class SgdsDescriptionListGroup extends SgdsElement {\n static styles = [...SgdsElement.styles, descriptionListGroupStyle];\n\n /** When true, adds a border around the entire group. */\n @property({ type: Boolean, reflect: true }) bordered = false;\n\n /** When true, the description lists are displayed in a stacked layout. */\n @property({ type: Boolean, reflect: true }) stacked = false;\n\n @queryAssignedElements({ flatten: true })\n private _descriptionLists!: HTMLElement[];\n\n /** @internal */\n private readonly hasSlotController = new HasSlotController(this, \"title\", \"description\");\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute(\"role\", \"list\");\n this.updateComplete.then(() => {\n this._updateDescriptionLists();\n });\n }\n\n private _updateDescriptionLists() {\n if (!this._descriptionLists) return;\n this._descriptionLists.forEach(descriptionList => {\n if (this.stacked) {\n descriptionList.setAttribute(\"stacked\", \"\");\n } else {\n descriptionList.removeAttribute(\"stacked\");\n }\n if (this.bordered) {\n descriptionList.setAttribute(\"bordered\", \"\");\n } else {\n descriptionList.removeAttribute(\"bordered\");\n }\n });\n }\n\n protected updated(_changedProperties: PropertyValues) {\n if (_changedProperties.has(\"stacked\")) {\n this._updateDescriptionLists();\n }\n if (_changedProperties.has(\"bordered\")) {\n this._updateDescriptionLists();\n }\n }\n\n render() {\n const hasTitleSlot = this.hasSlotController.test(\"title\");\n const hasDescriptionSlot = this.hasSlotController.test(\"description\");\n return html`\n <div class=\"container\" part=\"base\">\n ${hasTitleSlot || hasDescriptionSlot\n ? html`\n <div class=\"header\">\n ${hasTitleSlot\n ? html` <div class=\"title\">\n <slot name=\"title\"></slot>\n </div>`\n : nothing}\n ${hasDescriptionSlot\n ? html`\n <div class=\"description\">\n <slot name=\"description\"></slot>\n </div>\n `\n : nothing}\n </div>\n `\n : nothing}\n <div>\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n\nexport default SgdsDescriptionListGroup;\n"],"names":["descriptionListGroupStyle"],"mappings":";;;;;;;;AAMA;;;;;;;AAOG;AACG,MAAO,wBAAyB,SAAQ,WAAW,CAAA;AAAzD,IAAA,WAAA,GAAA;;;QAI8C,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;;QAGjB,IAAO,CAAA,OAAA,GAAG,KAAK,CAAC;;QAM3C,IAAiB,CAAA,iBAAA,GAAG,IAAI,iBAAiB,CAAC,IAAI,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"sgds-description-list-group.js","sources":["../../../../src/components/DescriptionList/sgds-description-list-group.ts"],"sourcesContent":["import { html, nothing, PropertyValues } from \"lit\";\nimport { property, queryAssignedElements } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport descriptionListGroupStyle from \"./description-list-group.css\";\nimport { HasSlotController } from \"../../utils/slot\";\n\n/**\n * @summary Description List Group organizes multiple description lists.\n *\n * @slot default - The slot for `description-list` components\n * @slot title - Slot for the title content\n * @slot description - Slot for the description content\n *\n */\nexport class SgdsDescriptionListGroup extends SgdsElement {\n static styles = [...SgdsElement.styles, descriptionListGroupStyle];\n\n /** When true, adds a border around the entire group. */\n @property({ type: Boolean, reflect: true }) bordered = false;\n\n /** When true, the description lists are displayed in a stacked layout. */\n @property({ type: Boolean, reflect: true }) stacked = false;\n\n @queryAssignedElements({ flatten: true })\n private _descriptionLists!: HTMLElement[];\n\n /** @internal */\n private readonly hasSlotController = new HasSlotController(this, \"title\", \"description\");\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute(\"role\", \"list\");\n this.updateComplete.then(() => {\n this._updateDescriptionLists();\n });\n }\n\n private _updateDescriptionLists() {\n if (!this._descriptionLists) return;\n this._descriptionLists.forEach((descriptionList, index) => {\n if (this.stacked) {\n descriptionList.setAttribute(\"stacked\", \"\");\n } else {\n descriptionList.removeAttribute(\"stacked\");\n }\n if (this.bordered) {\n descriptionList.setAttribute(\"bordered\", \"\");\n } else {\n descriptionList.removeAttribute(\"bordered\");\n }\n\n if (index === this._descriptionLists.length - 1) {\n descriptionList.setAttribute(\"isLastChild\", \"\");\n }\n });\n }\n\n protected updated(_changedProperties: PropertyValues) {\n if (_changedProperties.has(\"stacked\")) {\n this._updateDescriptionLists();\n }\n if (_changedProperties.has(\"bordered\")) {\n this._updateDescriptionLists();\n }\n }\n\n render() {\n const hasTitleSlot = this.hasSlotController.test(\"title\");\n const hasDescriptionSlot = this.hasSlotController.test(\"description\");\n return html`\n <div class=\"container\" part=\"base\">\n ${hasTitleSlot || hasDescriptionSlot\n ? html`\n <div class=\"header\">\n ${hasTitleSlot\n ? html` <div class=\"title\">\n <slot name=\"title\"></slot>\n </div>`\n : nothing}\n ${hasDescriptionSlot\n ? html`\n <div class=\"description\">\n <slot name=\"description\"></slot>\n </div>\n `\n : nothing}\n </div>\n `\n : nothing}\n <div>\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n\nexport default SgdsDescriptionListGroup;\n"],"names":["descriptionListGroupStyle"],"mappings":"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"}
|