@govtechsg/sgds-web-component 3.3.2 → 3.3.3-rc.0
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/Masthead/index.js +2 -2
- package/base/card.js +1 -1
- package/base/sgds-element2.js +1 -1
- package/components/Accordion/index.umd.js +1 -1
- package/components/Alert/index.umd.js +2 -2
- package/components/Badge/index.umd.js +1 -1
- package/components/Breadcrumb/index.umd.js +36 -11
- package/components/Breadcrumb/index.umd.js.map +1 -1
- package/components/Button/button.js +1 -1
- package/components/Button/index.umd.js +61 -54
- package/components/Button/index.umd.js.map +1 -1
- package/components/Button/sgds-button.d.ts +1 -6
- package/components/Button/sgds-button.js +11 -27
- package/components/Button/sgds-button.js.map +1 -1
- package/components/Card/index.umd.js +3330 -3251
- package/components/Card/index.umd.js.map +1 -1
- package/components/Card/sgds-card.d.ts +1 -0
- package/components/Card/sgds-card.js +9 -3
- package/components/Card/sgds-card.js.map +1 -1
- package/components/Checkbox/index.umd.js +1 -1
- package/components/ComboBox/index.umd.js +2 -2
- package/components/Datepicker/index.umd.js +62 -29
- package/components/Datepicker/index.umd.js.map +1 -1
- package/components/DescriptionList/index.umd.js +1 -1
- package/components/Divider/index.umd.js +1 -1
- package/components/Drawer/index.umd.js +1 -1
- package/components/Dropdown/index.umd.js +2 -2
- package/components/FileUpload/index.umd.js +62 -29
- package/components/FileUpload/index.umd.js.map +1 -1
- package/components/Footer/footer-item.js +1 -1
- package/components/Footer/index.umd.js +89 -45
- package/components/Footer/index.umd.js.map +1 -1
- package/components/Footer/sgds-footer.d.ts +1 -1
- package/components/Footer/sgds-footer.js +39 -44
- package/components/Footer/sgds-footer.js.map +1 -1
- package/components/Icon/icon.js +1 -1
- package/components/Icon/index.umd.js +2 -2
- package/components/IconButton/index.umd.js +2 -2
- package/components/IconCard/index.umd.js +93 -14
- package/components/IconCard/index.umd.js.map +1 -1
- package/components/IconCard/sgds-icon-card.d.ts +1 -0
- package/components/IconCard/sgds-icon-card.js +8 -3
- package/components/IconCard/sgds-icon-card.js.map +1 -1
- package/components/IconList/index.umd.js +1 -1
- package/components/ImageCard/index.umd.js +93 -14
- package/components/ImageCard/index.umd.js.map +1 -1
- package/components/ImageCard/sgds-image-card.d.ts +1 -0
- package/components/ImageCard/sgds-image-card.js +8 -3
- package/components/ImageCard/sgds-image-card.js.map +1 -1
- package/components/Input/index.umd.js +2 -2
- package/components/Link/index.umd.js +35 -10
- package/components/Link/index.umd.js.map +1 -1
- package/components/Link/link.js +1 -1
- package/components/Link/sgds-link.d.ts +3 -0
- package/components/Link/sgds-link.js +33 -8
- package/components/Link/sgds-link.js.map +1 -1
- package/components/Mainnav/index.umd.js +2 -2
- package/components/Masthead/index.umd.js +2 -2
- package/components/Masthead/masthead.js +1 -1
- package/components/Modal/index.umd.js +1 -1
- package/components/OverflowMenu/index.umd.js +2 -2
- package/components/Pagination/index.umd.js +62 -29
- package/components/Pagination/index.umd.js.map +1 -1
- package/components/ProgressBar/index.umd.js +1 -1
- package/components/QuantityToggle/index.umd.js +2 -2
- package/components/Radio/index.umd.js +1 -1
- package/components/Select/index.umd.js +2 -2
- package/components/Sidenav/index.umd.js +2 -2
- package/components/Skeleton/index.umd.js +1 -1
- package/components/Spinner/index.umd.js +1 -1
- package/components/Stepper/index.umd.js +2 -2
- package/components/Subnav/index.umd.js +3 -3
- package/components/Subnav/subnav-item.js +1 -1
- package/components/Switch/index.umd.js +1 -1
- package/components/Tab/index.umd.js +1 -1
- package/components/Table/index.umd.js +1 -1
- package/components/TableOfContents/index.umd.js +1 -1
- package/components/Textarea/index.umd.js +1 -1
- package/components/ThumbnailCard/index.umd.js +93 -14
- package/components/ThumbnailCard/index.umd.js.map +1 -1
- package/components/ThumbnailCard/sgds-thumbnail-card.d.ts +1 -0
- package/components/ThumbnailCard/sgds-thumbnail-card.js +8 -3
- package/components/ThumbnailCard/sgds-thumbnail-card.js.map +1 -1
- package/components/Toast/index.umd.js +1 -1
- package/components/Tooltip/index.umd.js +1 -1
- package/components/index.umd.js +113 -95
- package/components/index.umd.js.map +1 -1
- package/index.umd.js +115 -97
- package/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/react/base/card.cjs.js +1 -1
- package/react/base/card.js +1 -1
- package/react/base/sgds-element.cjs2.js +1 -1
- package/react/base/sgds-element2.js +1 -1
- package/react/components/Button/button.cjs.js +1 -1
- package/react/components/Button/button.js +1 -1
- package/react/components/Button/sgds-button.cjs.js +10 -26
- package/react/components/Button/sgds-button.cjs.js.map +1 -1
- package/react/components/Button/sgds-button.js +11 -27
- package/react/components/Button/sgds-button.js.map +1 -1
- package/react/components/Card/sgds-card.cjs.js +9 -3
- package/react/components/Card/sgds-card.cjs.js.map +1 -1
- package/react/components/Card/sgds-card.js +9 -3
- package/react/components/Card/sgds-card.js.map +1 -1
- package/react/components/Footer/footer-item.cjs.js +1 -1
- package/react/components/Footer/footer-item.js +1 -1
- package/react/components/Footer/sgds-footer.cjs.js +38 -43
- package/react/components/Footer/sgds-footer.cjs.js.map +1 -1
- package/react/components/Footer/sgds-footer.js +39 -44
- package/react/components/Footer/sgds-footer.js.map +1 -1
- package/react/components/Icon/icon.cjs.js +1 -1
- package/react/components/Icon/icon.js +1 -1
- package/react/components/IconCard/sgds-icon-card.cjs.js +8 -3
- package/react/components/IconCard/sgds-icon-card.cjs.js.map +1 -1
- package/react/components/IconCard/sgds-icon-card.js +8 -3
- package/react/components/IconCard/sgds-icon-card.js.map +1 -1
- package/react/components/ImageCard/sgds-image-card.cjs.js +8 -3
- package/react/components/ImageCard/sgds-image-card.cjs.js.map +1 -1
- package/react/components/ImageCard/sgds-image-card.js +8 -3
- package/react/components/ImageCard/sgds-image-card.js.map +1 -1
- package/react/components/Link/link.cjs.js +1 -1
- package/react/components/Link/link.js +1 -1
- package/react/components/Link/sgds-link.cjs.js +33 -8
- package/react/components/Link/sgds-link.cjs.js.map +1 -1
- package/react/components/Link/sgds-link.js +33 -8
- package/react/components/Link/sgds-link.js.map +1 -1
- package/react/components/Masthead/masthead.cjs.js +1 -1
- package/react/components/Masthead/masthead.js +1 -1
- package/react/components/Subnav/subnav-item.cjs.js +1 -1
- package/react/components/Subnav/subnav-item.js +1 -1
- package/react/components/ThumbnailCard/sgds-thumbnail-card.cjs.js +8 -3
- package/react/components/ThumbnailCard/sgds-thumbnail-card.cjs.js.map +1 -1
- package/react/components/ThumbnailCard/sgds-thumbnail-card.js +8 -3
- package/react/components/ThumbnailCard/sgds-thumbnail-card.js.map +1 -1
|
@@ -4157,7 +4157,7 @@
|
|
|
4157
4157
|
});
|
|
4158
4158
|
}
|
|
4159
4159
|
|
|
4160
|
-
var css_248z$2 = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}
|
|
4160
|
+
var css_248z$2 = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}::slotted(a[target=_blank]):after,a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;height:var(--sgds-icon-size-lg);margin-left:.25rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:bottom;width:var(--sgds-icon-size-lg)}::slotted(svg){vertical-align:middle}}`;
|
|
4161
4161
|
|
|
4162
4162
|
/**
|
|
4163
4163
|
* @cssprop --sgds-{stateColor} - State colors in hexadecimal value
|
|
@@ -4031,7 +4031,7 @@
|
|
|
4031
4031
|
`is not recommended.`);
|
|
4032
4032
|
}
|
|
4033
4033
|
|
|
4034
|
-
var css_248z$1 = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}
|
|
4034
|
+
var css_248z$1 = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}::slotted(a[target=_blank]):after,a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;height:var(--sgds-icon-size-lg);margin-left:.25rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:bottom;width:var(--sgds-icon-size-lg)}::slotted(svg){vertical-align:middle}}`;
|
|
4035
4035
|
|
|
4036
4036
|
/**
|
|
4037
4037
|
* @cssprop --sgds-{stateColor} - State colors in hexadecimal value
|
|
@@ -4340,7 +4340,7 @@
|
|
|
4340
4340
|
*/
|
|
4341
4341
|
const classMap = directive(ClassMapDirective);
|
|
4342
4342
|
|
|
4343
|
-
var css_248z$2 = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}
|
|
4343
|
+
var css_248z$2 = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}::slotted(a[target=_blank]):after,a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;height:var(--sgds-icon-size-lg);margin-left:.25rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:bottom;width:var(--sgds-icon-size-lg)}::slotted(svg){vertical-align:middle}}`;
|
|
4344
4344
|
|
|
4345
4345
|
/**
|
|
4346
4346
|
* @cssprop --sgds-{stateColor} - State colors in hexadecimal value
|
|
@@ -7952,7 +7952,7 @@
|
|
|
7952
7952
|
return target;
|
|
7953
7953
|
};
|
|
7954
7954
|
|
|
7955
|
-
var css_248z$4 = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}
|
|
7955
|
+
var css_248z$4 = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}::slotted(a[target=_blank]):after,a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;height:var(--sgds-icon-size-lg);margin-left:.25rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:bottom;width:var(--sgds-icon-size-lg)}::slotted(svg){vertical-align:middle}}`;
|
|
7956
7956
|
|
|
7957
7957
|
/**
|
|
7958
7958
|
* @cssprop --sgds-{stateColor} - State colors in hexadecimal value
|
|
@@ -10991,7 +10991,7 @@
|
|
|
10991
10991
|
"zoom-out": ZoomOut
|
|
10992
10992
|
};
|
|
10993
10993
|
|
|
10994
|
-
var css_248z$1 = css`:host{color:inherit;display:inline-flex}:host([size=sm]) svg{height:var(--sgds-icon-size-sm);width:var(--sgds-icon-size-sm)}:host([size=md]) svg{height:var(--sgds-icon-size-md);width:var(--sgds-icon-size-md)}:host([size=xl]) svg{height:var(--sgds-icon-size-xl);width:var(--sgds-icon-size-xl)}:host([size="2-xl"]) svg{height:var(--sgds-icon-size-2-xl);width:var(--sgds-icon-size-2-xl)}:host([size="3-xl"]) svg{height:var(--sgds-icon-size-3-xl);width:var(--sgds-icon-size-3-xl)}svg{display:inline-block;height:var(--sgds-icon-size-lg);width:var(--sgds-icon-size-lg)}`;
|
|
10994
|
+
var css_248z$1 = css`:host{color:inherit;display:inline-flex;vertical-align:bottom}:host(.icon-left){margin-right:.25rem}:host(.icon-right){margin-left:.25rem}:host([size=sm]) svg{height:var(--sgds-icon-size-sm);width:var(--sgds-icon-size-sm)}:host([size=md]) svg{height:var(--sgds-icon-size-md);width:var(--sgds-icon-size-md)}:host([size=xl]) svg{height:var(--sgds-icon-size-xl);width:var(--sgds-icon-size-xl)}:host([size="2-xl"]) svg{height:var(--sgds-icon-size-2-xl);width:var(--sgds-icon-size-2-xl)}:host([size="3-xl"]) svg{height:var(--sgds-icon-size-3-xl);width:var(--sgds-icon-size-3-xl)}svg{display:inline-block;height:var(--sgds-icon-size-lg);width:var(--sgds-icon-size-lg)}`;
|
|
10995
10995
|
|
|
10996
10996
|
/**
|
|
10997
10997
|
* @summary Icons offer a form of visual shorthand that we are all familiar with. They can label, inform and aid navigation quickly and effectively in minimal space. Icons must first and foremost communicate meaning. By default, the icon component renders icons from `SgdsIcon` library set
|
|
@@ -4812,7 +4812,7 @@
|
|
|
4812
4812
|
*/
|
|
4813
4813
|
const ifDefined = (value) => value ?? nothing;
|
|
4814
4814
|
|
|
4815
|
-
var css_248z$a = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}
|
|
4815
|
+
var css_248z$a = css`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-body);margin:0;*,:after,:before{box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}::slotted(a[target=_blank]):after,a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;height:var(--sgds-icon-size-lg);margin-left:.25rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:bottom;width:var(--sgds-icon-size-lg)}::slotted(svg){vertical-align:middle}}`;
|
|
4816
4816
|
|
|
4817
4817
|
/**
|
|
4818
4818
|
* @cssprop --sgds-{stateColor} - State colors in hexadecimal value
|
|
@@ -5138,6 +5138,56 @@
|
|
|
5138
5138
|
|
|
5139
5139
|
var css_248z$7 = css`::slotted(a[target=_blank]:after),a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;margin:0 .125rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.274 3.9H9.3a.6.6 0 0 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.361 6.41c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v5.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h5.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.469-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.274c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.524-.042-1.175-.042-1.993V9.274c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C7.805 3.9 8.456 3.9 9.274 3.9Zm3.626.6a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V5.949l-5.976 5.975a.6.6 0 0 1-.848-.848L18.05 5.1H13.5a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.274 3.9H9.3a.6.6 0 0 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.361 6.41c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v5.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h5.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.469-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.274c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.524-.042-1.175-.042-1.993V9.274c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C7.805 3.9 8.456 3.9 9.274 3.9Zm3.626.6a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V5.949l-5.976 5.975a.6.6 0 0 1-.848-.848L18.05 5.1H13.5a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-size:73%;-webkit-mask-size:73%;padding:0 .45em}`;
|
|
5140
5140
|
|
|
5141
|
+
class HasSlotController {
|
|
5142
|
+
constructor(host, ...slotNames) {
|
|
5143
|
+
this.slotNames = [];
|
|
5144
|
+
(this.host = host).addController(this);
|
|
5145
|
+
this.slotNames = slotNames;
|
|
5146
|
+
this.handleSlotChange = this.handleSlotChange.bind(this);
|
|
5147
|
+
}
|
|
5148
|
+
hasDefaultSlot() {
|
|
5149
|
+
return [...this.host.childNodes].some(node => {
|
|
5150
|
+
var _a;
|
|
5151
|
+
if (node.nodeType === node.TEXT_NODE && ((_a = node.textContent) === null || _a === void 0 ? void 0 : _a.trim()) !== "") {
|
|
5152
|
+
return true;
|
|
5153
|
+
}
|
|
5154
|
+
if (node.nodeType === node.ELEMENT_NODE) {
|
|
5155
|
+
const el = node;
|
|
5156
|
+
const tagName = el.tagName.toLowerCase();
|
|
5157
|
+
// Ignore visually hidden elements since they aren't rendered
|
|
5158
|
+
if (tagName === "sl-visually-hidden") {
|
|
5159
|
+
return false;
|
|
5160
|
+
}
|
|
5161
|
+
// If it doesn't have a slot attribute, it's part of the default slot
|
|
5162
|
+
if (!el.hasAttribute("slot")) {
|
|
5163
|
+
return true;
|
|
5164
|
+
}
|
|
5165
|
+
}
|
|
5166
|
+
return false;
|
|
5167
|
+
});
|
|
5168
|
+
}
|
|
5169
|
+
hasNamedSlot(name) {
|
|
5170
|
+
return this.host.querySelector(`:scope > [slot="${name}"]`) !== null;
|
|
5171
|
+
}
|
|
5172
|
+
test(slotName) {
|
|
5173
|
+
return slotName === "[default]" ? this.hasDefaultSlot() : this.hasNamedSlot(slotName);
|
|
5174
|
+
}
|
|
5175
|
+
hostConnected() {
|
|
5176
|
+
var _a;
|
|
5177
|
+
(_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.addEventListener("slotchange", this.handleSlotChange);
|
|
5178
|
+
}
|
|
5179
|
+
hostDisconnected() {
|
|
5180
|
+
var _a;
|
|
5181
|
+
(_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.removeEventListener("slotchange", this.handleSlotChange);
|
|
5182
|
+
}
|
|
5183
|
+
handleSlotChange(event) {
|
|
5184
|
+
const slot = event.target;
|
|
5185
|
+
if ((this.slotNames.includes("[default]") && !slot.name) || (slot.name && this.slotNames.includes(slot.name))) {
|
|
5186
|
+
this.host.requestUpdate();
|
|
5187
|
+
}
|
|
5188
|
+
}
|
|
5189
|
+
}
|
|
5190
|
+
|
|
5141
5191
|
/**
|
|
5142
5192
|
* A controller to help with form submission
|
|
5143
5193
|
*/
|
|
@@ -5195,7 +5245,7 @@
|
|
|
5195
5245
|
}
|
|
5196
5246
|
}
|
|
5197
5247
|
|
|
5198
|
-
var css_248z$6 = css`:host{display:inline-block}:host([fullWidth]),:host([fullWidth]) .btn{width:100%}:host([fullWidth]) .btn.has-left-icon{justify-content:flex-start}:host([fullWidth]) .btn.has-right-icon{justify-content:space-between}:host([fullWidth]) .btn.has-left-icon.has-right-icon{justify-content:center}.btn span{padding:0 var(--sgds-padding-2-xs)}`;
|
|
5248
|
+
var css_248z$6 = css`:host{display:inline-block}:host([fullWidth]),:host([fullWidth]) .btn{width:100%}:host([fullWidth]) .btn.has-left-icon{justify-content:flex-start}:host([fullWidth]) .btn.has-right-icon{justify-content:space-between}:host([fullWidth]) .btn.has-left-icon.has-right-icon{justify-content:center}.btn span{padding:0 var(--sgds-padding-2-xs)}.btn.no-icon{gap:var(--sgds-gap-none)}`;
|
|
5199
5249
|
|
|
5200
5250
|
/**
|
|
5201
5251
|
* @summary Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.
|
|
@@ -5213,10 +5263,6 @@
|
|
|
5213
5263
|
constructor() {
|
|
5214
5264
|
super(...arguments);
|
|
5215
5265
|
/** @internal */
|
|
5216
|
-
this._hasLeftIcon = false;
|
|
5217
|
-
/** @internal */
|
|
5218
|
-
this._hasRightIcon = false;
|
|
5219
|
-
/** @internal */
|
|
5220
5266
|
this.formSubmitController = new FormSubmitController(this, {
|
|
5221
5267
|
form: (input) => {
|
|
5222
5268
|
// Buttons support a form attribute that points to an arbitrary form, so if this attribute it set we need to query
|
|
@@ -5234,6 +5280,7 @@
|
|
|
5234
5280
|
this.type = "button";
|
|
5235
5281
|
/** When set, the button will be in full width. */
|
|
5236
5282
|
this.fullWidth = false;
|
|
5283
|
+
this.hasSlotController = new HasSlotController(this, "leftIcon", "rightIcon");
|
|
5237
5284
|
this._clickHandler = () => {
|
|
5238
5285
|
if (this.type === "submit") {
|
|
5239
5286
|
this.formSubmitController.submit(this);
|
|
@@ -5252,28 +5299,20 @@
|
|
|
5252
5299
|
this.removeEventListener("click", this._clickHandler);
|
|
5253
5300
|
this.addEventListener("click", this._clickHandler);
|
|
5254
5301
|
}
|
|
5255
|
-
_handleLeftIconSlotchange(e) {
|
|
5256
|
-
const childNodes = e.target.assignedNodes({ flatten: true });
|
|
5257
|
-
if (childNodes.length > 0) {
|
|
5258
|
-
return (this._hasLeftIcon = true);
|
|
5259
|
-
}
|
|
5260
|
-
}
|
|
5261
|
-
_handleRightIconSlotchange(e) {
|
|
5262
|
-
const childNodes = e.target.assignedNodes({ flatten: true });
|
|
5263
|
-
if (childNodes.length > 0) {
|
|
5264
|
-
return (this._hasRightIcon = true);
|
|
5265
|
-
}
|
|
5266
|
-
}
|
|
5267
5302
|
render() {
|
|
5268
5303
|
const isLink = this.href;
|
|
5269
5304
|
const tag = isLink ? literal `a` : literal `button`;
|
|
5305
|
+
const hasLeftIconSlot = this.hasSlotController.test("leftIcon");
|
|
5306
|
+
const hasRightIconSlot = this.hasSlotController.test("rightIcon");
|
|
5307
|
+
const noIconSlot = !hasLeftIconSlot && !hasRightIconSlot;
|
|
5270
5308
|
return html `
|
|
5271
5309
|
<${tag}
|
|
5272
5310
|
class="btn ${classMap({
|
|
5273
5311
|
disabled: this.disabled,
|
|
5274
5312
|
active: this.active,
|
|
5275
|
-
"has-left-icon":
|
|
5276
|
-
"has-right-icon":
|
|
5313
|
+
"has-left-icon": hasLeftIconSlot,
|
|
5314
|
+
"has-right-icon": hasRightIconSlot,
|
|
5315
|
+
"no-icon": noIconSlot
|
|
5277
5316
|
})}"
|
|
5278
5317
|
?disabled=${ifDefined(isLink ? undefined : this.disabled)}
|
|
5279
5318
|
type=${ifDefined(isLink ? undefined : this.type)}
|
|
@@ -5289,20 +5328,14 @@
|
|
|
5289
5328
|
@blur=${this._handleBlur}
|
|
5290
5329
|
aria-label=${ifDefined(this.ariaLabel)}
|
|
5291
5330
|
>
|
|
5292
|
-
<slot name="leftIcon"
|
|
5331
|
+
<slot name="leftIcon"></slot>
|
|
5293
5332
|
<span><slot></slot></span>
|
|
5294
|
-
<slot name="rightIcon"
|
|
5333
|
+
<slot name="rightIcon"></slot>
|
|
5295
5334
|
</${tag}>
|
|
5296
5335
|
`;
|
|
5297
5336
|
}
|
|
5298
5337
|
}
|
|
5299
5338
|
SgdsButton.styles = [...ButtonElement.styles, css_248z$7, css_248z$6];
|
|
5300
|
-
__decorate([
|
|
5301
|
-
state()
|
|
5302
|
-
], SgdsButton.prototype, "_hasLeftIcon", void 0);
|
|
5303
|
-
__decorate([
|
|
5304
|
-
state()
|
|
5305
|
-
], SgdsButton.prototype, "_hasRightIcon", void 0);
|
|
5306
5339
|
__decorate([
|
|
5307
5340
|
property({ type: String, reflect: true })
|
|
5308
5341
|
], SgdsButton.prototype, "type", void 0);
|
|
@@ -8100,7 +8133,7 @@
|
|
|
8100
8133
|
"zoom-out": ZoomOut
|
|
8101
8134
|
};
|
|
8102
8135
|
|
|
8103
|
-
var css_248z = css`:host{color:inherit;display:inline-flex}:host([size=sm]) svg{height:var(--sgds-icon-size-sm);width:var(--sgds-icon-size-sm)}:host([size=md]) svg{height:var(--sgds-icon-size-md);width:var(--sgds-icon-size-md)}:host([size=xl]) svg{height:var(--sgds-icon-size-xl);width:var(--sgds-icon-size-xl)}:host([size="2-xl"]) svg{height:var(--sgds-icon-size-2-xl);width:var(--sgds-icon-size-2-xl)}:host([size="3-xl"]) svg{height:var(--sgds-icon-size-3-xl);width:var(--sgds-icon-size-3-xl)}svg{display:inline-block;height:var(--sgds-icon-size-lg);width:var(--sgds-icon-size-lg)}`;
|
|
8136
|
+
var css_248z = css`:host{color:inherit;display:inline-flex;vertical-align:bottom}:host(.icon-left){margin-right:.25rem}:host(.icon-right){margin-left:.25rem}:host([size=sm]) svg{height:var(--sgds-icon-size-sm);width:var(--sgds-icon-size-sm)}:host([size=md]) svg{height:var(--sgds-icon-size-md);width:var(--sgds-icon-size-md)}:host([size=xl]) svg{height:var(--sgds-icon-size-xl);width:var(--sgds-icon-size-xl)}:host([size="2-xl"]) svg{height:var(--sgds-icon-size-2-xl);width:var(--sgds-icon-size-2-xl)}:host([size="3-xl"]) svg{height:var(--sgds-icon-size-3-xl);width:var(--sgds-icon-size-3-xl)}svg{display:inline-block;height:var(--sgds-icon-size-lg);width:var(--sgds-icon-size-lg)}`;
|
|
8104
8137
|
|
|
8105
8138
|
/**
|
|
8106
8139
|
* @summary Icons offer a form of visual shorthand that we are all familiar with. They can label, inform and aid navigation quickly and effectively in minimal space. Icons must first and foremost communicate meaning. By default, the icon component renders icons from `SgdsIcon` library set
|