@sellmate/design-system 0.0.12 → 0.0.15
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/dist/{esm/resolveColor-BYf-ybt2.js → cjs/color-Oz29vj7L.js} +6 -14
- package/dist/cjs/color-Oz29vj7L.js.map +1 -0
- package/dist/cjs/design-system.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/resolveColor-CauSLF0s.js +18 -0
- package/dist/{esm/resolveColor-BYf-ybt2.js.map → cjs/resolveColor-CauSLF0s.js.map} +1 -1
- package/dist/cjs/sd-badge.cjs.entry.js +3 -2
- package/dist/cjs/sd-badge.entry.cjs.js.map +1 -1
- package/dist/cjs/sd-button.sd-tooltip-portal.entry.cjs.js.map +1 -0
- package/dist/cjs/sd-button_2.cjs.entry.js +223 -0
- package/dist/cjs/sd-card.cjs.entry.js +20 -0
- package/dist/cjs/sd-card.entry.cjs.js.map +1 -0
- package/dist/cjs/sd-checkbox.sd-icon.sd-input.sd-portal.sd-select.sd-select-multiple.sd-select-multiple-group.sd-select-option.sd-select-option-group.entry.cjs.js.map +1 -0
- package/dist/cjs/sd-checkbox_9.cjs.entry.js +1677 -0
- package/dist/cjs/{sd-date-box_2.cjs.entry.js → sd-date-box.cjs.entry.js} +3 -121
- package/dist/cjs/sd-date-box.entry.cjs.js.map +1 -0
- package/dist/cjs/sd-date-picker.cjs.entry.js +2 -2
- package/dist/cjs/sd-date-range-picker.cjs.entry.js +2 -2
- package/dist/cjs/sd-guide.cjs.entry.js +121 -0
- package/dist/cjs/sd-guide.entry.cjs.js.map +1 -0
- package/dist/cjs/sd-pagination_2.cjs.entry.js +4 -4
- package/dist/cjs/sd-popover.cjs.entry.js +2 -2
- package/dist/cjs/sd-table.cjs.entry.js +4 -4
- package/dist/cjs/sd-table.entry.cjs.js.map +1 -1
- package/dist/cjs/sd-tag.cjs.entry.js +1 -1
- package/dist/collection/collection-manifest.json +5 -1
- package/dist/collection/components/assets/index.js +2 -0
- package/dist/collection/components/assets/index.js.map +1 -1
- package/dist/collection/components/assets/minus/Minus12.js +3 -0
- package/dist/collection/components/assets/minus/Minus12.js.map +1 -0
- package/dist/collection/components/assets/minus/index.js +5 -0
- package/dist/collection/components/assets/minus/index.js.map +1 -0
- package/dist/collection/components/event-management.js +20 -0
- package/dist/collection/components/event-management.js.map +1 -0
- package/dist/collection/components/sd-badge/sd-badge.js +1 -1
- package/dist/collection/components/sd-button/sd-button.css +1 -1
- package/dist/collection/components/sd-button/sd-button.js +14 -39
- package/dist/collection/components/sd-button/sd-button.js.map +1 -1
- package/dist/collection/components/sd-card/sd-card.css +1372 -0
- package/dist/collection/components/sd-card/sd-card.js +64 -0
- package/dist/collection/components/sd-card/sd-card.js.map +1 -0
- package/dist/collection/components/sd-checkbox/sd-checkbox.css +1372 -7
- package/dist/collection/components/sd-checkbox/sd-checkbox.js +35 -40
- package/dist/collection/components/sd-checkbox/sd-checkbox.js.map +1 -1
- package/dist/collection/components/sd-date-box/sd-date-box.js +2 -2
- package/dist/collection/components/sd-date-picker/sd-date-picker.js +2 -2
- package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.js +2 -2
- package/dist/collection/components/sd-guide/sd-guide.css +8 -0
- package/dist/collection/components/sd-guide/sd-guide.js +66 -54
- package/dist/collection/components/sd-guide/sd-guide.js.map +1 -1
- package/dist/collection/components/sd-icon/sd-icon.js +2 -2
- package/dist/collection/components/sd-input/sd-input.js +2 -2
- package/dist/collection/components/sd-pagination/sd-pagination.js +2 -2
- package/dist/collection/components/sd-popover/sd-popover.js +3 -3
- package/dist/collection/components/sd-portal/sd-portal.js +1 -1
- package/dist/collection/components/sd-select/sd-select-option/sd-select-option.css +7 -0
- package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +12 -9
- package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js.map +1 -1
- package/dist/collection/components/sd-select/sd-select.css +2 -0
- package/dist/collection/components/sd-select/sd-select.js +7 -136
- package/dist/collection/components/sd-select/sd-select.js.map +1 -1
- package/dist/collection/components/sd-select-multiple/sd-select-multiple.css +1504 -0
- package/dist/collection/components/sd-select-multiple/sd-select-multiple.js +585 -0
- package/dist/collection/components/sd-select-multiple/sd-select-multiple.js.map +1 -0
- package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.css +1499 -0
- package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js +754 -0
- package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js.map +1 -0
- package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.css +1412 -0
- package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js +269 -0
- package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js.map +1 -0
- package/dist/collection/components/sd-table/sd-table.js +8 -10
- package/dist/collection/components/sd-table/sd-table.js.map +1 -1
- package/dist/collection/components/sd-tag/sd-tag.js +1 -1
- package/dist/collection/components/sd-tooltip/sd-tooltip.js +3 -3
- package/dist/collection/components/sd-tooltip-portal/sd-tooltip-portal.js +1 -1
- package/dist/components/p-1jmdnu3I.js +118 -0
- package/dist/components/p-1jmdnu3I.js.map +1 -0
- package/dist/components/{p-BO6LLSyN.js → p-7xizrxZ5.js} +9 -9
- package/dist/components/p-7xizrxZ5.js.map +1 -0
- package/dist/components/{p-CiTGsdkP.js → p-B1kMis4e.js} +7 -7
- package/dist/components/{p-CiTGsdkP.js.map → p-B1kMis4e.js.map} +1 -1
- package/dist/components/{p-CI-1-u3u.js → p-BOsnXzkr.js} +15 -3
- package/dist/components/p-BOsnXzkr.js.map +1 -0
- package/dist/components/{p-BVMP8_7g.js → p-BTSN9ENi.js} +5 -5
- package/dist/components/{p-BVMP8_7g.js.map → p-BTSN9ENi.js.map} +1 -1
- package/dist/components/{p-CwnpMbLt.js → p-B_s4RQWY.js} +18 -15
- package/dist/components/p-B_s4RQWY.js.map +1 -0
- package/dist/components/{p-BQR8GTeD.js → p-D_m-rDEx.js} +4 -4
- package/dist/components/{p-BQR8GTeD.js.map → p-D_m-rDEx.js.map} +1 -1
- package/dist/components/p-UtZuVoJ9.js +110 -0
- package/dist/components/p-UtZuVoJ9.js.map +1 -0
- package/dist/components/{p-D7VWdAch.js → p-az-fZTqo.js} +3 -3
- package/dist/components/{p-D7VWdAch.js.map → p-az-fZTqo.js.map} +1 -1
- package/dist/components/p-sQ8mybM7.js +115 -0
- package/dist/components/p-sQ8mybM7.js.map +1 -0
- package/dist/components/{p-BbUf81Wx.js → p-x0iTdFk8.js} +5 -5
- package/dist/components/{p-BbUf81Wx.js.map → p-x0iTdFk8.js.map} +1 -1
- package/dist/components/{p-exVR_ekC.js → p-yJmTynI0.js} +3 -3
- package/dist/components/{p-exVR_ekC.js.map → p-yJmTynI0.js.map} +1 -1
- package/dist/components/sd-badge.js +1 -1
- package/dist/components/sd-button.js +1 -1
- package/dist/components/sd-card.d.ts +11 -0
- package/dist/components/sd-card.js +42 -0
- package/dist/components/sd-card.js.map +1 -0
- package/dist/components/sd-checkbox.js +1 -1
- package/dist/components/sd-date-box.js +1 -1
- package/dist/components/sd-date-picker.js +6 -6
- package/dist/components/sd-date-range-picker.js +6 -6
- package/dist/components/sd-guide.js +69 -57
- package/dist/components/sd-guide.js.map +1 -1
- package/dist/components/sd-icon.js +1 -1
- package/dist/components/sd-input.js +1 -1
- package/dist/components/sd-pagination.js +1 -1
- package/dist/components/sd-popover.js +5 -5
- package/dist/components/sd-portal.js +1 -1
- package/dist/components/sd-select-multiple-group.d.ts +11 -0
- package/dist/components/sd-select-multiple-group.js +389 -0
- package/dist/components/sd-select-multiple-group.js.map +1 -0
- package/dist/components/sd-select-multiple.d.ts +11 -0
- package/dist/components/sd-select-multiple.js +335 -0
- package/dist/components/sd-select-multiple.js.map +1 -0
- package/dist/components/sd-select-option-group.d.ts +11 -0
- package/dist/components/sd-select-option-group.js +9 -0
- package/dist/components/sd-select-option-group.js.map +1 -0
- package/dist/components/sd-select-option.js +1 -1
- package/dist/components/sd-select.js +15 -137
- package/dist/components/sd-select.js.map +1 -1
- package/dist/components/sd-table.js +10 -10
- package/dist/components/sd-table.js.map +1 -1
- package/dist/components/sd-tag.js +1 -1
- package/dist/components/sd-tooltip-portal.js +1 -1
- package/dist/components/sd-tooltip.js +1 -1
- package/dist/design-system/design-system.esm.js +1 -1
- package/dist/design-system/{p-7dcff5f4.entry.js → p-240de5df.entry.js} +2 -2
- package/dist/design-system/p-2e519819.entry.js +2 -0
- package/dist/design-system/p-2e519819.entry.js.map +1 -0
- package/dist/design-system/{p-5af93f6e.entry.js → p-4eaf6262.entry.js} +2 -2
- package/dist/design-system/p-5f6c69ed.entry.js +2 -0
- package/dist/design-system/p-5f6c69ed.entry.js.map +1 -0
- package/dist/design-system/p-62c12ab7.entry.js +2 -0
- package/dist/design-system/p-62c12ab7.entry.js.map +1 -0
- package/dist/design-system/{p-c89d383a.entry.js → p-71716c18.entry.js} +2 -2
- package/dist/design-system/p-87da8d28.entry.js +2 -0
- package/dist/design-system/p-87da8d28.entry.js.map +1 -0
- package/dist/design-system/p-BoLmB6pG.js +2 -0
- package/dist/design-system/{p-BYf-ybt2.js.map → p-BoLmB6pG.js.map} +1 -1
- package/dist/design-system/{p-BYf-ybt2.js → p-CgyTlXBV.js} +2 -2
- package/dist/design-system/p-CgyTlXBV.js.map +1 -0
- package/dist/design-system/{p-585f1e0c.entry.js → p-ac9a20b4.entry.js} +2 -2
- package/dist/design-system/p-ac9a20b4.entry.js.map +1 -0
- package/dist/design-system/{p-fe6d6d27.entry.js → p-b037ea76.entry.js} +2 -2
- package/dist/design-system/p-b4e3145a.entry.js +2 -0
- package/dist/design-system/p-b4e3145a.entry.js.map +1 -0
- package/dist/design-system/{p-4cd267c5.entry.js → p-bd9e799c.entry.js} +2 -2
- package/dist/design-system/p-d185bd2e.entry.js +2 -0
- package/dist/design-system/p-d185bd2e.entry.js.map +1 -0
- package/dist/design-system/sd-badge.entry.esm.js.map +1 -1
- package/dist/design-system/sd-button.sd-tooltip-portal.entry.esm.js.map +1 -0
- package/dist/design-system/sd-card.entry.esm.js.map +1 -0
- package/dist/design-system/sd-checkbox.sd-icon.sd-input.sd-portal.sd-select.sd-select-multiple.sd-select-multiple-group.sd-select-option.sd-select-option-group.entry.esm.js.map +1 -0
- package/dist/design-system/sd-date-box.entry.esm.js.map +1 -0
- package/dist/design-system/sd-guide.entry.esm.js.map +1 -0
- package/dist/design-system/sd-table.entry.esm.js.map +1 -1
- package/dist/{cjs/resolveColor-DxvExwgo.js → esm/color-CgyTlXBV.js} +4 -17
- package/dist/esm/color-CgyTlXBV.js.map +1 -0
- package/dist/esm/design-system.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/resolveColor-CswQ9y2Q.js +16 -0
- package/dist/{cjs/resolveColor-DxvExwgo.js.map → esm/resolveColor-CswQ9y2Q.js.map} +1 -1
- package/dist/esm/sd-badge.entry.js +3 -2
- package/dist/esm/sd-badge.entry.js.map +1 -1
- package/dist/esm/sd-button.sd-tooltip-portal.entry.js.map +1 -0
- package/dist/esm/sd-button_2.entry.js +220 -0
- package/dist/esm/sd-card.entry.js +18 -0
- package/dist/esm/sd-card.entry.js.map +1 -0
- package/dist/esm/sd-checkbox.sd-icon.sd-input.sd-portal.sd-select.sd-select-multiple.sd-select-multiple-group.sd-select-option.sd-select-option-group.entry.js.map +1 -0
- package/dist/esm/sd-checkbox_9.entry.js +1667 -0
- package/dist/esm/{sd-date-box_2.entry.js → sd-date-box.entry.js} +5 -122
- package/dist/esm/sd-date-box.entry.js.map +1 -0
- package/dist/esm/sd-date-picker.entry.js +2 -2
- package/dist/esm/sd-date-range-picker.entry.js +2 -2
- package/dist/esm/sd-guide.entry.js +119 -0
- package/dist/esm/sd-guide.entry.js.map +1 -0
- package/dist/esm/sd-pagination_2.entry.js +4 -4
- package/dist/esm/sd-popover.entry.js +2 -2
- package/dist/esm/sd-table.entry.js +4 -4
- package/dist/esm/sd-table.entry.js.map +1 -1
- package/dist/esm/sd-tag.entry.js +1 -1
- package/dist/types/components/assets/index.d.ts +3 -0
- package/dist/types/components/assets/minus/Minus12.d.ts +1 -0
- package/dist/types/components/assets/minus/index.d.ts +3 -0
- package/dist/types/components/event-management.d.ts +6 -0
- package/dist/types/components/sd-button/sd-button.d.ts +1 -2
- package/dist/types/components/sd-card/sd-card.d.ts +5 -0
- package/dist/types/components/sd-checkbox/sd-checkbox.d.ts +6 -5
- package/dist/types/components/sd-guide/sd-guide.d.ts +2 -11
- package/dist/types/components/sd-select/sd-select.d.ts +0 -6
- package/dist/types/components/sd-select-multiple/sd-select-multiple.d.ts +54 -0
- package/dist/types/components/sd-select-multiple-group/sd-select-multiple-group.d.ts +75 -0
- package/dist/types/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.d.ts +24 -0
- package/dist/types/components.d.ts +379 -54
- package/hydrate/index.js +904 -153
- package/hydrate/index.mjs +904 -153
- package/package.json +2 -2
- package/dist/cjs/sd-button.sd-guide.sd-icon.sd-portal.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-button_4.cjs.entry.js +0 -587
- package/dist/cjs/sd-checkbox.cjs.entry.js +0 -81
- package/dist/cjs/sd-checkbox.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-date-box.sd-input.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-select-option.cjs.entry.js +0 -55
- package/dist/cjs/sd-select-option.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-select.cjs.entry.js +0 -371
- package/dist/cjs/sd-select.entry.cjs.js.map +0 -1
- package/dist/cjs/sd-tooltip-portal.cjs.entry.js +0 -158
- package/dist/cjs/sd-tooltip-portal.entry.cjs.js.map +0 -1
- package/dist/components/p-BO6LLSyN.js.map +0 -1
- package/dist/components/p-CI-1-u3u.js.map +0 -1
- package/dist/components/p-CwnpMbLt.js.map +0 -1
- package/dist/components/p-hwVfUtSx.js +0 -112
- package/dist/components/p-hwVfUtSx.js.map +0 -1
- package/dist/design-system/p-3824f9a6.entry.js +0 -2
- package/dist/design-system/p-3824f9a6.entry.js.map +0 -1
- package/dist/design-system/p-585f1e0c.entry.js.map +0 -1
- package/dist/design-system/p-71ac64b0.entry.js +0 -2
- package/dist/design-system/p-71ac64b0.entry.js.map +0 -1
- package/dist/design-system/p-9f6aa159.entry.js +0 -2
- package/dist/design-system/p-9f6aa159.entry.js.map +0 -1
- package/dist/design-system/p-bfd17f46.entry.js +0 -2
- package/dist/design-system/p-bfd17f46.entry.js.map +0 -1
- package/dist/design-system/p-c7b6d94d.entry.js +0 -2
- package/dist/design-system/p-c7b6d94d.entry.js.map +0 -1
- package/dist/design-system/p-ca8e64cf.entry.js +0 -2
- package/dist/design-system/p-ca8e64cf.entry.js.map +0 -1
- package/dist/design-system/p-d4395043.entry.js +0 -2
- package/dist/design-system/p-d4395043.entry.js.map +0 -1
- package/dist/design-system/sd-button.sd-guide.sd-icon.sd-portal.entry.esm.js.map +0 -1
- package/dist/design-system/sd-checkbox.entry.esm.js.map +0 -1
- package/dist/design-system/sd-date-box.sd-input.entry.esm.js.map +0 -1
- package/dist/design-system/sd-select-option.entry.esm.js.map +0 -1
- package/dist/design-system/sd-select.entry.esm.js.map +0 -1
- package/dist/design-system/sd-tooltip-portal.entry.esm.js.map +0 -1
- package/dist/esm/sd-button.sd-guide.sd-icon.sd-portal.entry.js.map +0 -1
- package/dist/esm/sd-button_4.entry.js +0 -582
- package/dist/esm/sd-checkbox.entry.js +0 -79
- package/dist/esm/sd-checkbox.entry.js.map +0 -1
- package/dist/esm/sd-date-box.sd-input.entry.js.map +0 -1
- package/dist/esm/sd-select-option.entry.js +0 -53
- package/dist/esm/sd-select-option.entry.js.map +0 -1
- package/dist/esm/sd-select.entry.js +0 -369
- package/dist/esm/sd-select.entry.js.map +0 -1
- package/dist/esm/sd-tooltip-portal.entry.js +0 -156
- package/dist/esm/sd-tooltip-portal.entry.js.map +0 -1
- /package/dist/design-system/{p-7dcff5f4.entry.js.map → p-240de5df.entry.js.map} +0 -0
- /package/dist/design-system/{p-5af93f6e.entry.js.map → p-4eaf6262.entry.js.map} +0 -0
- /package/dist/design-system/{p-c89d383a.entry.js.map → p-71716c18.entry.js.map} +0 -0
- /package/dist/design-system/{p-fe6d6d27.entry.js.map → p-b037ea76.entry.js.map} +0 -0
- /package/dist/design-system/{p-4cd267c5.entry.js.map → p-bd9e799c.entry.js.map} +0 -0
package/hydrate/index.js
CHANGED
|
@@ -3682,7 +3682,7 @@ class SdBadge {
|
|
|
3682
3682
|
label = '';
|
|
3683
3683
|
render() {
|
|
3684
3684
|
const resolvedColor = resolveColor(this.color);
|
|
3685
|
-
return (hAsync(Host, { key: '
|
|
3685
|
+
return (hAsync(Host, { key: '5d8b9d87ef3d773e0bfae1b74db8fbcb5c663028' }, hAsync("div", { key: '89a5f08b4294aeb92ecd66a8d45276d6cf1c9c0a', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: '20f8f8d27f566e300418fd6eca6ff0dfd032cc74', class: "sd-badge__dot" }), hAsync("div", { key: 'fe65df57e30ade4f8f2c65a4c4a6e9436a2a1970', class: "sd-badge__label" }, this.label))));
|
|
3686
3686
|
}
|
|
3687
3687
|
static get style() { return sdBadgeCss; }
|
|
3688
3688
|
static get cmpMeta() { return {
|
|
@@ -3699,7 +3699,7 @@ class SdBadge {
|
|
|
3699
3699
|
}; }
|
|
3700
3700
|
}
|
|
3701
3701
|
|
|
3702
|
-
const sdButtonCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\")}.sc-sd-button:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html.sc-sd-button{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary.sc-sd-button{background-color:var(--color-primary, #051d36)}.bg-secondary.sc-sd-button{background-color:var(--color-secondary, #555555)}.bg-accent.sc-sd-button{background-color:var(--color-accent, #9c27b0)}.bg-positive.sc-sd-button{background-color:var(--color-positive, #0075ff)}.bg-negative.sc-sd-button{background-color:var(--color-negative, #e30000)}.bg-info.sc-sd-button{background-color:var(--color-info, #00cd52)}.bg-warning.sc-sd-button{background-color:var(--color-warning, #f2c037)}.bg-red_99.sc-sd-button{background-color:var(--color-red_99, #220000)}.bg-red_95.sc-sd-button{background-color:var(--color-red_95, #440000)}.bg-red_90.sc-sd-button{background-color:var(--color-red_90, #5E0000)}.bg-red_85.sc-sd-button{background-color:var(--color-red_85, #820000)}.bg-red_80.sc-sd-button{background-color:var(--color-red_80, #AD0000)}.bg-red_75.sc-sd-button{background-color:var(--color-red_75, #E30000)}.bg-red_70.sc-sd-button{background-color:var(--color-red_70, #FB4444)}.bg-red_60.sc-sd-button{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45.sc-sd-button{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30.sc-sd-button{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20.sc-sd-button{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15.sc-sd-button{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg.sc-sd-button{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon.sc-sd-button{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99.sc-sd-button{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95.sc-sd-button{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90.sc-sd-button{background-color:var(--color-orange_90, #752A00)}.bg-orange_85.sc-sd-button{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75.sc-sd-button{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65.sc-sd-button{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60.sc-sd-button{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55.sc-sd-button{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45.sc-sd-button{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35.sc-sd-button{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20.sc-sd-button{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10.sc-sd-button{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert.sc-sd-button{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95.sc-sd-button{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90.sc-sd-button{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80.sc-sd-button{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70.sc-sd-button{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60.sc-sd-button{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50.sc-sd-button{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45.sc-sd-button{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40.sc-sd-button{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30.sc-sd-button{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25.sc-sd-button{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20.sc-sd-button{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10.sc-sd-button{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95.sc-sd-button{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90.sc-sd-button{background-color:var(--color-olive_90, #454500)}.bg-olive_80.sc-sd-button{background-color:var(--color-olive_80, #636300)}.bg-olive_70.sc-sd-button{background-color:var(--color-olive_70, #838300)}.bg-olive_65.sc-sd-button{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55.sc-sd-button{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45.sc-sd-button{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30.sc-sd-button{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20.sc-sd-button{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15.sc-sd-button{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10.sc-sd-button{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05.sc-sd-button{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99.sc-sd-button{background-color:var(--color-green_99, #001D0B)}.bg-green_95.sc-sd-button{background-color:var(--color-green_95, #003013)}.bg-green_90.sc-sd-button{background-color:var(--color-green_90, #00461C)}.bg-green_85.sc-sd-button{background-color:var(--color-green_85, #006629)}.bg-green_80.sc-sd-button{background-color:var(--color-green_80, #007B31)}.bg-green_75.sc-sd-button{background-color:var(--color-green_75, #00973C)}.bg-green_70.sc-sd-button{background-color:var(--color-green_70, #12B553)}.bg-green_65.sc-sd-button{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55.sc-sd-button{background-color:var(--color-green_55, #6DE39C)}.bg-green_45.sc-sd-button{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25.sc-sd-button{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15.sc-sd-button{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99.sc-sd-button{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95.sc-sd-button{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90.sc-sd-button{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85.sc-sd-button{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80.sc-sd-button{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75.sc-sd-button{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70.sc-sd-button{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65.sc-sd-button{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60.sc-sd-button{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45.sc-sd-button{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25.sc-sd-button{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10.sc-sd-button{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99.sc-sd-button{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95.sc-sd-button{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90.sc-sd-button{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85.sc-sd-button{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80.sc-sd-button{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75.sc-sd-button{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70.sc-sd-button{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65.sc-sd-button{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60.sc-sd-button{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50.sc-sd-button{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25.sc-sd-button{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15.sc-sd-button{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99.sc-sd-button{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95.sc-sd-button{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90.sc-sd-button{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85.sc-sd-button{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80.sc-sd-button{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75.sc-sd-button{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70.sc-sd-button{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60.sc-sd-button{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50.sc-sd-button{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40.sc-sd-button{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25.sc-sd-button{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20.sc-sd-button{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10.sc-sd-button{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05.sc-sd-button{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95.sc-sd-button{background-color:var(--color-grey_95, #222222)}.bg-grey_90.sc-sd-button{background-color:var(--color-grey_90, #333333)}.bg-grey_85.sc-sd-button{background-color:var(--color-grey_85, #444444)}.bg-grey_80.sc-sd-button{background-color:var(--color-grey_80, #555555)}.bg-grey_70.sc-sd-button{background-color:var(--color-grey_70, #737373)}.bg-grey_65.sc-sd-button{background-color:var(--color-grey_65, #888888)}.bg-grey_60.sc-sd-button{background-color:var(--color-grey_60, #999999)}.bg-grey_55.sc-sd-button{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50.sc-sd-button{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45.sc-sd-button{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35.sc-sd-button{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30.sc-sd-button{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25.sc-sd-button{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20.sc-sd-button{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10.sc-sd-button{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05.sc-sd-button{background-color:var(--color-grey_05, #f9f9f9)}.bg-white.sc-sd-button{background-color:var(--color-white, #ffffff)}.bg-black.sc-sd-button{background-color:var(--color-black, #000000)}.text-primary.sc-sd-button{color:var(--color-primary, #051d36)}.text-secondary.sc-sd-button{color:var(--color-secondary, #555555)}.text-accent.sc-sd-button{color:var(--color-accent, #9c27b0)}.text-positive.sc-sd-button{color:var(--color-positive, #0075ff)}.text-negative.sc-sd-button{color:var(--color-negative, #e30000)}.text-info.sc-sd-button{color:var(--color-info, #00cd52)}.text-warning.sc-sd-button{color:var(--color-warning, #f2c037)}.text-red_99.sc-sd-button{color:var(--color-red_99, #220000)}.text-red_95.sc-sd-button{color:var(--color-red_95, #440000)}.text-red_90.sc-sd-button{color:var(--color-red_90, #5E0000)}.text-red_85.sc-sd-button{color:var(--color-red_85, #820000)}.text-red_80.sc-sd-button{color:var(--color-red_80, #AD0000)}.text-red_75.sc-sd-button{color:var(--color-red_75, #E30000)}.text-red_70.sc-sd-button{color:var(--color-red_70, #FB4444)}.text-red_60.sc-sd-button{color:var(--color-red_60, #FF7C7C)}.text-red_45.sc-sd-button{color:var(--color-red_45, #FFB5B5)}.text-red_30.sc-sd-button{color:var(--color-red_30, #FFD3D3)}.text-red_20.sc-sd-button{color:var(--color-red_20, #FCE6E6)}.text-red_15.sc-sd-button{color:var(--color-red_15, #FCEFEF)}.text-caution_bg.sc-sd-button{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon.sc-sd-button{color:var(--color-caution_icon, #fd9595)}.text-orange_99.sc-sd-button{color:var(--color-orange_99, #2F1100)}.text-orange_95.sc-sd-button{color:var(--color-orange_95, #4D1B00)}.text-orange_90.sc-sd-button{color:var(--color-orange_90, #752A00)}.text-orange_85.sc-sd-button{color:var(--color-orange_85, #9B3700)}.text-orange_75.sc-sd-button{color:var(--color-orange_75, #CE4900)}.text-orange_65.sc-sd-button{color:var(--color-orange_65, #FF6B00)}.text-orange_60.sc-sd-button{color:var(--color-orange_60, #FF7F22)}.text-orange_55.sc-sd-button{color:var(--color-orange_55, #FFA452)}.text-orange_45.sc-sd-button{color:var(--color-orange_45, #FFBC81)}.text-orange_35.sc-sd-button{color:var(--color-orange_35, #FFD5AF)}.text-orange_20.sc-sd-button{color:var(--color-orange_20, #FFEAD7)}.text-orange_10.sc-sd-button{color:var(--color-orange_10, #FEF1EA)}.text-header_alert.sc-sd-button{color:var(--color-header_alert, #FF7A00)}.text-yellow_95.sc-sd-button{color:var(--color-yellow_95, #322700)}.text-yellow_90.sc-sd-button{color:var(--color-yellow_90, #453702)}.text-yellow_80.sc-sd-button{color:var(--color-yellow_80, #6C5602)}.text-yellow_70.sc-sd-button{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60.sc-sd-button{color:var(--color-yellow_60, #C49900)}.text-yellow_50.sc-sd-button{color:var(--color-yellow_50, #EBB800)}.text-yellow_45.sc-sd-button{color:var(--color-yellow_45, #FFC700)}.text-yellow_40.sc-sd-button{color:var(--color-yellow_40, #FFD643)}.text-yellow_30.sc-sd-button{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25.sc-sd-button{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20.sc-sd-button{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10.sc-sd-button{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95.sc-sd-button{color:var(--color-olive_95, #2C2C00)}.text-olive_90.sc-sd-button{color:var(--color-olive_90, #454500)}.text-olive_80.sc-sd-button{color:var(--color-olive_80, #636300)}.text-olive_70.sc-sd-button{color:var(--color-olive_70, #838300)}.text-olive_65.sc-sd-button{color:var(--color-olive_65, #A5A500)}.text-olive_55.sc-sd-button{color:var(--color-olive_55, #C7C700)}.text-olive_45.sc-sd-button{color:var(--color-olive_45, #DDDD12)}.text-olive_30.sc-sd-button{color:var(--color-olive_30, #EEEE37)}.text-olive_20.sc-sd-button{color:var(--color-olive_20, #F6F65F)}.text-olive_15.sc-sd-button{color:var(--color-olive_15, #FAFAA1)}.text-olive_10.sc-sd-button{color:var(--color-olive_10, #FBFBBF)}.text-olive_05.sc-sd-button{color:var(--color-olive_05, #FEFED9)}.text-green_99.sc-sd-button{color:var(--color-green_99, #001D0B)}.text-green_95.sc-sd-button{color:var(--color-green_95, #003013)}.text-green_90.sc-sd-button{color:var(--color-green_90, #00461C)}.text-green_85.sc-sd-button{color:var(--color-green_85, #006629)}.text-green_80.sc-sd-button{color:var(--color-green_80, #007B31)}.text-green_75.sc-sd-button{color:var(--color-green_75, #00973C)}.text-green_70.sc-sd-button{color:var(--color-green_70, #12B553)}.text-green_65.sc-sd-button{color:var(--color-green_65, #2BCE6C)}.text-green_55.sc-sd-button{color:var(--color-green_55, #6DE39C)}.text-green_45.sc-sd-button{color:var(--color-green_45, #ACF4C9)}.text-green_25.sc-sd-button{color:var(--color-green_25, #D4FAE3)}.text-green_15.sc-sd-button{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99.sc-sd-button{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95.sc-sd-button{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90.sc-sd-button{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85.sc-sd-button{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80.sc-sd-button{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75.sc-sd-button{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70.sc-sd-button{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65.sc-sd-button{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60.sc-sd-button{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45.sc-sd-button{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25.sc-sd-button{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10.sc-sd-button{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99.sc-sd-button{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95.sc-sd-button{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90.sc-sd-button{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85.sc-sd-button{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80.sc-sd-button{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75.sc-sd-button{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70.sc-sd-button{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65.sc-sd-button{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60.sc-sd-button{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50.sc-sd-button{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25.sc-sd-button{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15.sc-sd-button{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99.sc-sd-button{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95.sc-sd-button{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90.sc-sd-button{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85.sc-sd-button{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80.sc-sd-button{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75.sc-sd-button{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70.sc-sd-button{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60.sc-sd-button{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50.sc-sd-button{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40.sc-sd-button{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25.sc-sd-button{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20.sc-sd-button{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10.sc-sd-button{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05.sc-sd-button{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95.sc-sd-button{color:var(--color-grey_95, #222222)}.text-grey_90.sc-sd-button{color:var(--color-grey_90, #333333)}.text-grey_85.sc-sd-button{color:var(--color-grey_85, #444444)}.text-grey_80.sc-sd-button{color:var(--color-grey_80, #555555)}.text-grey_70.sc-sd-button{color:var(--color-grey_70, #737373)}.text-grey_65.sc-sd-button{color:var(--color-grey_65, #888888)}.text-grey_60.sc-sd-button{color:var(--color-grey_60, #999999)}.text-grey_55.sc-sd-button{color:var(--color-grey_55, #aaaaaa)}.text-grey_50.sc-sd-button{color:var(--color-grey_50, #bbbbbb)}.text-grey_45.sc-sd-button{color:var(--color-grey_45, #cccccc)}.text-grey_35.sc-sd-button{color:var(--color-grey_35, #D8D8D8)}.text-grey_30.sc-sd-button{color:var(--color-grey_30, #e1e1e1)}.text-grey_25.sc-sd-button{color:var(--color-grey_25, #E5E5E5)}.text-grey_20.sc-sd-button{color:var(--color-grey_20, #eeeeee)}.text-grey_10.sc-sd-button{color:var(--color-grey_10, #f6f6f6)}.text-grey_05.sc-sd-button{color:var(--color-grey_05, #f9f9f9)}.text-white.sc-sd-button{color:var(--color-white, #ffffff)}.text-black.sc-sd-button{color:var(--color-black, #000000)}*.sc-sd-button,*.sc-sd-button::before,*.sc-sd-button::after{box-sizing:border-box}html.sc-sd-button{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body.sc-sd-button,h1.sc-sd-button,h2.sc-sd-button,h3.sc-sd-button,h4.sc-sd-button,p.sc-sd-button,figure.sc-sd-button,blockquote.sc-sd-button,dl.sc-sd-button,dd.sc-sd-button{margin-block-end:0}ul[role=list].sc-sd-button,ol[role=list].sc-sd-button{list-style:none}body.sc-sd-button{min-height:100vh;line-height:1.5}h1.sc-sd-button,h2.sc-sd-button,h3.sc-sd-button,h4.sc-sd-button,button.sc-sd-button,input.sc-sd-button,label.sc-sd-button{line-height:1}h1.sc-sd-button,h2.sc-sd-button,h3.sc-sd-button,h4.sc-sd-button{text-wrap:balance}a.sc-sd-button:not([class]){text-decoration-skip-ink:auto;color:currentColor}img.sc-sd-button,picture.sc-sd-button{max-width:100%;display:block}input.sc-sd-button,button.sc-sd-button,textarea.sc-sd-button,select.sc-sd-button{font-size:inherit}.sc-sd-button:target{scroll-margin-block:5ex}button.sc-sd-button{background:none;border:none;cursor:pointer;padding:0;outline:0}button.sc-sd-button:focus{outline:0 !important}.sc-sd-button-h{display:inline-block;height:fit-content;line-height:0}.text-center.sc-sd-button{text-align:center}.text-right.sc-sd-button{text-align:right}.text-left.sc-sd-button{text-align:left}input[type=text].sc-sd-button,input[type=number].sc-sd-button,input[type=password].sc-sd-button,input[type=email].sc-sd-button,input[type=tel].sc-sd-button,textarea.sc-sd-button{padding-block:0px;padding-inline:0px}.sd-hoverable.sc-sd-button:hover>.sd-focus-helper.sc-sd-button{background:currentColor;opacity:0.15}.sd-hoverable.sc-sd-button:hover>.sd-focus-helper.sc-sd-button:before{opacity:0.1}.sd-hoverable.sc-sd-button:hover>.sd-focus-helper.sc-sd-button:after{opacity:0.4}.sd-focus-helper.sc-sd-button{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-button:before,.sd-focus-helper.sc-sd-button:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-button:before{background:#000000}.sd-focus-helper.sc-sd-button:after{background:#ffffff}.sd-tooltip-menu.sc-sd-button{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close.sc-sd-button{padding-right:12px !important}.sd-tooltip-menu__arrow.sc-sd-button{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow.sc-sd-button svg.sc-sd-button{width:100%;height:100%}.sd-tooltip-menu__arrow--top.sc-sd-button{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom.sc-sd-button{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left.sc-sd-button{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right.sc-sd-button{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content.sc-sd-button{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button.sc-sd-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button.sc-sd-button button.sc-sd-button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu.sc-sd-button{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow.sc-sd-button{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow.sc-sd-button svg.sc-sd-button{width:100%;height:100%}.sd-popover-menu__arrow--top.sc-sd-button{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom.sc-sd-button{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left.sc-sd-button{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right.sc-sd-button{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content.sc-sd-button{font-size:12px;line-height:20px}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__title.sc-sd-button{font-weight:700;margin-bottom:4px}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__messages.sc-sd-button{font-weight:500}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__buttons.sc-sd-button{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__buttons--1.sc-sd-button{justify-content:flex-end}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__buttons--2.sc-sd-button{justify-content:space-between}.sd-popover-menu__close-button.sc-sd-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}.sd-button.sc-sd-button{text-decoration:none;cursor:pointer;border-radius:4px;transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center}.sd-button--xs.sc-sd-button{padding:0 8px;font-size:12px;font-weight:500;line-height:20px;min-height:24px}.sd-button--sm.sc-sd-button{padding:0 12px;font-size:12px;font-weight:500;line-height:20px;min-height:28px}.sd-button--md.sc-sd-button{padding:0 20px;font-size:16px;font-weight:500;line-height:26px;min-height:34px}.sd-button--lg.sc-sd-button{padding:0 28px;font-size:18px;font-weight:500;line-height:30px;min-height:62px}.sd-button--primary.sc-sd-button{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary.sc-sd-button::before{content:\"\";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary.sc-sd-button:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline.sc-sd-button{background-color:white;border:1px solid var(--button-color);color:var(--button-color)}.sd-button--outline.sc-sd-button::before{content:\"\";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline.sc-sd-button:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline.sc-sd-button .sd-button__content.sc-sd-button{position:relative;z-index:1}.sd-button--ghost.sc-sd-button{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost.sc-sd-button::before{content:\"\";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost.sc-sd-button:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost.sc-sd-button .sd-button__content.sc-sd-button{position:relative;z-index:1}.sd-button--disabled.sc-sd-button{border:1px solid #cccccc;background:#e1e1e1;color:#888888;cursor:not-allowed !important}.sd-button--icon-only.sc-sd-button{padding:0;width:fit-content;height:fit-content;aspect-ratio:1/1}.sd-button--no-hover.sc-sd-button:hover::before{opacity:0 !important}.sd-button.sc-sd-button .sd-button__content.sc-sd-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;z-index:1;font-weight:500}";
|
|
3702
|
+
const sdButtonCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\")}.sc-sd-button:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html.sc-sd-button{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary.sc-sd-button{background-color:var(--color-primary, #051d36)}.bg-secondary.sc-sd-button{background-color:var(--color-secondary, #555555)}.bg-accent.sc-sd-button{background-color:var(--color-accent, #9c27b0)}.bg-positive.sc-sd-button{background-color:var(--color-positive, #0075ff)}.bg-negative.sc-sd-button{background-color:var(--color-negative, #e30000)}.bg-info.sc-sd-button{background-color:var(--color-info, #00cd52)}.bg-warning.sc-sd-button{background-color:var(--color-warning, #f2c037)}.bg-red_99.sc-sd-button{background-color:var(--color-red_99, #220000)}.bg-red_95.sc-sd-button{background-color:var(--color-red_95, #440000)}.bg-red_90.sc-sd-button{background-color:var(--color-red_90, #5E0000)}.bg-red_85.sc-sd-button{background-color:var(--color-red_85, #820000)}.bg-red_80.sc-sd-button{background-color:var(--color-red_80, #AD0000)}.bg-red_75.sc-sd-button{background-color:var(--color-red_75, #E30000)}.bg-red_70.sc-sd-button{background-color:var(--color-red_70, #FB4444)}.bg-red_60.sc-sd-button{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45.sc-sd-button{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30.sc-sd-button{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20.sc-sd-button{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15.sc-sd-button{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg.sc-sd-button{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon.sc-sd-button{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99.sc-sd-button{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95.sc-sd-button{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90.sc-sd-button{background-color:var(--color-orange_90, #752A00)}.bg-orange_85.sc-sd-button{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75.sc-sd-button{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65.sc-sd-button{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60.sc-sd-button{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55.sc-sd-button{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45.sc-sd-button{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35.sc-sd-button{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20.sc-sd-button{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10.sc-sd-button{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert.sc-sd-button{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95.sc-sd-button{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90.sc-sd-button{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80.sc-sd-button{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70.sc-sd-button{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60.sc-sd-button{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50.sc-sd-button{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45.sc-sd-button{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40.sc-sd-button{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30.sc-sd-button{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25.sc-sd-button{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20.sc-sd-button{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10.sc-sd-button{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95.sc-sd-button{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90.sc-sd-button{background-color:var(--color-olive_90, #454500)}.bg-olive_80.sc-sd-button{background-color:var(--color-olive_80, #636300)}.bg-olive_70.sc-sd-button{background-color:var(--color-olive_70, #838300)}.bg-olive_65.sc-sd-button{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55.sc-sd-button{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45.sc-sd-button{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30.sc-sd-button{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20.sc-sd-button{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15.sc-sd-button{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10.sc-sd-button{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05.sc-sd-button{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99.sc-sd-button{background-color:var(--color-green_99, #001D0B)}.bg-green_95.sc-sd-button{background-color:var(--color-green_95, #003013)}.bg-green_90.sc-sd-button{background-color:var(--color-green_90, #00461C)}.bg-green_85.sc-sd-button{background-color:var(--color-green_85, #006629)}.bg-green_80.sc-sd-button{background-color:var(--color-green_80, #007B31)}.bg-green_75.sc-sd-button{background-color:var(--color-green_75, #00973C)}.bg-green_70.sc-sd-button{background-color:var(--color-green_70, #12B553)}.bg-green_65.sc-sd-button{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55.sc-sd-button{background-color:var(--color-green_55, #6DE39C)}.bg-green_45.sc-sd-button{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25.sc-sd-button{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15.sc-sd-button{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99.sc-sd-button{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95.sc-sd-button{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90.sc-sd-button{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85.sc-sd-button{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80.sc-sd-button{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75.sc-sd-button{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70.sc-sd-button{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65.sc-sd-button{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60.sc-sd-button{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45.sc-sd-button{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25.sc-sd-button{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10.sc-sd-button{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99.sc-sd-button{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95.sc-sd-button{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90.sc-sd-button{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85.sc-sd-button{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80.sc-sd-button{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75.sc-sd-button{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70.sc-sd-button{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65.sc-sd-button{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60.sc-sd-button{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50.sc-sd-button{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25.sc-sd-button{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15.sc-sd-button{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99.sc-sd-button{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95.sc-sd-button{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90.sc-sd-button{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85.sc-sd-button{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80.sc-sd-button{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75.sc-sd-button{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70.sc-sd-button{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60.sc-sd-button{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50.sc-sd-button{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40.sc-sd-button{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25.sc-sd-button{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20.sc-sd-button{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10.sc-sd-button{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05.sc-sd-button{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95.sc-sd-button{background-color:var(--color-grey_95, #222222)}.bg-grey_90.sc-sd-button{background-color:var(--color-grey_90, #333333)}.bg-grey_85.sc-sd-button{background-color:var(--color-grey_85, #444444)}.bg-grey_80.sc-sd-button{background-color:var(--color-grey_80, #555555)}.bg-grey_70.sc-sd-button{background-color:var(--color-grey_70, #737373)}.bg-grey_65.sc-sd-button{background-color:var(--color-grey_65, #888888)}.bg-grey_60.sc-sd-button{background-color:var(--color-grey_60, #999999)}.bg-grey_55.sc-sd-button{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50.sc-sd-button{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45.sc-sd-button{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35.sc-sd-button{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30.sc-sd-button{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25.sc-sd-button{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20.sc-sd-button{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10.sc-sd-button{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05.sc-sd-button{background-color:var(--color-grey_05, #f9f9f9)}.bg-white.sc-sd-button{background-color:var(--color-white, #ffffff)}.bg-black.sc-sd-button{background-color:var(--color-black, #000000)}.text-primary.sc-sd-button{color:var(--color-primary, #051d36)}.text-secondary.sc-sd-button{color:var(--color-secondary, #555555)}.text-accent.sc-sd-button{color:var(--color-accent, #9c27b0)}.text-positive.sc-sd-button{color:var(--color-positive, #0075ff)}.text-negative.sc-sd-button{color:var(--color-negative, #e30000)}.text-info.sc-sd-button{color:var(--color-info, #00cd52)}.text-warning.sc-sd-button{color:var(--color-warning, #f2c037)}.text-red_99.sc-sd-button{color:var(--color-red_99, #220000)}.text-red_95.sc-sd-button{color:var(--color-red_95, #440000)}.text-red_90.sc-sd-button{color:var(--color-red_90, #5E0000)}.text-red_85.sc-sd-button{color:var(--color-red_85, #820000)}.text-red_80.sc-sd-button{color:var(--color-red_80, #AD0000)}.text-red_75.sc-sd-button{color:var(--color-red_75, #E30000)}.text-red_70.sc-sd-button{color:var(--color-red_70, #FB4444)}.text-red_60.sc-sd-button{color:var(--color-red_60, #FF7C7C)}.text-red_45.sc-sd-button{color:var(--color-red_45, #FFB5B5)}.text-red_30.sc-sd-button{color:var(--color-red_30, #FFD3D3)}.text-red_20.sc-sd-button{color:var(--color-red_20, #FCE6E6)}.text-red_15.sc-sd-button{color:var(--color-red_15, #FCEFEF)}.text-caution_bg.sc-sd-button{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon.sc-sd-button{color:var(--color-caution_icon, #fd9595)}.text-orange_99.sc-sd-button{color:var(--color-orange_99, #2F1100)}.text-orange_95.sc-sd-button{color:var(--color-orange_95, #4D1B00)}.text-orange_90.sc-sd-button{color:var(--color-orange_90, #752A00)}.text-orange_85.sc-sd-button{color:var(--color-orange_85, #9B3700)}.text-orange_75.sc-sd-button{color:var(--color-orange_75, #CE4900)}.text-orange_65.sc-sd-button{color:var(--color-orange_65, #FF6B00)}.text-orange_60.sc-sd-button{color:var(--color-orange_60, #FF7F22)}.text-orange_55.sc-sd-button{color:var(--color-orange_55, #FFA452)}.text-orange_45.sc-sd-button{color:var(--color-orange_45, #FFBC81)}.text-orange_35.sc-sd-button{color:var(--color-orange_35, #FFD5AF)}.text-orange_20.sc-sd-button{color:var(--color-orange_20, #FFEAD7)}.text-orange_10.sc-sd-button{color:var(--color-orange_10, #FEF1EA)}.text-header_alert.sc-sd-button{color:var(--color-header_alert, #FF7A00)}.text-yellow_95.sc-sd-button{color:var(--color-yellow_95, #322700)}.text-yellow_90.sc-sd-button{color:var(--color-yellow_90, #453702)}.text-yellow_80.sc-sd-button{color:var(--color-yellow_80, #6C5602)}.text-yellow_70.sc-sd-button{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60.sc-sd-button{color:var(--color-yellow_60, #C49900)}.text-yellow_50.sc-sd-button{color:var(--color-yellow_50, #EBB800)}.text-yellow_45.sc-sd-button{color:var(--color-yellow_45, #FFC700)}.text-yellow_40.sc-sd-button{color:var(--color-yellow_40, #FFD643)}.text-yellow_30.sc-sd-button{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25.sc-sd-button{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20.sc-sd-button{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10.sc-sd-button{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95.sc-sd-button{color:var(--color-olive_95, #2C2C00)}.text-olive_90.sc-sd-button{color:var(--color-olive_90, #454500)}.text-olive_80.sc-sd-button{color:var(--color-olive_80, #636300)}.text-olive_70.sc-sd-button{color:var(--color-olive_70, #838300)}.text-olive_65.sc-sd-button{color:var(--color-olive_65, #A5A500)}.text-olive_55.sc-sd-button{color:var(--color-olive_55, #C7C700)}.text-olive_45.sc-sd-button{color:var(--color-olive_45, #DDDD12)}.text-olive_30.sc-sd-button{color:var(--color-olive_30, #EEEE37)}.text-olive_20.sc-sd-button{color:var(--color-olive_20, #F6F65F)}.text-olive_15.sc-sd-button{color:var(--color-olive_15, #FAFAA1)}.text-olive_10.sc-sd-button{color:var(--color-olive_10, #FBFBBF)}.text-olive_05.sc-sd-button{color:var(--color-olive_05, #FEFED9)}.text-green_99.sc-sd-button{color:var(--color-green_99, #001D0B)}.text-green_95.sc-sd-button{color:var(--color-green_95, #003013)}.text-green_90.sc-sd-button{color:var(--color-green_90, #00461C)}.text-green_85.sc-sd-button{color:var(--color-green_85, #006629)}.text-green_80.sc-sd-button{color:var(--color-green_80, #007B31)}.text-green_75.sc-sd-button{color:var(--color-green_75, #00973C)}.text-green_70.sc-sd-button{color:var(--color-green_70, #12B553)}.text-green_65.sc-sd-button{color:var(--color-green_65, #2BCE6C)}.text-green_55.sc-sd-button{color:var(--color-green_55, #6DE39C)}.text-green_45.sc-sd-button{color:var(--color-green_45, #ACF4C9)}.text-green_25.sc-sd-button{color:var(--color-green_25, #D4FAE3)}.text-green_15.sc-sd-button{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99.sc-sd-button{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95.sc-sd-button{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90.sc-sd-button{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85.sc-sd-button{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80.sc-sd-button{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75.sc-sd-button{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70.sc-sd-button{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65.sc-sd-button{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60.sc-sd-button{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45.sc-sd-button{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25.sc-sd-button{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10.sc-sd-button{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99.sc-sd-button{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95.sc-sd-button{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90.sc-sd-button{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85.sc-sd-button{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80.sc-sd-button{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75.sc-sd-button{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70.sc-sd-button{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65.sc-sd-button{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60.sc-sd-button{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50.sc-sd-button{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25.sc-sd-button{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15.sc-sd-button{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99.sc-sd-button{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95.sc-sd-button{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90.sc-sd-button{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85.sc-sd-button{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80.sc-sd-button{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75.sc-sd-button{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70.sc-sd-button{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60.sc-sd-button{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50.sc-sd-button{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40.sc-sd-button{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25.sc-sd-button{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20.sc-sd-button{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10.sc-sd-button{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05.sc-sd-button{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95.sc-sd-button{color:var(--color-grey_95, #222222)}.text-grey_90.sc-sd-button{color:var(--color-grey_90, #333333)}.text-grey_85.sc-sd-button{color:var(--color-grey_85, #444444)}.text-grey_80.sc-sd-button{color:var(--color-grey_80, #555555)}.text-grey_70.sc-sd-button{color:var(--color-grey_70, #737373)}.text-grey_65.sc-sd-button{color:var(--color-grey_65, #888888)}.text-grey_60.sc-sd-button{color:var(--color-grey_60, #999999)}.text-grey_55.sc-sd-button{color:var(--color-grey_55, #aaaaaa)}.text-grey_50.sc-sd-button{color:var(--color-grey_50, #bbbbbb)}.text-grey_45.sc-sd-button{color:var(--color-grey_45, #cccccc)}.text-grey_35.sc-sd-button{color:var(--color-grey_35, #D8D8D8)}.text-grey_30.sc-sd-button{color:var(--color-grey_30, #e1e1e1)}.text-grey_25.sc-sd-button{color:var(--color-grey_25, #E5E5E5)}.text-grey_20.sc-sd-button{color:var(--color-grey_20, #eeeeee)}.text-grey_10.sc-sd-button{color:var(--color-grey_10, #f6f6f6)}.text-grey_05.sc-sd-button{color:var(--color-grey_05, #f9f9f9)}.text-white.sc-sd-button{color:var(--color-white, #ffffff)}.text-black.sc-sd-button{color:var(--color-black, #000000)}*.sc-sd-button,*.sc-sd-button::before,*.sc-sd-button::after{box-sizing:border-box}html.sc-sd-button{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body.sc-sd-button,h1.sc-sd-button,h2.sc-sd-button,h3.sc-sd-button,h4.sc-sd-button,p.sc-sd-button,figure.sc-sd-button,blockquote.sc-sd-button,dl.sc-sd-button,dd.sc-sd-button{margin-block-end:0}ul[role=list].sc-sd-button,ol[role=list].sc-sd-button{list-style:none}body.sc-sd-button{min-height:100vh;line-height:1.5}h1.sc-sd-button,h2.sc-sd-button,h3.sc-sd-button,h4.sc-sd-button,button.sc-sd-button,input.sc-sd-button,label.sc-sd-button{line-height:1}h1.sc-sd-button,h2.sc-sd-button,h3.sc-sd-button,h4.sc-sd-button{text-wrap:balance}a.sc-sd-button:not([class]){text-decoration-skip-ink:auto;color:currentColor}img.sc-sd-button,picture.sc-sd-button{max-width:100%;display:block}input.sc-sd-button,button.sc-sd-button,textarea.sc-sd-button,select.sc-sd-button{font-size:inherit}.sc-sd-button:target{scroll-margin-block:5ex}button.sc-sd-button{background:none;border:none;cursor:pointer;padding:0;outline:0}button.sc-sd-button:focus{outline:0 !important}.sc-sd-button-h{display:inline-block;height:fit-content;line-height:0}.text-center.sc-sd-button{text-align:center}.text-right.sc-sd-button{text-align:right}.text-left.sc-sd-button{text-align:left}input[type=text].sc-sd-button,input[type=number].sc-sd-button,input[type=password].sc-sd-button,input[type=email].sc-sd-button,input[type=tel].sc-sd-button,textarea.sc-sd-button{padding-block:0px;padding-inline:0px}.sd-hoverable.sc-sd-button:hover>.sd-focus-helper.sc-sd-button{background:currentColor;opacity:0.15}.sd-hoverable.sc-sd-button:hover>.sd-focus-helper.sc-sd-button:before{opacity:0.1}.sd-hoverable.sc-sd-button:hover>.sd-focus-helper.sc-sd-button:after{opacity:0.4}.sd-focus-helper.sc-sd-button{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-button:before,.sd-focus-helper.sc-sd-button:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-button:before{background:#000000}.sd-focus-helper.sc-sd-button:after{background:#ffffff}.sd-tooltip-menu.sc-sd-button{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close.sc-sd-button{padding-right:12px !important}.sd-tooltip-menu__arrow.sc-sd-button{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow.sc-sd-button svg.sc-sd-button{width:100%;height:100%}.sd-tooltip-menu__arrow--top.sc-sd-button{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom.sc-sd-button{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left.sc-sd-button{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right.sc-sd-button{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content.sc-sd-button{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button.sc-sd-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button.sc-sd-button button.sc-sd-button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu.sc-sd-button{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow.sc-sd-button{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow.sc-sd-button svg.sc-sd-button{width:100%;height:100%}.sd-popover-menu__arrow--top.sc-sd-button{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom.sc-sd-button{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left.sc-sd-button{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right.sc-sd-button{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content.sc-sd-button{font-size:12px;line-height:20px}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__title.sc-sd-button{font-weight:700;margin-bottom:4px}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__messages.sc-sd-button{font-weight:500}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__buttons.sc-sd-button{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__buttons--1.sc-sd-button{justify-content:flex-end}.sd-popover-menu__content.sc-sd-button .sd-popover-menu__buttons--2.sc-sd-button{justify-content:space-between}.sd-popover-menu__close-button.sc-sd-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}.sd-button.sc-sd-button{text-decoration:none;cursor:pointer;border-radius:4px;transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center}.sd-button--xs.sc-sd-button{padding:0 8px;font-size:12px;font-weight:500;line-height:20px;min-height:24px}.sd-button--sm.sc-sd-button{padding:0 12px;font-size:12px;font-weight:500;line-height:20px;min-height:28px}.sd-button--md.sc-sd-button{padding:0 20px;font-size:16px;font-weight:500;line-height:26px;min-height:34px}.sd-button--lg.sc-sd-button{padding:0 28px;font-size:18px;font-weight:500;line-height:30px;min-height:62px}.sd-button--primary.sc-sd-button{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary.sc-sd-button::before{content:\"\";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary.sc-sd-button:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline.sc-sd-button{background:white;border:1px solid var(--button-color);color:var(--button-color)}.sd-button--outline.sc-sd-button::before{content:\"\";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline.sc-sd-button:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline.sc-sd-button .sd-button__content.sc-sd-button{position:relative;z-index:1}.sd-button--ghost.sc-sd-button{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost.sc-sd-button::before{content:\"\";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost.sc-sd-button:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost.sc-sd-button .sd-button__content.sc-sd-button{position:relative;z-index:1}.sd-button--disabled.sc-sd-button{border:1px solid #cccccc;background:#e1e1e1;color:#888888;cursor:not-allowed !important}.sd-button--icon-only.sc-sd-button{padding:0;width:fit-content;height:fit-content;aspect-ratio:1/1}.sd-button--no-hover.sc-sd-button:hover::before{opacity:0 !important}.sd-button.sc-sd-button .sd-button__content.sc-sd-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;z-index:1;font-weight:500}";
|
|
3703
3703
|
|
|
3704
3704
|
const ICON_SIZES = {
|
|
3705
3705
|
xs: 12,
|
|
@@ -3724,8 +3724,9 @@ class SdButton {
|
|
|
3724
3724
|
iconSize;
|
|
3725
3725
|
iconRight;
|
|
3726
3726
|
noHover = false;
|
|
3727
|
-
|
|
3728
|
-
|
|
3727
|
+
class = '';
|
|
3728
|
+
// @Prop() buttonStyle: StyleProps = {};
|
|
3729
|
+
// @Prop() iconStyle: StyleProps = {};
|
|
3729
3730
|
sdClick;
|
|
3730
3731
|
handleClick = (event) => {
|
|
3731
3732
|
if (this.disabled) {
|
|
@@ -3755,7 +3756,7 @@ class SdButton {
|
|
|
3755
3756
|
const buttonClasses = this.getButtonClasses();
|
|
3756
3757
|
// 유틸로 색상 키 -> HEX 매핑 (없으면 원본 그대로)
|
|
3757
3758
|
const resolvedColor = resolveColor(this.color);
|
|
3758
|
-
return (hAsync(Host, { key: '
|
|
3759
|
+
return (hAsync(Host, { key: '8c541913f50cef643635a6c99846081824428141' }, hAsync("button", { key: '158c26a5be74a1b7d6fd9ab801cb464aaae62fb8', class: `${buttonClasses} ${this.class}`, type: this.type, disabled: this.disabled, onClick: this.handleClick, style: { '--button-color': resolvedColor } }, hAsync("div", { key: '1ea1ea1de4bcd096227e47bd342c37c79c798932', class: "sd-button__content" }, this.icon && (hAsync("sd-icon", { key: 'e6bc916ad0cb28839b4f38e4c68be1424424649e', class: "sd-button__icon sd-button__icon--left", name: this.icon, size: this.iconSize ? this.iconSize : ICON_SIZES[this.size], color: this.iconColor ? this.iconColor : this.variant === 'primary' ? '#fff' : resolvedColor })), this.label && hAsync("div", { key: '50881d8b7c6a59c9693e3957e4250417f40e8f63', class: "sd-button__label" }, this.label), this.iconRight && (hAsync("sd-icon", { key: '598062da7c80dff7ecebefd62b9c030852f35585', class: "sd-button__icon sd-button__icon--right", name: this.iconRight, size: ICON_SIZES[this.size], color: this.variant === 'primary' ? '#fff' : resolvedColor }))))));
|
|
3759
3760
|
}
|
|
3760
3761
|
static get style() { return sdButtonCss; }
|
|
3761
3762
|
static get cmpMeta() { return {
|
|
@@ -3773,8 +3774,32 @@ class SdButton {
|
|
|
3773
3774
|
"iconSize": [2, "icon-size"],
|
|
3774
3775
|
"iconRight": [1, "icon-right"],
|
|
3775
3776
|
"noHover": [4, "no-hover"],
|
|
3776
|
-
"
|
|
3777
|
-
|
|
3777
|
+
"class": [1]
|
|
3778
|
+
},
|
|
3779
|
+
"$listeners$": undefined,
|
|
3780
|
+
"$lazyBundleId$": "-",
|
|
3781
|
+
"$attrsToReflect$": []
|
|
3782
|
+
}; }
|
|
3783
|
+
}
|
|
3784
|
+
|
|
3785
|
+
const sdCardCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\");}:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow svg{width:100%;height:100%}.sd-popover-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content{font-size:12px;line-height:20px}.sd-popover-menu__content .sd-popover-menu__title{font-weight:700;margin-bottom:4px}.sd-popover-menu__content .sd-popover-menu__messages{font-weight:500}.sd-popover-menu__content .sd-popover-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content .sd-popover-menu__buttons--1{justify-content:flex-end}.sd-popover-menu__content .sd-popover-menu__buttons--2{justify-content:space-between}.sd-popover-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}:host{display:block}.sd-card{border-radius:8px;background:white}.sd-card .sd-card--bordered{border:1px solid #e1e1e1}";
|
|
3786
|
+
|
|
3787
|
+
class SdCard {
|
|
3788
|
+
constructor(hostRef) {
|
|
3789
|
+
registerInstance(this, hostRef);
|
|
3790
|
+
}
|
|
3791
|
+
bordered = true;
|
|
3792
|
+
class = '';
|
|
3793
|
+
render() {
|
|
3794
|
+
return (hAsync(Host, { key: 'bb5d75c00c43e981de3df9497d03510baf547b10' }, hAsync("div", { key: '7b9724fd95fef0e4c374b6f3d8ba0586abed5045', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, hAsync("slot", { key: '047683541469ee0490e296813cb7e303127ad200' }))));
|
|
3795
|
+
}
|
|
3796
|
+
static get style() { return sdCardCss; }
|
|
3797
|
+
static get cmpMeta() { return {
|
|
3798
|
+
"$flags$": 772,
|
|
3799
|
+
"$tagName$": "sd-card",
|
|
3800
|
+
"$members$": {
|
|
3801
|
+
"bordered": [4],
|
|
3802
|
+
"class": [1]
|
|
3778
3803
|
},
|
|
3779
3804
|
"$listeners$": undefined,
|
|
3780
3805
|
"$lazyBundleId$": "-",
|
|
@@ -3782,7 +3807,7 @@ class SdButton {
|
|
|
3782
3807
|
}; }
|
|
3783
3808
|
}
|
|
3784
3809
|
|
|
3785
|
-
const sdCheckboxCss = ".sd-checkbox.sc-sd-checkbox{line-height:0;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:20px;max-height:20px;position:relative;cursor:pointer}.sd-checkbox.sc-sd-checkbox>input.sc-sd-checkbox{display:none}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--checked .sd-checkbox__bg.sc-sd-checkbox{background:#005cc9}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--unchecked .sd-checkbox__bg.sc-sd-checkbox{border:1px solid #0075ff;background:#d9eaff}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--disabled .sd-checkbox__bg.sc-sd-checkbox{border:1px solid transparent;background:#eeeeee}.sd-checkbox__bg.sc-sd-checkbox{width:16px;height:16px;border-radius:2px;border:1px solid #888888;box-sizing:border-box;display:inline-flex;justify-content:center;align-items:center;overflow:hidden;line-height:0}.sd-checkbox__label.sc-sd-checkbox{font-size:12px;color:#333333;line-height:20px}.sd-checkbox--checked.sd-checkbox--disabled.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:#eeeeee;border:1px solid #cccccc !important}.sd-checkbox--checked.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{border:0;background:#0075ff}.sd-checkbox--unchecked.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:white}.sd-checkbox--disabled.sc-sd-checkbox{cursor:not-allowed}.sd-checkbox--disabled.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:#eeeeee;border:1px solid #cccccc !important}";
|
|
3810
|
+
const sdCheckboxCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\")}.sc-sd-checkbox:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html.sc-sd-checkbox{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary.sc-sd-checkbox{background-color:var(--color-primary, #051d36)}.bg-secondary.sc-sd-checkbox{background-color:var(--color-secondary, #555555)}.bg-accent.sc-sd-checkbox{background-color:var(--color-accent, #9c27b0)}.bg-positive.sc-sd-checkbox{background-color:var(--color-positive, #0075ff)}.bg-negative.sc-sd-checkbox{background-color:var(--color-negative, #e30000)}.bg-info.sc-sd-checkbox{background-color:var(--color-info, #00cd52)}.bg-warning.sc-sd-checkbox{background-color:var(--color-warning, #f2c037)}.bg-red_99.sc-sd-checkbox{background-color:var(--color-red_99, #220000)}.bg-red_95.sc-sd-checkbox{background-color:var(--color-red_95, #440000)}.bg-red_90.sc-sd-checkbox{background-color:var(--color-red_90, #5E0000)}.bg-red_85.sc-sd-checkbox{background-color:var(--color-red_85, #820000)}.bg-red_80.sc-sd-checkbox{background-color:var(--color-red_80, #AD0000)}.bg-red_75.sc-sd-checkbox{background-color:var(--color-red_75, #E30000)}.bg-red_70.sc-sd-checkbox{background-color:var(--color-red_70, #FB4444)}.bg-red_60.sc-sd-checkbox{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45.sc-sd-checkbox{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30.sc-sd-checkbox{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20.sc-sd-checkbox{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15.sc-sd-checkbox{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg.sc-sd-checkbox{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon.sc-sd-checkbox{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99.sc-sd-checkbox{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95.sc-sd-checkbox{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90.sc-sd-checkbox{background-color:var(--color-orange_90, #752A00)}.bg-orange_85.sc-sd-checkbox{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75.sc-sd-checkbox{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65.sc-sd-checkbox{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60.sc-sd-checkbox{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55.sc-sd-checkbox{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45.sc-sd-checkbox{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35.sc-sd-checkbox{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20.sc-sd-checkbox{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10.sc-sd-checkbox{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert.sc-sd-checkbox{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95.sc-sd-checkbox{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90.sc-sd-checkbox{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80.sc-sd-checkbox{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70.sc-sd-checkbox{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60.sc-sd-checkbox{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50.sc-sd-checkbox{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45.sc-sd-checkbox{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40.sc-sd-checkbox{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30.sc-sd-checkbox{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25.sc-sd-checkbox{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20.sc-sd-checkbox{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10.sc-sd-checkbox{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95.sc-sd-checkbox{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90.sc-sd-checkbox{background-color:var(--color-olive_90, #454500)}.bg-olive_80.sc-sd-checkbox{background-color:var(--color-olive_80, #636300)}.bg-olive_70.sc-sd-checkbox{background-color:var(--color-olive_70, #838300)}.bg-olive_65.sc-sd-checkbox{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55.sc-sd-checkbox{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45.sc-sd-checkbox{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30.sc-sd-checkbox{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20.sc-sd-checkbox{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15.sc-sd-checkbox{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10.sc-sd-checkbox{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05.sc-sd-checkbox{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99.sc-sd-checkbox{background-color:var(--color-green_99, #001D0B)}.bg-green_95.sc-sd-checkbox{background-color:var(--color-green_95, #003013)}.bg-green_90.sc-sd-checkbox{background-color:var(--color-green_90, #00461C)}.bg-green_85.sc-sd-checkbox{background-color:var(--color-green_85, #006629)}.bg-green_80.sc-sd-checkbox{background-color:var(--color-green_80, #007B31)}.bg-green_75.sc-sd-checkbox{background-color:var(--color-green_75, #00973C)}.bg-green_70.sc-sd-checkbox{background-color:var(--color-green_70, #12B553)}.bg-green_65.sc-sd-checkbox{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55.sc-sd-checkbox{background-color:var(--color-green_55, #6DE39C)}.bg-green_45.sc-sd-checkbox{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25.sc-sd-checkbox{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15.sc-sd-checkbox{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99.sc-sd-checkbox{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95.sc-sd-checkbox{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90.sc-sd-checkbox{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85.sc-sd-checkbox{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80.sc-sd-checkbox{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75.sc-sd-checkbox{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70.sc-sd-checkbox{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65.sc-sd-checkbox{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60.sc-sd-checkbox{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45.sc-sd-checkbox{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25.sc-sd-checkbox{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10.sc-sd-checkbox{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99.sc-sd-checkbox{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95.sc-sd-checkbox{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90.sc-sd-checkbox{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85.sc-sd-checkbox{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80.sc-sd-checkbox{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75.sc-sd-checkbox{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70.sc-sd-checkbox{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65.sc-sd-checkbox{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60.sc-sd-checkbox{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50.sc-sd-checkbox{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25.sc-sd-checkbox{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15.sc-sd-checkbox{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99.sc-sd-checkbox{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95.sc-sd-checkbox{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90.sc-sd-checkbox{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85.sc-sd-checkbox{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80.sc-sd-checkbox{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75.sc-sd-checkbox{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70.sc-sd-checkbox{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60.sc-sd-checkbox{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50.sc-sd-checkbox{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40.sc-sd-checkbox{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25.sc-sd-checkbox{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20.sc-sd-checkbox{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10.sc-sd-checkbox{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05.sc-sd-checkbox{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95.sc-sd-checkbox{background-color:var(--color-grey_95, #222222)}.bg-grey_90.sc-sd-checkbox{background-color:var(--color-grey_90, #333333)}.bg-grey_85.sc-sd-checkbox{background-color:var(--color-grey_85, #444444)}.bg-grey_80.sc-sd-checkbox{background-color:var(--color-grey_80, #555555)}.bg-grey_70.sc-sd-checkbox{background-color:var(--color-grey_70, #737373)}.bg-grey_65.sc-sd-checkbox{background-color:var(--color-grey_65, #888888)}.bg-grey_60.sc-sd-checkbox{background-color:var(--color-grey_60, #999999)}.bg-grey_55.sc-sd-checkbox{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50.sc-sd-checkbox{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45.sc-sd-checkbox{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35.sc-sd-checkbox{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30.sc-sd-checkbox{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25.sc-sd-checkbox{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20.sc-sd-checkbox{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10.sc-sd-checkbox{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05.sc-sd-checkbox{background-color:var(--color-grey_05, #f9f9f9)}.bg-white.sc-sd-checkbox{background-color:var(--color-white, #ffffff)}.bg-black.sc-sd-checkbox{background-color:var(--color-black, #000000)}.text-primary.sc-sd-checkbox{color:var(--color-primary, #051d36)}.text-secondary.sc-sd-checkbox{color:var(--color-secondary, #555555)}.text-accent.sc-sd-checkbox{color:var(--color-accent, #9c27b0)}.text-positive.sc-sd-checkbox{color:var(--color-positive, #0075ff)}.text-negative.sc-sd-checkbox{color:var(--color-negative, #e30000)}.text-info.sc-sd-checkbox{color:var(--color-info, #00cd52)}.text-warning.sc-sd-checkbox{color:var(--color-warning, #f2c037)}.text-red_99.sc-sd-checkbox{color:var(--color-red_99, #220000)}.text-red_95.sc-sd-checkbox{color:var(--color-red_95, #440000)}.text-red_90.sc-sd-checkbox{color:var(--color-red_90, #5E0000)}.text-red_85.sc-sd-checkbox{color:var(--color-red_85, #820000)}.text-red_80.sc-sd-checkbox{color:var(--color-red_80, #AD0000)}.text-red_75.sc-sd-checkbox{color:var(--color-red_75, #E30000)}.text-red_70.sc-sd-checkbox{color:var(--color-red_70, #FB4444)}.text-red_60.sc-sd-checkbox{color:var(--color-red_60, #FF7C7C)}.text-red_45.sc-sd-checkbox{color:var(--color-red_45, #FFB5B5)}.text-red_30.sc-sd-checkbox{color:var(--color-red_30, #FFD3D3)}.text-red_20.sc-sd-checkbox{color:var(--color-red_20, #FCE6E6)}.text-red_15.sc-sd-checkbox{color:var(--color-red_15, #FCEFEF)}.text-caution_bg.sc-sd-checkbox{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon.sc-sd-checkbox{color:var(--color-caution_icon, #fd9595)}.text-orange_99.sc-sd-checkbox{color:var(--color-orange_99, #2F1100)}.text-orange_95.sc-sd-checkbox{color:var(--color-orange_95, #4D1B00)}.text-orange_90.sc-sd-checkbox{color:var(--color-orange_90, #752A00)}.text-orange_85.sc-sd-checkbox{color:var(--color-orange_85, #9B3700)}.text-orange_75.sc-sd-checkbox{color:var(--color-orange_75, #CE4900)}.text-orange_65.sc-sd-checkbox{color:var(--color-orange_65, #FF6B00)}.text-orange_60.sc-sd-checkbox{color:var(--color-orange_60, #FF7F22)}.text-orange_55.sc-sd-checkbox{color:var(--color-orange_55, #FFA452)}.text-orange_45.sc-sd-checkbox{color:var(--color-orange_45, #FFBC81)}.text-orange_35.sc-sd-checkbox{color:var(--color-orange_35, #FFD5AF)}.text-orange_20.sc-sd-checkbox{color:var(--color-orange_20, #FFEAD7)}.text-orange_10.sc-sd-checkbox{color:var(--color-orange_10, #FEF1EA)}.text-header_alert.sc-sd-checkbox{color:var(--color-header_alert, #FF7A00)}.text-yellow_95.sc-sd-checkbox{color:var(--color-yellow_95, #322700)}.text-yellow_90.sc-sd-checkbox{color:var(--color-yellow_90, #453702)}.text-yellow_80.sc-sd-checkbox{color:var(--color-yellow_80, #6C5602)}.text-yellow_70.sc-sd-checkbox{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60.sc-sd-checkbox{color:var(--color-yellow_60, #C49900)}.text-yellow_50.sc-sd-checkbox{color:var(--color-yellow_50, #EBB800)}.text-yellow_45.sc-sd-checkbox{color:var(--color-yellow_45, #FFC700)}.text-yellow_40.sc-sd-checkbox{color:var(--color-yellow_40, #FFD643)}.text-yellow_30.sc-sd-checkbox{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25.sc-sd-checkbox{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20.sc-sd-checkbox{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10.sc-sd-checkbox{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95.sc-sd-checkbox{color:var(--color-olive_95, #2C2C00)}.text-olive_90.sc-sd-checkbox{color:var(--color-olive_90, #454500)}.text-olive_80.sc-sd-checkbox{color:var(--color-olive_80, #636300)}.text-olive_70.sc-sd-checkbox{color:var(--color-olive_70, #838300)}.text-olive_65.sc-sd-checkbox{color:var(--color-olive_65, #A5A500)}.text-olive_55.sc-sd-checkbox{color:var(--color-olive_55, #C7C700)}.text-olive_45.sc-sd-checkbox{color:var(--color-olive_45, #DDDD12)}.text-olive_30.sc-sd-checkbox{color:var(--color-olive_30, #EEEE37)}.text-olive_20.sc-sd-checkbox{color:var(--color-olive_20, #F6F65F)}.text-olive_15.sc-sd-checkbox{color:var(--color-olive_15, #FAFAA1)}.text-olive_10.sc-sd-checkbox{color:var(--color-olive_10, #FBFBBF)}.text-olive_05.sc-sd-checkbox{color:var(--color-olive_05, #FEFED9)}.text-green_99.sc-sd-checkbox{color:var(--color-green_99, #001D0B)}.text-green_95.sc-sd-checkbox{color:var(--color-green_95, #003013)}.text-green_90.sc-sd-checkbox{color:var(--color-green_90, #00461C)}.text-green_85.sc-sd-checkbox{color:var(--color-green_85, #006629)}.text-green_80.sc-sd-checkbox{color:var(--color-green_80, #007B31)}.text-green_75.sc-sd-checkbox{color:var(--color-green_75, #00973C)}.text-green_70.sc-sd-checkbox{color:var(--color-green_70, #12B553)}.text-green_65.sc-sd-checkbox{color:var(--color-green_65, #2BCE6C)}.text-green_55.sc-sd-checkbox{color:var(--color-green_55, #6DE39C)}.text-green_45.sc-sd-checkbox{color:var(--color-green_45, #ACF4C9)}.text-green_25.sc-sd-checkbox{color:var(--color-green_25, #D4FAE3)}.text-green_15.sc-sd-checkbox{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99.sc-sd-checkbox{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95.sc-sd-checkbox{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90.sc-sd-checkbox{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85.sc-sd-checkbox{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80.sc-sd-checkbox{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75.sc-sd-checkbox{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70.sc-sd-checkbox{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65.sc-sd-checkbox{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60.sc-sd-checkbox{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45.sc-sd-checkbox{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25.sc-sd-checkbox{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10.sc-sd-checkbox{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99.sc-sd-checkbox{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95.sc-sd-checkbox{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90.sc-sd-checkbox{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85.sc-sd-checkbox{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80.sc-sd-checkbox{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75.sc-sd-checkbox{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70.sc-sd-checkbox{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65.sc-sd-checkbox{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60.sc-sd-checkbox{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50.sc-sd-checkbox{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25.sc-sd-checkbox{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15.sc-sd-checkbox{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99.sc-sd-checkbox{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95.sc-sd-checkbox{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90.sc-sd-checkbox{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85.sc-sd-checkbox{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80.sc-sd-checkbox{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75.sc-sd-checkbox{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70.sc-sd-checkbox{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60.sc-sd-checkbox{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50.sc-sd-checkbox{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40.sc-sd-checkbox{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25.sc-sd-checkbox{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20.sc-sd-checkbox{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10.sc-sd-checkbox{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05.sc-sd-checkbox{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95.sc-sd-checkbox{color:var(--color-grey_95, #222222)}.text-grey_90.sc-sd-checkbox{color:var(--color-grey_90, #333333)}.text-grey_85.sc-sd-checkbox{color:var(--color-grey_85, #444444)}.text-grey_80.sc-sd-checkbox{color:var(--color-grey_80, #555555)}.text-grey_70.sc-sd-checkbox{color:var(--color-grey_70, #737373)}.text-grey_65.sc-sd-checkbox{color:var(--color-grey_65, #888888)}.text-grey_60.sc-sd-checkbox{color:var(--color-grey_60, #999999)}.text-grey_55.sc-sd-checkbox{color:var(--color-grey_55, #aaaaaa)}.text-grey_50.sc-sd-checkbox{color:var(--color-grey_50, #bbbbbb)}.text-grey_45.sc-sd-checkbox{color:var(--color-grey_45, #cccccc)}.text-grey_35.sc-sd-checkbox{color:var(--color-grey_35, #D8D8D8)}.text-grey_30.sc-sd-checkbox{color:var(--color-grey_30, #e1e1e1)}.text-grey_25.sc-sd-checkbox{color:var(--color-grey_25, #E5E5E5)}.text-grey_20.sc-sd-checkbox{color:var(--color-grey_20, #eeeeee)}.text-grey_10.sc-sd-checkbox{color:var(--color-grey_10, #f6f6f6)}.text-grey_05.sc-sd-checkbox{color:var(--color-grey_05, #f9f9f9)}.text-white.sc-sd-checkbox{color:var(--color-white, #ffffff)}.text-black.sc-sd-checkbox{color:var(--color-black, #000000)}*.sc-sd-checkbox,*.sc-sd-checkbox::before,*.sc-sd-checkbox::after{box-sizing:border-box}html.sc-sd-checkbox{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body.sc-sd-checkbox,h1.sc-sd-checkbox,h2.sc-sd-checkbox,h3.sc-sd-checkbox,h4.sc-sd-checkbox,p.sc-sd-checkbox,figure.sc-sd-checkbox,blockquote.sc-sd-checkbox,dl.sc-sd-checkbox,dd.sc-sd-checkbox{margin-block-end:0}ul[role=list].sc-sd-checkbox,ol[role=list].sc-sd-checkbox{list-style:none}body.sc-sd-checkbox{min-height:100vh;line-height:1.5}h1.sc-sd-checkbox,h2.sc-sd-checkbox,h3.sc-sd-checkbox,h4.sc-sd-checkbox,button.sc-sd-checkbox,input.sc-sd-checkbox,label.sc-sd-checkbox{line-height:1}h1.sc-sd-checkbox,h2.sc-sd-checkbox,h3.sc-sd-checkbox,h4.sc-sd-checkbox{text-wrap:balance}a.sc-sd-checkbox:not([class]){text-decoration-skip-ink:auto;color:currentColor}img.sc-sd-checkbox,picture.sc-sd-checkbox{max-width:100%;display:block}input.sc-sd-checkbox,button.sc-sd-checkbox,textarea.sc-sd-checkbox,select.sc-sd-checkbox{font-size:inherit}.sc-sd-checkbox:target{scroll-margin-block:5ex}button.sc-sd-checkbox{background:none;border:none;cursor:pointer;padding:0;outline:0}button.sc-sd-checkbox:focus{outline:0 !important}.sc-sd-checkbox-h{display:inline-block;height:fit-content;line-height:0}.text-center.sc-sd-checkbox{text-align:center}.text-right.sc-sd-checkbox{text-align:right}.text-left.sc-sd-checkbox{text-align:left}input[type=text].sc-sd-checkbox,input[type=number].sc-sd-checkbox,input[type=password].sc-sd-checkbox,input[type=email].sc-sd-checkbox,input[type=tel].sc-sd-checkbox,textarea.sc-sd-checkbox{padding-block:0px;padding-inline:0px}.sd-hoverable.sc-sd-checkbox:hover>.sd-focus-helper.sc-sd-checkbox{background:currentColor;opacity:0.15}.sd-hoverable.sc-sd-checkbox:hover>.sd-focus-helper.sc-sd-checkbox:before{opacity:0.1}.sd-hoverable.sc-sd-checkbox:hover>.sd-focus-helper.sc-sd-checkbox:after{opacity:0.4}.sd-focus-helper.sc-sd-checkbox{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-checkbox:before,.sd-focus-helper.sc-sd-checkbox:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-checkbox:before{background:#000000}.sd-focus-helper.sc-sd-checkbox:after{background:#ffffff}.sd-tooltip-menu.sc-sd-checkbox{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close.sc-sd-checkbox{padding-right:12px !important}.sd-tooltip-menu__arrow.sc-sd-checkbox{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow.sc-sd-checkbox svg.sc-sd-checkbox{width:100%;height:100%}.sd-tooltip-menu__arrow--top.sc-sd-checkbox{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom.sc-sd-checkbox{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left.sc-sd-checkbox{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right.sc-sd-checkbox{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content.sc-sd-checkbox{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button.sc-sd-checkbox{padding-top:4px;display:flex}.sd-tooltip-menu__close-button.sc-sd-checkbox button.sc-sd-checkbox{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu.sc-sd-checkbox{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow.sc-sd-checkbox{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow.sc-sd-checkbox svg.sc-sd-checkbox{width:100%;height:100%}.sd-popover-menu__arrow--top.sc-sd-checkbox{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom.sc-sd-checkbox{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left.sc-sd-checkbox{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right.sc-sd-checkbox{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content.sc-sd-checkbox{font-size:12px;line-height:20px}.sd-popover-menu__content.sc-sd-checkbox .sd-popover-menu__title.sc-sd-checkbox{font-weight:700;margin-bottom:4px}.sd-popover-menu__content.sc-sd-checkbox .sd-popover-menu__messages.sc-sd-checkbox{font-weight:500}.sd-popover-menu__content.sc-sd-checkbox .sd-popover-menu__buttons.sc-sd-checkbox{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content.sc-sd-checkbox .sd-popover-menu__buttons--1.sc-sd-checkbox{justify-content:flex-end}.sd-popover-menu__content.sc-sd-checkbox .sd-popover-menu__buttons--2.sc-sd-checkbox{justify-content:space-between}.sd-popover-menu__close-button.sc-sd-checkbox{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}.sc-sd-checkbox-h{display:inline-block;height:fit-content;line-height:0}.sd-checkbox.sc-sd-checkbox{cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:20px;max-height:20px}.sd-checkbox.sc-sd-checkbox>input.sc-sd-checkbox{display:none}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--checked .sd-checkbox__bg.sc-sd-checkbox,.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--indeterminate .sd-checkbox__bg.sc-sd-checkbox{border-color:1px solid #005cc9;background:#005cc9}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--unchecked .sd-checkbox__bg.sc-sd-checkbox{border:1px solid #0075ff;background:#d9eaff}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--disabled .sd-checkbox__bg.sc-sd-checkbox{border:1px solid transparent;background:#eeeeee}.sd-checkbox__bg.sc-sd-checkbox{width:16px;height:16px;border-radius:2px;border:1px solid #888888;box-sizing:border-box;display:inline-flex;justify-content:center;align-items:center;overflow:hidden;line-height:0}.sd-checkbox__label.sc-sd-checkbox{font-size:12px;color:#333333;line-height:20px}.sd-checkbox--checked.sd-checkbox--disabled.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox,.sd-checkbox--indeterminate.sd-checkbox--disabled.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:#eeeeee;border:1px solid #cccccc !important}.sd-checkbox--checked.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox,.sd-checkbox--indeterminate.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{border:1px solid #0075ff;background:#0075ff}.sd-checkbox--unchecked.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:white}.sd-checkbox--disabled.sc-sd-checkbox{cursor:not-allowed}.sd-checkbox--disabled.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:#eeeeee;border:1px solid #cccccc !important}";
|
|
3786
3811
|
|
|
3787
3812
|
class SdCheckbox {
|
|
3788
3813
|
constructor(hostRef) {
|
|
@@ -3791,14 +3816,13 @@ class SdCheckbox {
|
|
|
3791
3816
|
}
|
|
3792
3817
|
get el() { return getElement(this); }
|
|
3793
3818
|
/** 현재 선택 상태 또는 배열 형태의 값 */
|
|
3794
|
-
checked
|
|
3819
|
+
checked;
|
|
3795
3820
|
/** 배열 모드에서의 개별 값 */
|
|
3796
3821
|
val;
|
|
3797
3822
|
/** 비활성화 여부 */
|
|
3798
3823
|
disabled = false;
|
|
3799
3824
|
/** 표시할 라벨 텍스트 */
|
|
3800
3825
|
label = '';
|
|
3801
|
-
checkboxStyle = {};
|
|
3802
3826
|
/** 내부 체크 상태 */
|
|
3803
3827
|
isChecked = false;
|
|
3804
3828
|
/** 값 변경 이벤트 */
|
|
@@ -3806,18 +3830,27 @@ class SdCheckbox {
|
|
|
3806
3830
|
componentWillLoad() {
|
|
3807
3831
|
this.updateCheckedState(this.checked);
|
|
3808
3832
|
}
|
|
3833
|
+
componentWillRender() {
|
|
3834
|
+
this.updateCheckedState(this.checked);
|
|
3835
|
+
}
|
|
3809
3836
|
watchValueHandler(newValue) {
|
|
3810
3837
|
this.updateCheckedState(newValue);
|
|
3811
3838
|
}
|
|
3812
|
-
|
|
3813
|
-
const classes = [
|
|
3839
|
+
get checkboxClasses() {
|
|
3840
|
+
const classes = [
|
|
3841
|
+
'sd-checkbox',
|
|
3842
|
+
`sd-checkbox--${this.isChecked ? 'checked' : this.isChecked === null ? 'indeterminate' : 'unchecked'}`,
|
|
3843
|
+
];
|
|
3814
3844
|
if (this.disabled) {
|
|
3815
3845
|
classes.push('sd-checkbox--disabled');
|
|
3816
3846
|
}
|
|
3817
3847
|
return classes.join(' ');
|
|
3818
3848
|
}
|
|
3819
3849
|
updateCheckedState(value) {
|
|
3820
|
-
if (
|
|
3850
|
+
if (value === null) {
|
|
3851
|
+
this.isChecked = null;
|
|
3852
|
+
}
|
|
3853
|
+
else if (typeof value === 'boolean') {
|
|
3821
3854
|
this.isChecked = value;
|
|
3822
3855
|
}
|
|
3823
3856
|
else if (Array.isArray(value)) {
|
|
@@ -3837,7 +3870,6 @@ class SdCheckbox {
|
|
|
3837
3870
|
else if (Array.isArray(this.checked)) {
|
|
3838
3871
|
if (this.val === undefined) {
|
|
3839
3872
|
console.warn('A "val" property is required when using an array for the "value" property.');
|
|
3840
|
-
return;
|
|
3841
3873
|
}
|
|
3842
3874
|
const valueSet = new Set(this.checked);
|
|
3843
3875
|
valueSet.has(this.val) ? valueSet.delete(this.val) : valueSet.add(this.val);
|
|
@@ -3849,7 +3881,7 @@ class SdCheckbox {
|
|
|
3849
3881
|
this.sdChange.emit(newValue);
|
|
3850
3882
|
};
|
|
3851
3883
|
render() {
|
|
3852
|
-
return (hAsync(Host, { key: '
|
|
3884
|
+
return (hAsync(Host, { key: '953aa5173d5e89247d80f3ee4c258f322122df24' }, hAsync("label", { key: 'ef7e3b50f134307ecbfee42daf8e858891fcea75', "aria-checked": this.isChecked === null ? 'mixed' : this.isChecked.toString(), "aria-disabled": this.disabled.toString(), role: "checkbox", "aria-label": this.label || 'checkbox', class: this.checkboxClasses }, hAsync("input", { key: 'd10e690b3cfd6141ff091563189540ad6c50b4a8', type: "checkbox", value: this.val, checked: !!this.isChecked, disabled: this.disabled, onChange: this.handleChange, name: this.label || 'checkbox' }), hAsync("div", { key: '0bc77af921869f65ccd0ce220d6198160efb46e4', class: "sd-checkbox__bg" }, this.isChecked !== false ? (hAsync("sd-icon", { name: this.isChecked === true ? 'check' : 'minus', size: 12, color: this.disabled ? '#888888' : 'white' })) : null), this.label && hAsync("span", { key: '0d111f7f1e6d19cb0da67589c1ec4853ab543e71', class: "sd-checkbox__label" }, this.label))));
|
|
3853
3885
|
}
|
|
3854
3886
|
static get watchers() { return {
|
|
3855
3887
|
"checked": ["watchValueHandler"]
|
|
@@ -3859,11 +3891,10 @@ class SdCheckbox {
|
|
|
3859
3891
|
"$flags$": 770,
|
|
3860
3892
|
"$tagName$": "sd-checkbox",
|
|
3861
3893
|
"$members$": {
|
|
3862
|
-
"checked": [
|
|
3894
|
+
"checked": [4],
|
|
3863
3895
|
"val": [8],
|
|
3864
3896
|
"disabled": [4],
|
|
3865
3897
|
"label": [1],
|
|
3866
|
-
"checkboxStyle": [16],
|
|
3867
3898
|
"isChecked": [32]
|
|
3868
3899
|
},
|
|
3869
3900
|
"$listeners$": undefined,
|
|
@@ -3903,7 +3934,7 @@ class SdDateBox {
|
|
|
3903
3934
|
this.sdMouseOver?.emit(this.date);
|
|
3904
3935
|
}
|
|
3905
3936
|
render() {
|
|
3906
|
-
return (hAsync(Host, { key: '
|
|
3937
|
+
return (hAsync(Host, { key: 'ace5d023959d41d2a2255e70ad9d5bad9df4f9fe', role: "button", "aria-disabled": this.disabled ? 'true' : 'false', tabindex: this.disabled ? -1 : 0, class: {
|
|
3907
3938
|
'sd-date-box': true,
|
|
3908
3939
|
'sd-hoverable': !this.disabled || !this.selected || this.type === '',
|
|
3909
3940
|
'sd-date-box--disabled': this.disabled,
|
|
@@ -3914,7 +3945,7 @@ class SdDateBox {
|
|
|
3914
3945
|
'sd-date-box--in-range': this.inRange,
|
|
3915
3946
|
'sd-date-box--type-start': this.type === 'start',
|
|
3916
3947
|
'sd-date-box--type-end': this.type === 'end',
|
|
3917
|
-
}, onClick: () => this.handleClickDate(), onMouseOver: () => this.handleHoverDate() }, hAsync("div", { key: '
|
|
3948
|
+
}, onClick: () => this.handleClickDate(), onMouseOver: () => this.handleHoverDate() }, hAsync("div", { key: '2fdeea79f2eeb28da3b9999f7326996531cb6c88', class: "sd-date-box__content" }, hAsync("div", { key: '0f7839e75905b04f99a23603326099953f5e2990', class: "sd-date-box__label" }, this.date))));
|
|
3918
3949
|
}
|
|
3919
3950
|
static get style() { return sdDateBoxCss; }
|
|
3920
3951
|
static get cmpMeta() { return {
|
|
@@ -4071,9 +4102,9 @@ class SdDatePicker {
|
|
|
4071
4102
|
this.isOpen = false;
|
|
4072
4103
|
};
|
|
4073
4104
|
render() {
|
|
4074
|
-
return (hAsync(Host, { key: '
|
|
4105
|
+
return (hAsync(Host, { key: 'f445a752123f1a1a7f8d28ca7472a8ffabda9441', class: "sd-date-picker" }, hAsync("sd-input", { key: '85662ea61b192562311af23f67c1a1ad05636813', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
|
|
4075
4106
|
margin: '0 0 0 8px',
|
|
4076
|
-
}, onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '
|
|
4107
|
+
}, onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '41634f9170073fbde5e44c55b5985da90763f819', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: 'ce630583ef81cd72ad1b8fdaab7cab2d1df278cb', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: '55d4c73a3e17991ebf68495d7bed96399857de1e', class: "sd-date-picker__menu" }, hAsync("div", { key: '0800e3a37eec27bb8a8c59a2ebd8ffdbf4e813a7', class: "sd-date-picker__header" }, hAsync("div", { key: '1518b578ad87a0f5875d980d1c974492f32714e3', class: "year-nav" }, hAsync("button", { key: 'e70f1d4e73650c7bccb1629b679ca366717e5506', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, hAsync("sd-icon", { key: 'f679a54b76e304d08c132d6784575831a5d5d61b', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: '634dcbfe81d328cbc0460958208dc17aaf218158', class: "year-nav__current" }, this.currentYear), hAsync("button", { key: '7e7cef51d7b47b7280cfff4234b88394708ea01a', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, hAsync("sd-icon", { key: '8a6fc4a40f567d2d1ffef5dbc08de5148203970c', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '8fad6e92b899a0cb38398ec2f4036b959377d99b', class: "month-nav" }, hAsync("button", { key: '3180c35ad42239a6a97480a4db860182b98724f3', type: "button", name: "prev-month", title: "Previous ", onClick: () => this.handleUpdateMonth('prev') }, hAsync("sd-icon", { key: '6ccef0b13fde4124e0e14959687f60dab753ae51', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: 'db7db67a1a77f02451bc0a7c97e87e3cd6c9d453', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), hAsync("button", { key: '5df06269331e9f7ee1cb4801bfd713d433f00af4', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, hAsync("sd-icon", { key: '65b0f49b205e9aa38a46cbe672665b31c9ffe542', name: "arrowRight", size: "12", color: "#CCCCCC" })))), hAsync("div", { key: '68f3c05f2ffb57b7fc032209dd709e5eaa6fcbdd', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("div", { key: day, class: "day" }, day)))), hAsync("div", { key: '452c22746ace6b3923acf4912edba2509a56b369', class: "sd-date-picker__body" }, [
|
|
4077
4108
|
...this.calendar.prevMonthDays,
|
|
4078
4109
|
...this.calendar.days,
|
|
4079
4110
|
...this.calendar.afterMonthDays,
|
|
@@ -4246,9 +4277,9 @@ class SdDateRangePicker {
|
|
|
4246
4277
|
this.isOpen = false;
|
|
4247
4278
|
};
|
|
4248
4279
|
render() {
|
|
4249
|
-
return (hAsync(Host, { key: '
|
|
4280
|
+
return (hAsync(Host, { key: '3d95128a2a654e38ceae60e6b89482a454488286', class: "sd-date-range-picker" }, hAsync("sd-input", { key: '4f170abfe6214ffa1044020b2cd59a9219f3ef09', ref: el => (this.inputEl = el), value: `${this.dateRange[0]} ~ ${this.dateRange[1]}`, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
|
|
4250
4281
|
margin: '0 0 0 8px',
|
|
4251
|
-
}, onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '
|
|
4282
|
+
}, onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '7c12c7e3331638f333efdea4bcd3d452eb032561', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: '7312ab4a79877de6d6be3edaa404e0b9c52e28d8', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: '20a485d128de2b2d0a8043cb5fe0de990364bbd8', class: "sd-date-range-picker__menu" }, hAsync("div", { key: '19a0489246b5dccc183f3d3a040086a6a2c565f3', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, hAsync("button", { key: '1f9c5f1188234e2306c033e8e67f9a106b3b39bc', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, hAsync("sd-icon", { key: '52805839d2092886fe4f07c9f95a2e948b00c917', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("div", { key: 'e9f323504223ccfbc4b5703346a310e58d1621c3', class: "header-label" }, this.prevYear), hAsync("button", { key: '810c6fb9eaa16291550455ac1099c15da7b80ed6', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, hAsync("sd-icon", { key: '44cf361ed854292f90c954522c356e17d5a45d29', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '4cc859482a2c010261b64b8ce15f5c754a2234fd', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (hAsync(Fragment, null, index === 1 && hAsync("div", { class: "separator" }), hAsync("div", { key: index, class: "calendar-container" }, hAsync("div", { class: "calendar-header" }, hAsync("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, hAsync("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
|
|
4252
4283
|
? `${this.prevYear}.${String(this.prevMonth).padStart(2, '0')}`
|
|
4253
4284
|
: `${this.nextYear}.${String(this.nextMonth).padStart(2, '0')}`), hAsync("div", { class: "calendar-days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("sd-date-box", { key: day, date: day, disabled: true, class: "day" })))), hAsync("div", { class: "calendar-body mt-12pxr grid grid-cols-7 gap-y-8pxr" }, [...calendar.prevMonthDays, ...calendar.days, ...calendar.afterMonthDays].map((day, idx) => (hAsync("sd-date-box", { key: `prev${day}_${idx}`, date: !day ? '' : Number(day), selected: this.dateRange.some(date => date ===
|
|
4254
4285
|
this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), type: this.getDateBoxType(this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), isToday: today ===
|
|
@@ -4278,27 +4309,38 @@ class SdDateRangePicker {
|
|
|
4278
4309
|
}; }
|
|
4279
4310
|
}
|
|
4280
4311
|
|
|
4281
|
-
const sdGuideCss = "@charset \"UTF-8\";@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\")}.sc-sd-guide:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html.sc-sd-guide{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary.sc-sd-guide{background-color:var(--color-primary, #051d36)}.bg-secondary.sc-sd-guide{background-color:var(--color-secondary, #555555)}.bg-accent.sc-sd-guide{background-color:var(--color-accent, #9c27b0)}.bg-positive.sc-sd-guide{background-color:var(--color-positive, #0075ff)}.bg-negative.sc-sd-guide{background-color:var(--color-negative, #e30000)}.bg-info.sc-sd-guide{background-color:var(--color-info, #00cd52)}.bg-warning.sc-sd-guide{background-color:var(--color-warning, #f2c037)}.bg-red_99.sc-sd-guide{background-color:var(--color-red_99, #220000)}.bg-red_95.sc-sd-guide{background-color:var(--color-red_95, #440000)}.bg-red_90.sc-sd-guide{background-color:var(--color-red_90, #5E0000)}.bg-red_85.sc-sd-guide{background-color:var(--color-red_85, #820000)}.bg-red_80.sc-sd-guide{background-color:var(--color-red_80, #AD0000)}.bg-red_75.sc-sd-guide{background-color:var(--color-red_75, #E30000)}.bg-red_70.sc-sd-guide{background-color:var(--color-red_70, #FB4444)}.bg-red_60.sc-sd-guide{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45.sc-sd-guide{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30.sc-sd-guide{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20.sc-sd-guide{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15.sc-sd-guide{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg.sc-sd-guide{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon.sc-sd-guide{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99.sc-sd-guide{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95.sc-sd-guide{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90.sc-sd-guide{background-color:var(--color-orange_90, #752A00)}.bg-orange_85.sc-sd-guide{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75.sc-sd-guide{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65.sc-sd-guide{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60.sc-sd-guide{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55.sc-sd-guide{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45.sc-sd-guide{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35.sc-sd-guide{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20.sc-sd-guide{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10.sc-sd-guide{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert.sc-sd-guide{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95.sc-sd-guide{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90.sc-sd-guide{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80.sc-sd-guide{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70.sc-sd-guide{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60.sc-sd-guide{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50.sc-sd-guide{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45.sc-sd-guide{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40.sc-sd-guide{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30.sc-sd-guide{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25.sc-sd-guide{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20.sc-sd-guide{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10.sc-sd-guide{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95.sc-sd-guide{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90.sc-sd-guide{background-color:var(--color-olive_90, #454500)}.bg-olive_80.sc-sd-guide{background-color:var(--color-olive_80, #636300)}.bg-olive_70.sc-sd-guide{background-color:var(--color-olive_70, #838300)}.bg-olive_65.sc-sd-guide{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55.sc-sd-guide{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45.sc-sd-guide{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30.sc-sd-guide{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20.sc-sd-guide{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15.sc-sd-guide{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10.sc-sd-guide{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05.sc-sd-guide{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99.sc-sd-guide{background-color:var(--color-green_99, #001D0B)}.bg-green_95.sc-sd-guide{background-color:var(--color-green_95, #003013)}.bg-green_90.sc-sd-guide{background-color:var(--color-green_90, #00461C)}.bg-green_85.sc-sd-guide{background-color:var(--color-green_85, #006629)}.bg-green_80.sc-sd-guide{background-color:var(--color-green_80, #007B31)}.bg-green_75.sc-sd-guide{background-color:var(--color-green_75, #00973C)}.bg-green_70.sc-sd-guide{background-color:var(--color-green_70, #12B553)}.bg-green_65.sc-sd-guide{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55.sc-sd-guide{background-color:var(--color-green_55, #6DE39C)}.bg-green_45.sc-sd-guide{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25.sc-sd-guide{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15.sc-sd-guide{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99.sc-sd-guide{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95.sc-sd-guide{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90.sc-sd-guide{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85.sc-sd-guide{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80.sc-sd-guide{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75.sc-sd-guide{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70.sc-sd-guide{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65.sc-sd-guide{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60.sc-sd-guide{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45.sc-sd-guide{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25.sc-sd-guide{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10.sc-sd-guide{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99.sc-sd-guide{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95.sc-sd-guide{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90.sc-sd-guide{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85.sc-sd-guide{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80.sc-sd-guide{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75.sc-sd-guide{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70.sc-sd-guide{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65.sc-sd-guide{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60.sc-sd-guide{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50.sc-sd-guide{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25.sc-sd-guide{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15.sc-sd-guide{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99.sc-sd-guide{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95.sc-sd-guide{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90.sc-sd-guide{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85.sc-sd-guide{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80.sc-sd-guide{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75.sc-sd-guide{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70.sc-sd-guide{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60.sc-sd-guide{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50.sc-sd-guide{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40.sc-sd-guide{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25.sc-sd-guide{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20.sc-sd-guide{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10.sc-sd-guide{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05.sc-sd-guide{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95.sc-sd-guide{background-color:var(--color-grey_95, #222222)}.bg-grey_90.sc-sd-guide{background-color:var(--color-grey_90, #333333)}.bg-grey_85.sc-sd-guide{background-color:var(--color-grey_85, #444444)}.bg-grey_80.sc-sd-guide{background-color:var(--color-grey_80, #555555)}.bg-grey_70.sc-sd-guide{background-color:var(--color-grey_70, #737373)}.bg-grey_65.sc-sd-guide{background-color:var(--color-grey_65, #888888)}.bg-grey_60.sc-sd-guide{background-color:var(--color-grey_60, #999999)}.bg-grey_55.sc-sd-guide{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50.sc-sd-guide{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45.sc-sd-guide{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35.sc-sd-guide{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30.sc-sd-guide{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25.sc-sd-guide{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20.sc-sd-guide{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10.sc-sd-guide{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05.sc-sd-guide{background-color:var(--color-grey_05, #f9f9f9)}.bg-white.sc-sd-guide{background-color:var(--color-white, #ffffff)}.bg-black.sc-sd-guide{background-color:var(--color-black, #000000)}.text-primary.sc-sd-guide{color:var(--color-primary, #051d36)}.text-secondary.sc-sd-guide{color:var(--color-secondary, #555555)}.text-accent.sc-sd-guide{color:var(--color-accent, #9c27b0)}.text-positive.sc-sd-guide{color:var(--color-positive, #0075ff)}.text-negative.sc-sd-guide{color:var(--color-negative, #e30000)}.text-info.sc-sd-guide{color:var(--color-info, #00cd52)}.text-warning.sc-sd-guide{color:var(--color-warning, #f2c037)}.text-red_99.sc-sd-guide{color:var(--color-red_99, #220000)}.text-red_95.sc-sd-guide{color:var(--color-red_95, #440000)}.text-red_90.sc-sd-guide{color:var(--color-red_90, #5E0000)}.text-red_85.sc-sd-guide{color:var(--color-red_85, #820000)}.text-red_80.sc-sd-guide{color:var(--color-red_80, #AD0000)}.text-red_75.sc-sd-guide{color:var(--color-red_75, #E30000)}.text-red_70.sc-sd-guide{color:var(--color-red_70, #FB4444)}.text-red_60.sc-sd-guide{color:var(--color-red_60, #FF7C7C)}.text-red_45.sc-sd-guide{color:var(--color-red_45, #FFB5B5)}.text-red_30.sc-sd-guide{color:var(--color-red_30, #FFD3D3)}.text-red_20.sc-sd-guide{color:var(--color-red_20, #FCE6E6)}.text-red_15.sc-sd-guide{color:var(--color-red_15, #FCEFEF)}.text-caution_bg.sc-sd-guide{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon.sc-sd-guide{color:var(--color-caution_icon, #fd9595)}.text-orange_99.sc-sd-guide{color:var(--color-orange_99, #2F1100)}.text-orange_95.sc-sd-guide{color:var(--color-orange_95, #4D1B00)}.text-orange_90.sc-sd-guide{color:var(--color-orange_90, #752A00)}.text-orange_85.sc-sd-guide{color:var(--color-orange_85, #9B3700)}.text-orange_75.sc-sd-guide{color:var(--color-orange_75, #CE4900)}.text-orange_65.sc-sd-guide{color:var(--color-orange_65, #FF6B00)}.text-orange_60.sc-sd-guide{color:var(--color-orange_60, #FF7F22)}.text-orange_55.sc-sd-guide{color:var(--color-orange_55, #FFA452)}.text-orange_45.sc-sd-guide{color:var(--color-orange_45, #FFBC81)}.text-orange_35.sc-sd-guide{color:var(--color-orange_35, #FFD5AF)}.text-orange_20.sc-sd-guide{color:var(--color-orange_20, #FFEAD7)}.text-orange_10.sc-sd-guide{color:var(--color-orange_10, #FEF1EA)}.text-header_alert.sc-sd-guide{color:var(--color-header_alert, #FF7A00)}.text-yellow_95.sc-sd-guide{color:var(--color-yellow_95, #322700)}.text-yellow_90.sc-sd-guide{color:var(--color-yellow_90, #453702)}.text-yellow_80.sc-sd-guide{color:var(--color-yellow_80, #6C5602)}.text-yellow_70.sc-sd-guide{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60.sc-sd-guide{color:var(--color-yellow_60, #C49900)}.text-yellow_50.sc-sd-guide{color:var(--color-yellow_50, #EBB800)}.text-yellow_45.sc-sd-guide{color:var(--color-yellow_45, #FFC700)}.text-yellow_40.sc-sd-guide{color:var(--color-yellow_40, #FFD643)}.text-yellow_30.sc-sd-guide{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25.sc-sd-guide{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20.sc-sd-guide{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10.sc-sd-guide{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95.sc-sd-guide{color:var(--color-olive_95, #2C2C00)}.text-olive_90.sc-sd-guide{color:var(--color-olive_90, #454500)}.text-olive_80.sc-sd-guide{color:var(--color-olive_80, #636300)}.text-olive_70.sc-sd-guide{color:var(--color-olive_70, #838300)}.text-olive_65.sc-sd-guide{color:var(--color-olive_65, #A5A500)}.text-olive_55.sc-sd-guide{color:var(--color-olive_55, #C7C700)}.text-olive_45.sc-sd-guide{color:var(--color-olive_45, #DDDD12)}.text-olive_30.sc-sd-guide{color:var(--color-olive_30, #EEEE37)}.text-olive_20.sc-sd-guide{color:var(--color-olive_20, #F6F65F)}.text-olive_15.sc-sd-guide{color:var(--color-olive_15, #FAFAA1)}.text-olive_10.sc-sd-guide{color:var(--color-olive_10, #FBFBBF)}.text-olive_05.sc-sd-guide{color:var(--color-olive_05, #FEFED9)}.text-green_99.sc-sd-guide{color:var(--color-green_99, #001D0B)}.text-green_95.sc-sd-guide{color:var(--color-green_95, #003013)}.text-green_90.sc-sd-guide{color:var(--color-green_90, #00461C)}.text-green_85.sc-sd-guide{color:var(--color-green_85, #006629)}.text-green_80.sc-sd-guide{color:var(--color-green_80, #007B31)}.text-green_75.sc-sd-guide{color:var(--color-green_75, #00973C)}.text-green_70.sc-sd-guide{color:var(--color-green_70, #12B553)}.text-green_65.sc-sd-guide{color:var(--color-green_65, #2BCE6C)}.text-green_55.sc-sd-guide{color:var(--color-green_55, #6DE39C)}.text-green_45.sc-sd-guide{color:var(--color-green_45, #ACF4C9)}.text-green_25.sc-sd-guide{color:var(--color-green_25, #D4FAE3)}.text-green_15.sc-sd-guide{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99.sc-sd-guide{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95.sc-sd-guide{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90.sc-sd-guide{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85.sc-sd-guide{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80.sc-sd-guide{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75.sc-sd-guide{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70.sc-sd-guide{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65.sc-sd-guide{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60.sc-sd-guide{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45.sc-sd-guide{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25.sc-sd-guide{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10.sc-sd-guide{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99.sc-sd-guide{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95.sc-sd-guide{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90.sc-sd-guide{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85.sc-sd-guide{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80.sc-sd-guide{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75.sc-sd-guide{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70.sc-sd-guide{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65.sc-sd-guide{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60.sc-sd-guide{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50.sc-sd-guide{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25.sc-sd-guide{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15.sc-sd-guide{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99.sc-sd-guide{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95.sc-sd-guide{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90.sc-sd-guide{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85.sc-sd-guide{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80.sc-sd-guide{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75.sc-sd-guide{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70.sc-sd-guide{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60.sc-sd-guide{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50.sc-sd-guide{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40.sc-sd-guide{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25.sc-sd-guide{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20.sc-sd-guide{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10.sc-sd-guide{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05.sc-sd-guide{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95.sc-sd-guide{color:var(--color-grey_95, #222222)}.text-grey_90.sc-sd-guide{color:var(--color-grey_90, #333333)}.text-grey_85.sc-sd-guide{color:var(--color-grey_85, #444444)}.text-grey_80.sc-sd-guide{color:var(--color-grey_80, #555555)}.text-grey_70.sc-sd-guide{color:var(--color-grey_70, #737373)}.text-grey_65.sc-sd-guide{color:var(--color-grey_65, #888888)}.text-grey_60.sc-sd-guide{color:var(--color-grey_60, #999999)}.text-grey_55.sc-sd-guide{color:var(--color-grey_55, #aaaaaa)}.text-grey_50.sc-sd-guide{color:var(--color-grey_50, #bbbbbb)}.text-grey_45.sc-sd-guide{color:var(--color-grey_45, #cccccc)}.text-grey_35.sc-sd-guide{color:var(--color-grey_35, #D8D8D8)}.text-grey_30.sc-sd-guide{color:var(--color-grey_30, #e1e1e1)}.text-grey_25.sc-sd-guide{color:var(--color-grey_25, #E5E5E5)}.text-grey_20.sc-sd-guide{color:var(--color-grey_20, #eeeeee)}.text-grey_10.sc-sd-guide{color:var(--color-grey_10, #f6f6f6)}.text-grey_05.sc-sd-guide{color:var(--color-grey_05, #f9f9f9)}.text-white.sc-sd-guide{color:var(--color-white, #ffffff)}.text-black.sc-sd-guide{color:var(--color-black, #000000)}*.sc-sd-guide,*.sc-sd-guide::before,*.sc-sd-guide::after{box-sizing:border-box}html.sc-sd-guide{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body.sc-sd-guide,h1.sc-sd-guide,h2.sc-sd-guide,h3.sc-sd-guide,h4.sc-sd-guide,p.sc-sd-guide,figure.sc-sd-guide,blockquote.sc-sd-guide,dl.sc-sd-guide,dd.sc-sd-guide{margin-block-end:0}ul[role=list].sc-sd-guide,ol[role=list].sc-sd-guide{list-style:none}body.sc-sd-guide{min-height:100vh;line-height:1.5}h1.sc-sd-guide,h2.sc-sd-guide,h3.sc-sd-guide,h4.sc-sd-guide,button.sc-sd-guide,input.sc-sd-guide,label.sc-sd-guide{line-height:1}h1.sc-sd-guide,h2.sc-sd-guide,h3.sc-sd-guide,h4.sc-sd-guide{text-wrap:balance}a.sc-sd-guide:not([class]){text-decoration-skip-ink:auto;color:currentColor}img.sc-sd-guide,picture.sc-sd-guide{max-width:100%;display:block}input.sc-sd-guide,button.sc-sd-guide,textarea.sc-sd-guide,select.sc-sd-guide{font-size:inherit}.sc-sd-guide:target{scroll-margin-block:5ex}button.sc-sd-guide{background:none;border:none;cursor:pointer;padding:0;outline:0}button.sc-sd-guide:focus{outline:0 !important}.sc-sd-guide-h{display:inline-block;height:fit-content;line-height:0}.text-center.sc-sd-guide{text-align:center}.text-right.sc-sd-guide{text-align:right}.text-left.sc-sd-guide{text-align:left}input[type=text].sc-sd-guide,input[type=number].sc-sd-guide,input[type=password].sc-sd-guide,input[type=email].sc-sd-guide,input[type=tel].sc-sd-guide,textarea.sc-sd-guide{padding-block:0px;padding-inline:0px}.sd-hoverable.sc-sd-guide:hover>.sd-focus-helper.sc-sd-guide{background:currentColor;opacity:0.15}.sd-hoverable.sc-sd-guide:hover>.sd-focus-helper.sc-sd-guide:before{opacity:0.1}.sd-hoverable.sc-sd-guide:hover>.sd-focus-helper.sc-sd-guide:after{opacity:0.4}.sd-focus-helper.sc-sd-guide{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-guide:before,.sd-focus-helper.sc-sd-guide:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-guide:before{background:#000000}.sd-focus-helper.sc-sd-guide:after{background:#ffffff}.sd-tooltip-menu.sc-sd-guide{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close.sc-sd-guide{padding-right:12px !important}.sd-tooltip-menu__arrow.sc-sd-guide{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow.sc-sd-guide svg.sc-sd-guide{width:100%;height:100%}.sd-tooltip-menu__arrow--top.sc-sd-guide{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom.sc-sd-guide{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left.sc-sd-guide{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right.sc-sd-guide{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content.sc-sd-guide{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button.sc-sd-guide{padding-top:4px;display:flex}.sd-tooltip-menu__close-button.sc-sd-guide button.sc-sd-guide{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu.sc-sd-guide{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow.sc-sd-guide{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow.sc-sd-guide svg.sc-sd-guide{width:100%;height:100%}.sd-popover-menu__arrow--top.sc-sd-guide{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom.sc-sd-guide{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left.sc-sd-guide{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right.sc-sd-guide{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content.sc-sd-guide{font-size:12px;line-height:20px}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__title.sc-sd-guide{font-weight:700;margin-bottom:4px}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__messages.sc-sd-guide{font-weight:500}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__buttons.sc-sd-guide{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__buttons--1.sc-sd-guide{justify-content:flex-end}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__buttons--2.sc-sd-guide{justify-content:space-between}.sd-popover-menu__close-button.sc-sd-guide{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}.sd-guide__popup.sc-sd-guide{position:relative;padding:20px 32px;border-radius:8px;box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.1);background:white}.sd-guide__popup__close.sc-sd-guide{position:absolute;top:12px;right:12px}.sd-guide__popup__header.sc-sd-guide{display:flex;align-items:center;gap:8px;margin-bottom:12px}.sd-guide__popup__header.sc-sd-guide .sd-guide__popup__title.sc-sd-guide{margin-top:0;font-size:16px;font-weight:700;line-height:26px;color:#333333}.sd-guide__popup__list.sc-sd-guide{width:100%;padding:0;margin:0}.sd-guide__popup__list__item.sc-sd-guide{display:flex;width:100%;align-items:start;list-style:none;color:#333333;font-size:12px;font-weight:400}.sd-guide__popup__list__item.sc-sd-guide p.sc-sd-guide{width:100%;padding:0;margin:0;word-wrap:break-word;word-break:break-word;white-space:normal;overflow-wrap:break-word;min-width:0}.sd-guide__popup__list__item.sc-sd-guide::before{display:block;content:\"-\";width:6px;color:#333333;font-size:12px;font-weight:400;margin-left:10px;margin-right:12px;flex-shrink:0}.sd-guide__popup__list__item--depth-2.sc-sd-guide::before{content:\"•\"}.sd-guide__popup__list__item--depth-2.sc-sd-guide{padding-left:26px}";
|
|
4312
|
+
const sdGuideCss = "@charset \"UTF-8\";@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\")}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\")}.sc-sd-guide:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html.sc-sd-guide{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary.sc-sd-guide{background-color:var(--color-primary, #051d36)}.bg-secondary.sc-sd-guide{background-color:var(--color-secondary, #555555)}.bg-accent.sc-sd-guide{background-color:var(--color-accent, #9c27b0)}.bg-positive.sc-sd-guide{background-color:var(--color-positive, #0075ff)}.bg-negative.sc-sd-guide{background-color:var(--color-negative, #e30000)}.bg-info.sc-sd-guide{background-color:var(--color-info, #00cd52)}.bg-warning.sc-sd-guide{background-color:var(--color-warning, #f2c037)}.bg-red_99.sc-sd-guide{background-color:var(--color-red_99, #220000)}.bg-red_95.sc-sd-guide{background-color:var(--color-red_95, #440000)}.bg-red_90.sc-sd-guide{background-color:var(--color-red_90, #5E0000)}.bg-red_85.sc-sd-guide{background-color:var(--color-red_85, #820000)}.bg-red_80.sc-sd-guide{background-color:var(--color-red_80, #AD0000)}.bg-red_75.sc-sd-guide{background-color:var(--color-red_75, #E30000)}.bg-red_70.sc-sd-guide{background-color:var(--color-red_70, #FB4444)}.bg-red_60.sc-sd-guide{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45.sc-sd-guide{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30.sc-sd-guide{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20.sc-sd-guide{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15.sc-sd-guide{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg.sc-sd-guide{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon.sc-sd-guide{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99.sc-sd-guide{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95.sc-sd-guide{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90.sc-sd-guide{background-color:var(--color-orange_90, #752A00)}.bg-orange_85.sc-sd-guide{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75.sc-sd-guide{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65.sc-sd-guide{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60.sc-sd-guide{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55.sc-sd-guide{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45.sc-sd-guide{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35.sc-sd-guide{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20.sc-sd-guide{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10.sc-sd-guide{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert.sc-sd-guide{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95.sc-sd-guide{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90.sc-sd-guide{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80.sc-sd-guide{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70.sc-sd-guide{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60.sc-sd-guide{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50.sc-sd-guide{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45.sc-sd-guide{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40.sc-sd-guide{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30.sc-sd-guide{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25.sc-sd-guide{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20.sc-sd-guide{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10.sc-sd-guide{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95.sc-sd-guide{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90.sc-sd-guide{background-color:var(--color-olive_90, #454500)}.bg-olive_80.sc-sd-guide{background-color:var(--color-olive_80, #636300)}.bg-olive_70.sc-sd-guide{background-color:var(--color-olive_70, #838300)}.bg-olive_65.sc-sd-guide{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55.sc-sd-guide{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45.sc-sd-guide{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30.sc-sd-guide{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20.sc-sd-guide{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15.sc-sd-guide{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10.sc-sd-guide{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05.sc-sd-guide{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99.sc-sd-guide{background-color:var(--color-green_99, #001D0B)}.bg-green_95.sc-sd-guide{background-color:var(--color-green_95, #003013)}.bg-green_90.sc-sd-guide{background-color:var(--color-green_90, #00461C)}.bg-green_85.sc-sd-guide{background-color:var(--color-green_85, #006629)}.bg-green_80.sc-sd-guide{background-color:var(--color-green_80, #007B31)}.bg-green_75.sc-sd-guide{background-color:var(--color-green_75, #00973C)}.bg-green_70.sc-sd-guide{background-color:var(--color-green_70, #12B553)}.bg-green_65.sc-sd-guide{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55.sc-sd-guide{background-color:var(--color-green_55, #6DE39C)}.bg-green_45.sc-sd-guide{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25.sc-sd-guide{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15.sc-sd-guide{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99.sc-sd-guide{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95.sc-sd-guide{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90.sc-sd-guide{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85.sc-sd-guide{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80.sc-sd-guide{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75.sc-sd-guide{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70.sc-sd-guide{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65.sc-sd-guide{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60.sc-sd-guide{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45.sc-sd-guide{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25.sc-sd-guide{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10.sc-sd-guide{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99.sc-sd-guide{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95.sc-sd-guide{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90.sc-sd-guide{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85.sc-sd-guide{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80.sc-sd-guide{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75.sc-sd-guide{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70.sc-sd-guide{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65.sc-sd-guide{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60.sc-sd-guide{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50.sc-sd-guide{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25.sc-sd-guide{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15.sc-sd-guide{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99.sc-sd-guide{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95.sc-sd-guide{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90.sc-sd-guide{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85.sc-sd-guide{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80.sc-sd-guide{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75.sc-sd-guide{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70.sc-sd-guide{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60.sc-sd-guide{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50.sc-sd-guide{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40.sc-sd-guide{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25.sc-sd-guide{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20.sc-sd-guide{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10.sc-sd-guide{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05.sc-sd-guide{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95.sc-sd-guide{background-color:var(--color-grey_95, #222222)}.bg-grey_90.sc-sd-guide{background-color:var(--color-grey_90, #333333)}.bg-grey_85.sc-sd-guide{background-color:var(--color-grey_85, #444444)}.bg-grey_80.sc-sd-guide{background-color:var(--color-grey_80, #555555)}.bg-grey_70.sc-sd-guide{background-color:var(--color-grey_70, #737373)}.bg-grey_65.sc-sd-guide{background-color:var(--color-grey_65, #888888)}.bg-grey_60.sc-sd-guide{background-color:var(--color-grey_60, #999999)}.bg-grey_55.sc-sd-guide{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50.sc-sd-guide{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45.sc-sd-guide{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35.sc-sd-guide{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30.sc-sd-guide{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25.sc-sd-guide{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20.sc-sd-guide{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10.sc-sd-guide{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05.sc-sd-guide{background-color:var(--color-grey_05, #f9f9f9)}.bg-white.sc-sd-guide{background-color:var(--color-white, #ffffff)}.bg-black.sc-sd-guide{background-color:var(--color-black, #000000)}.text-primary.sc-sd-guide{color:var(--color-primary, #051d36)}.text-secondary.sc-sd-guide{color:var(--color-secondary, #555555)}.text-accent.sc-sd-guide{color:var(--color-accent, #9c27b0)}.text-positive.sc-sd-guide{color:var(--color-positive, #0075ff)}.text-negative.sc-sd-guide{color:var(--color-negative, #e30000)}.text-info.sc-sd-guide{color:var(--color-info, #00cd52)}.text-warning.sc-sd-guide{color:var(--color-warning, #f2c037)}.text-red_99.sc-sd-guide{color:var(--color-red_99, #220000)}.text-red_95.sc-sd-guide{color:var(--color-red_95, #440000)}.text-red_90.sc-sd-guide{color:var(--color-red_90, #5E0000)}.text-red_85.sc-sd-guide{color:var(--color-red_85, #820000)}.text-red_80.sc-sd-guide{color:var(--color-red_80, #AD0000)}.text-red_75.sc-sd-guide{color:var(--color-red_75, #E30000)}.text-red_70.sc-sd-guide{color:var(--color-red_70, #FB4444)}.text-red_60.sc-sd-guide{color:var(--color-red_60, #FF7C7C)}.text-red_45.sc-sd-guide{color:var(--color-red_45, #FFB5B5)}.text-red_30.sc-sd-guide{color:var(--color-red_30, #FFD3D3)}.text-red_20.sc-sd-guide{color:var(--color-red_20, #FCE6E6)}.text-red_15.sc-sd-guide{color:var(--color-red_15, #FCEFEF)}.text-caution_bg.sc-sd-guide{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon.sc-sd-guide{color:var(--color-caution_icon, #fd9595)}.text-orange_99.sc-sd-guide{color:var(--color-orange_99, #2F1100)}.text-orange_95.sc-sd-guide{color:var(--color-orange_95, #4D1B00)}.text-orange_90.sc-sd-guide{color:var(--color-orange_90, #752A00)}.text-orange_85.sc-sd-guide{color:var(--color-orange_85, #9B3700)}.text-orange_75.sc-sd-guide{color:var(--color-orange_75, #CE4900)}.text-orange_65.sc-sd-guide{color:var(--color-orange_65, #FF6B00)}.text-orange_60.sc-sd-guide{color:var(--color-orange_60, #FF7F22)}.text-orange_55.sc-sd-guide{color:var(--color-orange_55, #FFA452)}.text-orange_45.sc-sd-guide{color:var(--color-orange_45, #FFBC81)}.text-orange_35.sc-sd-guide{color:var(--color-orange_35, #FFD5AF)}.text-orange_20.sc-sd-guide{color:var(--color-orange_20, #FFEAD7)}.text-orange_10.sc-sd-guide{color:var(--color-orange_10, #FEF1EA)}.text-header_alert.sc-sd-guide{color:var(--color-header_alert, #FF7A00)}.text-yellow_95.sc-sd-guide{color:var(--color-yellow_95, #322700)}.text-yellow_90.sc-sd-guide{color:var(--color-yellow_90, #453702)}.text-yellow_80.sc-sd-guide{color:var(--color-yellow_80, #6C5602)}.text-yellow_70.sc-sd-guide{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60.sc-sd-guide{color:var(--color-yellow_60, #C49900)}.text-yellow_50.sc-sd-guide{color:var(--color-yellow_50, #EBB800)}.text-yellow_45.sc-sd-guide{color:var(--color-yellow_45, #FFC700)}.text-yellow_40.sc-sd-guide{color:var(--color-yellow_40, #FFD643)}.text-yellow_30.sc-sd-guide{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25.sc-sd-guide{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20.sc-sd-guide{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10.sc-sd-guide{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95.sc-sd-guide{color:var(--color-olive_95, #2C2C00)}.text-olive_90.sc-sd-guide{color:var(--color-olive_90, #454500)}.text-olive_80.sc-sd-guide{color:var(--color-olive_80, #636300)}.text-olive_70.sc-sd-guide{color:var(--color-olive_70, #838300)}.text-olive_65.sc-sd-guide{color:var(--color-olive_65, #A5A500)}.text-olive_55.sc-sd-guide{color:var(--color-olive_55, #C7C700)}.text-olive_45.sc-sd-guide{color:var(--color-olive_45, #DDDD12)}.text-olive_30.sc-sd-guide{color:var(--color-olive_30, #EEEE37)}.text-olive_20.sc-sd-guide{color:var(--color-olive_20, #F6F65F)}.text-olive_15.sc-sd-guide{color:var(--color-olive_15, #FAFAA1)}.text-olive_10.sc-sd-guide{color:var(--color-olive_10, #FBFBBF)}.text-olive_05.sc-sd-guide{color:var(--color-olive_05, #FEFED9)}.text-green_99.sc-sd-guide{color:var(--color-green_99, #001D0B)}.text-green_95.sc-sd-guide{color:var(--color-green_95, #003013)}.text-green_90.sc-sd-guide{color:var(--color-green_90, #00461C)}.text-green_85.sc-sd-guide{color:var(--color-green_85, #006629)}.text-green_80.sc-sd-guide{color:var(--color-green_80, #007B31)}.text-green_75.sc-sd-guide{color:var(--color-green_75, #00973C)}.text-green_70.sc-sd-guide{color:var(--color-green_70, #12B553)}.text-green_65.sc-sd-guide{color:var(--color-green_65, #2BCE6C)}.text-green_55.sc-sd-guide{color:var(--color-green_55, #6DE39C)}.text-green_45.sc-sd-guide{color:var(--color-green_45, #ACF4C9)}.text-green_25.sc-sd-guide{color:var(--color-green_25, #D4FAE3)}.text-green_15.sc-sd-guide{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99.sc-sd-guide{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95.sc-sd-guide{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90.sc-sd-guide{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85.sc-sd-guide{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80.sc-sd-guide{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75.sc-sd-guide{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70.sc-sd-guide{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65.sc-sd-guide{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60.sc-sd-guide{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45.sc-sd-guide{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25.sc-sd-guide{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10.sc-sd-guide{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99.sc-sd-guide{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95.sc-sd-guide{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90.sc-sd-guide{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85.sc-sd-guide{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80.sc-sd-guide{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75.sc-sd-guide{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70.sc-sd-guide{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65.sc-sd-guide{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60.sc-sd-guide{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50.sc-sd-guide{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25.sc-sd-guide{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15.sc-sd-guide{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99.sc-sd-guide{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95.sc-sd-guide{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90.sc-sd-guide{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85.sc-sd-guide{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80.sc-sd-guide{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75.sc-sd-guide{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70.sc-sd-guide{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60.sc-sd-guide{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50.sc-sd-guide{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40.sc-sd-guide{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25.sc-sd-guide{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20.sc-sd-guide{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10.sc-sd-guide{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05.sc-sd-guide{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95.sc-sd-guide{color:var(--color-grey_95, #222222)}.text-grey_90.sc-sd-guide{color:var(--color-grey_90, #333333)}.text-grey_85.sc-sd-guide{color:var(--color-grey_85, #444444)}.text-grey_80.sc-sd-guide{color:var(--color-grey_80, #555555)}.text-grey_70.sc-sd-guide{color:var(--color-grey_70, #737373)}.text-grey_65.sc-sd-guide{color:var(--color-grey_65, #888888)}.text-grey_60.sc-sd-guide{color:var(--color-grey_60, #999999)}.text-grey_55.sc-sd-guide{color:var(--color-grey_55, #aaaaaa)}.text-grey_50.sc-sd-guide{color:var(--color-grey_50, #bbbbbb)}.text-grey_45.sc-sd-guide{color:var(--color-grey_45, #cccccc)}.text-grey_35.sc-sd-guide{color:var(--color-grey_35, #D8D8D8)}.text-grey_30.sc-sd-guide{color:var(--color-grey_30, #e1e1e1)}.text-grey_25.sc-sd-guide{color:var(--color-grey_25, #E5E5E5)}.text-grey_20.sc-sd-guide{color:var(--color-grey_20, #eeeeee)}.text-grey_10.sc-sd-guide{color:var(--color-grey_10, #f6f6f6)}.text-grey_05.sc-sd-guide{color:var(--color-grey_05, #f9f9f9)}.text-white.sc-sd-guide{color:var(--color-white, #ffffff)}.text-black.sc-sd-guide{color:var(--color-black, #000000)}*.sc-sd-guide,*.sc-sd-guide::before,*.sc-sd-guide::after{box-sizing:border-box}html.sc-sd-guide{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body.sc-sd-guide,h1.sc-sd-guide,h2.sc-sd-guide,h3.sc-sd-guide,h4.sc-sd-guide,p.sc-sd-guide,figure.sc-sd-guide,blockquote.sc-sd-guide,dl.sc-sd-guide,dd.sc-sd-guide{margin-block-end:0}ul[role=list].sc-sd-guide,ol[role=list].sc-sd-guide{list-style:none}body.sc-sd-guide{min-height:100vh;line-height:1.5}h1.sc-sd-guide,h2.sc-sd-guide,h3.sc-sd-guide,h4.sc-sd-guide,button.sc-sd-guide,input.sc-sd-guide,label.sc-sd-guide{line-height:1}h1.sc-sd-guide,h2.sc-sd-guide,h3.sc-sd-guide,h4.sc-sd-guide{text-wrap:balance}a.sc-sd-guide:not([class]){text-decoration-skip-ink:auto;color:currentColor}img.sc-sd-guide,picture.sc-sd-guide{max-width:100%;display:block}input.sc-sd-guide,button.sc-sd-guide,textarea.sc-sd-guide,select.sc-sd-guide{font-size:inherit}.sc-sd-guide:target{scroll-margin-block:5ex}button.sc-sd-guide{background:none;border:none;cursor:pointer;padding:0;outline:0}button.sc-sd-guide:focus{outline:0 !important}.sc-sd-guide-h{display:inline-block;height:fit-content;line-height:0}.text-center.sc-sd-guide{text-align:center}.text-right.sc-sd-guide{text-align:right}.text-left.sc-sd-guide{text-align:left}input[type=text].sc-sd-guide,input[type=number].sc-sd-guide,input[type=password].sc-sd-guide,input[type=email].sc-sd-guide,input[type=tel].sc-sd-guide,textarea.sc-sd-guide{padding-block:0px;padding-inline:0px}.sd-hoverable.sc-sd-guide:hover>.sd-focus-helper.sc-sd-guide{background:currentColor;opacity:0.15}.sd-hoverable.sc-sd-guide:hover>.sd-focus-helper.sc-sd-guide:before{opacity:0.1}.sd-hoverable.sc-sd-guide:hover>.sd-focus-helper.sc-sd-guide:after{opacity:0.4}.sd-focus-helper.sc-sd-guide{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-guide:before,.sd-focus-helper.sc-sd-guide:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper.sc-sd-guide:before{background:#000000}.sd-focus-helper.sc-sd-guide:after{background:#ffffff}.sd-tooltip-menu.sc-sd-guide{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close.sc-sd-guide{padding-right:12px !important}.sd-tooltip-menu__arrow.sc-sd-guide{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow.sc-sd-guide svg.sc-sd-guide{width:100%;height:100%}.sd-tooltip-menu__arrow--top.sc-sd-guide{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom.sc-sd-guide{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left.sc-sd-guide{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right.sc-sd-guide{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content.sc-sd-guide{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button.sc-sd-guide{padding-top:4px;display:flex}.sd-tooltip-menu__close-button.sc-sd-guide button.sc-sd-guide{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu.sc-sd-guide{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow.sc-sd-guide{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow.sc-sd-guide svg.sc-sd-guide{width:100%;height:100%}.sd-popover-menu__arrow--top.sc-sd-guide{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom.sc-sd-guide{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left.sc-sd-guide{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right.sc-sd-guide{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content.sc-sd-guide{font-size:12px;line-height:20px}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__title.sc-sd-guide{font-weight:700;margin-bottom:4px}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__messages.sc-sd-guide{font-weight:500}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__buttons.sc-sd-guide{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__buttons--1.sc-sd-guide{justify-content:flex-end}.sd-popover-menu__content.sc-sd-guide .sd-popover-menu__buttons--2.sc-sd-guide{justify-content:space-between}.sd-popover-menu__close-button.sc-sd-guide{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}.sd-guide.sc-sd-guide .sc-sd-guide:deep(.sd-button){padding:0 16px 0 12px;border-radius:16px}.sd-guide.sc-sd-guide .sc-sd-guide:deep(.sd-button) .sd-button__content.sc-sd-guide .sd-button__label.sc-sd-guide{color:#333333}.sd-guide__popup.sc-sd-guide{position:relative;padding:20px 32px;border-radius:8px;box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.1);background:white}.sd-guide__popup__close.sc-sd-guide{position:absolute;top:12px;right:12px}.sd-guide__popup__header.sc-sd-guide{display:flex;align-items:center;gap:8px;margin-bottom:12px}.sd-guide__popup__header.sc-sd-guide .sd-guide__popup__title.sc-sd-guide{margin-top:0;font-size:16px;font-weight:700;line-height:26px;color:#333333}.sd-guide__popup__list.sc-sd-guide{width:100%;padding:0;margin:0}.sd-guide__popup__list__item.sc-sd-guide{display:flex;width:100%;align-items:start;list-style:none;color:#333333;font-size:12px;font-weight:400}.sd-guide__popup__list__item.sc-sd-guide p.sc-sd-guide{width:100%;padding:0;margin:0;word-wrap:break-word;word-break:break-word;white-space:normal;overflow-wrap:break-word;min-width:0}.sd-guide__popup__list__item.sc-sd-guide::before{display:block;content:\"-\";width:6px;color:#333333;font-size:12px;font-weight:400;margin-left:10px;margin-right:12px;flex-shrink:0}.sd-guide__popup__list__item--depth-2.sc-sd-guide::before{content:\"•\"}.sd-guide__popup__list__item--depth-2.sc-sd-guide{padding-left:26px}";
|
|
4282
4313
|
|
|
4314
|
+
const GUIDE_LABEL = {
|
|
4315
|
+
help: '활용 TIP',
|
|
4316
|
+
pdf: 'PDF Guide',
|
|
4317
|
+
youtube: 'Video Guide',
|
|
4318
|
+
notion: '사용 가이드',
|
|
4319
|
+
event: 'Event Button',
|
|
4320
|
+
};
|
|
4321
|
+
const GUIDE_ICON = {
|
|
4322
|
+
help: {
|
|
4323
|
+
name: 'helpOutline',
|
|
4324
|
+
size: 20,
|
|
4325
|
+
color: colors$1.green_65,
|
|
4326
|
+
},
|
|
4327
|
+
pdf: { name: 'pdf', size: 20, color: colors$1.red_75 },
|
|
4328
|
+
youtube: { name: 'youtube', size: 20, color: colors$1.red_75 },
|
|
4329
|
+
notion: { name: 'notion', size: 16, color: colors$1.black },
|
|
4330
|
+
event: { name: 'event', size: 16, color: colors$1.brilliantblue_70 },
|
|
4331
|
+
};
|
|
4283
4332
|
class SdGuide {
|
|
4284
4333
|
constructor(hostRef) {
|
|
4285
4334
|
registerInstance(this, hostRef);
|
|
4286
4335
|
}
|
|
4287
4336
|
get el() { return getElement(this); }
|
|
4288
4337
|
type = 'help';
|
|
4289
|
-
|
|
4338
|
+
label = '';
|
|
4290
4339
|
message = '';
|
|
4291
4340
|
guideUrl = '';
|
|
4292
4341
|
popupWidth;
|
|
4293
4342
|
popupShow = false;
|
|
4294
4343
|
guideRef;
|
|
4295
|
-
static guideTitle = {
|
|
4296
|
-
help: '활용 Tip',
|
|
4297
|
-
pdf: 'PDF Guide',
|
|
4298
|
-
youtube: 'Video Guide',
|
|
4299
|
-
notion: '사용 가이드',
|
|
4300
|
-
event: 'Event Button',
|
|
4301
|
-
};
|
|
4302
4344
|
handleClickGuide = () => {
|
|
4303
4345
|
if (this.type === 'help') {
|
|
4304
4346
|
this.popupShow = !this.popupShow;
|
|
@@ -4308,58 +4350,59 @@ class SdGuide {
|
|
|
4308
4350
|
window.open(this.guideUrl, '_blank');
|
|
4309
4351
|
}
|
|
4310
4352
|
};
|
|
4311
|
-
|
|
4312
|
-
const classes = ['sd-guide'];
|
|
4313
|
-
classes.push(`sd-guide--${this.type}`);
|
|
4353
|
+
get guideClass() {
|
|
4354
|
+
const classes = ['sd-guide', `sd-guide--${this.type}`];
|
|
4314
4355
|
if (this.popupShow)
|
|
4315
4356
|
classes.push('sd-guide--active');
|
|
4316
4357
|
return classes.join(' ');
|
|
4317
4358
|
}
|
|
4318
|
-
getGuideStyle() {
|
|
4319
|
-
|
|
4320
|
-
|
|
4321
|
-
|
|
4322
|
-
|
|
4323
|
-
|
|
4324
|
-
|
|
4325
|
-
|
|
4326
|
-
|
|
4327
|
-
|
|
4328
|
-
|
|
4329
|
-
|
|
4330
|
-
|
|
4331
|
-
}
|
|
4332
|
-
|
|
4333
|
-
|
|
4334
|
-
|
|
4335
|
-
|
|
4336
|
-
|
|
4337
|
-
|
|
4338
|
-
|
|
4339
|
-
|
|
4340
|
-
|
|
4341
|
-
|
|
4342
|
-
|
|
4343
|
-
return { name: 'event', size: 16, color: colors$1.brilliantblue_70 };
|
|
4344
|
-
}
|
|
4345
|
-
return { name: 'helpOutline', size: 20, color: this.popupShow ? colors$1.white : colors$1.green_65 };
|
|
4346
|
-
}
|
|
4359
|
+
// private getGuideStyle(): StyleProps {
|
|
4360
|
+
// const styles: StyleProps = {};
|
|
4361
|
+
// if (this.type === 'help') {
|
|
4362
|
+
// styles['--guide-border'] = this.popupShow ? colors.green_65 : colors.grey_45;
|
|
4363
|
+
// styles['--guide-color'] = this.popupShow ? colors.white : colors.grey_90;
|
|
4364
|
+
// styles['--guide-background'] = this.popupShow ? colors.green_65 : colors.white;
|
|
4365
|
+
// } else {
|
|
4366
|
+
// styles['--guide-border'] = colors.grey_45;
|
|
4367
|
+
// styles['--guide-color'] = colors.grey_90;
|
|
4368
|
+
// styles['--guide-background'] = colors.white;
|
|
4369
|
+
// }
|
|
4370
|
+
// return styles;
|
|
4371
|
+
// }
|
|
4372
|
+
// private getGuidIcon(): { name: IconName; size: number; color: string } {
|
|
4373
|
+
// if (this.type === 'pdf') {
|
|
4374
|
+
// return { name: 'pdf', size: 20, color: colors.red_75 };
|
|
4375
|
+
// } else if (this.type === 'youtube') {
|
|
4376
|
+
// return { name: 'youtube', size: 20, color: colors.red_75 };
|
|
4377
|
+
// } else if (this.type === 'notion') {
|
|
4378
|
+
// return { name: 'notion', size: 16, color: colors.black };
|
|
4379
|
+
// } else if (this.type === 'event') {
|
|
4380
|
+
// return { name: 'event', size: 16, color: colors.brilliantblue_70 };
|
|
4381
|
+
// }
|
|
4382
|
+
// return { name: 'helpOutline', size: 20, color: this.popupShow ? colors.white : colors.green_65 };
|
|
4383
|
+
// }
|
|
4347
4384
|
closeDropdown = () => {
|
|
4348
4385
|
this.popupShow = false;
|
|
4349
4386
|
};
|
|
4350
4387
|
render() {
|
|
4351
|
-
const { name: iconName, size: iconSize, color: iconColor } = this.getGuidIcon();
|
|
4352
|
-
|
|
4353
|
-
|
|
4354
|
-
|
|
4355
|
-
|
|
4356
|
-
|
|
4357
|
-
|
|
4358
|
-
|
|
4359
|
-
|
|
4360
|
-
|
|
4361
|
-
|
|
4362
|
-
|
|
4388
|
+
// const { name: iconName, size: iconSize, color: iconColor } = this.getGuidIcon();
|
|
4389
|
+
const { name: iconName, size: iconSize, color: iconColor } = GUIDE_ICON[this.type];
|
|
4390
|
+
return (hAsync(Host, { key: '9f8b8af98d5bbcbde8544d0e8e337068e8e5778d' }, hAsync("sd-button", { key: '13cd8b97e2c017f5e31344cb9ded45015bfe8364', ref: el => (this.guideRef = el), class: this.guideClass, variant: "outline", label: GUIDE_LABEL[this.type], size: "sm", color: "grey_45", icon: iconName, iconColor: iconColor, iconSize: iconSize,
|
|
4391
|
+
// iconStyle={{ marginRight: '4px' }}
|
|
4392
|
+
// buttonStyle={{
|
|
4393
|
+
// height: '28px',
|
|
4394
|
+
// minHeight: '28px',
|
|
4395
|
+
// padding: '4px 12px',
|
|
4396
|
+
// borderRadius: '16px',
|
|
4397
|
+
// borderColor: 'var(--guide-border)',
|
|
4398
|
+
// color: 'var(--guide-color)',
|
|
4399
|
+
// fontSize: '12px',
|
|
4400
|
+
// fontWeight: '400',
|
|
4401
|
+
// backgroundColor: 'var(--guide-background)',
|
|
4402
|
+
// }}
|
|
4403
|
+
onSdClick: this.handleClickGuide }), this.type === 'help' && this.popupShow && (hAsync("sd-portal", { key: '5e199a2c2d5bc42fa87c651ef4d07fa0ab091558', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: '625d746fedfc57df447f754ae477d89058152ead', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, hAsync("sd-button", { key: 'ac0f7809af22910f677df3a3ec48dd370dac0f9e', class: "sd-guide__popup__close", icon: "close", color: colors$1.grey_65, size: "md", variant: "ghost", noHover: true,
|
|
4404
|
+
// buttonStyle={{ padding: '0px', minHeight: '0px' }}
|
|
4405
|
+
onSdClick: this.closeDropdown }), hAsync("div", { key: '747244da8b2cd0c6b59bdaa2bc7967017dcc1a6b', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: '7899329aed456415febc12184d7fb276eeb011fd', name: "helpOutline", size: 24, color: colors$1.green_65 }), hAsync("h3", { key: '9cbbe86aa294d9831e1f7a3a6a0aece5b74b6171', class: "sd-guide__popup__title" }, this.label || GUIDE_LABEL[this.type])), hAsync("ul", { key: '1a2cc3226c080db952adcf458511a5efec61e797', class: "sd-guide__popup__list" }, this.renderListItem(this.message)))))));
|
|
4363
4406
|
}
|
|
4364
4407
|
// 현재 2depth까지만 스타일 적용
|
|
4365
4408
|
renderListItem(message, depth = 0) {
|
|
@@ -4383,7 +4426,7 @@ class SdGuide {
|
|
|
4383
4426
|
"$tagName$": "sd-guide",
|
|
4384
4427
|
"$members$": {
|
|
4385
4428
|
"type": [1],
|
|
4386
|
-
"
|
|
4429
|
+
"label": [1],
|
|
4387
4430
|
"message": [1],
|
|
4388
4431
|
"guideUrl": [1, "guide-url"],
|
|
4389
4432
|
"popupWidth": [2, "popup-width"],
|
|
@@ -4560,6 +4603,17 @@ var HelpOutline = /*#__PURE__*/Object.freeze({
|
|
|
4560
4603
|
helpOutline: helpOutline
|
|
4561
4604
|
});
|
|
4562
4605
|
|
|
4606
|
+
const Minus12 = (props) => (hAsync("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, hAsync("g", { "clip-path": "url(#clip0_8697_41981)" }, hAsync("path", { d: "M1.40002 6H10.6", stroke: "currentColor", "stroke-linecap": "round" })), hAsync("defs", null, hAsync("clipPath", { id: "clip0_8697_41981" }, hAsync("rect", { width: "12", height: "12", fill: "white" })))));
|
|
4607
|
+
|
|
4608
|
+
const minus = {
|
|
4609
|
+
12: Minus12,
|
|
4610
|
+
};
|
|
4611
|
+
|
|
4612
|
+
var Minus = /*#__PURE__*/Object.freeze({
|
|
4613
|
+
__proto__: null,
|
|
4614
|
+
minus: minus
|
|
4615
|
+
});
|
|
4616
|
+
|
|
4563
4617
|
const PageMove12 = (props) => (hAsync("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, hAsync("path", { d: "M5.53955 0.899902C5.81566 0.899902 6.0395 1.1238 6.03955 1.3999C6.03955 1.67604 5.81569 1.8999 5.53955 1.8999H1.8999V10.1001H10.1001V6.45947C10.1004 6.1836 10.3242 5.95953 10.6001 5.95947C10.876 5.95958 11.0998 6.18363 11.1001 6.45947V10.1001C11.1 10.6522 10.6522 11.1 10.1001 11.1001H1.8999C1.34773 11.1 0.900008 10.6523 0.899902 10.1001V1.8999C0.899952 1.34769 1.34769 0.899956 1.8999 0.899902H5.53955ZM10.0005 1.50049C10.2764 1.50075 10.5005 1.72451 10.5005 2.00049V4.29248C10.5 4.56809 10.2761 4.79222 10.0005 4.79248C9.72462 4.79248 9.50093 4.56825 9.50049 4.29248V3.20752L4.854 7.854C4.6589 8.0491 4.34227 8.04878 4.14697 7.854C3.95171 7.65874 3.95171 7.34223 4.14697 7.14697L8.79346 2.50049H7.25049C6.97451 2.50049 6.75075 2.27641 6.75049 2.00049C6.75049 1.72435 6.97435 1.50049 7.25049 1.50049H10.0005Z", fill: "currentColor" })));
|
|
4564
4618
|
|
|
4565
4619
|
const pageMove = {
|
|
@@ -4667,6 +4721,7 @@ const Icons = {
|
|
|
4667
4721
|
...Date$1,
|
|
4668
4722
|
...Event,
|
|
4669
4723
|
...HelpOutline,
|
|
4724
|
+
...Minus,
|
|
4670
4725
|
...PageMove,
|
|
4671
4726
|
...Notion,
|
|
4672
4727
|
...Pdf,
|
|
@@ -4703,7 +4758,7 @@ class SdIcon {
|
|
|
4703
4758
|
}
|
|
4704
4759
|
render() {
|
|
4705
4760
|
const IconComponent = Icons[this.name]?.[this.size];
|
|
4706
|
-
return (hAsync("i", { key: '
|
|
4761
|
+
return (hAsync("i", { key: 'b727103f18fb77aeffa1e826154ca3cffbd9fd1b', class: this.getIconClasses(), style: this.iconStyle }, hAsync(IconComponent, { key: '1993b16afde46ce507ed442c20d24179cbd079c7', color: this.resolvedColor })));
|
|
4707
4762
|
}
|
|
4708
4763
|
static get style() { return sdIconCss; }
|
|
4709
4764
|
static get cmpMeta() { return {
|
|
@@ -4823,11 +4878,11 @@ class SdInput {
|
|
|
4823
4878
|
'--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,
|
|
4824
4879
|
}
|
|
4825
4880
|
: {};
|
|
4826
|
-
return (hAsync(Host, { key: '
|
|
4881
|
+
return (hAsync(Host, { key: '9a0b975f20b4b8bbc8bff2aef4ee9036450921d4', style: inputWidth }, this.label && hAsync("div", { key: 'ec6c840dcdaa7b9788c32ecbd03dc5daee74c748', class: "sd-input__label" }, this.label), hAsync("label", { key: '4c11c34fd26897b50e0cfbb569de476c9e06884c', class: {
|
|
4827
4882
|
'sd-input': true,
|
|
4828
4883
|
[this.getInputStatus()]: true,
|
|
4829
4884
|
'sd-input--barcode': !!this.barcode,
|
|
4830
|
-
}, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, hAsync("slot", { key: '
|
|
4885
|
+
}, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, hAsync("slot", { key: '0d7df02ed548b12f415bd72f84ea411fde5ef549', name: "prefix" }), hAsync("input", { key: '6203dcb95fd486d263e0fe33495243e95c332e1a', ref: el => (this.nativeEl = el), class: `sd-input__native_element ${this.inputClass}`, type: "text", value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onChange: this.handleChange, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event) }), hAsync("slot", { key: '21544173b390be5607c50faf84f1d47fa703e8bf', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-icon", { key: '39ed103b452ae49e2f492d8d0072ee42a842c4c0', name: "close", color: "#888", style: { marginRight: '-4px', marginLeft: '8px', cursor: 'pointer' }, onClick: () => {
|
|
4831
4886
|
this.internalValue = '';
|
|
4832
4887
|
this.sdChange?.emit(this.internalValue);
|
|
4833
4888
|
this.sdInput?.emit(this.internalValue);
|
|
@@ -4947,12 +5002,12 @@ class SdPagination {
|
|
|
4947
5002
|
}
|
|
4948
5003
|
}
|
|
4949
5004
|
render() {
|
|
4950
|
-
return (hAsync("div", { key: '
|
|
5005
|
+
return (hAsync("div", { key: 'ae962ed1dfbcb79c23c402d52d0a83822b54d4b3', class: this.paginationClasses }, hAsync("div", { key: 'efa0dfbcc8d71d2b9ff5b02334a3d1e119a7f469', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (hAsync("div", { class: "pagination-info" }, hAsync("span", { class: "current-page" }, this.currentPage), hAsync("span", null, "/"), hAsync("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (hAsync("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
|
|
4951
5006
|
'pagination-btn': true,
|
|
4952
5007
|
'pagination-btn--selected': this.currentPage === n,
|
|
4953
5008
|
}, disabled: this.currentPage === n, style: {
|
|
4954
5009
|
'--pagination-btn-width': `${this.buttonWidth}px`,
|
|
4955
|
-
}, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: '
|
|
5010
|
+
}, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: 'f0bd3b291453696e22a34f182a852a2a092874f2', class: "append-btns" }, this.renderNextButtons())));
|
|
4956
5011
|
}
|
|
4957
5012
|
static get watchers() { return {
|
|
4958
5013
|
"currentPage": ["onPropChange"],
|
|
@@ -5011,11 +5066,11 @@ class SdPopover {
|
|
|
5011
5066
|
this.showPopover = false;
|
|
5012
5067
|
};
|
|
5013
5068
|
render() {
|
|
5014
|
-
return (hAsync(Fragment, { key: '
|
|
5069
|
+
return (hAsync(Fragment, { key: 'fb877e8d016d13fb33b49a1a4dbfed9fc01b1336' }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })), this.showPopover && (hAsync("sd-tooltip-portal", { key: '02208721da61cb84086a57c823f8e31775fdbd5e', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, hAsync("div", { key: '3f3c4fc690dac5061bda08af37121e2b98374979', class: {
|
|
5015
5070
|
'sd-popover-menu': true,
|
|
5016
5071
|
[`sd-popover-menu--${this.placement}`]: true,
|
|
5017
5072
|
[this.menuClass]: !!this.menuClass,
|
|
5018
|
-
} }, hAsync("i", { key: '
|
|
5073
|
+
} }, hAsync("i", { key: '6f0df95bafc2cbf564fd0e5a133c89f03c3a924b', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '535acee0be86db4ed58d6cc1631732541f1e475e' })), hAsync("div", { key: 'd4366800a8cbd5a1f9630344a5ca4241b0eaa8dd', class: "sd-popover-menu__content" }, this.menuTitle && hAsync("div", { key: '1cd9de3129988c5d26be0ded5b03520ab591cb9a', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: '5aae57948bd5e0fd98e73a8ae504b77ce6cdbe07', class: "sd-popover-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: '814ac9ba0b2cf4367bb4cd5e688fa5433fee7126', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("button", { key: 'a21ad0a5e28f8609b2f9d9accd0be5d81ed9de5b', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, hAsync("sd-icon", { key: '10738ec0926ea5fbc0b30b5c8c08b6cc37bf47d3', name: "close", size: "12", color: "#AAAAAA" }))))))));
|
|
5019
5074
|
}
|
|
5020
5075
|
static get watchers() { return {
|
|
5021
5076
|
"show": ["watchShowHandler"]
|
|
@@ -5145,7 +5200,7 @@ class SdPortal {
|
|
|
5145
5200
|
this.sdClose.emit();
|
|
5146
5201
|
}
|
|
5147
5202
|
render() {
|
|
5148
|
-
return hAsync("slot", { key: '
|
|
5203
|
+
return hAsync("slot", { key: '00e0fc50bd1da8ae4f43b61ddcc37614a4738dde' });
|
|
5149
5204
|
}
|
|
5150
5205
|
static get cmpMeta() { return {
|
|
5151
5206
|
"$flags$": 772,
|
|
@@ -5275,7 +5330,7 @@ class SelectKeyboardNavigation {
|
|
|
5275
5330
|
}
|
|
5276
5331
|
}
|
|
5277
5332
|
|
|
5278
|
-
const sdSelectCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\");}:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}.sd-select__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select__dropdown::-webkit-scrollbar-thumb:hover{background:#e5e5e5}.sd-select__dropdown::-webkit-scrollbar-thumb:active{background:#e5e5e5}.sd-select__dropdown::-webkit-scrollbar-track{background-color:transparent}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow svg{width:100%;height:100%}.sd-popover-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content{font-size:12px;line-height:20px}.sd-popover-menu__content .sd-popover-menu__title{font-weight:700;margin-bottom:4px}.sd-popover-menu__content .sd-popover-menu__messages{font-weight:500}.sd-popover-menu__content .sd-popover-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content .sd-popover-menu__buttons--1{justify-content:flex-end}.sd-popover-menu__content .sd-popover-menu__buttons--2{justify-content:space-between}.sd-popover-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}.sd-select{display:flex;width:var(--select-width, 200px);height:28px;position:relative;color:#333333;cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white}.sd-select:hover:not(.sd-select--disabled){background:#f6f6f6}.sd-select.sd-select--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}.sd-select.sd-select--disabled .sd-select__label{border-right:1px solid #cccccc}.sd-select.sd-select--disabled .sd-select__trigger{color:#888888}.sd-select.sd-select--disabled .sd-select__trigger:focus,.sd-select.sd-select--disabled .sd-select__trigger:focus-visible,.sd-select.sd-select--disabled .sd-select__trigger:focus-within{outline:none !important}.sd-select__label{font-size:12px;line-height:20px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6;display:inline-block;white-space:nowrap}.sd-select__container{position:relative;width:100%;display:flex}.sd-select__container .sd-select__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}.sd-select__container .sd-select__trigger .sd-select__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400;text-align:left}.sd-select__container .sd-select__trigger .sd-select__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}.sd-select__container .sd-select__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}.sd-select__container .sd-select__arrow--open{transform:rotate(180deg)}.sd-select__dropdown{width:var(--select-dropdown-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333}.sd-select__dropdown .sd-select__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select__dropdown .sd-select__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select__dropdown .sd-select__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px;text-align:left}";
|
|
5333
|
+
const sdSelectCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\");}:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}.sd-select__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select__dropdown::-webkit-scrollbar-thumb:hover{background:#e5e5e5}.sd-select__dropdown::-webkit-scrollbar-thumb:active{background:#e5e5e5}.sd-select__dropdown::-webkit-scrollbar-track{background-color:transparent}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow svg{width:100%;height:100%}.sd-popover-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content{font-size:12px;line-height:20px}.sd-popover-menu__content .sd-popover-menu__title{font-weight:700;margin-bottom:4px}.sd-popover-menu__content .sd-popover-menu__messages{font-weight:500}.sd-popover-menu__content .sd-popover-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content .sd-popover-menu__buttons--1{justify-content:flex-end}.sd-popover-menu__content .sd-popover-menu__buttons--2{justify-content:space-between}.sd-popover-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}.sd-select{display:flex;width:var(--select-width, 200px);height:28px;position:relative;color:#333333;cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white}.sd-select:hover:not(.sd-select--disabled){background:#f6f6f6}.sd-select.sd-select--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}.sd-select.sd-select--disabled .sd-select__label{border-right:1px solid #cccccc}.sd-select.sd-select--disabled .sd-select__trigger{color:#888888}.sd-select.sd-select--disabled .sd-select__trigger:focus,.sd-select.sd-select--disabled .sd-select__trigger:focus-visible,.sd-select.sd-select--disabled .sd-select__trigger:focus-within{outline:none !important}.sd-select__label{font-size:12px;line-height:20px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6;display:inline-block;white-space:nowrap}.sd-select__container{position:relative;width:100%;display:flex}.sd-select__container .sd-select__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}.sd-select__container .sd-select__trigger .sd-select__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400;text-align:left}.sd-select__container .sd-select__trigger .sd-select__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}.sd-select__container .sd-select__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}.sd-select__container .sd-select__arrow--open{transform:rotate(180deg)}.sd-select__dropdown{width:var(--select-dropdown-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333;display:flex;flex-direction:column nowrap}.sd-select__dropdown .sd-select__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select__dropdown .sd-select__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select__dropdown .sd-select__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px;text-align:left}";
|
|
5279
5334
|
|
|
5280
5335
|
class SdSelect extends BaseDropdownEvent {
|
|
5281
5336
|
constructor(hostRef) {
|
|
@@ -5296,12 +5351,6 @@ class SdSelect extends BaseDropdownEvent {
|
|
|
5296
5351
|
disabled = false;
|
|
5297
5352
|
clearable = false;
|
|
5298
5353
|
searchable = false;
|
|
5299
|
-
// props - custom styles
|
|
5300
|
-
containerStyle = {};
|
|
5301
|
-
triggerStyle = {};
|
|
5302
|
-
dropdownStyle = {};
|
|
5303
|
-
optionStyle = {};
|
|
5304
|
-
labelStyle = {};
|
|
5305
5354
|
// props - custom slots
|
|
5306
5355
|
optionRenderer;
|
|
5307
5356
|
// states
|
|
@@ -5435,9 +5484,6 @@ class SdSelect extends BaseDropdownEvent {
|
|
|
5435
5484
|
this.isOpen = false;
|
|
5436
5485
|
}
|
|
5437
5486
|
};
|
|
5438
|
-
handleDropdownOpen = (element) => {
|
|
5439
|
-
this.dropdownRef = element;
|
|
5440
|
-
};
|
|
5441
5487
|
filterOptions() {
|
|
5442
5488
|
if (!this.searchText || this.searchText.trim() === '') {
|
|
5443
5489
|
// 검색어가 없으면 전체 옵션 표시
|
|
@@ -5488,20 +5534,20 @@ class SdSelect extends BaseDropdownEvent {
|
|
|
5488
5534
|
'--select-width': this.width || '200px',
|
|
5489
5535
|
'--select-dropdown-height': this.dropdownHeight || '260px',
|
|
5490
5536
|
};
|
|
5491
|
-
return (hAsync(Host, { key: '
|
|
5537
|
+
return (hAsync(Host, { key: 'cf8f4ce07f7ee5fc9706bdcd0d34c5211113f21e', style: style }, hAsync("div", { key: 'b2cc0ad9e72668d33255c4e7277fabfd121e8b72', class: {
|
|
5492
5538
|
'sd-select': true,
|
|
5493
5539
|
'sd-select--open': this.isOpen,
|
|
5494
5540
|
'sd-select--disabled': this.disabled,
|
|
5495
|
-
},
|
|
5541
|
+
}, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), hAsync("div", { key: '1be74d029ebbc24eecc6cbd2d2f236715282f350', class: "sd-select__container" }, this.renderTrigger(), this.renderDropdown()))));
|
|
5496
5542
|
}
|
|
5497
|
-
renderLabel(label
|
|
5543
|
+
renderLabel(label) {
|
|
5498
5544
|
if (!label)
|
|
5499
5545
|
return null;
|
|
5500
|
-
return
|
|
5546
|
+
return hAsync("label", { class: "sd-select__label" }, label);
|
|
5501
5547
|
}
|
|
5502
5548
|
renderTrigger() {
|
|
5503
5549
|
const selectedOption = this.getSelectedOption();
|
|
5504
|
-
return (hAsync("div", { class: "sd-select__trigger", tabindex: this.disabled ? -1 : 0, onClick: this.handleTriggerClick
|
|
5550
|
+
return (hAsync("div", { class: "sd-select__trigger", tabindex: this.disabled ? -1 : 0, onClick: this.handleTriggerClick }, hAsync("span", { class: "sd-select__value" }, selectedOption ? selectedOption.label : this.placeholder), this.clearable && selectedOption && !this.disabled && (hAsync("sd-icon", { key: "clear-icon", name: "close", size: 10, color: "#888", class: "sd-select__clear", onClick: event => {
|
|
5505
5551
|
event.stopPropagation();
|
|
5506
5552
|
this.value = null;
|
|
5507
5553
|
} })), hAsync("sd-icon", { key: "arrow-icon", name: "arrowDown", color: "#888", class: { 'sd-select__arrow': true, 'sd-select__arrow--open': this.isOpen } })));
|
|
@@ -5509,14 +5555,14 @@ class SdSelect extends BaseDropdownEvent {
|
|
|
5509
5555
|
renderDropdown() {
|
|
5510
5556
|
if (this.isOpen === false)
|
|
5511
5557
|
return null;
|
|
5512
|
-
return (hAsync("sd-portal", { open: this.isOpen, parentRef: this.selectRef, onSdClose: this.closeDropdown }, hAsync("div", { class: "sd-select__dropdown",
|
|
5558
|
+
return (hAsync("sd-portal", { open: this.isOpen, parentRef: this.selectRef, onSdClose: this.closeDropdown }, hAsync("div", { class: "sd-select__dropdown", onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (hAsync("div", { class: {
|
|
5513
5559
|
'sd-select__search-container': true,
|
|
5514
5560
|
'sd-select__search-container--scrolled': this.isScrolled,
|
|
5515
5561
|
}, onClick: event => event.stopPropagation() }, hAsync("sd-input", { ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdInput: event => {
|
|
5516
5562
|
this.searchText = String(event?.detail);
|
|
5517
5563
|
}, onSdFocus: () => {
|
|
5518
5564
|
this.itemIndex = -1;
|
|
5519
|
-
} }, hAsync("sd-icon", { name: "search", size: 16, color: "#737373", style: { marginRight: '4px' }, slot: "prefix" })))), this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index) => (hAsync("slot", { name: `option-${option.value}` }, hAsync("sd-select-option", { option: option, index: index, isSelected: option.value === this.value, isFocused: index === this.itemIndex,
|
|
5565
|
+
} }, hAsync("sd-icon", { name: "search", size: 16, color: "#737373", style: { marginRight: '4px' }, slot: "prefix" })))), this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index) => (hAsync("slot", { name: `option-${option.value}` }, hAsync("sd-select-option", { option: option, index: index, isSelected: option.value === this.value, isFocused: index === this.itemIndex, onOptionClick: ({ detail }) => this.handleOptionClick(detail) }))))) : (hAsync("slot", { name: "option-placeholder" }, hAsync("div", { class: 'sd-select__option-placeholder' }, this.optionPlaceholder))))));
|
|
5520
5566
|
}
|
|
5521
5567
|
static get watchers() { return {
|
|
5522
5568
|
"value": ["valueChanged"],
|
|
@@ -5540,11 +5586,6 @@ class SdSelect extends BaseDropdownEvent {
|
|
|
5540
5586
|
"disabled": [4],
|
|
5541
5587
|
"clearable": [4],
|
|
5542
5588
|
"searchable": [4],
|
|
5543
|
-
"containerStyle": [16],
|
|
5544
|
-
"triggerStyle": [16],
|
|
5545
|
-
"dropdownStyle": [16],
|
|
5546
|
-
"optionStyle": [16],
|
|
5547
|
-
"labelStyle": [16],
|
|
5548
5589
|
"optionRenderer": [16],
|
|
5549
5590
|
"filteredOptions": [32],
|
|
5550
5591
|
"isOpen": [32],
|
|
@@ -5558,56 +5599,762 @@ class SdSelect extends BaseDropdownEvent {
|
|
|
5558
5599
|
}; }
|
|
5559
5600
|
}
|
|
5560
5601
|
|
|
5561
|
-
const sdSelectOptionCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\");}:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow svg{width:100%;height:100%}.sd-popover-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content{font-size:12px;line-height:20px}.sd-popover-menu__content .sd-popover-menu__title{font-weight:700;margin-bottom:4px}.sd-popover-menu__content .sd-popover-menu__messages{font-weight:500}.sd-popover-menu__content .sd-popover-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content .sd-popover-menu__buttons--1{justify-content:flex-end}.sd-popover-menu__content .sd-popover-menu__buttons--2{justify-content:space-between}.sd-popover-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}.sd-select__option{display:flex;padding:4px 12px;font-size:12px;line-height:20px}.sd-select__option__checkbox-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sd-select__option--focused{background-color:#e6f1ff}.sd-select__option--selected:not(:hover):not(.sd-select__option--use-checkbox),.sd-select__option--focused:not(:hover):not(.sd-select__option--use-checkbox){color:#0075ff;font-weight:700}.sd-select__option--disabled{color:#aaaaaa;cursor:not-allowed}.sd-select__option:hover:not(.sd-select__option--disabled){background-color:#0075ff;color:white}";
|
|
5602
|
+
const sdSelectMultipleCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\");}:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}.sd-select-multiple__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select-multiple__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select-multiple__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select-multiple__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select-multiple__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select-multiple__dropdown::-webkit-scrollbar-thumb:hover{background:#e5e5e5}.sd-select-multiple__dropdown::-webkit-scrollbar-thumb:active{background:#e5e5e5}.sd-select-multiple__dropdown::-webkit-scrollbar-track{background-color:transparent}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow svg{width:100%;height:100%}.sd-popover-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content{font-size:12px;line-height:20px}.sd-popover-menu__content .sd-popover-menu__title{font-weight:700;margin-bottom:4px}.sd-popover-menu__content .sd-popover-menu__messages{font-weight:500}.sd-popover-menu__content .sd-popover-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content .sd-popover-menu__buttons--1{justify-content:flex-end}.sd-popover-menu__content .sd-popover-menu__buttons--2{justify-content:space-between}.sd-popover-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}:host{display:inline-block;height:fit-content;position:relative}.sd-select-multiple{display:flex;flex-wrap:nowrap;width:var(--select-width, 200px);height:28px;cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white}.sd-select-multiple:hover:not(.sd-select-multiple--disabled){background:#f6f6f6}.sd-select-multiple.sd-select-multiple--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__label{border-right:1px solid #cccccc}.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger{color:#888888}.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger:focus,.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger:focus-visible,.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger:focus-within{outline:none !important}.sd-select-multiple__label{font-size:12px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6}.sd-select-multiple__container{position:relative;width:100%;display:flex}.sd-select-multiple__container .sd-select-multiple__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}.sd-select-multiple__container .sd-select-multiple__trigger .sd-select-multiple__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400}.sd-select-multiple__container .sd-select-multiple__trigger .sd-select-multiple__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}.sd-select-multiple__container .sd-select-multiple__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}.sd-select-multiple__container .sd-select-multiple__arrow--open{transform:rotate(180deg)}.sd-select-multiple__dropdown{width:var(--select-dropdown-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333}.sd-select-multiple__dropdown .sd-select-multiple__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px;z-index:1}.sd-select-multiple__dropdown .sd-select-multiple__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select-multiple__dropdown .sd-select-multiple__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px;text-align:left}";
|
|
5562
5603
|
|
|
5563
|
-
class
|
|
5604
|
+
class SdSelectMultiple extends BaseDropdownEvent {
|
|
5564
5605
|
constructor(hostRef) {
|
|
5606
|
+
super();
|
|
5565
5607
|
registerInstance(this, hostRef);
|
|
5566
|
-
this.
|
|
5608
|
+
this.sdChange = createEvent(this, "sdChange");
|
|
5609
|
+
this.dropDownShow = createEvent(this, "dropDownShow");
|
|
5567
5610
|
}
|
|
5568
5611
|
get el() { return getElement(this); }
|
|
5569
|
-
|
|
5570
|
-
|
|
5571
|
-
|
|
5572
|
-
|
|
5573
|
-
|
|
5612
|
+
// props
|
|
5613
|
+
value = null;
|
|
5614
|
+
label = '';
|
|
5615
|
+
options = [];
|
|
5616
|
+
placeholder = '선택';
|
|
5617
|
+
optionPlaceholder = '옵션이 없습니다.';
|
|
5618
|
+
width = '200px';
|
|
5619
|
+
dropdownHeight = '260px';
|
|
5574
5620
|
disabled = false;
|
|
5621
|
+
clearable = false;
|
|
5622
|
+
searchable = false;
|
|
5575
5623
|
useCheckbox = false;
|
|
5576
|
-
|
|
5577
|
-
|
|
5578
|
-
|
|
5624
|
+
// props - custom slots
|
|
5625
|
+
optionRenderer;
|
|
5626
|
+
// states
|
|
5627
|
+
filteredOptions = this.options;
|
|
5628
|
+
isOpen = false;
|
|
5629
|
+
searchText = null;
|
|
5630
|
+
itemIndex = -1;
|
|
5631
|
+
isScrolled = false;
|
|
5632
|
+
// events
|
|
5633
|
+
sdChange;
|
|
5634
|
+
dropDownShow;
|
|
5635
|
+
selectRef;
|
|
5636
|
+
searchRef;
|
|
5637
|
+
optionRef;
|
|
5638
|
+
dropdownRef;
|
|
5639
|
+
valueChanged() {
|
|
5640
|
+
this.sdChange?.emit(this.value);
|
|
5579
5641
|
}
|
|
5580
|
-
|
|
5581
|
-
|
|
5642
|
+
optionsChanged() {
|
|
5643
|
+
this.filteredOptions = this.options;
|
|
5644
|
+
this.filterOptions();
|
|
5645
|
+
}
|
|
5646
|
+
searchTextChanged() {
|
|
5647
|
+
this.filterOptions();
|
|
5648
|
+
}
|
|
5649
|
+
async itemIndexChanged(newIndex, oldIndex) {
|
|
5650
|
+
if (this.searchable) {
|
|
5651
|
+
const searchInput = await this.getNativeInputElement();
|
|
5652
|
+
if (this.itemIndex === -1) {
|
|
5653
|
+
searchInput?.focus();
|
|
5654
|
+
return;
|
|
5655
|
+
}
|
|
5656
|
+
else if (searchInput?.matches(':focus')) {
|
|
5657
|
+
searchInput?.blur();
|
|
5658
|
+
}
|
|
5659
|
+
}
|
|
5660
|
+
const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple__dropdown sd-select-option') || []);
|
|
5661
|
+
const currentItem = optionElements?.[this.itemIndex];
|
|
5662
|
+
if (!currentItem || !this.isOpen)
|
|
5663
|
+
return;
|
|
5664
|
+
this.optionRef = currentItem;
|
|
5665
|
+
const isOptionDisabled = await this.optionRef.isDisabled();
|
|
5666
|
+
if (isOptionDisabled) {
|
|
5667
|
+
newIndex > oldIndex ? this.itemIndex++ : this.itemIndex--;
|
|
5668
|
+
return;
|
|
5669
|
+
}
|
|
5670
|
+
this.scrollToOption(currentItem);
|
|
5671
|
+
}
|
|
5672
|
+
async isOpenChanged() {
|
|
5673
|
+
// Base class의 이벤트 관리 호출 - 다른 select와의 이벤트 충돌 방지
|
|
5674
|
+
this.onDropdownToggle(this.isOpen);
|
|
5675
|
+
const selectedOption = this.getSelectedOption();
|
|
5676
|
+
if (!selectedOption) {
|
|
5677
|
+
this.itemIndex = -1;
|
|
5678
|
+
}
|
|
5679
|
+
else {
|
|
5680
|
+
this.itemIndex = this.options.indexOf(selectedOption[0]);
|
|
5681
|
+
}
|
|
5682
|
+
this.dropDownShow?.emit({ isOpen: this.isOpen });
|
|
5683
|
+
if (this.isOpen === false)
|
|
5684
|
+
return;
|
|
5685
|
+
await new Promise(resolve => setTimeout(resolve, 10));
|
|
5686
|
+
const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple__dropdown sd-select-item') || []);
|
|
5687
|
+
const currentItem = optionElements?.[this.itemIndex];
|
|
5688
|
+
// 드롭다운이 열릴 때 검색 입력에 포커스
|
|
5689
|
+
if (this.searchable) {
|
|
5690
|
+
const searchInput = await this.getNativeInputElement();
|
|
5691
|
+
searchInput?.focus();
|
|
5692
|
+
}
|
|
5693
|
+
if (!currentItem)
|
|
5694
|
+
return;
|
|
5695
|
+
await new Promise(resolve => setTimeout(resolve, 10)); // 추가 딜레이
|
|
5696
|
+
this.scrollToOption(currentItem);
|
|
5697
|
+
}
|
|
5698
|
+
connectedCallback() {
|
|
5699
|
+
// props가 모두 설정된 후에 실행되므로 올바른 options 값을 가져올 수 있음
|
|
5700
|
+
this.filteredOptions = this.options;
|
|
5701
|
+
this.initializeEvent(); // global dropdown Manager에 등록 + 이벤트 핸들러 초기화
|
|
5702
|
+
}
|
|
5703
|
+
disconnectedCallback() {
|
|
5704
|
+
this.cleanupEvent(); // global dropdown Manager에서 제거 + 이벤트 정리
|
|
5705
|
+
}
|
|
5706
|
+
handleDocumentClick(event) {
|
|
5707
|
+
if (!this.selectRef?.contains(event.target)) {
|
|
5708
|
+
this.isOpen = false;
|
|
5709
|
+
}
|
|
5710
|
+
}
|
|
5711
|
+
handleDocumentKeydown(keyboardEvent) {
|
|
5712
|
+
keyboardEvent.stopPropagation();
|
|
5713
|
+
const targetKey = ['ArrowDown', 'ArrowUp', 'Enter', 'Escape'];
|
|
5714
|
+
if (!targetKey.includes(keyboardEvent.key))
|
|
5715
|
+
return;
|
|
5716
|
+
keyboardEvent.preventDefault();
|
|
5717
|
+
switch (keyboardEvent.key) {
|
|
5718
|
+
case 'ArrowDown':
|
|
5719
|
+
case 'ArrowUp':
|
|
5720
|
+
const keyboardNavigation = new SelectKeyboardNavigation(this.searchable, this.filteredOptions);
|
|
5721
|
+
const nextIndex = keyboardNavigation.getNextIndex(this.itemIndex, keyboardEvent.key);
|
|
5722
|
+
this.itemIndex = nextIndex;
|
|
5723
|
+
break;
|
|
5724
|
+
case 'Enter':
|
|
5725
|
+
const selectedOption = this.filteredOptions[this.itemIndex];
|
|
5726
|
+
if (selectedOption && !selectedOption.disabled) {
|
|
5727
|
+
this.handleOptionSelection(selectedOption);
|
|
5728
|
+
}
|
|
5729
|
+
break;
|
|
5730
|
+
case 'Escape':
|
|
5731
|
+
this.isOpen = false;
|
|
5732
|
+
break;
|
|
5733
|
+
}
|
|
5734
|
+
}
|
|
5735
|
+
// event handlers
|
|
5736
|
+
handleTriggerClick = (event) => {
|
|
5582
5737
|
event.stopPropagation();
|
|
5583
|
-
if (!this.
|
|
5584
|
-
this.
|
|
5585
|
-
|
|
5586
|
-
index: this.index,
|
|
5587
|
-
event,
|
|
5588
|
-
});
|
|
5738
|
+
if (!this.disabled) {
|
|
5739
|
+
this.isOpen = !this.isOpen;
|
|
5740
|
+
this.dropDownShow?.emit({ isOpen: this.isOpen });
|
|
5589
5741
|
}
|
|
5590
5742
|
};
|
|
5591
|
-
|
|
5592
|
-
|
|
5593
|
-
|
|
5594
|
-
|
|
5595
|
-
|
|
5596
|
-
|
|
5597
|
-
|
|
5598
|
-
|
|
5599
|
-
|
|
5600
|
-
|
|
5601
|
-
|
|
5602
|
-
|
|
5603
|
-
|
|
5604
|
-
|
|
5605
|
-
} }), hAsync("span", { class: "sd-select__option-label" }, this.option.label))) : (this.option.label)));
|
|
5743
|
+
handleOptionClick = (detail) => {
|
|
5744
|
+
const { option, event } = detail;
|
|
5745
|
+
event.stopPropagation();
|
|
5746
|
+
this.handleOptionSelection(option);
|
|
5747
|
+
};
|
|
5748
|
+
filterOptions() {
|
|
5749
|
+
if (!this.searchText || this.searchText.trim() === '') {
|
|
5750
|
+
// 검색어가 없으면 전체 옵션 표시
|
|
5751
|
+
this.filteredOptions = this.options;
|
|
5752
|
+
}
|
|
5753
|
+
else {
|
|
5754
|
+
// 검색어가 있으면 필터링
|
|
5755
|
+
this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(this.searchText.toLowerCase()));
|
|
5756
|
+
}
|
|
5606
5757
|
}
|
|
5607
|
-
|
|
5608
|
-
|
|
5609
|
-
|
|
5610
|
-
|
|
5758
|
+
getSelectedOption() {
|
|
5759
|
+
return this.options.filter(option => this.value?.includes(option));
|
|
5760
|
+
}
|
|
5761
|
+
handleDropdownScroll = (event) => {
|
|
5762
|
+
const target = event.target;
|
|
5763
|
+
const scrollTop = target.scrollTop;
|
|
5764
|
+
// 스크롤이 조금이라도 되면 그림자 표시
|
|
5765
|
+
this.isScrolled = scrollTop > 0;
|
|
5766
|
+
};
|
|
5767
|
+
async getNativeInputElement() {
|
|
5768
|
+
if (this.searchRef) {
|
|
5769
|
+
return this.searchRef.getNativeElement();
|
|
5770
|
+
}
|
|
5771
|
+
return null;
|
|
5772
|
+
}
|
|
5773
|
+
handleOptionSelection = (option) => {
|
|
5774
|
+
if (!option || option.disabled)
|
|
5775
|
+
return;
|
|
5776
|
+
const isAlreadySelected = this.value?.some(opt => opt.value === option.value);
|
|
5777
|
+
if (isAlreadySelected) {
|
|
5778
|
+
// 이미 선택된 옵션인 경우, 선택 해제
|
|
5779
|
+
this.value = this.value?.filter(opt => opt.value !== option.value) || null;
|
|
5780
|
+
}
|
|
5781
|
+
else {
|
|
5782
|
+
// 새로운 옵션 선택
|
|
5783
|
+
this.value = [...(this.value || []), option];
|
|
5784
|
+
}
|
|
5785
|
+
};
|
|
5786
|
+
closeDropdown() {
|
|
5787
|
+
this.isOpen = false;
|
|
5788
|
+
}
|
|
5789
|
+
scrollToOption(optionElement) {
|
|
5790
|
+
if (!this.dropdownRef || !optionElement)
|
|
5791
|
+
return;
|
|
5792
|
+
const dropdown = this.dropdownRef;
|
|
5793
|
+
const optionTop = optionElement.offsetTop;
|
|
5794
|
+
const optionHeight = optionElement.offsetHeight;
|
|
5795
|
+
const dropdownScrollTop = dropdown.scrollTop;
|
|
5796
|
+
const dropdownHeight = dropdown.clientHeight;
|
|
5797
|
+
const searchContainer = dropdown.querySelector('.sd-select__search-container');
|
|
5798
|
+
const searchOffset = searchContainer ? searchContainer.offsetHeight : 0;
|
|
5799
|
+
const visibleTop = dropdownScrollTop + searchOffset;
|
|
5800
|
+
const visibleBottom = dropdownScrollTop + dropdownHeight;
|
|
5801
|
+
if (optionTop < visibleTop) {
|
|
5802
|
+
dropdown.scrollTop = optionTop - searchOffset;
|
|
5803
|
+
}
|
|
5804
|
+
else if (optionTop + optionHeight > visibleBottom) {
|
|
5805
|
+
dropdown.scrollTop = optionTop + optionHeight - dropdownHeight + searchOffset;
|
|
5806
|
+
}
|
|
5807
|
+
}
|
|
5808
|
+
// render method
|
|
5809
|
+
render() {
|
|
5810
|
+
const style = {
|
|
5811
|
+
'--select-width': this.width || '200px',
|
|
5812
|
+
'--select-dropdown-height': this.dropdownHeight || '260px',
|
|
5813
|
+
};
|
|
5814
|
+
return (hAsync(Host, { key: '8a237d4dc7f743a7685b440cd654d51629765a20', style: style }, hAsync("div", { key: 'c1240092508fbb9e9b638803171847b174da9062', class: {
|
|
5815
|
+
'sd-select-multiple': true,
|
|
5816
|
+
'sd-select-multiple--open': this.isOpen,
|
|
5817
|
+
'sd-select-multiple--disabled': this.disabled,
|
|
5818
|
+
}, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), hAsync("div", { key: 'b99913866f316d7eacffd9e0e71fd58baac05c34', class: "sd-select-multiple__container" }, this.renderTrigger(), this.renderDropdown()))));
|
|
5819
|
+
}
|
|
5820
|
+
renderLabel(label) {
|
|
5821
|
+
if (!label)
|
|
5822
|
+
return null;
|
|
5823
|
+
return hAsync("label", { class: "sd-select-multiple__label" }, label);
|
|
5824
|
+
}
|
|
5825
|
+
renderTrigger() {
|
|
5826
|
+
const selectedOption = this.getSelectedOption();
|
|
5827
|
+
return (hAsync("div", { class: "sd-select-multiple__trigger", tabindex: this.disabled ? -1 : 0, onClick: this.handleTriggerClick }, hAsync("span", { class: "sd-select-multiple__value" }, !selectedOption
|
|
5828
|
+
? '선택'
|
|
5829
|
+
: selectedOption.length
|
|
5830
|
+
? selectedOption.map(option => option.label).join(', ')
|
|
5831
|
+
: this.placeholder), this.clearable && selectedOption?.length > 0 && !this.disabled && (hAsync("sd-icon", { key: "close-icon", name: "close", size: 10, color: "#888", class: "sd-select-multiple__clear", onClick: event => {
|
|
5832
|
+
event.stopPropagation();
|
|
5833
|
+
this.value = null;
|
|
5834
|
+
} })), hAsync("sd-icon", { key: "arrow-icon", name: "arrowDown", color: "#888", class: { 'sd-select-multiple__arrow': true, 'sd-select-multiple__arrow--open': this.isOpen } })));
|
|
5835
|
+
}
|
|
5836
|
+
renderDropdown() {
|
|
5837
|
+
if (this.isOpen === false)
|
|
5838
|
+
return null;
|
|
5839
|
+
return (hAsync("sd-portal", { open: this.isOpen, parentRef: this.selectRef, onSdClose: this.closeDropdown }, hAsync("div", { class: "sd-select-multiple__dropdown", onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (hAsync("div", { class: {
|
|
5840
|
+
'sd-select-multiple__search-container': true,
|
|
5841
|
+
'sd-select-multiple__search-container--scrolled': this.isScrolled,
|
|
5842
|
+
}, onClick: event => event.stopPropagation() }, hAsync("sd-input", { ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdInput: event => {
|
|
5843
|
+
this.searchText = String(event?.detail);
|
|
5844
|
+
}, onSdFocus: () => {
|
|
5845
|
+
this.itemIndex = -1;
|
|
5846
|
+
} }, hAsync("sd-icon", { name: "search", size: 16, color: "#737373", style: { marginRight: '4px' }, slot: "prefix" })))), this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index) => (hAsync("slot", { name: `option-${option.value}` }, hAsync("sd-select-option", { option: option, index: index, isSelected: this.value?.some(selected => selected.value === option.value), isFocused: index === this.itemIndex, onOptionClick: ({ detail }) => this.handleOptionClick(detail), useCheckbox: this.useCheckbox }))))) : (hAsync("slot", { name: "option-placeholder" }, hAsync("div", { class: 'sd-select-multiple__option-placeholder' }, this.optionPlaceholder))))));
|
|
5847
|
+
}
|
|
5848
|
+
static get watchers() { return {
|
|
5849
|
+
"value": ["valueChanged"],
|
|
5850
|
+
"options": ["optionsChanged"],
|
|
5851
|
+
"searchText": ["searchTextChanged"],
|
|
5852
|
+
"itemIndex": ["itemIndexChanged"],
|
|
5853
|
+
"isOpen": ["isOpenChanged"]
|
|
5854
|
+
}; }
|
|
5855
|
+
static get style() { return sdSelectMultipleCss; }
|
|
5856
|
+
static get cmpMeta() { return {
|
|
5857
|
+
"$flags$": 772,
|
|
5858
|
+
"$tagName$": "sd-select-multiple",
|
|
5859
|
+
"$members$": {
|
|
5860
|
+
"value": [1040],
|
|
5861
|
+
"label": [1],
|
|
5862
|
+
"options": [1040],
|
|
5863
|
+
"placeholder": [1],
|
|
5864
|
+
"optionPlaceholder": [1, "option-placeholder"],
|
|
5865
|
+
"width": [1],
|
|
5866
|
+
"dropdownHeight": [1, "dropdown-height"],
|
|
5867
|
+
"disabled": [4],
|
|
5868
|
+
"clearable": [4],
|
|
5869
|
+
"searchable": [4],
|
|
5870
|
+
"useCheckbox": [4, "use-checkbox"],
|
|
5871
|
+
"optionRenderer": [16],
|
|
5872
|
+
"filteredOptions": [32],
|
|
5873
|
+
"isOpen": [32],
|
|
5874
|
+
"searchText": [32],
|
|
5875
|
+
"itemIndex": [32],
|
|
5876
|
+
"isScrolled": [32]
|
|
5877
|
+
},
|
|
5878
|
+
"$listeners$": undefined,
|
|
5879
|
+
"$lazyBundleId$": "-",
|
|
5880
|
+
"$attrsToReflect$": []
|
|
5881
|
+
}; }
|
|
5882
|
+
}
|
|
5883
|
+
|
|
5884
|
+
const sdSelectMultipleGroupCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\");}:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}.sd-select-multiple-group__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select-multiple-group__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select-multiple-group__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-thumb:hover{background:#e5e5e5}.sd-select-multiple-group__dropdown::-webkit-scrollbar-thumb:active{background:#e5e5e5}.sd-select-multiple-group__dropdown::-webkit-scrollbar-track{background-color:transparent}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow svg{width:100%;height:100%}.sd-popover-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content{font-size:12px;line-height:20px}.sd-popover-menu__content .sd-popover-menu__title{font-weight:700;margin-bottom:4px}.sd-popover-menu__content .sd-popover-menu__messages{font-weight:500}.sd-popover-menu__content .sd-popover-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content .sd-popover-menu__buttons--1{justify-content:flex-end}.sd-popover-menu__content .sd-popover-menu__buttons--2{justify-content:space-between}.sd-popover-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}:host{display:display;height:fit-content}.sd-select-multiple-group{display:flex;flex-wrap:nowrap;width:var(--select-width, 200px);cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white}.sd-select-multiple-group:hover:not(.sd-select-multiple-group--disabled){background:#f6f6f6}.sd-select-multiple-group.sd-select-multiple-group--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}.sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__label{border-right:1px solid #cccccc}.sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger{color:#888888}.sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus,.sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-visible,.sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-within{outline:none !important}.sd-select-multiple-group__label{font-size:12px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6}.sd-select-multiple-group__container{position:relative;width:100%;display:flex}.sd-select-multiple-group__container .sd-select-multiple-group__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}.sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400}.sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}.sd-select-multiple-group__container .sd-select-multiple-group__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}.sd-select-multiple-group__container .sd-select-multiple-group__arrow--open{transform:rotate(180deg)}.sd-select-multiple-group__dropdown{width:var(--select-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select-multiple-group__dropdown .sd-select-multiple-group__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px}";
|
|
5885
|
+
|
|
5886
|
+
class SdSelectMultipleGroup extends BaseDropdownEvent {
|
|
5887
|
+
constructor(hostRef) {
|
|
5888
|
+
super();
|
|
5889
|
+
registerInstance(this, hostRef);
|
|
5890
|
+
this.sdChange = createEvent(this, "sdChange");
|
|
5891
|
+
this.dropDownShow = createEvent(this, "dropDownShow");
|
|
5892
|
+
}
|
|
5893
|
+
get el() { return getElement(this); }
|
|
5894
|
+
// props
|
|
5895
|
+
value = null;
|
|
5896
|
+
label = '';
|
|
5897
|
+
options = [];
|
|
5898
|
+
placeholder = '선택';
|
|
5899
|
+
optionPlaceholder = '옵션이 없습니다.';
|
|
5900
|
+
width = '200px';
|
|
5901
|
+
dropdownHeight = '260px';
|
|
5902
|
+
disabled = false;
|
|
5903
|
+
clearable = false;
|
|
5904
|
+
searchable = false;
|
|
5905
|
+
useCheckbox = false;
|
|
5906
|
+
// props - custom styles
|
|
5907
|
+
containerStyle = {};
|
|
5908
|
+
triggerStyle = {};
|
|
5909
|
+
dropdownStyle = {};
|
|
5910
|
+
optionStyle = {};
|
|
5911
|
+
labelStyle = {};
|
|
5912
|
+
// props - custom slots
|
|
5913
|
+
optionRenderer;
|
|
5914
|
+
// states
|
|
5915
|
+
filteredOptions = this.options;
|
|
5916
|
+
isOpen = false;
|
|
5917
|
+
searchText = null;
|
|
5918
|
+
itemIndex = -1;
|
|
5919
|
+
isScrolled = false;
|
|
5920
|
+
// events
|
|
5921
|
+
sdChange;
|
|
5922
|
+
dropDownShow;
|
|
5923
|
+
selectRef;
|
|
5924
|
+
searchRef;
|
|
5925
|
+
optionRef;
|
|
5926
|
+
dropdownRef;
|
|
5927
|
+
valueChanged() {
|
|
5928
|
+
this.sdChange?.emit(this.value);
|
|
5929
|
+
}
|
|
5930
|
+
optionsChanged() {
|
|
5931
|
+
this.filteredOptions = this.options;
|
|
5932
|
+
this.filterOptions();
|
|
5933
|
+
}
|
|
5934
|
+
searchTextChanged() {
|
|
5935
|
+
this.filterOptions();
|
|
5936
|
+
}
|
|
5937
|
+
async itemIndexChanged(newIndex, oldIndex) {
|
|
5938
|
+
if (this.searchable) {
|
|
5939
|
+
const searchInput = await this.getNativeInputElement();
|
|
5940
|
+
if (this.itemIndex === -1) {
|
|
5941
|
+
searchInput?.focus();
|
|
5942
|
+
return;
|
|
5943
|
+
}
|
|
5944
|
+
else if (searchInput?.matches(':focus')) {
|
|
5945
|
+
searchInput?.blur();
|
|
5946
|
+
}
|
|
5947
|
+
}
|
|
5948
|
+
const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple__dropdown sd-select-option') || []);
|
|
5949
|
+
const currentItem = optionElements?.[this.itemIndex];
|
|
5950
|
+
if (!currentItem || !this.isOpen)
|
|
5951
|
+
return;
|
|
5952
|
+
this.optionRef = currentItem;
|
|
5953
|
+
const isOptionDisabled = await this.optionRef.isDisabled();
|
|
5954
|
+
if (isOptionDisabled) {
|
|
5955
|
+
newIndex > oldIndex ? this.itemIndex++ : this.itemIndex--;
|
|
5956
|
+
return;
|
|
5957
|
+
}
|
|
5958
|
+
this.scrollToOption(currentItem);
|
|
5959
|
+
}
|
|
5960
|
+
async isOpenChanged() {
|
|
5961
|
+
// Base class의 이벤트 관리 호출 - 다른 select와의 이벤트 충돌 방지
|
|
5962
|
+
this.onDropdownToggle(this.isOpen);
|
|
5963
|
+
const selectedOption = this.getSelectedOption();
|
|
5964
|
+
if (!selectedOption) {
|
|
5965
|
+
this.itemIndex = -1;
|
|
5966
|
+
}
|
|
5967
|
+
else {
|
|
5968
|
+
this.itemIndex = this.options.indexOf(selectedOption[0]);
|
|
5969
|
+
}
|
|
5970
|
+
this.dropDownShow?.emit({ isOpen: this.isOpen });
|
|
5971
|
+
if (this.isOpen === false)
|
|
5972
|
+
return;
|
|
5973
|
+
await new Promise(resolve => setTimeout(resolve, 10));
|
|
5974
|
+
const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple__dropdown sd-select-item') || []);
|
|
5975
|
+
const currentItem = optionElements?.[this.itemIndex];
|
|
5976
|
+
// 드롭다운이 열릴 때 검색 입력에 포커스
|
|
5977
|
+
if (this.searchable) {
|
|
5978
|
+
const searchInput = await this.getNativeInputElement();
|
|
5979
|
+
searchInput?.focus();
|
|
5980
|
+
}
|
|
5981
|
+
if (!currentItem)
|
|
5982
|
+
return;
|
|
5983
|
+
await new Promise(resolve => setTimeout(resolve, 10)); // 추가 딜레이
|
|
5984
|
+
this.scrollToOption(currentItem);
|
|
5985
|
+
}
|
|
5986
|
+
connectedCallback() {
|
|
5987
|
+
// props가 모두 설정된 후에 실행되므로 올바른 options 값을 가져올 수 있음
|
|
5988
|
+
this.filteredOptions = this.options;
|
|
5989
|
+
this.initializeEvent(); // global dropdown Manager에 등록 + 이벤트 핸들러 초기화
|
|
5990
|
+
}
|
|
5991
|
+
disconnectedCallback() {
|
|
5992
|
+
this.cleanupEvent(); // global dropdown Manager에서 제거 + 이벤트 정리
|
|
5993
|
+
}
|
|
5994
|
+
handleDocumentClick(event) {
|
|
5995
|
+
if (!this.selectRef?.contains(event.target)) {
|
|
5996
|
+
this.isOpen = false;
|
|
5997
|
+
}
|
|
5998
|
+
}
|
|
5999
|
+
handleDocumentKeydown(keyboardEvent) {
|
|
6000
|
+
keyboardEvent.stopPropagation();
|
|
6001
|
+
const targetKey = ['ArrowDown', 'ArrowUp', 'Enter', 'Escape'];
|
|
6002
|
+
if (!targetKey.includes(keyboardEvent.key))
|
|
6003
|
+
return;
|
|
6004
|
+
keyboardEvent.preventDefault();
|
|
6005
|
+
switch (keyboardEvent.key) {
|
|
6006
|
+
case 'ArrowDown':
|
|
6007
|
+
case 'ArrowUp':
|
|
6008
|
+
const keyboardNavigation = new SelectKeyboardNavigation(this.searchable, this.filteredOptions);
|
|
6009
|
+
const nextIndex = keyboardNavigation.getNextIndex(this.itemIndex, keyboardEvent.key);
|
|
6010
|
+
this.itemIndex = nextIndex;
|
|
6011
|
+
break;
|
|
6012
|
+
case 'Enter':
|
|
6013
|
+
const selectedOption = this.filteredOptions[this.itemIndex];
|
|
6014
|
+
if (selectedOption && !selectedOption.disabled) {
|
|
6015
|
+
this.handleOptionSelection(selectedOption);
|
|
6016
|
+
}
|
|
6017
|
+
break;
|
|
6018
|
+
case 'Escape':
|
|
6019
|
+
this.isOpen = false;
|
|
6020
|
+
break;
|
|
6021
|
+
}
|
|
6022
|
+
}
|
|
6023
|
+
// event handlers
|
|
6024
|
+
handleTriggerClick = (event) => {
|
|
6025
|
+
event.stopPropagation();
|
|
6026
|
+
if (!this.disabled) {
|
|
6027
|
+
this.isOpen = !this.isOpen;
|
|
6028
|
+
this.dropDownShow?.emit({ isOpen: this.isOpen });
|
|
6029
|
+
}
|
|
6030
|
+
};
|
|
6031
|
+
handleOptionClick = (detail) => {
|
|
6032
|
+
const { option, event } = detail;
|
|
6033
|
+
event.stopPropagation();
|
|
6034
|
+
if (option.type === 'group')
|
|
6035
|
+
this.handleGroupOptionClick(detail);
|
|
6036
|
+
if (option.type === 'subgroup')
|
|
6037
|
+
this.handleSubGroupOptionClick(detail);
|
|
6038
|
+
if (option.type === 'item')
|
|
6039
|
+
this.handleOptionSelection(option);
|
|
6040
|
+
};
|
|
6041
|
+
handleGroupOptionClick = (detail) => {
|
|
6042
|
+
const { option, isSelected } = detail;
|
|
6043
|
+
const childOptions = this.options.filter(opt => opt.parent === option.value && !opt.disabled);
|
|
6044
|
+
childOptions.forEach(subgroup => {
|
|
6045
|
+
this.handleSubGroupOptionClick({
|
|
6046
|
+
option: subgroup,
|
|
6047
|
+
isSelected: isSelected || isSelected === null,
|
|
6048
|
+
});
|
|
6049
|
+
});
|
|
6050
|
+
};
|
|
6051
|
+
handleSubGroupOptionClick = (detail) => {
|
|
6052
|
+
const { option, isSelected } = detail;
|
|
6053
|
+
const childOptions = this.options.filter(opt => opt.parent === option.value && !opt.disabled);
|
|
6054
|
+
if (isSelected || isSelected === null) {
|
|
6055
|
+
// 모든 자식 옵션이 선택된 경우, 모두 선택 해제
|
|
6056
|
+
this.value =
|
|
6057
|
+
this.value?.filter(selected => !childOptions.some(child => child.value === selected.value)) ||
|
|
6058
|
+
null;
|
|
6059
|
+
}
|
|
6060
|
+
else {
|
|
6061
|
+
// 일부 또는 전체 자식 옵션이 선택되지 않은 경우, 모두 선택
|
|
6062
|
+
const newSelections = childOptions.filter(child => !this.value?.some(selected => selected.value === child.value));
|
|
6063
|
+
this.value = [...(this.value || []), ...newSelections];
|
|
6064
|
+
}
|
|
6065
|
+
};
|
|
6066
|
+
filterOptions() {
|
|
6067
|
+
if (!this.searchText || this.searchText.trim() === '') {
|
|
6068
|
+
// 검색어가 없으면 전체 옵션 표시
|
|
6069
|
+
this.filteredOptions = this.options;
|
|
6070
|
+
}
|
|
6071
|
+
else {
|
|
6072
|
+
// 검색어가 있으면 필터링
|
|
6073
|
+
this.filteredOptions = this.options.filter(option => option.label.toLowerCase().includes(this.searchText.toLowerCase()));
|
|
6074
|
+
}
|
|
6075
|
+
}
|
|
6076
|
+
getSelectedOption() {
|
|
6077
|
+
return this.options.filter(option => this.value?.includes(option));
|
|
6078
|
+
}
|
|
6079
|
+
handleDropdownScroll = (event) => {
|
|
6080
|
+
const target = event.target;
|
|
6081
|
+
const scrollTop = target.scrollTop;
|
|
6082
|
+
// 스크롤이 조금이라도 되면 그림자 표시
|
|
6083
|
+
this.isScrolled = scrollTop > 0;
|
|
6084
|
+
};
|
|
6085
|
+
async getNativeInputElement() {
|
|
6086
|
+
if (this.searchRef) {
|
|
6087
|
+
return this.searchRef.getNativeElement();
|
|
6088
|
+
}
|
|
6089
|
+
return null;
|
|
6090
|
+
}
|
|
6091
|
+
handleOptionSelection = (option) => {
|
|
6092
|
+
if (!option || option.disabled)
|
|
6093
|
+
return;
|
|
6094
|
+
const isAlreadySelected = this.value?.some(opt => opt.value === option.value);
|
|
6095
|
+
if (isAlreadySelected) {
|
|
6096
|
+
// 이미 선택된 옵션인 경우, 선택 해제
|
|
6097
|
+
this.value = this.value?.filter(opt => opt.value !== option.value) || null;
|
|
6098
|
+
}
|
|
6099
|
+
else {
|
|
6100
|
+
// 새로운 옵션 선택
|
|
6101
|
+
this.value = [...(this.value || []), option];
|
|
6102
|
+
}
|
|
6103
|
+
};
|
|
6104
|
+
isAllChildrenSelected(parentOption) {
|
|
6105
|
+
const childOptions = this.options.filter(option => option.parent === parentOption.value);
|
|
6106
|
+
const isChecked = childOptions.filter(child => this.value?.some(selected => selected.value === child.value));
|
|
6107
|
+
if (isChecked.length === childOptions.length)
|
|
6108
|
+
return true;
|
|
6109
|
+
if (isChecked.length > 0)
|
|
6110
|
+
return null;
|
|
6111
|
+
return false;
|
|
6112
|
+
}
|
|
6113
|
+
closeDropdown() {
|
|
6114
|
+
this.isOpen = false;
|
|
6115
|
+
}
|
|
6116
|
+
scrollToOption(optionElement) {
|
|
6117
|
+
if (!this.dropdownRef || !optionElement)
|
|
6118
|
+
return;
|
|
6119
|
+
const dropdown = this.dropdownRef;
|
|
6120
|
+
const optionTop = optionElement.offsetTop;
|
|
6121
|
+
const optionHeight = optionElement.offsetHeight;
|
|
6122
|
+
const dropdownScrollTop = dropdown.scrollTop;
|
|
6123
|
+
const dropdownHeight = dropdown.clientHeight;
|
|
6124
|
+
const searchContainer = dropdown.querySelector('.sd-select__search-container');
|
|
6125
|
+
const searchOffset = searchContainer ? searchContainer.offsetHeight : 0;
|
|
6126
|
+
const visibleTop = dropdownScrollTop + searchOffset;
|
|
6127
|
+
const visibleBottom = dropdownScrollTop + dropdownHeight;
|
|
6128
|
+
if (optionTop < visibleTop) {
|
|
6129
|
+
dropdown.scrollTop = optionTop - searchOffset;
|
|
6130
|
+
}
|
|
6131
|
+
else if (optionTop + optionHeight > visibleBottom) {
|
|
6132
|
+
dropdown.scrollTop = optionTop + optionHeight - dropdownHeight + searchOffset;
|
|
6133
|
+
}
|
|
6134
|
+
}
|
|
6135
|
+
render() {
|
|
6136
|
+
const style = {
|
|
6137
|
+
'--select-width': this.width || '200px',
|
|
6138
|
+
'--select-dropdown-height': this.dropdownHeight || '260px',
|
|
6139
|
+
};
|
|
6140
|
+
return (hAsync(Host, { key: '1244cf850d04ffbe539dc3d282488aef7adf012b', style: style }, hAsync("div", { key: 'd4170fd8bc7f7fa6a71b2e66003bf9ccf09fc68a', class: {
|
|
6141
|
+
'sd-select-multiple-group': true,
|
|
6142
|
+
'sd-select-multiple-group--open': this.isOpen,
|
|
6143
|
+
'sd-select-multiple-group--disabled': this.disabled,
|
|
6144
|
+
}, style: this.containerStyle, ref: el => (this.selectRef = el) }, this.renderLabel(this.label, this.labelStyle), hAsync("div", { key: '5e6bfa6b8f0eb9c88dfca7496d1e81cb4c2a185c', class: "sd-select-multiple-group__container" }, this.renderTrigger(), this.renderDropdown()))));
|
|
6145
|
+
}
|
|
6146
|
+
renderLabel(label, labelStyle) {
|
|
6147
|
+
if (!label)
|
|
6148
|
+
return null;
|
|
6149
|
+
return (hAsync("label", { class: "sd-select-multiple-group__label", style: labelStyle }, label));
|
|
6150
|
+
}
|
|
6151
|
+
renderTrigger() {
|
|
6152
|
+
const selectedOption = this.getSelectedOption();
|
|
6153
|
+
return (hAsync("div", { class: "sd-select-multiple-group__trigger", tabindex: this.disabled ? -1 : 0, onClick: this.handleTriggerClick, style: this.triggerStyle }, hAsync("span", { class: "sd-select-multiple-group__value" }, !selectedOption
|
|
6154
|
+
? '선택'
|
|
6155
|
+
: selectedOption.length
|
|
6156
|
+
? selectedOption.map(option => option.label).join(', ')
|
|
6157
|
+
: this.placeholder), this.clearable && selectedOption?.length > 0 && !this.disabled && (hAsync("sd-icon", { key: "close-icon", name: "close", size: 10, color: "#888", class: "sd-select-multiple-group__clear", onClick: event => {
|
|
6158
|
+
event.stopPropagation();
|
|
6159
|
+
this.value = null;
|
|
6160
|
+
} })), hAsync("sd-icon", { key: "arrow-icon", name: "arrowDown", color: "#888", class: {
|
|
6161
|
+
'sd-select-multiple-group__arrow': true,
|
|
6162
|
+
'sd-select-multiple-group__arrow--open': this.isOpen,
|
|
6163
|
+
} })));
|
|
6164
|
+
}
|
|
6165
|
+
renderDropdown() {
|
|
6166
|
+
if (this.isOpen === false)
|
|
6167
|
+
return null;
|
|
6168
|
+
return (hAsync("sd-portal", { open: this.isOpen, parentRef: this.selectRef, onSdClose: this.closeDropdown }, hAsync("div", { class: "sd-select-multiple-group__dropdown", style: this.dropdownStyle, onScroll: this.handleDropdownScroll }, this.searchable && (hAsync("div", { class: {
|
|
6169
|
+
'sd-select-multiple-group__search-container': true,
|
|
6170
|
+
'sd-select-multiple-group__search-container--scrolled': this.isScrolled,
|
|
6171
|
+
}, onClick: event => event.stopPropagation() }, hAsync("sd-input", { ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdInput: event => {
|
|
6172
|
+
this.searchText = String(event?.detail);
|
|
6173
|
+
}, onSdFocus: () => {
|
|
6174
|
+
this.itemIndex = -1;
|
|
6175
|
+
} }, hAsync("sd-icon", { name: "search", size: 16, color: "#737373", slot: "prefix" })))), this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index) => (hAsync("slot", { name: `option-${option.value}` }, hAsync("sd-select-option-group", { option: option, index: index, isSelected: option.type === 'item'
|
|
6176
|
+
? this.value?.some(selected => selected.value === option.value)
|
|
6177
|
+
: this.isAllChildrenSelected(option), isFocused: index === this.itemIndex, optionStyle: this.optionStyle, onOptionClick: ({ detail, }) => this.handleOptionClick(detail), useCheckbox: this.useCheckbox }))))) : (hAsync("slot", { name: "option-placeholder" }, hAsync("div", { class: 'sd-select-multiple-group__option-placeholder', style: this.optionStyle }, this.optionPlaceholder))))));
|
|
6178
|
+
}
|
|
6179
|
+
static get watchers() { return {
|
|
6180
|
+
"value": ["valueChanged"],
|
|
6181
|
+
"options": ["optionsChanged"],
|
|
6182
|
+
"searchText": ["searchTextChanged"],
|
|
6183
|
+
"itemIndex": ["itemIndexChanged"],
|
|
6184
|
+
"isOpen": ["isOpenChanged"]
|
|
6185
|
+
}; }
|
|
6186
|
+
static get style() { return sdSelectMultipleGroupCss; }
|
|
6187
|
+
static get cmpMeta() { return {
|
|
6188
|
+
"$flags$": 772,
|
|
6189
|
+
"$tagName$": "sd-select-multiple-group",
|
|
6190
|
+
"$members$": {
|
|
6191
|
+
"value": [1040],
|
|
6192
|
+
"label": [1],
|
|
6193
|
+
"options": [1040],
|
|
6194
|
+
"placeholder": [1],
|
|
6195
|
+
"optionPlaceholder": [1, "option-placeholder"],
|
|
6196
|
+
"width": [1],
|
|
6197
|
+
"dropdownHeight": [1, "dropdown-height"],
|
|
6198
|
+
"disabled": [4],
|
|
6199
|
+
"clearable": [4],
|
|
6200
|
+
"searchable": [4],
|
|
6201
|
+
"useCheckbox": [4, "use-checkbox"],
|
|
6202
|
+
"containerStyle": [16],
|
|
6203
|
+
"triggerStyle": [16],
|
|
6204
|
+
"dropdownStyle": [16],
|
|
6205
|
+
"optionStyle": [16],
|
|
6206
|
+
"labelStyle": [16],
|
|
6207
|
+
"optionRenderer": [16],
|
|
6208
|
+
"filteredOptions": [32],
|
|
6209
|
+
"isOpen": [32],
|
|
6210
|
+
"searchText": [32],
|
|
6211
|
+
"itemIndex": [32],
|
|
6212
|
+
"isScrolled": [32]
|
|
6213
|
+
},
|
|
6214
|
+
"$listeners$": undefined,
|
|
6215
|
+
"$lazyBundleId$": "-",
|
|
6216
|
+
"$attrsToReflect$": []
|
|
6217
|
+
}; }
|
|
6218
|
+
}
|
|
6219
|
+
|
|
6220
|
+
const sdSelectOptionCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\");}:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow svg{width:100%;height:100%}.sd-popover-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content{font-size:12px;line-height:20px}.sd-popover-menu__content .sd-popover-menu__title{font-weight:700;margin-bottom:4px}.sd-popover-menu__content .sd-popover-menu__messages{font-weight:500}.sd-popover-menu__content .sd-popover-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content .sd-popover-menu__buttons--1{justify-content:flex-end}.sd-popover-menu__content .sd-popover-menu__buttons--2{justify-content:space-between}.sd-popover-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}:host{display:block;height:fit-content;line-height:0}.sd-select__option{display:flex;padding:4px 12px;font-size:12px;line-height:20px;cursor:pointer}.sd-select__option__checkbox-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sd-select__option--focused{background-color:#e6f1ff}.sd-select__option--selected:not(:hover):not(.sd-select__option--use-checkbox),.sd-select__option--focused:not(:hover):not(.sd-select__option--use-checkbox){color:#0075ff;font-weight:700}.sd-select__option--disabled{color:#aaaaaa;cursor:not-allowed}.sd-select__option:hover:not(.sd-select__option--disabled){background-color:#0075ff;color:white}";
|
|
6221
|
+
|
|
6222
|
+
class SdSelectOption {
|
|
6223
|
+
constructor(hostRef) {
|
|
6224
|
+
registerInstance(this, hostRef);
|
|
6225
|
+
this.optionClick = createEvent(this, "optionClick");
|
|
6226
|
+
}
|
|
6227
|
+
get el() { return getElement(this); }
|
|
6228
|
+
option;
|
|
6229
|
+
index;
|
|
6230
|
+
isSelected = false;
|
|
6231
|
+
isFocused = false;
|
|
6232
|
+
optionStyle;
|
|
6233
|
+
disabled = false;
|
|
6234
|
+
useCheckbox = false;
|
|
6235
|
+
isHovered = false;
|
|
6236
|
+
async isDisabled() {
|
|
6237
|
+
return !!this.option.disabled;
|
|
6238
|
+
}
|
|
6239
|
+
optionClick;
|
|
6240
|
+
handleClick = (event) => {
|
|
6241
|
+
event.stopPropagation();
|
|
6242
|
+
if (!this.option.disabled && !this.disabled) {
|
|
6243
|
+
this.optionClick.emit({
|
|
6244
|
+
option: this.option,
|
|
6245
|
+
index: this.index,
|
|
6246
|
+
event,
|
|
6247
|
+
});
|
|
6248
|
+
}
|
|
6249
|
+
};
|
|
6250
|
+
render() {
|
|
6251
|
+
return (hAsync(Host, { key: '23d87df53fa083e6c9aceb1956de51800117df9f' }, hAsync("div", { key: '569c5d35098350fa4d186ba838925de4f966c491', class: {
|
|
6252
|
+
'sd-select__option': true,
|
|
6253
|
+
'sd-select__option--selected': this.isSelected,
|
|
6254
|
+
'sd-select__option--disabled': !!this.option.disabled,
|
|
6255
|
+
'sd-select__option--focused': this.isFocused,
|
|
6256
|
+
'sd-select__option--use-checkbox': this.useCheckbox,
|
|
6257
|
+
}, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: this.handleClick }, this.useCheckbox ? (hAsync("div", { class: "sd-select__option__checkbox-wrapper" }, hAsync("sd-checkbox", { checked: this.isSelected, disabled: this.option.disabled,
|
|
6258
|
+
// checkboxStyle={
|
|
6259
|
+
// !this.isSelected
|
|
6260
|
+
// ? { borderColor: '#888' }
|
|
6261
|
+
// : this.isHovered
|
|
6262
|
+
// ? { borderColor: 'white' }
|
|
6263
|
+
// : { borderColor: '#0075ff' }
|
|
6264
|
+
// }
|
|
6265
|
+
onClick: e => {
|
|
6266
|
+
e.preventDefault();
|
|
6267
|
+
this.handleClick(e);
|
|
6268
|
+
} }), hAsync("span", { class: "sd-select__option-label" }, this.option.label))) : (this.option.label))));
|
|
6269
|
+
}
|
|
6270
|
+
static get style() { return sdSelectOptionCss; }
|
|
6271
|
+
static get cmpMeta() { return {
|
|
6272
|
+
"$flags$": 768,
|
|
6273
|
+
"$tagName$": "sd-select-option",
|
|
6274
|
+
"$members$": {
|
|
6275
|
+
"option": [16],
|
|
6276
|
+
"index": [2],
|
|
6277
|
+
"isSelected": [4, "is-selected"],
|
|
6278
|
+
"isFocused": [4, "is-focused"],
|
|
6279
|
+
"optionStyle": [16],
|
|
6280
|
+
"disabled": [4],
|
|
6281
|
+
"useCheckbox": [4, "use-checkbox"],
|
|
6282
|
+
"isHovered": [32],
|
|
6283
|
+
"isDisabled": [64]
|
|
6284
|
+
},
|
|
6285
|
+
"$listeners$": undefined,
|
|
6286
|
+
"$lazyBundleId$": "-",
|
|
6287
|
+
"$attrsToReflect$": []
|
|
6288
|
+
}; }
|
|
6289
|
+
}
|
|
6290
|
+
|
|
6291
|
+
const sdSelectOptionGroupCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\");}:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow svg{width:100%;height:100%}.sd-popover-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content{font-size:12px;line-height:20px}.sd-popover-menu__content .sd-popover-menu__title{font-weight:700;margin-bottom:4px}.sd-popover-menu__content .sd-popover-menu__messages{font-weight:500}.sd-popover-menu__content .sd-popover-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content .sd-popover-menu__buttons--1{justify-content:flex-end}.sd-popover-menu__content .sd-popover-menu__buttons--2{justify-content:space-between}.sd-popover-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}:host{display:block;height:fit-content}.sd-select__option-group{display:flex;padding:4px 12px;padding-left:28px;font-size:12px;line-height:20px}.sd-select__option-group.sd-select__option-group--group:not(.sd-select__option-group--use-checkbox),.sd-select__option-group.sd-select__option-group--subgroup:not(.sd-select__option-group--use-checkbox){cursor:default}.sd-select__option-group.sd-select__option-group--group{padding-left:12px;background-color:#f5faff !important;color:#333333 !important;font-weight:700}.sd-select__option-group.sd-select__option-group--subgroup{padding-left:20px;background-color:#f9f9f9 !important;color:#333333 !important;font-weight:500}.sd-select__option-group__checkbox-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sd-select__option-group--focused{background-color:#e6f1ff}.sd-select__option-group--selected:not(:hover):not(.sd-select__option-group--use-checkbox),.sd-select__option-group--focused:not(:hover):not(.sd-select__option-group--use-checkbox){color:#0075ff;font-weight:700}.sd-select__option-group--disabled{color:#aaaaaa;cursor:not-allowed}.sd-select__option-group:hover:not(.sd-select__option-group--disabled){background-color:#0075ff;color:white}";
|
|
6292
|
+
|
|
6293
|
+
class SdSelectOptionGroup {
|
|
6294
|
+
constructor(hostRef) {
|
|
6295
|
+
registerInstance(this, hostRef);
|
|
6296
|
+
this.optionClick = createEvent(this, "optionClick");
|
|
6297
|
+
}
|
|
6298
|
+
get el() { return getElement(this); }
|
|
6299
|
+
option;
|
|
6300
|
+
index;
|
|
6301
|
+
isSelected = false;
|
|
6302
|
+
isFocused = false;
|
|
6303
|
+
optionStyle;
|
|
6304
|
+
disabled = false;
|
|
6305
|
+
useCheckbox = false;
|
|
6306
|
+
isHovered = false;
|
|
6307
|
+
async isDisabled() {
|
|
6308
|
+
return !!this.option.disabled || this.option.type === 'group' || this.option.type === 'subgroup';
|
|
6309
|
+
}
|
|
6310
|
+
optionClick;
|
|
6311
|
+
handleClick = (option, isSelected, event) => {
|
|
6312
|
+
event.stopPropagation();
|
|
6313
|
+
if (option.type === 'group' || option.type === 'subgroup') {
|
|
6314
|
+
this.optionClick.emit({
|
|
6315
|
+
option: this.option,
|
|
6316
|
+
isSelected,
|
|
6317
|
+
index: this.index,
|
|
6318
|
+
event,
|
|
6319
|
+
});
|
|
6320
|
+
return;
|
|
6321
|
+
}
|
|
6322
|
+
if (!this.option.disabled && !this.disabled) {
|
|
6323
|
+
this.optionClick.emit({
|
|
6324
|
+
option: this.option,
|
|
6325
|
+
isSelected,
|
|
6326
|
+
index: this.index,
|
|
6327
|
+
event,
|
|
6328
|
+
});
|
|
6329
|
+
}
|
|
6330
|
+
};
|
|
6331
|
+
render() {
|
|
6332
|
+
return (hAsync(Host, { key: 'efe392a974379955f7530659a609c584910764eb' }, hAsync("div", { key: '6eabbdcac6f6c2b7439e22f82d85b96b54726805', class: {
|
|
6333
|
+
'sd-select__option-group': true,
|
|
6334
|
+
'sd-select__option-group--selected': !!this.isSelected,
|
|
6335
|
+
'sd-select__option-group--disabled': !!this.option.disabled,
|
|
6336
|
+
'sd-select__option-group--focused': this.isFocused,
|
|
6337
|
+
'sd-select__option-group--use-checkbox': this.useCheckbox,
|
|
6338
|
+
'sd-select__option-group--group': this.option.type === 'group',
|
|
6339
|
+
'sd-select__option-group--subgroup': this.option.type === 'subgroup',
|
|
6340
|
+
'sd-select__option-group--item': this.option.type === 'item',
|
|
6341
|
+
}, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, this.useCheckbox ? (hAsync("div", { class: "sd-select__option-group__checkbox-wrapper" }, hAsync("sd-checkbox", { checked: this.isSelected, disabled: this.option.disabled,
|
|
6342
|
+
// checkboxStyle={
|
|
6343
|
+
// !this.isSelected
|
|
6344
|
+
// ? { borderColor: '#888' }
|
|
6345
|
+
// : this.isHovered
|
|
6346
|
+
// ? { borderColor: 'white' }
|
|
6347
|
+
// : { borderColor: '#0075ff' }
|
|
6348
|
+
// }
|
|
6349
|
+
onClick: e => {
|
|
6350
|
+
e.preventDefault();
|
|
6351
|
+
this.handleClick(this.option, this.isSelected, e);
|
|
6352
|
+
} }), hAsync("span", { class: "sd-select__option-group-label" }, this.option.label))) : (this.option.label))));
|
|
6353
|
+
}
|
|
6354
|
+
static get style() { return sdSelectOptionGroupCss; }
|
|
6355
|
+
static get cmpMeta() { return {
|
|
6356
|
+
"$flags$": 768,
|
|
6357
|
+
"$tagName$": "sd-select-option-group",
|
|
5611
6358
|
"$members$": {
|
|
5612
6359
|
"option": [16],
|
|
5613
6360
|
"index": [2],
|
|
@@ -5634,8 +6381,8 @@ class SdTable {
|
|
|
5634
6381
|
this.sdPageChange = createEvent(this, "sdPageChange");
|
|
5635
6382
|
}
|
|
5636
6383
|
get el() { return getElement(this); }
|
|
5637
|
-
columns
|
|
5638
|
-
rows
|
|
6384
|
+
columns;
|
|
6385
|
+
rows;
|
|
5639
6386
|
selected = new Set();
|
|
5640
6387
|
rowKey = 'id';
|
|
5641
6388
|
selectable = false;
|
|
@@ -5825,10 +6572,10 @@ class SdTable {
|
|
|
5825
6572
|
}))))));
|
|
5826
6573
|
}
|
|
5827
6574
|
render() {
|
|
5828
|
-
return (hAsync(Host, { key: '
|
|
6575
|
+
return (hAsync(Host, { key: '84e1e86a1f537814c86b4d23e19d9e15110feeb5' }, hAsync("div", { key: '38c189caa26fb8b32021e4445e0e9673c2913852', class: "sd-table__wrapper", style: {
|
|
5829
6576
|
'--table-width': this.width,
|
|
5830
6577
|
'--table-height': this.height,
|
|
5831
|
-
} }, hAsync("div", { key: '
|
|
6578
|
+
} }, hAsync("div", { key: 'e81e3a04ac13e9b049acda3ba3503d15dfcb0b5b', class: "sd-table__container" }, hAsync("div", { key: '4be117d9789efd655e288159512947f272704bc6', class: "sd-table__middle" }, hAsync("table", { key: '7b9985d135355e1c4fc5b96b098f044c8d4d4405', part: "table", class: this.sdTableClasses }, this.renderHeader(), this.renderBody())), hAsync("div", { key: '0bef58541461eae84d674ebf6ff776ffe21778d2', class: "sd-table__bottom" })), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: '0dbf69c7b87b3eb0cff3409fc3e3be8a03c66699', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: 'f924fd4b198f1015a9468673887e199e155ed821', currentPage: this.currentPage, lastPage: this.lastPageNumber, onPageChange: (e) => {
|
|
5832
6579
|
this.currentPage = e.detail;
|
|
5833
6580
|
this.sdPageChange.emit(this.currentPage);
|
|
5834
6581
|
} }))))));
|
|
@@ -5913,7 +6660,7 @@ class SdTag {
|
|
|
5913
6660
|
}
|
|
5914
6661
|
render() {
|
|
5915
6662
|
const tagClasses = this.getTagClasses();
|
|
5916
|
-
return (hAsync("span", { key: '
|
|
6663
|
+
return (hAsync("span", { key: 'eff57a253b788f0435525cae9a15881cce8a08a0', class: tagClasses, style: {
|
|
5917
6664
|
'--tag-bg-color': this.bgColor,
|
|
5918
6665
|
'--tag-text-color': this.textColor,
|
|
5919
6666
|
}, "aria-label": this.label || 'tag' }, this.renderContent()));
|
|
@@ -5968,11 +6715,11 @@ class SdTooltip {
|
|
|
5968
6715
|
: {
|
|
5969
6716
|
onClick: () => (console.log('click tooltip'), (this.showTooltip = !this.showTooltip)),
|
|
5970
6717
|
};
|
|
5971
|
-
return (hAsync(Fragment, { key: '
|
|
6718
|
+
return (hAsync(Fragment, { key: 'db5f9498990b6cc3941a1f276dc7b437f00ae3b1' }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-tooltip", ...handleTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-tooltip", ...handleTrigger })), this.showTooltip && (hAsync("sd-tooltip-portal", { key: '19e133936ac7d7efc95292c0053a6eace81e7ccb', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, hAsync("div", { key: '2d0fed8f8f2f3e6dfe860c78f4c1af99f595e4d4', class: {
|
|
5972
6719
|
'sd-tooltip-menu': true,
|
|
5973
6720
|
[`sd-tooltip-menu--${this.placement}`]: true,
|
|
5974
6721
|
'sd-tooltip-menu--with-close': this.useClose,
|
|
5975
|
-
} }, hAsync("i", { key: '
|
|
6722
|
+
} }, hAsync("i", { key: '6ec7ba058e541d65eae3b5100ca8eb741a04d814', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '550d0629d949f9da13117c3c569e886b44e8b9bd' })), hAsync("div", { key: '4a1fc247b84457ee8c962804ca91bd93b4de8948', class: "sd-tooltip-menu__content" }, hAsync("slot", { key: '444c621343b3eeba8f89e85f06b9b66e39b626b1' }, this.el.textContent)), this.useClose && (hAsync("div", { key: '570364c37b97299922b4c52192d52d1e0e20228d', class: "sd-tooltip-menu__close-button" }, hAsync("button", { key: '0e126ad1ed0238e8adbf7a82132e28c90bffa1a5', onClick: () => this.handleClose() }, hAsync("sd-icon", { key: '796643e7a212b7a65f81671c46e2b992fe1ae0d1', name: "close", size: "12", color: "#AAAAAA" })))))))));
|
|
5976
6723
|
}
|
|
5977
6724
|
static get style() { return sdTooltipCss; }
|
|
5978
6725
|
static get cmpMeta() { return {
|
|
@@ -6145,7 +6892,7 @@ class SdTooltipPortal {
|
|
|
6145
6892
|
this.sdClose.emit();
|
|
6146
6893
|
}
|
|
6147
6894
|
render() {
|
|
6148
|
-
return hAsync("slot", { key: '
|
|
6895
|
+
return hAsync("slot", { key: 'c591e9142f81d16318407d32af6b58a9fc4433b7' });
|
|
6149
6896
|
}
|
|
6150
6897
|
static get cmpMeta() { return {
|
|
6151
6898
|
"$flags$": 777,
|
|
@@ -6167,6 +6914,7 @@ class SdTooltipPortal {
|
|
|
6167
6914
|
registerComponents([
|
|
6168
6915
|
SdBadge,
|
|
6169
6916
|
SdButton,
|
|
6917
|
+
SdCard,
|
|
6170
6918
|
SdCheckbox,
|
|
6171
6919
|
SdDateBox,
|
|
6172
6920
|
SdDatePicker,
|
|
@@ -6178,7 +6926,10 @@ registerComponents([
|
|
|
6178
6926
|
SdPopover,
|
|
6179
6927
|
SdPortal,
|
|
6180
6928
|
SdSelect,
|
|
6929
|
+
SdSelectMultiple,
|
|
6930
|
+
SdSelectMultipleGroup,
|
|
6181
6931
|
SdSelectOption,
|
|
6932
|
+
SdSelectOptionGroup,
|
|
6182
6933
|
SdTable,
|
|
6183
6934
|
SdTag,
|
|
6184
6935
|
SdTooltip,
|