@sellmate/design-system 0.0.9 → 0.0.10
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/cjs/design-system.cjs.js +3 -3
- package/dist/cjs/design-system.cjs.js.map +1 -1
- package/dist/cjs/{index-iB3JlG0y.js → index-D1tXBb8y.js} +5 -7
- package/dist/cjs/index-D1tXBb8y.js.map +1 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/resolveColor-DxvExwgo.js +272 -0
- package/dist/cjs/resolveColor-DxvExwgo.js.map +1 -0
- package/dist/cjs/sd-badge.cjs.entry.js +23 -0
- package/dist/cjs/sd-badge.entry.cjs.js.map +1 -0
- package/dist/cjs/sd-button.sd-guide.sd-icon.sd-portal.entry.cjs.js.map +1 -1
- package/dist/cjs/sd-button_4.cjs.entry.js +51 -315
- package/dist/cjs/sd-checkbox.cjs.entry.js +2 -2
- package/dist/cjs/sd-date-box_2.cjs.entry.js +3 -3
- package/dist/cjs/sd-date-picker.cjs.entry.js +3 -3
- package/dist/cjs/sd-date-range-picker.cjs.entry.js +3 -3
- package/dist/cjs/sd-pagination_2.cjs.entry.js +6 -6
- package/dist/cjs/sd-popover.cjs.entry.js +4 -4
- package/dist/cjs/sd-select-option.cjs.entry.js +2 -2
- package/dist/cjs/sd-select.cjs.entry.js +1 -1
- package/dist/cjs/sd-table.cjs.entry.js +1 -1
- package/dist/cjs/sd-tag.cjs.entry.js +1 -1
- package/dist/cjs/sd-tooltip-portal.cjs.entry.js +2 -2
- package/dist/cjs/{tooltipArrow-CSLQDjwL.js → tooltipArrow-D4Vc_pEU.js} +3 -3
- package/dist/cjs/{tooltipArrow-CSLQDjwL.js.map → tooltipArrow-D4Vc_pEU.js.map} +1 -1
- package/dist/collection/collection-manifest.json +2 -1
- package/dist/collection/components/sd-badge/sd-badge.css +1386 -0
- package/dist/collection/components/sd-badge/sd-badge.js +88 -0
- package/dist/collection/components/sd-badge/sd-badge.js.map +1 -0
- package/dist/collection/components/sd-checkbox/sd-checkbox.js +1 -1
- 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.js +2 -2
- package/dist/collection/components/sd-icon/sd-icon.js +1 -1
- 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 +2 -2
- package/dist/collection/components/sd-portal/sd-portal.js +1 -1
- package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +1 -1
- package/dist/collection/components/sd-tooltip/sd-tooltip.js +2 -2
- package/dist/collection/components/sd-tooltip-portal/sd-tooltip-portal.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/{p-B0--8AFP.js → p-0rgiptJp.js} +7 -271
- package/dist/components/p-0rgiptJp.js.map +1 -0
- package/dist/components/{p-BVQq85Sb.js → p-6-oOxxG7.js} +5 -5
- package/dist/components/{p-BVQq85Sb.js.map → p-6-oOxxG7.js.map} +1 -1
- package/dist/components/{p-CwAyLWEQ.js → p-8_DE9sf7.js} +7 -7
- package/dist/components/{p-CwAyLWEQ.js.map → p-8_DE9sf7.js.map} +1 -1
- package/dist/components/{p-CIRxuq9O.js → p-BEEv43du.js} +5 -5
- package/dist/components/{p-CIRxuq9O.js.map → p-BEEv43du.js.map} +1 -1
- package/dist/components/{p-CvQARSF2.js → p-BFclKl59.js} +7 -7
- package/dist/components/{p-CvQARSF2.js.map → p-BFclKl59.js.map} +1 -1
- package/dist/components/{p-B3-UiLOb.js → p-BQR8GTeD.js} +4 -4
- package/dist/components/{p-B3-UiLOb.js.map → p-BQR8GTeD.js.map} +1 -1
- package/dist/components/{p-Cwa0Scin.js → p-BV65zDeF.js} +6 -5
- package/dist/components/p-BV65zDeF.js.map +1 -0
- package/dist/components/p-BYf-ybt2.js +269 -0
- package/dist/components/p-BYf-ybt2.js.map +1 -0
- package/dist/components/{p-CmjvNSNS.js → p-Bws0p2kF.js} +3 -3
- package/dist/components/{p-CmjvNSNS.js.map → p-Bws0p2kF.js.map} +1 -1
- package/dist/components/{p-D_I5tXD6.js → p-CLODAhOA.js} +6 -8
- package/dist/components/p-CLODAhOA.js.map +1 -0
- package/dist/components/{p-DyncZo9Q.js → p-Cf1_Ckwe.js} +10 -10
- package/dist/components/{p-DyncZo9Q.js.map → p-Cf1_Ckwe.js.map} +1 -1
- package/dist/components/{p-Dg9QFKjM.js → p-DCdQLHpa.js} +7 -7
- package/dist/components/{p-Dg9QFKjM.js.map → p-DCdQLHpa.js.map} +1 -1
- package/dist/components/{p-BrGg4-IA.js → p-Dy4OXsOy.js} +6 -6
- package/dist/components/{p-BrGg4-IA.js.map → p-Dy4OXsOy.js.map} +1 -1
- package/dist/components/sd-badge.d.ts +11 -0
- package/dist/components/sd-badge.js +46 -0
- package/dist/components/sd-badge.js.map +1 -0
- package/dist/components/sd-button.js +1 -1
- package/dist/components/sd-checkbox.js +1 -1
- package/dist/components/sd-date-box.js +1 -1
- package/dist/components/sd-date-picker.js +8 -8
- package/dist/components/sd-date-range-picker.js +8 -8
- package/dist/components/sd-guide.js +8 -7
- 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 +8 -8
- package/dist/components/sd-portal.js +1 -1
- package/dist/components/sd-select-option.js +1 -1
- package/dist/components/sd-select.js +7 -7
- package/dist/components/sd-table.js +8 -8
- package/dist/components/sd-tag.js +2 -2
- 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/design-system.esm.js.map +1 -1
- package/dist/design-system/{p-12aaaa03.entry.js → p-1c85c36d.entry.js} +2 -2
- package/dist/design-system/p-308edd31.entry.js +2 -0
- package/dist/design-system/p-308edd31.entry.js.map +1 -0
- package/dist/design-system/p-7b32ab16.entry.js +2 -0
- package/dist/design-system/{p-997af0ed.entry.js.map → p-7b32ab16.entry.js.map} +1 -1
- package/dist/design-system/{p-7e33f5e5.entry.js → p-8ac68037.entry.js} +2 -2
- package/dist/design-system/{p-1f393066.entry.js → p-97900de1.entry.js} +2 -2
- package/dist/design-system/{p-2bb928fc.entry.js → p-9cc14b6e.entry.js} +2 -2
- package/dist/design-system/p-BYf-ybt2.js +2 -0
- package/dist/design-system/p-BYf-ybt2.js.map +1 -0
- package/dist/design-system/p-D8LjiNqp.js +2 -0
- package/dist/design-system/{p-DMW6VeLX.js.map → p-D8LjiNqp.js.map} +1 -1
- package/dist/design-system/{p-DVhJrGoi.js → p-DON0UcbL.js} +2 -2
- package/dist/design-system/p-DON0UcbL.js.map +1 -0
- package/dist/design-system/{p-c87c465b.entry.js → p-acf8aec2.entry.js} +2 -2
- package/dist/design-system/{p-912c7a8d.entry.js → p-b24ace19.entry.js} +2 -2
- package/dist/design-system/{p-8b2b47a7.entry.js → p-b2516c36.entry.js} +2 -2
- package/dist/design-system/p-cb0d8ecc.entry.js +2 -0
- package/dist/design-system/p-cb0d8ecc.entry.js.map +1 -0
- package/dist/design-system/{p-97dbc008.entry.js → p-d4395043.entry.js} +2 -2
- package/dist/design-system/{p-5db3252c.entry.js → p-dfbbde69.entry.js} +2 -2
- package/dist/design-system/{p-682cf57d.entry.js → p-ef6a088a.entry.js} +2 -2
- package/dist/design-system/sd-badge.entry.esm.js.map +1 -0
- package/dist/design-system/sd-button.sd-guide.sd-icon.sd-portal.entry.esm.js.map +1 -1
- package/dist/esm/design-system.js +4 -4
- package/dist/esm/design-system.js.map +1 -1
- package/dist/esm/{index-DVhJrGoi.js → index-DON0UcbL.js} +5 -7
- package/dist/esm/index-DON0UcbL.js.map +1 -0
- package/dist/esm/loader.js +3 -3
- package/dist/esm/resolveColor-BYf-ybt2.js +269 -0
- package/dist/esm/resolveColor-BYf-ybt2.js.map +1 -0
- package/dist/esm/sd-badge.entry.js +21 -0
- package/dist/esm/sd-badge.entry.js.map +1 -0
- package/dist/esm/sd-button.sd-guide.sd-icon.sd-portal.entry.js.map +1 -1
- package/dist/esm/sd-button_4.entry.js +49 -313
- package/dist/esm/sd-checkbox.entry.js +2 -2
- package/dist/esm/sd-date-box_2.entry.js +3 -3
- package/dist/esm/sd-date-picker.entry.js +3 -3
- package/dist/esm/sd-date-range-picker.entry.js +3 -3
- package/dist/esm/sd-pagination_2.entry.js +6 -6
- package/dist/esm/sd-popover.entry.js +4 -4
- package/dist/esm/sd-select-option.entry.js +2 -2
- package/dist/esm/sd-select.entry.js +1 -1
- package/dist/esm/sd-table.entry.js +1 -1
- package/dist/esm/sd-tag.entry.js +1 -1
- package/dist/esm/sd-tooltip-portal.entry.js +2 -2
- package/dist/esm/{tooltipArrow-BZiofDi8.js → tooltipArrow-Dv8Sb6cw.js} +3 -3
- package/dist/esm/{tooltipArrow-BZiofDi8.js.map → tooltipArrow-Dv8Sb6cw.js.map} +1 -1
- package/dist/types/components/sd-badge/sd-badge.d.ts +6 -0
- package/dist/types/components.d.ts +37 -0
- package/dist/types/stencil-public-runtime.d.ts +1 -1
- package/hydrate/index.js +69 -40
- package/hydrate/index.mjs +69 -40
- package/package.json +2 -2
- package/dist/cjs/index-iB3JlG0y.js.map +0 -1
- package/dist/components/p-B0--8AFP.js.map +0 -1
- package/dist/components/p-Cwa0Scin.js.map +0 -1
- package/dist/components/p-D_I5tXD6.js.map +0 -1
- package/dist/design-system/p-997af0ed.entry.js +0 -2
- package/dist/design-system/p-DMW6VeLX.js +0 -2
- package/dist/design-system/p-DVhJrGoi.js.map +0 -1
- package/dist/design-system/p-e40ff66a.entry.js +0 -2
- package/dist/design-system/p-e40ff66a.entry.js.map +0 -1
- package/dist/esm/index-DVhJrGoi.js.map +0 -1
- /package/dist/design-system/{p-12aaaa03.entry.js.map → p-1c85c36d.entry.js.map} +0 -0
- /package/dist/design-system/{p-7e33f5e5.entry.js.map → p-8ac68037.entry.js.map} +0 -0
- /package/dist/design-system/{p-1f393066.entry.js.map → p-97900de1.entry.js.map} +0 -0
- /package/dist/design-system/{p-2bb928fc.entry.js.map → p-9cc14b6e.entry.js.map} +0 -0
- /package/dist/design-system/{p-c87c465b.entry.js.map → p-acf8aec2.entry.js.map} +0 -0
- /package/dist/design-system/{p-912c7a8d.entry.js.map → p-b24ace19.entry.js.map} +0 -0
- /package/dist/design-system/{p-8b2b47a7.entry.js.map → p-b2516c36.entry.js.map} +0 -0
- /package/dist/design-system/{p-97dbc008.entry.js.map → p-d4395043.entry.js.map} +0 -0
- /package/dist/design-system/{p-5db3252c.entry.js.map → p-dfbbde69.entry.js.map} +0 -0
- /package/dist/design-system/{p-682cf57d.entry.js.map → p-ef6a088a.entry.js.map} +0 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H,
|
|
2
|
-
import { d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CLODAhOA.js';
|
|
2
|
+
import { d as defineCustomElement$1 } from './p-0rgiptJp.js';
|
|
3
3
|
|
|
4
4
|
const sdInputCss = "@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-input{display:flex;width:var(--input-width, 100%);align-items:center;height:28px;padding:4px 8px;border:1px solid #aaaaaa;border-radius:4px;color:#333333;font-size:12px;line-height:20px;background:white}.sd-input--hovered,.sd-input--focused{border-color:#0075ff;box-shadow:0 0 4px 0 rgba(0, 113, 255, 0.4)}.sd-input.sd-input--error{border-color:#fb4444}.sd-input.sd-input--pass{border-color:#2bce6c}.sd-input.sd-input--barcode:not(.sd-input--disabled){background-color:#fafaa1}.sd-input.sd-input--disabled{background-color:#eeeeee !important;border-color:#cccccc !important;cursor:not-allowed !important;box-shadow:none !important}.sd-input.sd-input--disabled .sd-input__native_element{color:#888888 !important}.sd-input .sd-input__native_element{display:block;width:100%;height:20px;line-height:20px;border:none;outline:none;background:transparent;font-size:inherit;color:#333333;margin-left:4px;margin-right:4px;padding-block:0;padding-inline:0}.sd-input .sd-input__native_element::placeholder{font-size:12px;height:20px;line-height:20px;color:#aaaaaa}";
|
|
5
5
|
|
|
@@ -104,11 +104,11 @@ const SdInput = /*@__PURE__*/ proxyCustomElement(class SdInput extends H {
|
|
|
104
104
|
'--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,
|
|
105
105
|
}
|
|
106
106
|
: {};
|
|
107
|
-
return (h(Host, { key: '
|
|
107
|
+
return (h(Host, { key: 'a98bd133a5e00feaea2c3d2a4ef8e63a9e9e1dc5', style: inputWidth }, this.label && h("div", { key: 'c5bce4ee152a83f1e34a63a7e347c449f27e568e', class: "sd-input__label" }, this.label), h("label", { key: '77c9bf2b1bad3839afef09a55c170924355b4ec9', class: {
|
|
108
108
|
'sd-input': true,
|
|
109
109
|
[this.getInputStatus()]: true,
|
|
110
110
|
'sd-input--barcode': !!this.barcode,
|
|
111
|
-
}, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, h("slot", { key: '
|
|
111
|
+
}, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, h("slot", { key: 'a81d4ae208787b2a74a000cc1baf3e288cc42132', name: "prefix" }), h("input", { key: 'fc5141f2364ca939e0a8ed7425143f5c1ecab572', 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) }), h("slot", { key: 'deabb72ce63756290ba752774a207c65f2bf287f', name: "suffix" }), this.clearable && this.internalValue && (h("sd-icon", { key: '8e62dc1e4a17d12ae26c01ffe5c3ac40da516a46', name: "close", color: "#888", style: { marginRight: '-4px', marginLeft: '8px', cursor: 'pointer' }, onClick: () => {
|
|
112
112
|
this.internalValue = '';
|
|
113
113
|
this.sdChange?.emit(this.internalValue);
|
|
114
114
|
this.sdInput?.emit(this.internalValue);
|
|
@@ -119,7 +119,7 @@ const SdInput = /*@__PURE__*/ proxyCustomElement(class SdInput extends H {
|
|
|
119
119
|
"internalValue": ["internalValueChanged"]
|
|
120
120
|
}; }
|
|
121
121
|
static get style() { return sdInputCss; }
|
|
122
|
-
}, [
|
|
122
|
+
}, [772, "sd-input", {
|
|
123
123
|
"value": [1032],
|
|
124
124
|
"label": [1],
|
|
125
125
|
"placeholder": [1],
|
|
@@ -162,6 +162,6 @@ function defineCustomElement() {
|
|
|
162
162
|
}
|
|
163
163
|
|
|
164
164
|
export { SdInput as S, defineCustomElement as d };
|
|
165
|
-
//# sourceMappingURL=p-
|
|
165
|
+
//# sourceMappingURL=p-BFclKl59.js.map
|
|
166
166
|
|
|
167
|
-
//# sourceMappingURL=p-
|
|
167
|
+
//# sourceMappingURL=p-BFclKl59.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-CvQARSF2.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-input/sd-input.scss?tag=sd-input","src/components/sd-input/sd-input.tsx"],"sourcesContent":["@import 'global.scss';\r\n\r\n.sd-input {\r\n display: flex;\r\n width: var(--input-width, 100%);\r\n align-items: center;\r\n height: 28px;\r\n padding: 4px 8px;\r\n border: 1px solid $grey_55;\r\n border-radius: 4px;\r\n color: $grey_90;\r\n font-size: 12px;\r\n line-height: 20px;\r\n background: white;\r\n\r\n &--hovered,\r\n &--focused {\r\n border-color: $brilliantblue_75;\r\n box-shadow: 0 0 4px 0 #0071ff66;\r\n }\r\n\r\n &.sd-input--error {\r\n border-color: $red_70;\r\n }\r\n\r\n &.sd-input--pass {\r\n border-color: $green_65;\r\n }\r\n\r\n &.sd-input--barcode:not(.sd-input--disabled) {\r\n background-color: $olive_15;\r\n }\r\n\r\n &.sd-input--disabled {\r\n background-color: $grey_20 !important;\r\n border-color: $grey_45 !important;\r\n cursor: not-allowed !important;\r\n box-shadow: none !important;\r\n .sd-input__native_element {\r\n color: $grey_65 !important;\r\n }\r\n }\r\n\r\n .sd-input__native_element {\r\n display: block;\r\n width: 100%;\r\n height: 20px;\r\n line-height: 20px;\r\n border: none;\r\n outline: none;\r\n background: transparent;\r\n font-size: inherit;\r\n color: $grey_90;\r\n margin-left: 4px;\r\n margin-right: 4px;\r\n padding-block: 0;\r\n padding-inline: 0;\r\n\r\n &::placeholder {\r\n font-size: 12px;\r\n height: 20px;\r\n line-height: 20px;\r\n color: $grey_55;\r\n }\r\n }\r\n}\r\n","import {\r\n Component,\r\n Element,\r\n Host,\r\n Prop,\r\n State,\r\n Watch,\r\n Event,\r\n EventEmitter,\r\n h,\r\n Method,\r\n} from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'sd-input',\r\n styleUrl: 'sd-input.scss',\r\n})\r\nexport class SdInput {\r\n @Element() el!: HTMLElement;\r\n\r\n @Prop({ mutable: true }) value?: string | number | null = null;\r\n @Prop() label?: string;\r\n @Prop() placeholder: string = '입력해 주세요.';\r\n @Prop() disabled: boolean = false;\r\n @Prop() clearable: boolean = false;\r\n @Prop() width?: number | string;\r\n @Prop() barcode?: boolean = false;\r\n @Prop() rules?: Array<(value: string | number | null) => boolean | string>;\r\n @Prop() autoFocus: boolean = false;\r\n @Prop() status?: 'default' | 'pass' | 'error';\r\n @Prop() inputClass: string = '';\r\n @Prop() readonly: boolean = false;\r\n\r\n // props - custom styles\r\n @Prop() inputStyle: { [key: string]: string } = {};\r\n\r\n @State() private internalValue: string | number | null = null;\r\n @State() private error: boolean = false;\r\n @State() private focused: boolean = false;\r\n @State() private hovered: boolean = false;\r\n\r\n private nativeEl: HTMLInputElement | undefined = undefined;\r\n\r\n @Event() sdClick?: EventEmitter<string | number | null>;\r\n @Event() sdInput?: EventEmitter<string | number | null>;\r\n @Event() sdChange?: EventEmitter<string | number | null>;\r\n @Event() sdFocus?: EventEmitter<Event>;\r\n @Event() sdBlur?: EventEmitter<Event>;\r\n\r\n @Watch('value')\r\n valueChanged(newValue: string | number | null) {\r\n this.internalValue = newValue;\r\n }\r\n\r\n @Watch('internalValue')\r\n internalValueChanged(newValue: string | number | null) {\r\n if (newValue !== this.value) {\r\n this.value = newValue;\r\n this.sdInput?.emit(this.value);\r\n }\r\n\r\n if (!this.rules || this.rules.length === 0) return;\r\n this.error = false;\r\n for (const rule of this.rules) {\r\n const result = rule(newValue);\r\n if (result !== true) {\r\n this.error = true;\r\n break;\r\n }\r\n }\r\n }\r\n\r\n @Method()\r\n async getNativeElement(): Promise<HTMLInputElement | null> {\r\n return this.nativeEl || null;\r\n }\r\n\r\n componentWillLoad() {\r\n if (this.value) {\r\n this.internalValue = this.value;\r\n }\r\n }\r\n\r\n private handleInput = (event: Event) => {\r\n const target = event.target as HTMLInputElement;\r\n this.internalValue = target.value;\r\n this.sdInput?.emit(this.internalValue);\r\n };\r\n\r\n private handleChange = (event: Event) => {\r\n const target = event.target as HTMLInputElement;\r\n this.internalValue = target.value;\r\n this.sdChange?.emit(this.internalValue);\r\n };\r\n\r\n private handleFocus = (type: 'focus' | 'blur', event: Event) => {\r\n this.focused = type === 'focus';\r\n\r\n if (type === 'blur') this.sdBlur?.emit(event);\r\n else this.sdFocus?.emit(event);\r\n };\r\n\r\n getInputStatus() {\r\n // input 상태 우선순위: hovered > focused > status(상태 주입) > error(rules 검사)\r\n if (this.disabled) return 'sd-input--disabled';\r\n if (this.hovered) return 'sd-input--hovered';\r\n if (this.focused) return 'sd-input--focused';\r\n if (this.status) return `sd-input--${this.status}`;\r\n if (this.error) return 'sd-input--error';\r\n return '';\r\n }\r\n\r\n render() {\r\n const inputWidth = this.width\r\n ? {\r\n '--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,\r\n }\r\n : {};\r\n\r\n return (\r\n <Host style={inputWidth}>\r\n {this.label && <div class=\"sd-input__label\">{this.label}</div>}\r\n <label\r\n class={{\r\n 'sd-input': true,\r\n [this.getInputStatus()]: true,\r\n 'sd-input--barcode': !!this.barcode,\r\n }}\r\n onMouseEnter={() => (this.hovered = true)}\r\n onMouseLeave={() => (this.hovered = false)}\r\n style={this.inputStyle}\r\n >\r\n <slot name=\"prefix\"></slot>\r\n <input\r\n ref={el => (this.nativeEl = el)}\r\n class={`sd-input__native_element ${this.inputClass}`}\r\n type=\"text\"\r\n value={this.internalValue || ''}\r\n placeholder={this.placeholder}\r\n disabled={this.disabled}\r\n readonly={this.readonly}\r\n autofocus={this.autoFocus}\r\n onInput={this.handleInput}\r\n onChange={this.handleChange}\r\n onFocus={event => this.handleFocus('focus', event)}\r\n onBlur={event => this.handleFocus('blur', event)}\r\n />\r\n <slot name=\"suffix\"></slot>\r\n {this.clearable && this.internalValue && (\r\n <sd-icon\r\n name=\"close\"\r\n color=\"#888\"\r\n style={{ marginRight: '-4px', marginLeft: '8px', cursor: 'pointer' }}\r\n onClick={() => {\r\n this.internalValue = '';\r\n this.sdChange?.emit(this.internalValue);\r\n this.sdInput?.emit(this.internalValue);\r\n }}\r\n />\r\n )}\r\n </label>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
1
|
+
{"file":"p-BFclKl59.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-input/sd-input.scss?tag=sd-input","src/components/sd-input/sd-input.tsx"],"sourcesContent":["@import 'global.scss';\r\n\r\n.sd-input {\r\n display: flex;\r\n width: var(--input-width, 100%);\r\n align-items: center;\r\n height: 28px;\r\n padding: 4px 8px;\r\n border: 1px solid $grey_55;\r\n border-radius: 4px;\r\n color: $grey_90;\r\n font-size: 12px;\r\n line-height: 20px;\r\n background: white;\r\n\r\n &--hovered,\r\n &--focused {\r\n border-color: $brilliantblue_75;\r\n box-shadow: 0 0 4px 0 #0071ff66;\r\n }\r\n\r\n &.sd-input--error {\r\n border-color: $red_70;\r\n }\r\n\r\n &.sd-input--pass {\r\n border-color: $green_65;\r\n }\r\n\r\n &.sd-input--barcode:not(.sd-input--disabled) {\r\n background-color: $olive_15;\r\n }\r\n\r\n &.sd-input--disabled {\r\n background-color: $grey_20 !important;\r\n border-color: $grey_45 !important;\r\n cursor: not-allowed !important;\r\n box-shadow: none !important;\r\n .sd-input__native_element {\r\n color: $grey_65 !important;\r\n }\r\n }\r\n\r\n .sd-input__native_element {\r\n display: block;\r\n width: 100%;\r\n height: 20px;\r\n line-height: 20px;\r\n border: none;\r\n outline: none;\r\n background: transparent;\r\n font-size: inherit;\r\n color: $grey_90;\r\n margin-left: 4px;\r\n margin-right: 4px;\r\n padding-block: 0;\r\n padding-inline: 0;\r\n\r\n &::placeholder {\r\n font-size: 12px;\r\n height: 20px;\r\n line-height: 20px;\r\n color: $grey_55;\r\n }\r\n }\r\n}\r\n","import {\r\n Component,\r\n Element,\r\n Host,\r\n Prop,\r\n State,\r\n Watch,\r\n Event,\r\n EventEmitter,\r\n h,\r\n Method,\r\n} from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'sd-input',\r\n styleUrl: 'sd-input.scss',\r\n})\r\nexport class SdInput {\r\n @Element() el!: HTMLElement;\r\n\r\n @Prop({ mutable: true }) value?: string | number | null = null;\r\n @Prop() label?: string;\r\n @Prop() placeholder: string = '입력해 주세요.';\r\n @Prop() disabled: boolean = false;\r\n @Prop() clearable: boolean = false;\r\n @Prop() width?: number | string;\r\n @Prop() barcode?: boolean = false;\r\n @Prop() rules?: Array<(value: string | number | null) => boolean | string>;\r\n @Prop() autoFocus: boolean = false;\r\n @Prop() status?: 'default' | 'pass' | 'error';\r\n @Prop() inputClass: string = '';\r\n @Prop() readonly: boolean = false;\r\n\r\n // props - custom styles\r\n @Prop() inputStyle: { [key: string]: string } = {};\r\n\r\n @State() private internalValue: string | number | null = null;\r\n @State() private error: boolean = false;\r\n @State() private focused: boolean = false;\r\n @State() private hovered: boolean = false;\r\n\r\n private nativeEl: HTMLInputElement | undefined = undefined;\r\n\r\n @Event() sdClick?: EventEmitter<string | number | null>;\r\n @Event() sdInput?: EventEmitter<string | number | null>;\r\n @Event() sdChange?: EventEmitter<string | number | null>;\r\n @Event() sdFocus?: EventEmitter<Event>;\r\n @Event() sdBlur?: EventEmitter<Event>;\r\n\r\n @Watch('value')\r\n valueChanged(newValue: string | number | null) {\r\n this.internalValue = newValue;\r\n }\r\n\r\n @Watch('internalValue')\r\n internalValueChanged(newValue: string | number | null) {\r\n if (newValue !== this.value) {\r\n this.value = newValue;\r\n this.sdInput?.emit(this.value);\r\n }\r\n\r\n if (!this.rules || this.rules.length === 0) return;\r\n this.error = false;\r\n for (const rule of this.rules) {\r\n const result = rule(newValue);\r\n if (result !== true) {\r\n this.error = true;\r\n break;\r\n }\r\n }\r\n }\r\n\r\n @Method()\r\n async getNativeElement(): Promise<HTMLInputElement | null> {\r\n return this.nativeEl || null;\r\n }\r\n\r\n componentWillLoad() {\r\n if (this.value) {\r\n this.internalValue = this.value;\r\n }\r\n }\r\n\r\n private handleInput = (event: Event) => {\r\n const target = event.target as HTMLInputElement;\r\n this.internalValue = target.value;\r\n this.sdInput?.emit(this.internalValue);\r\n };\r\n\r\n private handleChange = (event: Event) => {\r\n const target = event.target as HTMLInputElement;\r\n this.internalValue = target.value;\r\n this.sdChange?.emit(this.internalValue);\r\n };\r\n\r\n private handleFocus = (type: 'focus' | 'blur', event: Event) => {\r\n this.focused = type === 'focus';\r\n\r\n if (type === 'blur') this.sdBlur?.emit(event);\r\n else this.sdFocus?.emit(event);\r\n };\r\n\r\n getInputStatus() {\r\n // input 상태 우선순위: hovered > focused > status(상태 주입) > error(rules 검사)\r\n if (this.disabled) return 'sd-input--disabled';\r\n if (this.hovered) return 'sd-input--hovered';\r\n if (this.focused) return 'sd-input--focused';\r\n if (this.status) return `sd-input--${this.status}`;\r\n if (this.error) return 'sd-input--error';\r\n return '';\r\n }\r\n\r\n render() {\r\n const inputWidth = this.width\r\n ? {\r\n '--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,\r\n }\r\n : {};\r\n\r\n return (\r\n <Host style={inputWidth}>\r\n {this.label && <div class=\"sd-input__label\">{this.label}</div>}\r\n <label\r\n class={{\r\n 'sd-input': true,\r\n [this.getInputStatus()]: true,\r\n 'sd-input--barcode': !!this.barcode,\r\n }}\r\n onMouseEnter={() => (this.hovered = true)}\r\n onMouseLeave={() => (this.hovered = false)}\r\n style={this.inputStyle}\r\n >\r\n <slot name=\"prefix\"></slot>\r\n <input\r\n ref={el => (this.nativeEl = el)}\r\n class={`sd-input__native_element ${this.inputClass}`}\r\n type=\"text\"\r\n value={this.internalValue || ''}\r\n placeholder={this.placeholder}\r\n disabled={this.disabled}\r\n readonly={this.readonly}\r\n autofocus={this.autoFocus}\r\n onInput={this.handleInput}\r\n onChange={this.handleChange}\r\n onFocus={event => this.handleFocus('focus', event)}\r\n onBlur={event => this.handleFocus('blur', event)}\r\n />\r\n <slot name=\"suffix\"></slot>\r\n {this.clearable && this.internalValue && (\r\n <sd-icon\r\n name=\"close\"\r\n color=\"#888\"\r\n style={{ marginRight: '-4px', marginLeft: '8px', cursor: 'pointer' }}\r\n onClick={() => {\r\n this.internalValue = '';\r\n this.sdChange?.emit(this.internalValue);\r\n this.sdInput?.emit(this.internalValue);\r\n }}\r\n />\r\n )}\r\n </label>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H,
|
|
1
|
+
import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CLODAhOA.js';
|
|
2
2
|
|
|
3
3
|
const sdDateBoxCss = "@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-date-box:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html.sc-sd-date-box{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary.sc-sd-date-box{background-color:var(--color-primary, #051d36)}.bg-secondary.sc-sd-date-box{background-color:var(--color-secondary, #555555)}.bg-accent.sc-sd-date-box{background-color:var(--color-accent, #9c27b0)}.bg-positive.sc-sd-date-box{background-color:var(--color-positive, #0075ff)}.bg-negative.sc-sd-date-box{background-color:var(--color-negative, #e30000)}.bg-info.sc-sd-date-box{background-color:var(--color-info, #00cd52)}.bg-warning.sc-sd-date-box{background-color:var(--color-warning, #f2c037)}.bg-red_99.sc-sd-date-box{background-color:var(--color-red_99, #220000)}.bg-red_95.sc-sd-date-box{background-color:var(--color-red_95, #440000)}.bg-red_90.sc-sd-date-box{background-color:var(--color-red_90, #5E0000)}.bg-red_85.sc-sd-date-box{background-color:var(--color-red_85, #820000)}.bg-red_80.sc-sd-date-box{background-color:var(--color-red_80, #AD0000)}.bg-red_75.sc-sd-date-box{background-color:var(--color-red_75, #E30000)}.bg-red_70.sc-sd-date-box{background-color:var(--color-red_70, #FB4444)}.bg-red_60.sc-sd-date-box{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45.sc-sd-date-box{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30.sc-sd-date-box{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20.sc-sd-date-box{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15.sc-sd-date-box{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg.sc-sd-date-box{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon.sc-sd-date-box{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99.sc-sd-date-box{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95.sc-sd-date-box{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90.sc-sd-date-box{background-color:var(--color-orange_90, #752A00)}.bg-orange_85.sc-sd-date-box{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75.sc-sd-date-box{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65.sc-sd-date-box{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60.sc-sd-date-box{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55.sc-sd-date-box{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45.sc-sd-date-box{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35.sc-sd-date-box{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20.sc-sd-date-box{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10.sc-sd-date-box{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert.sc-sd-date-box{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95.sc-sd-date-box{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90.sc-sd-date-box{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80.sc-sd-date-box{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70.sc-sd-date-box{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60.sc-sd-date-box{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50.sc-sd-date-box{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45.sc-sd-date-box{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40.sc-sd-date-box{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30.sc-sd-date-box{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25.sc-sd-date-box{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20.sc-sd-date-box{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10.sc-sd-date-box{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95.sc-sd-date-box{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90.sc-sd-date-box{background-color:var(--color-olive_90, #454500)}.bg-olive_80.sc-sd-date-box{background-color:var(--color-olive_80, #636300)}.bg-olive_70.sc-sd-date-box{background-color:var(--color-olive_70, #838300)}.bg-olive_65.sc-sd-date-box{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55.sc-sd-date-box{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45.sc-sd-date-box{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30.sc-sd-date-box{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20.sc-sd-date-box{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15.sc-sd-date-box{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10.sc-sd-date-box{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05.sc-sd-date-box{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99.sc-sd-date-box{background-color:var(--color-green_99, #001D0B)}.bg-green_95.sc-sd-date-box{background-color:var(--color-green_95, #003013)}.bg-green_90.sc-sd-date-box{background-color:var(--color-green_90, #00461C)}.bg-green_85.sc-sd-date-box{background-color:var(--color-green_85, #006629)}.bg-green_80.sc-sd-date-box{background-color:var(--color-green_80, #007B31)}.bg-green_75.sc-sd-date-box{background-color:var(--color-green_75, #00973C)}.bg-green_70.sc-sd-date-box{background-color:var(--color-green_70, #12B553)}.bg-green_65.sc-sd-date-box{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55.sc-sd-date-box{background-color:var(--color-green_55, #6DE39C)}.bg-green_45.sc-sd-date-box{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25.sc-sd-date-box{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15.sc-sd-date-box{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99.sc-sd-date-box{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95.sc-sd-date-box{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90.sc-sd-date-box{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85.sc-sd-date-box{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80.sc-sd-date-box{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75.sc-sd-date-box{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70.sc-sd-date-box{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65.sc-sd-date-box{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60.sc-sd-date-box{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45.sc-sd-date-box{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25.sc-sd-date-box{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10.sc-sd-date-box{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99.sc-sd-date-box{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95.sc-sd-date-box{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90.sc-sd-date-box{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85.sc-sd-date-box{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80.sc-sd-date-box{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75.sc-sd-date-box{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70.sc-sd-date-box{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65.sc-sd-date-box{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60.sc-sd-date-box{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50.sc-sd-date-box{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25.sc-sd-date-box{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15.sc-sd-date-box{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99.sc-sd-date-box{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95.sc-sd-date-box{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90.sc-sd-date-box{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85.sc-sd-date-box{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80.sc-sd-date-box{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75.sc-sd-date-box{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70.sc-sd-date-box{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60.sc-sd-date-box{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50.sc-sd-date-box{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40.sc-sd-date-box{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25.sc-sd-date-box{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20.sc-sd-date-box{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10.sc-sd-date-box{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05.sc-sd-date-box{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95.sc-sd-date-box{background-color:var(--color-grey_95, #222222)}.bg-grey_90.sc-sd-date-box{background-color:var(--color-grey_90, #333333)}.bg-grey_85.sc-sd-date-box{background-color:var(--color-grey_85, #444444)}.bg-grey_80.sc-sd-date-box{background-color:var(--color-grey_80, #555555)}.bg-grey_70.sc-sd-date-box{background-color:var(--color-grey_70, #737373)}.bg-grey_65.sc-sd-date-box{background-color:var(--color-grey_65, #888888)}.bg-grey_60.sc-sd-date-box{background-color:var(--color-grey_60, #999999)}.bg-grey_55.sc-sd-date-box{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50.sc-sd-date-box{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45.sc-sd-date-box{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35.sc-sd-date-box{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30.sc-sd-date-box{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25.sc-sd-date-box{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20.sc-sd-date-box{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10.sc-sd-date-box{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05.sc-sd-date-box{background-color:var(--color-grey_05, #f9f9f9)}.bg-white.sc-sd-date-box{background-color:var(--color-white, #ffffff)}.bg-black.sc-sd-date-box{background-color:var(--color-black, #000000)}.text-primary.sc-sd-date-box{color:var(--color-primary, #051d36)}.text-secondary.sc-sd-date-box{color:var(--color-secondary, #555555)}.text-accent.sc-sd-date-box{color:var(--color-accent, #9c27b0)}.text-positive.sc-sd-date-box{color:var(--color-positive, #0075ff)}.text-negative.sc-sd-date-box{color:var(--color-negative, #e30000)}.text-info.sc-sd-date-box{color:var(--color-info, #00cd52)}.text-warning.sc-sd-date-box{color:var(--color-warning, #f2c037)}.text-red_99.sc-sd-date-box{color:var(--color-red_99, #220000)}.text-red_95.sc-sd-date-box{color:var(--color-red_95, #440000)}.text-red_90.sc-sd-date-box{color:var(--color-red_90, #5E0000)}.text-red_85.sc-sd-date-box{color:var(--color-red_85, #820000)}.text-red_80.sc-sd-date-box{color:var(--color-red_80, #AD0000)}.text-red_75.sc-sd-date-box{color:var(--color-red_75, #E30000)}.text-red_70.sc-sd-date-box{color:var(--color-red_70, #FB4444)}.text-red_60.sc-sd-date-box{color:var(--color-red_60, #FF7C7C)}.text-red_45.sc-sd-date-box{color:var(--color-red_45, #FFB5B5)}.text-red_30.sc-sd-date-box{color:var(--color-red_30, #FFD3D3)}.text-red_20.sc-sd-date-box{color:var(--color-red_20, #FCE6E6)}.text-red_15.sc-sd-date-box{color:var(--color-red_15, #FCEFEF)}.text-caution_bg.sc-sd-date-box{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon.sc-sd-date-box{color:var(--color-caution_icon, #fd9595)}.text-orange_99.sc-sd-date-box{color:var(--color-orange_99, #2F1100)}.text-orange_95.sc-sd-date-box{color:var(--color-orange_95, #4D1B00)}.text-orange_90.sc-sd-date-box{color:var(--color-orange_90, #752A00)}.text-orange_85.sc-sd-date-box{color:var(--color-orange_85, #9B3700)}.text-orange_75.sc-sd-date-box{color:var(--color-orange_75, #CE4900)}.text-orange_65.sc-sd-date-box{color:var(--color-orange_65, #FF6B00)}.text-orange_60.sc-sd-date-box{color:var(--color-orange_60, #FF7F22)}.text-orange_55.sc-sd-date-box{color:var(--color-orange_55, #FFA452)}.text-orange_45.sc-sd-date-box{color:var(--color-orange_45, #FFBC81)}.text-orange_35.sc-sd-date-box{color:var(--color-orange_35, #FFD5AF)}.text-orange_20.sc-sd-date-box{color:var(--color-orange_20, #FFEAD7)}.text-orange_10.sc-sd-date-box{color:var(--color-orange_10, #FEF1EA)}.text-header_alert.sc-sd-date-box{color:var(--color-header_alert, #FF7A00)}.text-yellow_95.sc-sd-date-box{color:var(--color-yellow_95, #322700)}.text-yellow_90.sc-sd-date-box{color:var(--color-yellow_90, #453702)}.text-yellow_80.sc-sd-date-box{color:var(--color-yellow_80, #6C5602)}.text-yellow_70.sc-sd-date-box{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60.sc-sd-date-box{color:var(--color-yellow_60, #C49900)}.text-yellow_50.sc-sd-date-box{color:var(--color-yellow_50, #EBB800)}.text-yellow_45.sc-sd-date-box{color:var(--color-yellow_45, #FFC700)}.text-yellow_40.sc-sd-date-box{color:var(--color-yellow_40, #FFD643)}.text-yellow_30.sc-sd-date-box{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25.sc-sd-date-box{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20.sc-sd-date-box{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10.sc-sd-date-box{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95.sc-sd-date-box{color:var(--color-olive_95, #2C2C00)}.text-olive_90.sc-sd-date-box{color:var(--color-olive_90, #454500)}.text-olive_80.sc-sd-date-box{color:var(--color-olive_80, #636300)}.text-olive_70.sc-sd-date-box{color:var(--color-olive_70, #838300)}.text-olive_65.sc-sd-date-box{color:var(--color-olive_65, #A5A500)}.text-olive_55.sc-sd-date-box{color:var(--color-olive_55, #C7C700)}.text-olive_45.sc-sd-date-box{color:var(--color-olive_45, #DDDD12)}.text-olive_30.sc-sd-date-box{color:var(--color-olive_30, #EEEE37)}.text-olive_20.sc-sd-date-box{color:var(--color-olive_20, #F6F65F)}.text-olive_15.sc-sd-date-box{color:var(--color-olive_15, #FAFAA1)}.text-olive_10.sc-sd-date-box{color:var(--color-olive_10, #FBFBBF)}.text-olive_05.sc-sd-date-box{color:var(--color-olive_05, #FEFED9)}.text-green_99.sc-sd-date-box{color:var(--color-green_99, #001D0B)}.text-green_95.sc-sd-date-box{color:var(--color-green_95, #003013)}.text-green_90.sc-sd-date-box{color:var(--color-green_90, #00461C)}.text-green_85.sc-sd-date-box{color:var(--color-green_85, #006629)}.text-green_80.sc-sd-date-box{color:var(--color-green_80, #007B31)}.text-green_75.sc-sd-date-box{color:var(--color-green_75, #00973C)}.text-green_70.sc-sd-date-box{color:var(--color-green_70, #12B553)}.text-green_65.sc-sd-date-box{color:var(--color-green_65, #2BCE6C)}.text-green_55.sc-sd-date-box{color:var(--color-green_55, #6DE39C)}.text-green_45.sc-sd-date-box{color:var(--color-green_45, #ACF4C9)}.text-green_25.sc-sd-date-box{color:var(--color-green_25, #D4FAE3)}.text-green_15.sc-sd-date-box{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99.sc-sd-date-box{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95.sc-sd-date-box{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90.sc-sd-date-box{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85.sc-sd-date-box{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80.sc-sd-date-box{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75.sc-sd-date-box{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70.sc-sd-date-box{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65.sc-sd-date-box{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60.sc-sd-date-box{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45.sc-sd-date-box{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25.sc-sd-date-box{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10.sc-sd-date-box{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99.sc-sd-date-box{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95.sc-sd-date-box{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90.sc-sd-date-box{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85.sc-sd-date-box{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80.sc-sd-date-box{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75.sc-sd-date-box{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70.sc-sd-date-box{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65.sc-sd-date-box{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60.sc-sd-date-box{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50.sc-sd-date-box{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25.sc-sd-date-box{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15.sc-sd-date-box{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99.sc-sd-date-box{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95.sc-sd-date-box{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90.sc-sd-date-box{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85.sc-sd-date-box{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80.sc-sd-date-box{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75.sc-sd-date-box{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70.sc-sd-date-box{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60.sc-sd-date-box{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50.sc-sd-date-box{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40.sc-sd-date-box{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25.sc-sd-date-box{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20.sc-sd-date-box{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10.sc-sd-date-box{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05.sc-sd-date-box{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95.sc-sd-date-box{color:var(--color-grey_95, #222222)}.text-grey_90.sc-sd-date-box{color:var(--color-grey_90, #333333)}.text-grey_85.sc-sd-date-box{color:var(--color-grey_85, #444444)}.text-grey_80.sc-sd-date-box{color:var(--color-grey_80, #555555)}.text-grey_70.sc-sd-date-box{color:var(--color-grey_70, #737373)}.text-grey_65.sc-sd-date-box{color:var(--color-grey_65, #888888)}.text-grey_60.sc-sd-date-box{color:var(--color-grey_60, #999999)}.text-grey_55.sc-sd-date-box{color:var(--color-grey_55, #aaaaaa)}.text-grey_50.sc-sd-date-box{color:var(--color-grey_50, #bbbbbb)}.text-grey_45.sc-sd-date-box{color:var(--color-grey_45, #cccccc)}.text-grey_35.sc-sd-date-box{color:var(--color-grey_35, #D8D8D8)}.text-grey_30.sc-sd-date-box{color:var(--color-grey_30, #e1e1e1)}.text-grey_25.sc-sd-date-box{color:var(--color-grey_25, #E5E5E5)}.text-grey_20.sc-sd-date-box{color:var(--color-grey_20, #eeeeee)}.text-grey_10.sc-sd-date-box{color:var(--color-grey_10, #f6f6f6)}.text-grey_05.sc-sd-date-box{color:var(--color-grey_05, #f9f9f9)}.text-white.sc-sd-date-box{color:var(--color-white, #ffffff)}.text-black.sc-sd-date-box{color:var(--color-black, #000000)}*.sc-sd-date-box,*.sc-sd-date-box::before,*.sc-sd-date-box::after{box-sizing:border-box}html.sc-sd-date-box{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body.sc-sd-date-box,h1.sc-sd-date-box,h2.sc-sd-date-box,h3.sc-sd-date-box,h4.sc-sd-date-box,p.sc-sd-date-box,figure.sc-sd-date-box,blockquote.sc-sd-date-box,dl.sc-sd-date-box,dd.sc-sd-date-box{margin-block-end:0}ul[role=list].sc-sd-date-box,ol[role=list].sc-sd-date-box{list-style:none}body.sc-sd-date-box{min-height:100vh;line-height:1.5}h1.sc-sd-date-box,h2.sc-sd-date-box,h3.sc-sd-date-box,h4.sc-sd-date-box,button.sc-sd-date-box,input.sc-sd-date-box,label.sc-sd-date-box{line-height:1}h1.sc-sd-date-box,h2.sc-sd-date-box,h3.sc-sd-date-box,h4.sc-sd-date-box{text-wrap:balance}a.sc-sd-date-box:not([class]){text-decoration-skip-ink:auto;color:currentColor}img.sc-sd-date-box,picture.sc-sd-date-box{max-width:100%;display:block}input.sc-sd-date-box,button.sc-sd-date-box,textarea.sc-sd-date-box,select.sc-sd-date-box{font-size:inherit}.sc-sd-date-box:target{scroll-margin-block:5ex}button.sc-sd-date-box{background:none;border:none;cursor:pointer;padding:0;outline:0}button.sc-sd-date-box:focus{outline:0 !important}.sc-sd-date-box-h{display:inline-block;height:fit-content;line-height:0}.text-center.sc-sd-date-box{text-align:center}.text-right.sc-sd-date-box{text-align:right}.text-left.sc-sd-date-box{text-align:left}input[type=text].sc-sd-date-box,input[type=number].sc-sd-date-box,input[type=password].sc-sd-date-box,input[type=email].sc-sd-date-box,input[type=tel].sc-sd-date-box,textarea.sc-sd-date-box{padding-block:0px;padding-inline:0px}.sd-hoverable.sc-sd-date-box:hover>.sd-focus-helper.sc-sd-date-box{background:currentColor;opacity:0.15}.sd-hoverable.sc-sd-date-box:hover>.sd-focus-helper.sc-sd-date-box:before{opacity:0.1}.sd-hoverable.sc-sd-date-box:hover>.sd-focus-helper.sc-sd-date-box:after{opacity:0.4}.sd-focus-helper.sc-sd-date-box{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-date-box:before,.sd-focus-helper.sc-sd-date-box: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-date-box:before{background:#000000}.sd-focus-helper.sc-sd-date-box:after{background:#ffffff}.sd-tooltip-menu.sc-sd-date-box{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-date-box{padding-right:12px !important}.sd-tooltip-menu__arrow.sc-sd-date-box{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow.sc-sd-date-box svg.sc-sd-date-box{width:100%;height:100%}.sd-tooltip-menu__arrow--top.sc-sd-date-box{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom.sc-sd-date-box{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left.sc-sd-date-box{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right.sc-sd-date-box{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content.sc-sd-date-box{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button.sc-sd-date-box{padding-top:4px;display:flex}.sd-tooltip-menu__close-button.sc-sd-date-box button.sc-sd-date-box{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu.sc-sd-date-box{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-date-box{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow.sc-sd-date-box svg.sc-sd-date-box{width:100%;height:100%}.sd-popover-menu__arrow--top.sc-sd-date-box{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom.sc-sd-date-box{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left.sc-sd-date-box{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right.sc-sd-date-box{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content.sc-sd-date-box{font-size:12px;line-height:20px}.sd-popover-menu__content.sc-sd-date-box .sd-popover-menu__title.sc-sd-date-box{font-weight:700;margin-bottom:4px}.sd-popover-menu__content.sc-sd-date-box .sd-popover-menu__messages.sc-sd-date-box{font-weight:500}.sd-popover-menu__content.sc-sd-date-box .sd-popover-menu__buttons.sc-sd-date-box{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content.sc-sd-date-box .sd-popover-menu__buttons--1.sc-sd-date-box{justify-content:flex-end}.sd-popover-menu__content.sc-sd-date-box .sd-popover-menu__buttons--2.sc-sd-date-box{justify-content:space-between}.sd-popover-menu__close-button.sc-sd-date-box{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}.sd-date-box.sc-sd-date-box-h{display:flex;align-items:center;justify-content:center;width:38px;height:36px;font-size:14px;position:relative;box-sizing:border-box;text-align:center;transition:background-color 150ms cubic-bezier(0.4, 0, 0.2, 1);border-radius:14px}.sd-date-box.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box{width:28px;height:28px;border-radius:14px;position:relative}.sd-date-box.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box{position:relative;z-index:2;user-select:none;line-height:28px}.sd-date-box.sd-date-box--disabled.sc-sd-date-box-h{color:#cccccc;cursor:default !important;pointer-events:none}.sd-date-box.sc-sd-date-box-h:not(.sd-date-box--disabled){cursor:pointer}.sd-date-box.sd-hoverable.sc-sd-date-box-h:hover .sd-date-box__content.sc-sd-date-box{background:#d9eaff}.sd-date-box.sd-date-box--in-range.sc-sd-date-box-h:not(.sd-date-box--disabled) .sd-date-box__content.sc-sd-date-box::before{content:\"\";position:absolute;top:0;left:-5px;width:calc(100% + 10px);height:100%;background:#d9eaff}.sd-date-box.sd-date-box--in-range.sd-date-box--type-start.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box::before{left:auto !important;width:19px !important;right:-5px}.sd-date-box.sd-date-box--in-range.sd-date-box--type-end.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box::before{width:19px !important}.sd-date-box.sd-date-box--selected.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box::after,.sd-date-box.sd-date-box--type-start.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box::after,.sd-date-box.sd-date-box--type-end.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box::after{content:\"\";position:absolute;inset:0;background:#0075ff;border-radius:14px;z-index:1}.sd-date-box.sd-date-box--selected.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box,.sd-date-box.sd-date-box--type-start.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box,.sd-date-box.sd-date-box--type-end.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box{color:white;font-weight:700}.sd-date-box.sd-date-box--today.sc-sd-date-box-h:not(.sd-date-box--selected) .sd-date-box__content.sc-sd-date-box::after{content:\"\";position:absolute;top:0;left:50%;transform:translateX(-50%);width:28px;height:28px;border:1px solid #e1e1e1 !important;border-radius:14px}";
|
|
4
4
|
|
|
@@ -48,7 +48,7 @@ const SdDateBox = /*@__PURE__*/ proxyCustomElement(class SdDateBox extends H {
|
|
|
48
48
|
}, onClick: () => this.handleClickDate(), onMouseOver: () => this.handleHoverDate() }, h("div", { key: '5673658e4532547f57e86babfce2ac9c8399cfa7', class: "sd-date-box__content" }, h("div", { key: '1e978a0bbf7a1f3e8d13d541d5d75e1b8568ddd8', class: "sd-date-box__label" }, this.date))));
|
|
49
49
|
}
|
|
50
50
|
static get style() { return sdDateBoxCss; }
|
|
51
|
-
}, [
|
|
51
|
+
}, [770, "sd-date-box", {
|
|
52
52
|
"date": [8],
|
|
53
53
|
"disabled": [4],
|
|
54
54
|
"selected": [4],
|
|
@@ -73,6 +73,6 @@ function defineCustomElement() {
|
|
|
73
73
|
}
|
|
74
74
|
|
|
75
75
|
export { SdDateBox as S, defineCustomElement as d };
|
|
76
|
-
//# sourceMappingURL=p-
|
|
76
|
+
//# sourceMappingURL=p-BQR8GTeD.js.map
|
|
77
77
|
|
|
78
|
-
//# sourceMappingURL=p-
|
|
78
|
+
//# sourceMappingURL=p-BQR8GTeD.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-
|
|
1
|
+
{"file":"p-BQR8GTeD.js","mappings":";;AAAA,MAAM,YAAY,GAAG,s+2BAAs+2B;;MCS9+2B,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;;;;;;;;;IACb,IAAI,GAA2B,IAAI;IACnC,QAAQ,GAAY,KAAK;IACzB,QAAQ,GAAY,KAAK;IACzB,WAAW,GAAY,KAAK;IAC5B,SAAS,GAAY,KAAK;IAC1B,OAAO,GAAY,KAAK;IACxB,OAAO,GAAY,KAAK;IACxB,IAAI,GAAS,EAAE;AAEd,IAAA,OAAO;AACP,IAAA,WAAW;IAEZ,eAAe,GAAA;QACtB,IAAI,IAAI,CAAC,QAAQ;YAAE;AACnB,QAAA,IAAI,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ;YAAE;QAEnC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGtB,eAAe,GAAA;AACtB,QAAA,IAAI,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ;YAAE;QAEnC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGlC,MAAM,GAAA;QACL,QACC,CAAC,CAAA,IAAI,EACJ,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAA,eAAA,EACE,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,EAC/C,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,EAAE,GAAG,CAAC,EAChC,KAAK,EAAE;AACN,gBAAA,aAAa,EAAE,IAAI;AACnB,gBAAA,cAAc,EAAE,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,KAAK,EAAE;gBACpE,uBAAuB,EAAE,IAAI,CAAC,QAAQ;gBACtC,uBAAuB,EAAE,IAAI,CAAC,QAAQ;gBACtC,oBAAoB,EAAE,IAAI,CAAC,OAAO;gBAClC,yBAAyB,EAAE,IAAI,CAAC,WAAW;gBAC3C,uBAAuB,EAAE,IAAI,CAAC,SAAS;gBACvC,uBAAuB,EAAE,IAAI,CAAC,OAAO;AACrC,gBAAA,yBAAyB,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;AAChD,gBAAA,uBAAuB,EAAE,IAAI,CAAC,IAAI,KAAK,KAAK;aAC5C,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,EAAE,EACrC,WAAW,EAAE,MAAM,IAAI,CAAC,eAAe,EAAE,EAAA,EAEzC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,sBAAsB,EAAA,EAChC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,oBAAoB,EAAE,EAAA,IAAI,CAAC,IAAI,CAAO,CAC5C,CACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-date-box/sd-date-box.scss?tag=sd-date-box&encapsulation=scoped","src/components/sd-date-box/sd-date-box.tsx"],"sourcesContent":["@import '../../styles/global.scss';\r\n\r\n:host(.sd-date-box) {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 38px;\r\n height: 36px;\r\n font-size: 14px;\r\n position: relative;\r\n box-sizing: border-box;\r\n text-align: center;\r\n transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1);\r\n border-radius: 14px;\r\n\r\n .sd-date-box__content {\r\n width: 28px;\r\n height: 28px;\r\n border-radius: 14px;\r\n position: relative;\r\n .sd-date-box__label {\r\n position: relative;\r\n z-index: 2;\r\n user-select: none;\r\n line-height: 28px;\r\n }\r\n }\r\n\r\n &.sd-date-box--disabled {\r\n color: $grey_45;\r\n cursor: default !important;\r\n pointer-events: none;\r\n }\r\n\r\n &:not(.sd-date-box--disabled) {\r\n cursor: pointer;\r\n }\r\n\r\n &.sd-hoverable {\r\n &:hover {\r\n .sd-date-box__content {\r\n background: $brilliantblue_25;\r\n }\r\n }\r\n }\r\n\r\n &.sd-date-box--in-range {\r\n &:not(.sd-date-box--disabled) {\r\n .sd-date-box__content {\r\n &::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: -5px;\r\n width: calc(100% + 10px);\r\n height: 100%;\r\n background: $brilliantblue_25;\r\n }\r\n }\r\n }\r\n\r\n &.sd-date-box--type-start {\r\n .sd-date-box__content {\r\n &::before {\r\n left: auto !important;\r\n width: 19px !important;\r\n right: -5px;\r\n }\r\n }\r\n }\r\n\r\n &.sd-date-box--type-end {\r\n .sd-date-box__content {\r\n &::before {\r\n width: 19px !important;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.sd-date-box--selected,\r\n &.sd-date-box--type-start,\r\n &.sd-date-box--type-end {\r\n .sd-date-box__content {\r\n &::after {\r\n content: '';\r\n position: absolute;\r\n inset: 0;\r\n background: $brilliantblue_75;\r\n border-radius: 14px;\r\n z-index: 1;\r\n }\r\n\r\n .sd-date-box__label {\r\n color: white;\r\n font-weight: 700;\r\n }\r\n }\r\n }\r\n\r\n &.sd-date-box--today:not(.sd-date-box--selected) {\r\n .sd-date-box__content {\r\n &::after {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n width: 28px;\r\n height: 28px;\r\n border: 1px solid $grey_30 !important;\r\n border-radius: 14px;\r\n }\r\n }\r\n }\r\n}\r\n","import { Component, Event, EventEmitter, Host, Prop, h } from '@stencil/core';\r\n\r\nexport type Type = 'start' | 'end' | '';\r\n\r\n@Component({\r\n tag: 'sd-date-box',\r\n styleUrl: 'sd-date-box.scss',\r\n scoped: true,\r\n})\r\nexport class SdDateBox {\r\n @Prop() date: number | string | null = null;\r\n @Prop() disabled: boolean = false;\r\n @Prop() selected: boolean = false;\r\n @Prop() isStartDate: boolean = false;\r\n @Prop() isEndDate: boolean = false;\r\n @Prop() isToday: boolean = false;\r\n @Prop() inRange: boolean = false;\r\n @Prop() type: Type = '';\r\n\r\n @Event() sdClick?: EventEmitter<number | string | null>;\r\n @Event() sdMouseOver?: EventEmitter<number | string | null>;\r\n\r\n private handleClickDate() {\r\n if (this.disabled) return;\r\n if (typeof this.date === 'string') return;\r\n\r\n this.sdClick?.emit(this.date);\r\n }\r\n\r\n private handleHoverDate() {\r\n if (typeof this.date === 'string') return;\r\n\r\n this.sdMouseOver?.emit(this.date);\r\n }\r\n\r\n render() {\r\n return (\r\n <Host\r\n role=\"button\"\r\n aria-disabled={this.disabled ? 'true' : 'false'}\r\n tabindex={this.disabled ? -1 : 0}\r\n class={{\r\n 'sd-date-box': true,\r\n 'sd-hoverable': !this.disabled || !this.selected || this.type === '',\r\n 'sd-date-box--disabled': this.disabled,\r\n 'sd-date-box--selected': this.selected,\r\n 'sd-date-box--today': this.isToday,\r\n 'sd-date-box--start-date': this.isStartDate,\r\n 'sd-date-box--end-date': this.isEndDate,\r\n 'sd-date-box--in-range': this.inRange,\r\n 'sd-date-box--type-start': this.type === 'start',\r\n 'sd-date-box--type-end': this.type === 'end',\r\n }}\r\n onClick={() => this.handleClickDate()}\r\n onMouseOver={() => this.handleHoverDate()}\r\n >\r\n <div class=\"sd-date-box__content\">\r\n <div class=\"sd-date-box__label\">{this.date}</div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H,
|
|
2
|
-
import {
|
|
1
|
+
import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CLODAhOA.js';
|
|
2
|
+
import { r as resolveColor } from './p-BYf-ybt2.js';
|
|
3
|
+
import { d as defineCustomElement$1 } from './p-0rgiptJp.js';
|
|
3
4
|
|
|
4
5
|
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}";
|
|
5
6
|
|
|
@@ -63,7 +64,7 @@ const SdButton = /*@__PURE__*/ proxyCustomElement(class SdButton extends H {
|
|
|
63
64
|
return (h(Host, { key: 'ae4e4c2b3255ee21487bd857f84c8bfa31b93a41' }, h("button", { key: 'c45695065034c68c6f61bd820163f8a50572d99e', class: buttonClasses, type: this.type, disabled: this.disabled, onClick: this.handleClick, style: { '--button-color': resolvedColor, ...this.buttonStyle } }, h("div", { key: '13500c7e0f7476ba9e111a3b31ee3578018fb572', class: "sd-button__content" }, this.icon && (h("sd-icon", { key: 'dbf632796e8f199b93db99c26b3d7bc53e30c375', 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 && h("div", { key: '6703a0377d5f8eafea62a61a5987abeba10dcaf3', class: "sd-button__label" }, this.label), this.iconRight && (h("sd-icon", { key: 'a5071037fad2e76a4ffd94df547948b9192defe8', class: "sd-button__icon sd-button__icon--right", name: this.iconRight, size: ICON_SIZES[this.size], color: this.variant === 'primary' ? '#fff' : resolvedColor }))))));
|
|
64
65
|
}
|
|
65
66
|
static get style() { return sdButtonCss; }
|
|
66
|
-
}, [
|
|
67
|
+
}, [770, "sd-button", {
|
|
67
68
|
"variant": [1],
|
|
68
69
|
"size": [1],
|
|
69
70
|
"color": [1],
|
|
@@ -98,6 +99,6 @@ function defineCustomElement() {
|
|
|
98
99
|
}
|
|
99
100
|
|
|
100
101
|
export { SdButton as S, defineCustomElement as d };
|
|
101
|
-
//# sourceMappingURL=p-
|
|
102
|
+
//# sourceMappingURL=p-BV65zDeF.js.map
|
|
102
103
|
|
|
103
|
-
//# sourceMappingURL=p-
|
|
104
|
+
//# sourceMappingURL=p-BV65zDeF.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-BV65zDeF.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-button/sd-button.scss?tag=sd-button&encapsulation=scoped","src/components/sd-button/sd-button.tsx"],"sourcesContent":["@import '../../styles/global.scss';\r\n\r\n.sd-button {\r\n text-decoration: none;\r\n cursor: pointer;\r\n border-radius: 4px;\r\n transition: all 0.2s ease-in-out;\r\n position: relative;\r\n overflow: hidden;\r\n white-space: nowrap;\r\n -webkit-user-select: none;\r\n user-select: none;\r\n box-sizing: border-box;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n &--xs {\r\n padding: 0 8px;\r\n font-size: 12px;\r\n font-weight: 500;\r\n line-height: 20px;\r\n min-height: 24px;\r\n }\r\n &--sm {\r\n padding: 0 12px;\r\n font-size: 12px;\r\n font-weight: 500;\r\n line-height: 20px;\r\n min-height: 28px;\r\n }\r\n &--md {\r\n padding: 0 20px;\r\n font-size: 16px;\r\n font-weight: 500;\r\n line-height: 26px;\r\n min-height: 34px;\r\n }\r\n &--lg {\r\n padding: 0 28px;\r\n font-size: 18px;\r\n font-weight: 500;\r\n line-height: 30px;\r\n min-height: 62px;\r\n }\r\n &--primary {\r\n background-color: var(--button-color);\r\n color: white;\r\n transition: filter 0.2s ease;\r\n\r\n &::before {\r\n content: '';\r\n position: absolute;\r\n inset: 0;\r\n background: #000000;\r\n opacity: 0;\r\n transition: opacity 0.2s ease;\r\n z-index: 0;\r\n }\r\n\r\n &:hover:not(.sd-button--disabled):not(.sd-button--loading)::before {\r\n opacity: 0.25;\r\n }\r\n }\r\n\r\n &--outline {\r\n background-color: white;\r\n border: 1px solid var(--button-color);\r\n color: var(--button-color);\r\n\r\n &::before {\r\n content: '';\r\n position: absolute;\r\n inset: 0;\r\n background: var(--button-color);\r\n opacity: 0;\r\n transition: opacity 0.2s ease;\r\n z-index: 0;\r\n }\r\n\r\n &:hover:not(.sd-button--disabled):not(.sd-button--loading)::before {\r\n opacity: 0.15;\r\n }\r\n\r\n .sd-button__content {\r\n position: relative;\r\n z-index: 1;\r\n }\r\n }\r\n &--ghost {\r\n background-color: transparent;\r\n color: var(--button-color);\r\n border-color: transparent;\r\n\r\n &::before {\r\n content: '';\r\n position: absolute;\r\n inset: 0;\r\n background: var(--button-color);\r\n opacity: 0;\r\n transition: opacity 0.2s ease;\r\n z-index: 0;\r\n }\r\n\r\n &:hover:not(.sd-button--disabled):not(.sd-button--loading)::before {\r\n opacity: 0.15;\r\n }\r\n\r\n .sd-button__content {\r\n position: relative;\r\n z-index: 1;\r\n }\r\n }\r\n &--disabled {\r\n border: 1px solid $grey_45;\r\n background: $grey_30;\r\n color: $grey_65;\r\n cursor: not-allowed !important;\r\n }\r\n &--icon-only {\r\n padding: 0;\r\n width: fit-content;\r\n height: fit-content;\r\n aspect-ratio: 1 / 1;\r\n }\r\n &--no-hover {\r\n &:hover::before {\r\n opacity: 0 !important;\r\n }\r\n }\r\n\r\n .sd-button__content {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 4px;\r\n\r\n z-index: 1;\r\n font-weight: 500;\r\n }\r\n}\r\n\r\n// /* Focus styles */\r\n// .sd-button:focus-visible {\r\n// outline: 2px solid $primary;\r\n// outline-offset: 2px;\r\n// }\r\n\r\n// /* High contrast mode support */\r\n// @media (prefers-contrast: high) {\r\n// .sd-button {\r\n// border-width: 2px;\r\n// }\r\n// }\r\n","import { Component, Prop, h, Element, Event, EventEmitter, Host } from '@stencil/core';\r\nimport { resolveColor } from '../../utils/color';\r\n\r\nexport type ButtonVariant = 'primary' | 'outline' | 'ghost';\r\nexport type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';\r\n\r\nconst ICON_SIZES: { [key in ButtonSize]: number } = {\r\n xs: 12,\r\n sm: 16,\r\n md: 20,\r\n lg: 24,\r\n};\r\n\r\n@Component({\r\n tag: 'sd-button',\r\n styleUrl: 'sd-button.scss',\r\n scoped: true,\r\n})\r\nexport class SdButton {\r\n @Element() el!: HTMLElement;\r\n\r\n @Prop() variant?: ButtonVariant = 'primary';\r\n @Prop() size: ButtonSize = 'sm';\r\n @Prop() color: string = '#025497';\r\n @Prop() label: string = '';\r\n @Prop() disabled: boolean = false;\r\n @Prop() type: 'button' | 'submit' | 'reset' = 'button';\r\n @Prop() icon?: IconName;\r\n @Prop() iconColor?: string;\r\n @Prop() iconSize?: number;\r\n @Prop() iconRight?: IconName;\r\n @Prop() noHover: boolean = false;\r\n\r\n @Prop() buttonStyle: StyleProps = {};\r\n @Prop() iconStyle: StyleProps = {};\r\n\r\n @Event() sdClick!: EventEmitter<MouseEvent>;\r\n\r\n private handleClick = (event: MouseEvent) => {\r\n if (this.disabled) {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n return;\r\n }\r\n this.sdClick.emit(event);\r\n };\r\n\r\n private getButtonClasses(): string {\r\n const classes = ['sd-button'];\r\n\r\n classes.push(`sd-button--${this.variant}`);\r\n classes.push(`sd-button--${this.size}`);\r\n classes.push(`sd-button--color-${this.color}`);\r\n\r\n if (this.disabled) {\r\n classes.push('sd-button--disabled');\r\n }\r\n\r\n if (!this.label && (this.icon || this.iconRight)) {\r\n classes.push('sd-button--icon-only');\r\n }\r\n\r\n if (this.noHover) {\r\n classes.push('sd-button--no-hover');\r\n }\r\n\r\n return classes.join(' ');\r\n }\r\n\r\n render() {\r\n const buttonClasses = this.getButtonClasses();\r\n // 유틸로 색상 키 -> HEX 매핑 (없으면 원본 그대로)\r\n const resolvedColor = resolveColor(this.color);\r\n\r\n return (\r\n <Host>\r\n <button\r\n class={buttonClasses}\r\n type={this.type}\r\n disabled={this.disabled}\r\n onClick={this.handleClick}\r\n style={{ '--button-color': resolvedColor, ...this.buttonStyle }}\r\n >\r\n <div class=\"sd-button__content\">\r\n {this.icon && (\r\n <sd-icon\r\n class=\"sd-button__icon sd-button__icon--left\"\r\n name={this.icon}\r\n size={this.iconSize ? this.iconSize : ICON_SIZES[this.size!]}\r\n color={\r\n this.iconColor ? this.iconColor : this.variant === 'primary' ? '#fff' : resolvedColor\r\n }\r\n ></sd-icon>\r\n )}\r\n\r\n {this.label && <div class=\"sd-button__label\">{this.label}</div>}\r\n\r\n {this.iconRight && (\r\n <sd-icon\r\n class=\"sd-button__icon sd-button__icon--right\"\r\n name={this.iconRight}\r\n size={ICON_SIZES[this.size!]}\r\n color={this.variant === 'primary' ? '#fff' : resolvedColor}\r\n ></sd-icon>\r\n )}\r\n </div>\r\n </button>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
|