npm - @sellmate/design-system - Versions diffs - 0.0.12 → 0.0.13 - Mend

@sellmate/design-system 0.0.12 → 0.0.13

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.

Files changed (210) hide show

package/dist/components/p-Cf4fh47I.js ADDED Viewed

@@ -0,0 +1,106 @@
+import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CLODAhOA.js';
+import { d as defineCustomElement$2 } from './p-CuDrOaaO.js';
+import { d as defineCustomElement$1 } from './p-DVFPBdfj.js';
+const sdSelectOptionGroupCss = "@font-face{font-family:\"Pretendard\";font-weight:800;font-display:swap;src:local(\"Pretendard-ExtraBold\"), url(\"./fonts/Pretendard-ExtraBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-ExtraBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:700;font-display:swap;src:local(\"Pretendard-Bold\"), url(\"./fonts/Pretendard-Bold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Bold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:600;font-display:swap;src:local(\"Pretendard-SemiBold\"), url(\"./fonts/Pretendard-SemiBold.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-SemiBold.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:500;font-display:swap;src:local(\"Pretendard-Medium\"), url(\"./fonts/Pretendard-Medium.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Medium.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:400;font-display:swap;src:local(\"Pretendard-Regular\"), url(\"./fonts/Pretendard-Regular.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Regular.ttf\") format(\"truetype\");}@font-face{font-family:\"Pretendard\";font-weight:300;font-display:swap;src:local(\"Pretendard-Light\"), url(\"./fonts/Pretendard-Light.subset.woff2\") format(\"font-woff2\"), url(\"./fonts/Pretendard-Light.ttf\") format(\"truetype\");}:root{--font-family-base:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}html{font-family:\"Pretendard\", -apple-system, BlinkMacSystemFont, system-ui, sans-serif}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}.sd-popover-menu{width:fit-content;padding:12px 20px;border-radius:4px;color:white;background:#07284a;font-size:12px;position:relative;box-sizing:border-box}.sd-popover-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-popover-menu__arrow svg{width:100%;height:100%}.sd-popover-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-popover-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-popover-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-popover-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-popover-menu__content{font-size:12px;line-height:20px}.sd-popover-menu__content .sd-popover-menu__title{font-weight:700;margin-bottom:4px}.sd-popover-menu__content .sd-popover-menu__messages{font-weight:500}.sd-popover-menu__content .sd-popover-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-popover-menu__content .sd-popover-menu__buttons--1{justify-content:flex-end}.sd-popover-menu__content .sd-popover-menu__buttons--2{justify-content:space-between}.sd-popover-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}:host{display:block;height:fit-content}.sd-select__option-group{display:flex;padding:4px 12px;padding-left:28px;font-size:12px;line-height:20px}.sd-select__option-group.sd-select__option-group--group:not(.sd-select__option-group--use-checkbox),.sd-select__option-group.sd-select__option-group--subgroup:not(.sd-select__option-group--use-checkbox){cursor:default}.sd-select__option-group.sd-select__option-group--group{padding-left:12px;background-color:#f5faff !important;color:#333333 !important;font-weight:700}.sd-select__option-group.sd-select__option-group--subgroup{padding-left:20px;background-color:#f9f9f9 !important;color:#333333 !important;font-weight:500}.sd-select__option-group__checkbox-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sd-select__option-group--focused{background-color:#e6f1ff}.sd-select__option-group--selected:not(:hover):not(.sd-select__option-group--use-checkbox),.sd-select__option-group--focused:not(:hover):not(.sd-select__option-group--use-checkbox){color:#0075ff;font-weight:700}.sd-select__option-group--disabled{color:#aaaaaa;cursor:not-allowed}.sd-select__option-group:hover:not(.sd-select__option-group--disabled){background-color:#0075ff;color:white}";
+const SdSelectOptionGroup = /*@__PURE__*/ proxyCustomElement(class SdSelectOptionGroup extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.optionClick = createEvent(this, "optionClick");
+    }
+    get el() { return this; }
+    option;
+    index;
+    isSelected = false;
+    isFocused = false;
+    optionStyle;
+    disabled = false;
+    useCheckbox = false;
+    isHovered = false;
+    async isDisabled() {
+        return !!this.option.disabled || this.option.type === 'group' || this.option.type === 'subgroup';
+    }
+    optionClick;
+    handleClick = (option, isSelected, event) => {
+        event.stopPropagation();
+        if (option.type === 'group' || option.type === 'subgroup') {
+            this.optionClick.emit({
+                option: this.option,
+                isSelected,
+                index: this.index,
+                event,
+            });
+            return;
+        }
+        if (!this.option.disabled && !this.disabled) {
+            this.optionClick.emit({
+                option: this.option,
+                isSelected,
+                index: this.index,
+                event,
+            });
+        }
+    };
+    render() {
+        return (h(Host, { key: '2c25ad33d49eefbfedae7e1b9ee4453131b53321' }, h("div", { key: '4f6ef860ca32e13bb8253d768f8bf70b4fd1fe91', class: {
+                'sd-select__option-group': true,
+                'sd-select__option-group--selected': !!this.isSelected,
+                'sd-select__option-group--disabled': !!this.option.disabled,
+                'sd-select__option-group--focused': this.isFocused,
+                'sd-select__option-group--use-checkbox': this.useCheckbox,
+                'sd-select__option-group--group': this.option.type === 'group',
+                'sd-select__option-group--subgroup': this.option.type === 'subgroup',
+                'sd-select__option-group--item': this.option.type === 'item',
+            }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, this.useCheckbox ? (h("div", { class: "sd-select__option-group__checkbox-wrapper" }, h("sd-checkbox", { checked: this.isSelected, disabled: this.option.disabled, checkboxStyle: !this.isSelected
+                ? { borderColor: '#888' }
+                : this.isHovered
+                    ? { borderColor: 'white' }
+                    : { borderColor: '#0075ff' }, onClick: e => {
+                e.preventDefault();
+                this.handleClick(this.option, this.isSelected, e);
+            } }), h("span", { class: "sd-select__option-group-label" }, this.option.label))) : (this.option.label))));
+    }
+    static get style() { return sdSelectOptionGroupCss; }
+}, [768, "sd-select-option-group", {
+        "option": [16],
+        "index": [2],
+        "isSelected": [4, "is-selected"],
+        "isFocused": [4, "is-focused"],
+        "optionStyle": [16],
+        "disabled": [4],
+        "useCheckbox": [4, "use-checkbox"],
+        "isHovered": [32],
+        "isDisabled": [64]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["sd-select-option-group", "sd-checkbox", "sd-icon"];
+    components.forEach(tagName => { switch (tagName) {
+        case "sd-select-option-group":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SdSelectOptionGroup);
+            }
+            break;
+        case "sd-checkbox":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "sd-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+export { SdSelectOptionGroup as S, defineCustomElement as d };
+//# sourceMappingURL=p-Cf4fh47I.js.map
+//# sourceMappingURL=p-Cf4fh47I.js.map

package/dist/components/p-Cf4fh47I.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"p-Cf4fh47I.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.scss?tag=sd-select-option-group","src/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.tsx"],"sourcesContent":["@import 'global';\r\n\r\n:host {\r\n display: block;\r\n height: fit-content;\r\n}\r\n\r\n.sd-select__option-group {\r\n display: flex;\r\n padding: 4px 12px;\r\n padding-left: 28px;\r\n font-size: 12px;\r\n line-height: 20px;\r\n\r\n &.sd-select__option-group--group,\r\n &.sd-select__option-group--subgroup {\r\n &:not(.sd-select__option-group--use-checkbox) {\r\n cursor: default;\r\n }\r\n }\r\n\r\n &.sd-select__option-group--group {\r\n padding-left: 12px;\r\n background-color: $brilliantblue_05 !important;\r\n color: $grey_90 !important;\r\n font-weight: 700;\r\n }\r\n\r\n &.sd-select__option-group--subgroup {\r\n padding-left: 20px;\r\n background-color: $grey_05 !important;\r\n color: $grey_90 !important;\r\n font-weight: 500;\r\n }\r\n\r\n &__checkbox-wrapper {\r\n display: flex;\r\n width: 100%;\r\n column-gap: 8px;\r\n align-items: center;\r\n overflow: hidden;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n }\r\n\r\n &--focused {\r\n background-color: $brilliantblue_20;\r\n }\r\n\r\n &--selected,\r\n &--focused {\r\n &:not(:hover):not(.sd-select__option-group--use-checkbox) {\r\n color: $brilliantblue_75;\r\n font-weight: 700;\r\n }\r\n }\r\n\r\n &--disabled {\r\n color: $grey_55;\r\n cursor: not-allowed;\r\n }\r\n\r\n &:hover {\r\n &:not(.sd-select__option-group--disabled) {\r\n background-color: $brilliantblue_75;\r\n color: white;\r\n }\r\n }\r\n}\r\n","import {\r\n Component,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n h,\r\n Host,\r\n Method,\r\n Prop,\r\n State,\r\n} from '@stencil/core';\r\nimport { SelectOptionGroup } from '../../sd-select/sd-select';\r\n\r\n@Component({\r\n tag: 'sd-select-option-group',\r\n styleUrl: 'sd-select-option-group.scss',\r\n})\r\nexport class SdSelectOptionGroup {\r\n @Element() el!: HTMLElement;\r\n\r\n @Prop() option!: SelectOptionGroup;\r\n @Prop() index!: number;\r\n @Prop() isSelected: boolean | null = false;\r\n @Prop() isFocused: boolean = false;\r\n @Prop() optionStyle?: { [key: string]: string };\r\n @Prop() disabled: boolean = false;\r\n @Prop() useCheckbox: boolean = false;\r\n\r\n @State() isHovered: boolean = false;\r\n\r\n @Method()\r\n async isDisabled(): Promise<boolean> {\r\n return !!this.option.disabled || this.option.type === 'group' || this.option.type === 'subgroup';\r\n }\r\n\r\n @Event() optionClick!: EventEmitter<{\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n }>;\r\n\r\n private handleClick = (\r\n option: SelectOptionGroup,\r\n isSelected: boolean | null,\r\n event: MouseEvent,\r\n ) => {\r\n event.stopPropagation();\r\n\r\n if (option.type === 'group' || option.type === 'subgroup') {\r\n this.optionClick.emit({\r\n option: this.option,\r\n isSelected,\r\n index: this.index,\r\n event,\r\n });\r\n return;\r\n }\r\n\r\n if (!this.option.disabled && !this.disabled) {\r\n this.optionClick.emit({\r\n option: this.option,\r\n isSelected,\r\n index: this.index,\r\n event,\r\n });\r\n }\r\n };\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <div\r\n class={{\r\n 'sd-select__option-group': true,\r\n 'sd-select__option-group--selected': !!this.isSelected,\r\n 'sd-select__option-group--disabled': !!this.option.disabled,\r\n 'sd-select__option-group--focused': this.isFocused,\r\n 'sd-select__option-group--use-checkbox': this.useCheckbox,\r\n 'sd-select__option-group--group': this.option.type === 'group',\r\n 'sd-select__option-group--subgroup': this.option.type === 'subgroup',\r\n 'sd-select__option-group--item': this.option.type === 'item',\r\n }}\r\n onMouseEnter={() => (this.isHovered = true)}\r\n onMouseLeave={() => (this.isHovered = false)}\r\n style={this.optionStyle}\r\n data-index={this.index}\r\n onClick={event => this.handleClick(this.option, this.isSelected, event)}\r\n >\r\n {this.useCheckbox ? (\r\n <div class=\"sd-select__option-group__checkbox-wrapper\">\r\n <sd-checkbox\r\n checked={this.isSelected}\r\n disabled={this.option.disabled}\r\n checkboxStyle={\r\n !this.isSelected\r\n ? { borderColor: '#888' }\r\n : this.isHovered\r\n ? { borderColor: 'white' }\r\n : { borderColor: '#0075ff' }\r\n }\r\n onClick={e => {\r\n e.preventDefault();\r\n this.handleClick(this.option, this.isSelected, e);\r\n }}\r\n ></sd-checkbox>\r\n <span class=\"sd-select__option-group-label\">{this.option.label}</span>\r\n </div>\r\n ) : (\r\n this.option.label\r\n )}\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-hwVfUtSx.js → p-CuDrOaaO.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CLODAhOA.js';
-import { d as defineCustomElement$1 } from './p-CI-1-u3u.js';
+import { d as defineCustomElement$1 } from './p-DVFPBdfj.js';
-const sdCheckboxCss = ".sd-checkbox.sc-sd-checkbox{line-height:0;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:20px;max-height:20px;position:relative;cursor:pointer}.sd-checkbox.sc-sd-checkbox>input.sc-sd-checkbox{display:none}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--checked .sd-checkbox__bg.sc-sd-checkbox{background:#005cc9}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--unchecked .sd-checkbox__bg.sc-sd-checkbox{border:1px solid #0075ff;background:#d9eaff}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--disabled .sd-checkbox__bg.sc-sd-checkbox{border:1px solid transparent;background:#eeeeee}.sd-checkbox__bg.sc-sd-checkbox{width:16px;height:16px;border-radius:2px;border:1px solid #888888;box-sizing:border-box;display:inline-flex;justify-content:center;align-items:center;overflow:hidden;line-height:0}.sd-checkbox__label.sc-sd-checkbox{font-size:12px;color:#333333;line-height:20px}.sd-checkbox--checked.sd-checkbox--disabled.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:#eeeeee;border:1px solid #cccccc !important}.sd-checkbox--checked.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{border:0;background:#0075ff}.sd-checkbox--unchecked.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:white}.sd-checkbox--disabled.sc-sd-checkbox{cursor:not-allowed}.sd-checkbox--disabled.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:#eeeeee;border:1px solid #cccccc !important}";
+const sdCheckboxCss = ".sd-checkbox.sc-sd-checkbox{line-height:0;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:20px;max-height:20px;position:relative;cursor:pointer}.sd-checkbox.sc-sd-checkbox>input.sc-sd-checkbox{display:none}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--checked .sd-checkbox__bg.sc-sd-checkbox{border-color:1px solid #005cc9;background:#005cc9}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--unchecked .sd-checkbox__bg.sc-sd-checkbox{border:1px solid #0075ff;background:#d9eaff}.sd-checkbox.sc-sd-checkbox:hover.sd-checkbox--disabled .sd-checkbox__bg.sc-sd-checkbox{border:1px solid transparent;background:#eeeeee}.sd-checkbox__bg.sc-sd-checkbox{width:16px;height:16px;border-radius:2px;border:1px solid #888888;box-sizing:border-box;display:inline-flex;justify-content:center;align-items:center;overflow:hidden;line-height:0}.sd-checkbox__label.sc-sd-checkbox{font-size:12px;color:#333333;line-height:20px}.sd-checkbox--checked.sd-checkbox--disabled.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:#eeeeee;border:1px solid #cccccc !important}.sd-checkbox--checked.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{border:1px solid #0075ff;background:#0075ff}.sd-checkbox--unchecked.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:white}.sd-checkbox--disabled.sc-sd-checkbox{cursor:not-allowed}.sd-checkbox--disabled.sc-sd-checkbox .sd-checkbox__bg.sc-sd-checkbox{background:#eeeeee;border:1px solid #cccccc !important}";
 const SdCheckbox = /*@__PURE__*/ proxyCustomElement(class SdCheckbox extends H {
     constructor(registerHost) {
@@ -71,7 +71,7 @@ const SdCheckbox = /*@__PURE__*/ proxyCustomElement(class SdCheckbox extends H {
         this.sdChange.emit(newValue);
     };
     render() {
-        return (h(Host, { key: '33dcecda70333bd89c1ca7f463dff7ab7f831d3f' }, h("label", { key: 'e4dd05930a655be5a86eeee294d8f8df5c944880', class: this.getCheckboxClasses() }, h("input", { key: '9beb8dd096c1a3de891e446e124c49cfdc3d94de', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onChange: this.handleChange }), h("div", { key: '551540600b67521601d5e487b2aa0229390357cb', class: "sd-checkbox__bg", style: this.checkboxStyle }, this.isChecked ? (h("sd-icon", { name: "check", size: 12, color: this.disabled ? '#888888' : 'white' })) : null), this.label && h("span", { key: '56e548b559c3491051cd6a490c1a150850926389', class: "sd-checkbox__label" }, this.label))));
+        return (h(Host, { key: '6e88ca34b4464d33b0aa54880eff5821d5c612d9' }, h("label", { key: '392dc3fe13ef18eb34625b830702f390131d2bab', class: this.getCheckboxClasses() }, h("input", { key: 'ed84bc69e4928488cf1ae76e62b0cbea4ca6a636', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onChange: this.handleChange }), h("div", { key: 'e434643d9bda619da1af184ea93b333364cc4972', class: "sd-checkbox__bg", style: this.checkboxStyle }, this.isChecked ? (h("sd-icon", { name: "check", size: 12, color: this.disabled ? '#888888' : 'white' })) : null), this.label && h("span", { key: '84d72a707e97e7b22a2c3183353bc295340ba490', class: "sd-checkbox__label" }, this.label))));
     }
     static get watchers() { return {
         "checked": ["watchValueHandler"]
@@ -107,6 +107,6 @@ function defineCustomElement() {
 }
 export { SdCheckbox as S, defineCustomElement as d };
-//# sourceMappingURL=p-hwVfUtSx.js.map
+//# sourceMappingURL=p-CuDrOaaO.js.map
-//# sourceMappingURL=p-hwVfUtSx.js.map
+//# sourceMappingURL=p-CuDrOaaO.js.map

package/dist/components/p-CuDrOaaO.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"p-CuDrOaaO.js","mappings":";;;AAAA,MAAM,aAAa,GAAG,i7CAAi7C;;MCiB17C,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;;;;;;;;;;IAId,OAAO,GAAgB,KAAK;;AAG5B,IAAA,GAAG;;IAGH,QAAQ,GAAY,KAAK;;IAGzB,KAAK,GAAW,EAAE;IAElB,aAAa,GAAe,EAAE;;IAGrB,SAAS,GAAY,KAAK;;AAGlC,IAAA,QAAQ;IAEjB,iBAAiB,GAAA;AAChB,QAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC;;AAItC,IAAA,iBAAiB,CAAC,QAAqB,EAAA;AACtC,QAAA,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC;;IAG1B,kBAAkB,GAAA;AACzB,QAAA,MAAM,OAAO,GAAG,CAAC,aAAa,EAAE,CAAA,aAAA,EAAgB,IAAI,CAAC,SAAS,GAAG,SAAS,GAAG,WAAW,CAAA,CAAE,CAAC;AAE3F,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AAClB,YAAA,OAAO,CAAC,IAAI,CAAC,uBAAuB,CAAC;;AAGtC,QAAA,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;;AAGjB,IAAA,kBAAkB,CAAC,KAAkB,EAAA;AAC5C,QAAA,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE;AAC/B,YAAA,IAAI,CAAC,SAAS,GAAG,KAAK;;AAChB,aAAA,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;AAChC,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,KAAK,SAAS,IAAI,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC;;aAC7D;AACN,YAAA,IAAI,CAAC,SAAS,GAAG,KAAK;;;IAIhB,YAAY,GAAG,MAAK;QAC3B,IAAI,IAAI,CAAC,QAAQ;YAAE;AAEnB,QAAA,IAAI,QAAqB;AAEzB,QAAA,IAAI,OAAO,IAAI,CAAC,OAAO,KAAK,SAAS,EAAE;AACtC,YAAA,QAAQ,GAAG,CAAC,IAAI,CAAC,OAAO;;aAClB,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;AACvC,YAAA,IAAI,IAAI,CAAC,GAAG,KAAK,SAAS,EAAE;AAC3B,gBAAA,OAAO,CAAC,IAAI,CAAC,4EAA4E,CAAC;gBAC1F;;YAGD,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;AACtC,YAAA,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC;AAC3E,YAAA,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC;;aACzB;AACN,YAAA,QAAQ,GAAG,CAAC,IAAI,CAAC,SAAS;;AAG3B,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC;AAC7B,KAAC;IAED,MAAM,GAAA;AACL,QAAA,QACC,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACJ,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAE,IAAI,CAAC,kBAAkB,EAAE,EAAA,EACtC,CACC,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,IAAI,CAAC,SAAS,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC1B,CAAA,EACF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAC,KAAK,EAAE,IAAI,CAAC,aAAa,EAAA,EACpD,IAAI,CAAC,SAAS,IACd,CAAS,CAAA,SAAA,EAAA,EAAA,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,OAAO,EAAA,CAAI,IAC3E,IAAI,CACH,EACL,IAAI,CAAC,KAAK,IAAI,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,oBAAoB,EAAE,EAAA,IAAI,CAAC,KAAK,CAAQ,CAC5D,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-checkbox/sd-checkbox.scss?tag=sd-checkbox&encapsulation=scoped","src/components/sd-checkbox/sd-checkbox.tsx"],"sourcesContent":["@import '../../styles/variables.scss';\r\n\r\n.sd-checkbox {\r\n line-height: 0;\r\n\r\n cursor: pointer;\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 8px;\r\n height: 20px;\r\n max-height: 20px;\r\n position: relative;\r\n cursor: pointer;\r\n\r\n > input {\r\n display: none;\r\n }\r\n\r\n &:hover {\r\n &.sd-checkbox--checked {\r\n .sd-checkbox__bg {\r\n border-color: 1px solid $brilliantblue_80;\r\n background: $brilliantblue_80;\r\n }\r\n }\r\n\r\n &.sd-checkbox--unchecked {\r\n .sd-checkbox__bg {\r\n border: 1px solid $brilliantblue_75;\r\n background: $brilliantblue_25;\r\n }\r\n }\r\n\r\n &.sd-checkbox--disabled {\r\n .sd-checkbox__bg {\r\n border: 1px solid transparent;\r\n background: $grey_20;\r\n }\r\n }\r\n }\r\n\r\n &__bg {\r\n width: 16px;\r\n height: 16px;\r\n border-radius: 2px;\r\n border: 1px solid $grey_65;\r\n box-sizing: border-box;\r\n display: inline-flex;\r\n justify-content: center;\r\n align-items: center;\r\n overflow: hidden;\r\n line-height: 0;\r\n }\r\n\r\n &__label {\r\n font-size: 12px;\r\n color: $grey_90;\r\n line-height: 20px;\r\n }\r\n\r\n &--checked {\r\n &.sd-checkbox--disabled {\r\n .sd-checkbox__bg {\r\n background: $grey_20;\r\n border: 1px solid $grey_45 !important;\r\n }\r\n }\r\n\r\n .sd-checkbox__bg {\r\n border: 1px solid $brilliantblue_75;\r\n background: $brilliantblue_75;\r\n }\r\n }\r\n\r\n &--unchecked {\r\n .sd-checkbox__bg {\r\n background: white;\r\n }\r\n }\r\n\r\n &--disabled {\r\n cursor: not-allowed;\r\n .sd-checkbox__bg {\r\n background: $grey_20;\r\n border: 1px solid $grey_45 !important;\r\n }\r\n }\r\n}\r\n","import {\r\n Component,\r\n Prop,\r\n h,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n State,\r\n Watch,\r\n Host,\r\n} from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'sd-checkbox',\r\n styleUrl: 'sd-checkbox.scss',\r\n scoped: true,\r\n})\r\nexport class SdCheckbox {\r\n @Element() el!: HTMLElement;\r\n\r\n /** 현재 선택 상태 또는 배열 형태의 값 */\r\n @Prop() checked: any[] | any = false;\r\n\r\n /** 배열 모드에서의 개별 값 */\r\n @Prop() val?: any;\r\n\r\n /** 비활성화 여부 */\r\n @Prop() disabled: boolean = false;\r\n\r\n /** 표시할 라벨 텍스트 */\r\n @Prop() label: string = '';\r\n\r\n @Prop() checkboxStyle: StyleProps = {};\r\n\r\n /** 내부 체크 상태 */\r\n @State() private isChecked: boolean = false;\r\n\r\n /** 값 변경 이벤트 */\r\n @Event() sdChange!: EventEmitter<any | any[]>;\r\n\r\n componentWillLoad() {\r\n this.updateCheckedState(this.checked);\r\n }\r\n\r\n @Watch('checked')\r\n watchValueHandler(newValue: any | any[]) {\r\n this.updateCheckedState(newValue);\r\n }\r\n\r\n private getCheckboxClasses(): string {\r\n const classes = ['sd-checkbox', `sd-checkbox--${this.isChecked ? 'checked' : 'unchecked'}`];\r\n\r\n if (this.disabled) {\r\n classes.push('sd-checkbox--disabled');\r\n }\r\n\r\n return classes.join(' ');\r\n }\r\n\r\n private updateCheckedState(value: any | any[]) {\r\n if (typeof value === 'boolean') {\r\n this.isChecked = value;\r\n } else if (Array.isArray(value)) {\r\n this.isChecked = this.val !== undefined && value.includes(this.val);\r\n } else {\r\n this.isChecked = false;\r\n }\r\n }\r\n\r\n private handleChange = () => {\r\n if (this.disabled) return;\r\n\r\n let newValue: any | any[];\r\n\r\n if (typeof this.checked === 'boolean') {\r\n newValue = !this.checked;\r\n } else if (Array.isArray(this.checked)) {\r\n if (this.val === undefined) {\r\n console.warn('A \"val\" property is required when using an array for the \"value\" property.');\r\n return;\r\n }\r\n\r\n const valueSet = new Set(this.checked);\r\n valueSet.has(this.val) ? valueSet.delete(this.val) : valueSet.add(this.val);\r\n newValue = Array.from(valueSet);\r\n } else {\r\n newValue = !this.isChecked;\r\n }\r\n\r\n this.sdChange.emit(newValue);\r\n };\r\n\r\n render() {\r\n return (\r\n <Host>\r\n <label class={this.getCheckboxClasses()}>\r\n <input\r\n type=\"checkbox\"\r\n checked={this.isChecked}\r\n disabled={this.disabled}\r\n onChange={this.handleChange}\r\n />\r\n <div class=\"sd-checkbox__bg\" style={this.checkboxStyle}>\r\n {this.isChecked ? (\r\n <sd-icon name=\"check\" size={12} color={this.disabled ? '#888888' : 'white'} />\r\n ) : null}\r\n </div>\r\n {this.label && <span class=\"sd-checkbox__label\">{this.label}</span>}\r\n </label>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-CiTGsdkP.js → p-Cw2pw4LC.js} RENAMED Viewed

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, h, F as Fragment } from './p-CLODAhOA.js';
 import { T as TooltipArrow } from './p-Bws0p2kF.js';
-import { d as defineCustomElement$3 } from './p-BO6LLSyN.js';
-import { d as defineCustomElement$2 } from './p-CI-1-u3u.js';
-import { d as defineCustomElement$1 } from './p-exVR_ekC.js';
+import { d as defineCustomElement$3 } from './p-tyC8W4sw.js';
+import { d as defineCustomElement$2 } from './p-DVFPBdfj.js';
+import { d as defineCustomElement$1 } from './p-D267VRcj.js';
 const sdTooltipCss = "@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-tooltip{position:relative;cursor:pointer;display:inline-block}";
@@ -40,11 +40,11 @@ const SdTooltip = /*@__PURE__*/ proxyCustomElement(class SdTooltip extends H {
             : {
                 onClick: () => (console.log('click tooltip'), (this.showTooltip = !this.showTooltip)),
             };
-        return (h(Fragment, { key: '1aa29d1def7cff13d41547e4041bb678f7ecf56d' }, this.label ? (h("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-tooltip", ...handleTrigger })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-tooltip", ...handleTrigger })), this.showTooltip && (h("sd-tooltip-portal", { key: 'a01870de440ba2e61467809a480bd55cbed5f73d', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, h("div", { key: 'dbf0e30cdd752b12f621e32bd4b8bce26779c6a7', class: {
+        return (h(Fragment, { key: '2047cb9cab136a3260f8641a08d784acd9554a0a' }, this.label ? (h("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-tooltip", ...handleTrigger })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-tooltip", ...handleTrigger })), this.showTooltip && (h("sd-tooltip-portal", { key: '28be62164055c23d711fe19feaafe05dc53de9b2', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, h("div", { key: 'c98d6d06e504daf8d13122623d65b8d9998f87f0', class: {
                 'sd-tooltip-menu': true,
                 [`sd-tooltip-menu--${this.placement}`]: true,
                 'sd-tooltip-menu--with-close': this.useClose,
-            } }, h("i", { key: '5664bcb13e1f415e223f04a6dbf76f8a8069555c', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: '4c4c6eaa876f0353b9c66fb5bd8b290c912f8a44' })), h("div", { key: '1b5267cb3699323c84d5eebb9197c8669c62e865', class: "sd-tooltip-menu__content" }, h("slot", { key: 'c5cc6f8d0e6f8b7e88c0f4f43d32663277bfaa51' }, this.el.textContent)), this.useClose && (h("div", { key: 'b261efb26610782051f612ba606c4a1f46030961', class: "sd-tooltip-menu__close-button" }, h("button", { key: 'f5d7826cc375266bf723861e365e25b1828c611a', onClick: () => this.handleClose() }, h("sd-icon", { key: 'e924e692a24320e033912c6337974ba0f9cce252', name: "close", size: "12", color: "#AAAAAA" })))))))));
+            } }, h("i", { key: '955f4f5476cb97cdfbf58251486c100a5c3b4537', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: '4376c6d745d35831b3245e9d6118e45f9b72f2d7' })), h("div", { key: 'af47262e47026506861befead5ba4c0f2203d28b', class: "sd-tooltip-menu__content" }, h("slot", { key: 'a63f5549325e6e19b87e7a4ea0be24c4c27026e5' }, this.el.textContent)), this.useClose && (h("div", { key: 'b8ea7c8582237d79de063be6bedef8ec0473f3dd', class: "sd-tooltip-menu__close-button" }, h("button", { key: '9776d45108b4b4eb27d38871e9705323db392b82', onClick: () => this.handleClose() }, h("sd-icon", { key: '298d7b079c3866d0448b05d38e4fe2c688a883b7', name: "close", size: "12", color: "#AAAAAA" })))))))));
     }
     static get style() { return sdTooltipCss; }
 }, [769, "sd-tooltip", {
@@ -90,6 +90,6 @@ function defineCustomElement() {
 }
 export { SdTooltip as S, defineCustomElement as d };
-//# sourceMappingURL=p-CiTGsdkP.js.map
+//# sourceMappingURL=p-Cw2pw4LC.js.map
-//# sourceMappingURL=p-CiTGsdkP.js.map
+//# sourceMappingURL=p-Cw2pw4LC.js.map

package/dist/components/{p-CiTGsdkP.js.map → p-Cw2pw4LC.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~CiTGsdkP~~.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-tooltip/sd-tooltip.scss?tag=sd-tooltip&encapsulation=shadow","src/components/sd-tooltip/sd-tooltip.tsx"],"sourcesContent":["@import '../../styles/global.scss';\r\n\r\n.sd-tooltip {\r\n position: relative;\r\n cursor: pointer;\r\n display: inline-block;\r\n}\r\n","import { Component, Element, Fragment, Prop, State, h } from '@stencil/core';\r\nimport { ButtonSize, ButtonVariant } from '../sd-button/sd-button';\r\nimport { TooltipArrow } from '../assets/tooltipArrow';\r\n\r\n@Component({\r\n tag: 'sd-tooltip',\r\n styleUrl: 'sd-tooltip.scss',\r\n shadow: true,\r\n})\r\nexport class SdTooltip {\r\n @Element() el!: HTMLElement;\r\n\r\n @Prop({ reflect: true }) trigger: 'hover' \| 'click' = 'hover';\r\n @Prop({ reflect: true }) placement: 'top' \| 'bottom' \| 'left' \| 'right' = 'top';\r\n @Prop({ reflect: true }) color: string = '#01BB4B';\r\n\r\n @Prop({ reflect: true }) icon: IconName = 'helpOutline';\r\n @Prop({ reflect: true }) iconSize: number = 12;\r\n\r\n @Prop() label: string = '';\r\n @Prop({ reflect: true }) buttonSize: ButtonSize = 'sm';\r\n @Prop({ reflect: true }) buttonVariant: ButtonVariant = 'primary';\r\n\r\n @Prop() noHover: boolean = true;\r\n\r\n @Prop() useClose: boolean = false;\r\n\r\n @State() showTooltip: boolean = false;\r\n\r\n private buttonEl?: HTMLElement;\r\n\r\n private handleClose = () => {\r\n console.log('close tooltip');\r\n this.showTooltip = false;\r\n };\r\n\r\n render() {\r\n const handleTrigger =\r\n this.trigger === 'hover'\r\n ? {\r\n onMouseEnter: () => (this.showTooltip = true),\r\n onMouseLeave: () => (this.showTooltip = false),\r\n }\r\n : {\r\n onClick: () => (console.log('click tooltip'), (this.showTooltip = !this.showTooltip)),\r\n };\r\n\r\n return (\r\n <Fragment>\r\n {this.label ? (\r\n <sd-button\r\n ref={el => (this.buttonEl = el as unknown as HTMLElement)}\r\n label={this.label}\r\n icon={this.icon}\r\n size={this.buttonSize}\r\n color={this.color}\r\n variant={this.buttonVariant}\r\n class=\"sd-tooltip\"\r\n {...handleTrigger}\r\n ></sd-button>\r\n ) : (\r\n <sd-icon\r\n ref={el => (this.buttonEl = el as unknown as HTMLElement)}\r\n name={this.icon}\r\n size={this.iconSize}\r\n color={this.color}\r\n class=\"sd-tooltip\"\r\n {...handleTrigger}\r\n ></sd-icon>\r\n )}\r\n\r\n {this.showTooltip && (\r\n <sd-tooltip-portal\r\n parentRef={this.buttonEl}\r\n onSdClose={() => this.handleClose()}\r\n placement={this.placement}\r\n >\r\n <div\r\n class={{\r\n 'sd-tooltip-menu': true,\r\n [`sd-tooltip-menu--${this.placement}`]: true,\r\n 'sd-tooltip-menu--with-close': this.useClose,\r\n }}\r\n >\r\n <i class={`sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}`}>\r\n <TooltipArrow></TooltipArrow>\r\n </i>\r\n\r\n <div class=\"sd-tooltip-menu__content\">\r\n <slot>{this.el.textContent}</slot>\r\n </div>\r\n\r\n {this.useClose && (\r\n <div class=\"sd-tooltip-menu__close-button\">\r\n <button onClick={() => this.handleClose()}>\r\n <sd-icon name=\"close\" size=\"12\" color=\"#AAAAAA\"></sd-icon>\r\n </button>\r\n </div>\r\n )}\r\n </div>\r\n </sd-tooltip-portal>\r\n )}\r\n </Fragment>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-Cw2pw4LC.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-tooltip/sd-tooltip.scss?tag=sd-tooltip&encapsulation=shadow","src/components/sd-tooltip/sd-tooltip.tsx"],"sourcesContent":["@import '../../styles/global.scss';\r\n\r\n.sd-tooltip {\r\n position: relative;\r\n cursor: pointer;\r\n display: inline-block;\r\n}\r\n","import { Component, Element, Fragment, Prop, State, h } from '@stencil/core';\r\nimport { ButtonSize, ButtonVariant } from '../sd-button/sd-button';\r\nimport { TooltipArrow } from '../assets/tooltipArrow';\r\n\r\n@Component({\r\n tag: 'sd-tooltip',\r\n styleUrl: 'sd-tooltip.scss',\r\n shadow: true,\r\n})\r\nexport class SdTooltip {\r\n @Element() el!: HTMLElement;\r\n\r\n @Prop({ reflect: true }) trigger: 'hover' \| 'click' = 'hover';\r\n @Prop({ reflect: true }) placement: 'top' \| 'bottom' \| 'left' \| 'right' = 'top';\r\n @Prop({ reflect: true }) color: string = '#01BB4B';\r\n\r\n @Prop({ reflect: true }) icon: IconName = 'helpOutline';\r\n @Prop({ reflect: true }) iconSize: number = 12;\r\n\r\n @Prop() label: string = '';\r\n @Prop({ reflect: true }) buttonSize: ButtonSize = 'sm';\r\n @Prop({ reflect: true }) buttonVariant: ButtonVariant = 'primary';\r\n\r\n @Prop() noHover: boolean = true;\r\n\r\n @Prop() useClose: boolean = false;\r\n\r\n @State() showTooltip: boolean = false;\r\n\r\n private buttonEl?: HTMLElement;\r\n\r\n private handleClose = () => {\r\n console.log('close tooltip');\r\n this.showTooltip = false;\r\n };\r\n\r\n render() {\r\n const handleTrigger =\r\n this.trigger === 'hover'\r\n ? {\r\n onMouseEnter: () => (this.showTooltip = true),\r\n onMouseLeave: () => (this.showTooltip = false),\r\n }\r\n : {\r\n onClick: () => (console.log('click tooltip'), (this.showTooltip = !this.showTooltip)),\r\n };\r\n\r\n return (\r\n <Fragment>\r\n {this.label ? (\r\n <sd-button\r\n ref={el => (this.buttonEl = el as unknown as HTMLElement)}\r\n label={this.label}\r\n icon={this.icon}\r\n size={this.buttonSize}\r\n color={this.color}\r\n variant={this.buttonVariant}\r\n class=\"sd-tooltip\"\r\n {...handleTrigger}\r\n ></sd-button>\r\n ) : (\r\n <sd-icon\r\n ref={el => (this.buttonEl = el as unknown as HTMLElement)}\r\n name={this.icon}\r\n size={this.iconSize}\r\n color={this.color}\r\n class=\"sd-tooltip\"\r\n {...handleTrigger}\r\n ></sd-icon>\r\n )}\r\n\r\n {this.showTooltip && (\r\n <sd-tooltip-portal\r\n parentRef={this.buttonEl}\r\n onSdClose={() => this.handleClose()}\r\n placement={this.placement}\r\n >\r\n <div\r\n class={{\r\n 'sd-tooltip-menu': true,\r\n [`sd-tooltip-menu--${this.placement}`]: true,\r\n 'sd-tooltip-menu--with-close': this.useClose,\r\n }}\r\n >\r\n <i class={`sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}`}>\r\n <TooltipArrow></TooltipArrow>\r\n </i>\r\n\r\n <div class=\"sd-tooltip-menu__content\">\r\n <slot>{this.el.textContent}</slot>\r\n </div>\r\n\r\n {this.useClose && (\r\n <div class=\"sd-tooltip-menu__close-button\">\r\n <button onClick={() => this.handleClose()}>\r\n <sd-icon name=\"close\" size=\"12\" color=\"#AAAAAA\"></sd-icon>\r\n </button>\r\n </div>\r\n )}\r\n </div>\r\n </sd-tooltip-portal>\r\n )}\r\n </Fragment>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-BbUf81Wx.js → p-D0hPGqjM.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment } from './p-CLODAhOA.js';
-import { d as defineCustomElement$1 } from './p-CI-1-u3u.js';
+import { d as defineCustomElement$1 } from './p-DVFPBdfj.js';
 const sdPaginationCss = "@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-pagination{display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;gap:8px;color:#555555;width:100%;font-size:12px}.sd-pagination .prepend-btns{display:flex;flex-flow:row nowrap;align-items:center;gap:8px;width:60px}.sd-pagination .prepend-btns button{width:26px;height:26px;border:0;background:none}.sd-pagination .prepend-btns button:hover{border:1px solid #006ac1;border-radius:14px}.sd-pagination .append-btns{display:flex;flex-flow:row nowrap;align-items:center;gap:8px;width:60px}.sd-pagination .append-btns button{width:26px;height:26px;border:0;background:none}.sd-pagination .append-btns button:hover{border:1px solid #006ac1;border-radius:14px}.sd-pagination .pagination-btn{display:flex;align-items:center;justify-content:center;border-radius:14px;outline:none;border:none;cursor:pointer;height:26px;color:#555555;width:var(--pagination-btn-width, 26px)}.sd-pagination .pagination-btn--selected{background-color:#006ac1;color:white}.sd-pagination .pagination-btn:hover{border:1px solid #006ac1}.sd-pagination--simple .pagination-info{line-height:26px;display:flex;flex-flow:row nowrap;align-items:center;gap:8px}.sd-pagination--simple .pagination-info .current-page,.sd-pagination--simple .pagination-info .last-page{padding:0 2px}";
@@ -85,12 +85,12 @@ const SdPagination = /*@__PURE__*/ proxyCustomElement(class SdPagination extends
         }
     }
     render() {
-        return (h("div", { key: 'b4b8a4b6ff7ae8296a15310a9e8819589dd25164', class: this.paginationClasses }, h("div", { key: '695d69098c97c4c4e4c5416b67bc075fb4e4b181', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (h("div", { class: "pagination-info" }, h("span", { class: "current-page" }, this.currentPage), h("span", null, "/"), h("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (h("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
+        return (h("div", { key: 'a59ec8c79042ac6b245dc796099b18f574a59045', class: this.paginationClasses }, h("div", { key: 'd4d951dc0f5c8b5212a21eaa02389344768ad15c', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (h("div", { class: "pagination-info" }, h("span", { class: "current-page" }, this.currentPage), h("span", null, "/"), h("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (h("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
                 'pagination-btn': true,
                 'pagination-btn--selected': this.currentPage === n,
             }, disabled: this.currentPage === n, style: {
                 '--pagination-btn-width': `${this.buttonWidth}px`,
-            }, onClick: () => this.handlePageChange(n) }, n)))), h("div", { key: '3762f013f7772d97999373eda3723d962ec7d73b', class: "append-btns" }, this.renderNextButtons())));
+            }, onClick: () => this.handlePageChange(n) }, n)))), h("div", { key: '90070d87eae5ba4d7e45c8b1163c6d910b202427', class: "append-btns" }, this.renderNextButtons())));
     }
     static get watchers() { return {
         "currentPage": ["onPropChange"],
@@ -125,6 +125,6 @@ function defineCustomElement() {
 }
 export { SdPagination as S, defineCustomElement as d };
-//# sourceMappingURL=p-BbUf81Wx.js.map
+//# sourceMappingURL=p-D0hPGqjM.js.map
-//# sourceMappingURL=p-BbUf81Wx.js.map
+//# sourceMappingURL=p-D0hPGqjM.js.map

package/dist/components/{p-BbUf81Wx.js.map → p-D0hPGqjM.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-BbUf81Wx.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,qxqBAAqxqB;;ACE7yqB,MAAM,YAAY,GAA2B;AAC5C,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;CACL;AAED,MAAM,QAAQ,GAAG,EAAE;MAON,YAAY,iBAAAA,kBAAA,CAAA,MAAA,YAAA,SAAAC,CAAA,CAAA;;;;;;;;;IAChB,WAAW,GAAW,CAAC;IACvB,QAAQ,GAAW,CAAC;IACpB,MAAM,GAAY,KAAK;AAEtB,IAAA,UAAU;IAInB,YAAY,GAAA;AACX,QAAA,OAAO,CAAC,GAAG,CAAC,0BAA0B,EAAE;YACvC,WAAW,EAAE,IAAI,CAAC,WAAW;YAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACvB,SAAA,CAAC;;AAGH,IAAA,IAAY,iBAAiB,GAAA;AAC5B,QAAA,MAAM,OAAO,GAAG,CAAC,eAAe,CAAC;AAEjC,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AAChB,YAAA,OAAO,CAAC,IAAI,CAAC,uBAAuB,CAAC;;AAEtC,QAAA,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;;AAGzB,IAAA,IAAY,WAAW,GAAA;QACtB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,QAAQ,CAAC,GAAG,QAAQ,GAAG,CAAC;AAC1E,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,QAAQ,GAAG,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC;QACzD,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,GAAG,GAAG,KAAK,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,KAAK,GAAG,CAAC,CAAC;;AAGpE,IAAA,IAAY,WAAW,GAAA;AACtB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QAChD,MAAM,aAAa,GAAW,WAAW,CAAC,QAAQ,EAAE,CAAC,MAAM;QAC3D,OAAO,YAAY,CAAC,aAAa,CAAC,IAAI,YAAY,CAAC,CAAC,CAAC;;AAG9C,IAAA,gBAAgB,CAAC,IAAY,EAAA;QACpC,IAAI,IAAI,GAAG,CAAC,IAAI,IAAI,GAAG,IAAI,CAAC,QAAQ;YAAE;AACtC,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;AAGnB,IAAA,iBAAiB,CAAC,SAAiC,EAAA;AAC1D,QAAA,MAAM,KAAK,GAAG,SAAS,KAAK,SAAS,GAAG,QAAQ,GAAG,GAAS;QAC5D,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,GAAG,KAAK,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC;AAC9E,QAAA,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC;;AAG/B,IAAA,IAAY,YAAY,GAAA;AACvB,QAAA,OAAO,IAAI,CAAC,WAAW,IAAI,QAAQ;;AAGpC,IAAA,IAAY,WAAW,GAAA;QACtB,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,QAAQ,CAAC,GAAG,QAAQ,GAAG,CAAC;QACnF,OAAO,cAAc,GAAG,QAAQ,GAAG,CAAC,IAAI,IAAI,CAAC,QAAQ;;IAG9C,iBAAiB,GAAA;AACxB,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AAChB,YAAA,IAAI,IAAI,CAAC,WAAW,IAAI,CAAC;AAAE,gBAAA,OAAO,IAAI;YAEtC,QACC,EAAC,QAAQ,EAAA,IAAA,EACR,CAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EAAmB,kBAAkB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAA,EAC5E,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAA,CAAG,CACjD,EACT,CAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EACY,qBAAqB,EAChC,OAAO,EAAE,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,EAAA,EAE1D,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAA,CAAG,CAC9C,CACC;;AAIb,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACvB,QACC,EAAC,QAAQ,EAAA,IAAA,EACR,CAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EAAmB,kBAAkB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAA,EAC5E,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAA,CAAG,CACjD,EACT,CAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EACY,2BAA2B,EACtC,OAAO,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,EAAA,EAEjD,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAA,CAAG,CAC9C,CACC;;;IAKN,iBAAiB,GAAA;AACxB,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AAChB,YAAA,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,QAAQ;AAAE,gBAAA,OAAO,IAAI;YAElD,QACC,EAAC,QAAQ,EAAA,IAAA,EACR,CAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EACY,iBAAiB,EAC5B,OAAO,EAAE,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,EAAA,EAE1D,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAA,CAAG,CAC/C,EACT,CAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EAAmB,iBAAiB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAA,EACvF,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,eAAe,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAA,CAAG,CAClD,CACC;;AAIb,QAAA,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;YACtB,QACC,EAAC,QAAQ,EAAA,IAAA,EACR,CAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EAAmB,uBAAuB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,EAAA,EAC1F,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAA,CAAG,CAC/C,EACT,CAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EAAmB,iBAAiB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAA,EACvF,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,eAAe,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAA,CAAG,CAClD,CACC;;;IAKd,MAAM,GAAA;AACL,QAAA,QACC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAA,EACjC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EAAE,IAAI,CAAC,iBAAiB,EAAE,CAAO,EAEzD,IAAI,CAAC,MAAM,IACX,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EAC3B,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,cAAc,IAAE,IAAI,CAAC,WAAW,CAAQ,EACpD,CAAc,CAAA,MAAA,EAAA,IAAA,EAAA,GAAA,CAAA,EACd,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,WAAW,EAAA,EAAE,IAAI,CAAC,QAAQ,CAAQ,CACzC,KAEN,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,KACrB,cACC,IAAI,EAAC,QAAQ,EACC,cAAA,EAAA,IAAI,CAAC,WAAW,KAAK,CAAC,GAAG,MAAM,GAAG,SAAS,EACzD,KAAK,EAAE;AACN,gBAAA,gBAAgB,EAAE,IAAI;AACtB,gBAAA,0BAA0B,EAAE,IAAI,CAAC,WAAW,KAAK,CAAC;aAClD,EACD,QAAQ,EAAE,IAAI,CAAC,WAAW,KAAK,CAAC,EAChC,KAAK,EAAE;AACN,gBAAA,wBAAwB,EAAE,CAAA,EAAG,IAAI,CAAC,WAAW,CAAI,EAAA,CAAA;AACjD,aAAA,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAEtC,EAAA,CAAC,CACM,CACT,CAAC,CACF,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAE,EAAA,IAAI,CAAC,iBAAiB,EAAE,CAAO,CACpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-pagination/sd-pagination.scss?tag=sd-pagination&encapsulation=shadow","src/components/sd-pagination/sd-pagination.tsx"],"sourcesContent":["@import '../../styles/global.scss';\r\n\r\n.sd-pagination {\r\n display: flex;\r\n flex-flow: row nowrap;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 8px;\r\n color: $grey_80;\r\n width: 100%;\r\n font-size: 12px;\r\n\r\n .prepend-btns {\r\n display: flex;\r\n flex-flow: row nowrap;\r\n align-items: center;\r\n gap: 8px;\r\n width: 60px;\r\n\r\n button {\r\n width: 26px;\r\n height: 26px;\r\n border: 0;\r\n background: none;\r\n\r\n &:hover {\r\n border: 1px solid $oceanblue_70;\r\n border-radius: 14px;\r\n }\r\n }\r\n }\r\n\r\n .append-btns {\r\n display: flex;\r\n flex-flow: row nowrap;\r\n align-items: center;\r\n gap: 8px;\r\n width: 60px;\r\n\r\n button {\r\n width: 26px;\r\n height: 26px;\r\n border: 0;\r\n background: none;\r\n\r\n &:hover {\r\n border: 1px solid $oceanblue_70;\r\n border-radius: 14px;\r\n }\r\n }\r\n }\r\n\r\n .pagination-btn {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: 14px;\r\n outline: none;\r\n border: none;\r\n cursor: pointer;\r\n height: 26px;\r\n color: $grey_80;\r\n width: var(--pagination-btn-width, 26px);\r\n\r\n &--selected {\r\n background-color: $oceanblue_70;\r\n color: white;\r\n }\r\n\r\n &:hover {\r\n border: 1px solid $oceanblue_70;\r\n }\r\n }\r\n\r\n &--simple {\r\n .pagination-info {\r\n line-height: 26px;\r\n display: flex;\r\n flex-flow: row nowrap;\r\n align-items: center;\r\n gap: 8px;\r\n .current-page,\r\n .last-page {\r\n padding: 0 2px;\r\n }\r\n }\r\n }\r\n}\r\n","import { Component, Prop, Event, EventEmitter, h, Watch, Fragment } from '@stencil/core';\r\n\r\nconst BUTTON_WIDTH: Record<number, number> = {\r\n 1: 26,\r\n 2: 36,\r\n 3: 42,\r\n 4: 50,\r\n 5: 58,\r\n};\r\n\r\nconst PER_PAGE = 10;\r\n\r\n@Component({\r\n tag: 'sd-pagination',\r\n styleUrl: 'sd-pagination.scss',\r\n shadow: true,\r\n})\r\nexport class SdPagination {\r\n @Prop() currentPage: number = 1;\r\n @Prop() lastPage: number = 1;\r\n @Prop() simple: boolean = false;\r\n\r\n @Event() pageChange!: EventEmitter<number>;\r\n\r\n @Watch('currentPage')\r\n @Watch('lastPage')\r\n onPropChange() {\r\n console.log('Pagination props changed', {\r\n currentPage: this.currentPage,\r\n lastPage: this.lastPage,\r\n });\r\n }\r\n\r\n private get paginationClasses() {\r\n const classes = ['sd-pagination'];\r\n\r\n if (this.simple) {\r\n classes.push('sd-pagination--simple');\r\n }\r\n return classes.join(' ');\r\n }\r\n\r\n private get pageNumbers() {\r\n const start = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;\r\n const end = Math.min(start + PER_PAGE - 1, this.lastPage);\r\n return Array.from({ length: end - start + 1 }, (_, i) => start + i);\r\n }\r\n\r\n private get buttonWidth() {\r\n const lastPageNum = this.pageNumbers.at(-1) ?? 1;\r\n const maxPageLength: number = lastPageNum.toString().length;\r\n return BUTTON_WIDTH[maxPageLength] \|\| BUTTON_WIDTH[1];\r\n }\r\n\r\n private handlePageChange(page: number) {\r\n if (page < 1 \|\| page > this.lastPage) return;\r\n this.pageChange.emit(page);\r\n }\r\n\r\n private handleGroupChange(direction: 'forward' \| 'backward') {\r\n const delta = direction === 'forward' ? PER_PAGE : -PER_PAGE;\r\n const newPage = Math.min(Math.max(this.currentPage + delta, 1), this.lastPage);\r\n this.handlePageChange(newPage);\r\n }\r\n\r\n private get isFirstGroup() {\r\n return this.currentPage <= PER_PAGE;\r\n }\r\n\r\n private get isLastGroup() {\r\n const startPageGroup = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;\r\n return startPageGroup + PER_PAGE - 1 >= this.lastPage;\r\n }\r\n\r\n private renderPrevButtons() {\r\n if (this.simple) {\r\n if (this.currentPage <= 1) return null;\r\n\r\n return (\r\n <Fragment>\r\n <button aria-label=\"Go to first page\" onClick={() => this.handlePageChange(1)}>\r\n <sd-icon name=\"arrowLeftEnd\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n <button\r\n aria-label=\"Go to previous page\"\r\n onClick={() => this.handlePageChange(this.currentPage - 1)}\r\n >\r\n <sd-icon name=\"arrowLeft\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n </Fragment>\r\n );\r\n }\r\n\r\n if (!this.isFirstGroup) {\r\n return (\r\n <Fragment>\r\n <button aria-label=\"Go to first page\" onClick={() => this.handlePageChange(1)}>\r\n <sd-icon name=\"arrowLeftEnd\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n <button\r\n aria-label=\"Go to previous page group\"\r\n onClick={() => this.handleGroupChange('backward')}\r\n >\r\n <sd-icon name=\"arrowLeft\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n </Fragment>\r\n );\r\n }\r\n }\r\n\r\n private renderNextButtons() {\r\n if (this.simple) {\r\n if (this.currentPage >= this.lastPage) return null;\r\n\r\n return (\r\n <Fragment>\r\n <button\r\n aria-label=\"Go to next page\"\r\n onClick={() => this.handlePageChange(this.currentPage + 1)}\r\n >\r\n <sd-icon name=\"arrowRight\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n <button aria-label=\"Go to last page\" onClick={() => this.handlePageChange(this.lastPage)}>\r\n <sd-icon name=\"arrowRightEnd\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n </Fragment>\r\n );\r\n }\r\n\r\n if (!this.isLastGroup) {\r\n return (\r\n <Fragment>\r\n <button aria-label=\"Go to next page group\" onClick={() => this.handleGroupChange('forward')}>\r\n <sd-icon name=\"arrowRight\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n <button aria-label=\"Go to last page\" onClick={() => this.handlePageChange(this.lastPage)}>\r\n <sd-icon name=\"arrowRightEnd\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n </Fragment>\r\n );\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={this.paginationClasses}>\r\n <div class=\"prepend-btns\">{this.renderPrevButtons()}</div>\r\n\r\n {this.simple ? (\r\n <div class=\"pagination-info\">\r\n <span class=\"current-page\">{this.currentPage}</span>\r\n <span>/</span>\r\n <span class=\"last-page\">{this.lastPage}</span>\r\n </div>\r\n ) : (\r\n this.pageNumbers.map(n => (\r\n <button\r\n type=\"button\"\r\n aria-current={this.currentPage === n ? 'page' : undefined}\r\n class={{\r\n 'pagination-btn': true,\r\n 'pagination-btn--selected': this.currentPage === n,\r\n }}\r\n disabled={this.currentPage === n}\r\n style={{\r\n '--pagination-btn-width': `${this.buttonWidth}px`,\r\n }}\r\n onClick={() => this.handlePageChange(n)}\r\n >\r\n {n}\r\n </button>\r\n ))\r\n )}\r\n\r\n <div class=\"append-btns\">{this.renderNextButtons()}</div>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-D0hPGqjM.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-pagination/sd-pagination.scss?tag=sd-pagination&encapsulation=shadow","src/components/sd-pagination/sd-pagination.tsx"],"sourcesContent":["@import '../../styles/global.scss';\r\n\r\n.sd-pagination {\r\n display: flex;\r\n flex-flow: row nowrap;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 8px;\r\n color: $grey_80;\r\n width: 100%;\r\n font-size: 12px;\r\n\r\n .prepend-btns {\r\n display: flex;\r\n flex-flow: row nowrap;\r\n align-items: center;\r\n gap: 8px;\r\n width: 60px;\r\n\r\n button {\r\n width: 26px;\r\n height: 26px;\r\n border: 0;\r\n background: none;\r\n\r\n &:hover {\r\n border: 1px solid $oceanblue_70;\r\n border-radius: 14px;\r\n }\r\n }\r\n }\r\n\r\n .append-btns {\r\n display: flex;\r\n flex-flow: row nowrap;\r\n align-items: center;\r\n gap: 8px;\r\n width: 60px;\r\n\r\n button {\r\n width: 26px;\r\n height: 26px;\r\n border: 0;\r\n background: none;\r\n\r\n &:hover {\r\n border: 1px solid $oceanblue_70;\r\n border-radius: 14px;\r\n }\r\n }\r\n }\r\n\r\n .pagination-btn {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: 14px;\r\n outline: none;\r\n border: none;\r\n cursor: pointer;\r\n height: 26px;\r\n color: $grey_80;\r\n width: var(--pagination-btn-width, 26px);\r\n\r\n &--selected {\r\n background-color: $oceanblue_70;\r\n color: white;\r\n }\r\n\r\n &:hover {\r\n border: 1px solid $oceanblue_70;\r\n }\r\n }\r\n\r\n &--simple {\r\n .pagination-info {\r\n line-height: 26px;\r\n display: flex;\r\n flex-flow: row nowrap;\r\n align-items: center;\r\n gap: 8px;\r\n .current-page,\r\n .last-page {\r\n padding: 0 2px;\r\n }\r\n }\r\n }\r\n}\r\n","import { Component, Prop, Event, EventEmitter, h, Watch, Fragment } from '@stencil/core';\r\n\r\nconst BUTTON_WIDTH: Record<number, number> = {\r\n 1: 26,\r\n 2: 36,\r\n 3: 42,\r\n 4: 50,\r\n 5: 58,\r\n};\r\n\r\nconst PER_PAGE = 10;\r\n\r\n@Component({\r\n tag: 'sd-pagination',\r\n styleUrl: 'sd-pagination.scss',\r\n shadow: true,\r\n})\r\nexport class SdPagination {\r\n @Prop() currentPage: number = 1;\r\n @Prop() lastPage: number = 1;\r\n @Prop() simple: boolean = false;\r\n\r\n @Event() pageChange!: EventEmitter<number>;\r\n\r\n @Watch('currentPage')\r\n @Watch('lastPage')\r\n onPropChange() {\r\n console.log('Pagination props changed', {\r\n currentPage: this.currentPage,\r\n lastPage: this.lastPage,\r\n });\r\n }\r\n\r\n private get paginationClasses() {\r\n const classes = ['sd-pagination'];\r\n\r\n if (this.simple) {\r\n classes.push('sd-pagination--simple');\r\n }\r\n return classes.join(' ');\r\n }\r\n\r\n private get pageNumbers() {\r\n const start = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;\r\n const end = Math.min(start + PER_PAGE - 1, this.lastPage);\r\n return Array.from({ length: end - start + 1 }, (_, i) => start + i);\r\n }\r\n\r\n private get buttonWidth() {\r\n const lastPageNum = this.pageNumbers.at(-1) ?? 1;\r\n const maxPageLength: number = lastPageNum.toString().length;\r\n return BUTTON_WIDTH[maxPageLength] \|\| BUTTON_WIDTH[1];\r\n }\r\n\r\n private handlePageChange(page: number) {\r\n if (page < 1 \|\| page > this.lastPage) return;\r\n this.pageChange.emit(page);\r\n }\r\n\r\n private handleGroupChange(direction: 'forward' \| 'backward') {\r\n const delta = direction === 'forward' ? PER_PAGE : -PER_PAGE;\r\n const newPage = Math.min(Math.max(this.currentPage + delta, 1), this.lastPage);\r\n this.handlePageChange(newPage);\r\n }\r\n\r\n private get isFirstGroup() {\r\n return this.currentPage <= PER_PAGE;\r\n }\r\n\r\n private get isLastGroup() {\r\n const startPageGroup = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;\r\n return startPageGroup + PER_PAGE - 1 >= this.lastPage;\r\n }\r\n\r\n private renderPrevButtons() {\r\n if (this.simple) {\r\n if (this.currentPage <= 1) return null;\r\n\r\n return (\r\n <Fragment>\r\n <button aria-label=\"Go to first page\" onClick={() => this.handlePageChange(1)}>\r\n <sd-icon name=\"arrowLeftEnd\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n <button\r\n aria-label=\"Go to previous page\"\r\n onClick={() => this.handlePageChange(this.currentPage - 1)}\r\n >\r\n <sd-icon name=\"arrowLeft\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n </Fragment>\r\n );\r\n }\r\n\r\n if (!this.isFirstGroup) {\r\n return (\r\n <Fragment>\r\n <button aria-label=\"Go to first page\" onClick={() => this.handlePageChange(1)}>\r\n <sd-icon name=\"arrowLeftEnd\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n <button\r\n aria-label=\"Go to previous page group\"\r\n onClick={() => this.handleGroupChange('backward')}\r\n >\r\n <sd-icon name=\"arrowLeft\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n </Fragment>\r\n );\r\n }\r\n }\r\n\r\n private renderNextButtons() {\r\n if (this.simple) {\r\n if (this.currentPage >= this.lastPage) return null;\r\n\r\n return (\r\n <Fragment>\r\n <button\r\n aria-label=\"Go to next page\"\r\n onClick={() => this.handlePageChange(this.currentPage + 1)}\r\n >\r\n <sd-icon name=\"arrowRight\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n <button aria-label=\"Go to last page\" onClick={() => this.handlePageChange(this.lastPage)}>\r\n <sd-icon name=\"arrowRightEnd\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n </Fragment>\r\n );\r\n }\r\n\r\n if (!this.isLastGroup) {\r\n return (\r\n <Fragment>\r\n <button aria-label=\"Go to next page group\" onClick={() => this.handleGroupChange('forward')}>\r\n <sd-icon name=\"arrowRight\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n <button aria-label=\"Go to last page\" onClick={() => this.handlePageChange(this.lastPage)}>\r\n <sd-icon name=\"arrowRightEnd\" size=\"12\" color=\"#222222\" />\r\n </button>\r\n </Fragment>\r\n );\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n <div class={this.paginationClasses}>\r\n <div class=\"prepend-btns\">{this.renderPrevButtons()}</div>\r\n\r\n {this.simple ? (\r\n <div class=\"pagination-info\">\r\n <span class=\"current-page\">{this.currentPage}</span>\r\n <span>/</span>\r\n <span class=\"last-page\">{this.lastPage}</span>\r\n </div>\r\n ) : (\r\n this.pageNumbers.map(n => (\r\n <button\r\n type=\"button\"\r\n aria-current={this.currentPage === n ? 'page' : undefined}\r\n class={{\r\n 'pagination-btn': true,\r\n 'pagination-btn--selected': this.currentPage === n,\r\n }}\r\n disabled={this.currentPage === n}\r\n style={{\r\n '--pagination-btn-width': `${this.buttonWidth}px`,\r\n }}\r\n onClick={() => this.handlePageChange(n)}\r\n >\r\n {n}\r\n </button>\r\n ))\r\n )}\r\n\r\n <div class=\"append-btns\">{this.renderNextButtons()}</div>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-exVR_ekC.js → p-D267VRcj.js} RENAMED Viewed

@@ -152,7 +152,7 @@ const SdTooltipPortal = /*@__PURE__*/ proxyCustomElement(class SdTooltipPortal e
         this.sdClose.emit();
     }
     render() {
-        return h("slot", { key: '15be4b3b16c1b688fddb31c0ad14ad224f97d53d' });
+        return h("slot", { key: '04e02ba53bc52d5377071b352159ebbf84a0141c' });
     }
 }, [769, "sd-tooltip-portal", {
         "to": [1],
@@ -177,6 +177,6 @@ function defineCustomElement() {
 }
 export { SdTooltipPortal as S, defineCustomElement as d };
-//# sourceMappingURL=p-exVR_ekC.js.map
+//# sourceMappingURL=p-D267VRcj.js.map
-//# sourceMappingURL=p-exVR_ekC.js.map
+//# sourceMappingURL=p-D267VRcj.js.map

package/dist/components/{p-exVR_ekC.js.map → p-D267VRcj.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-exVR_ekC.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-tooltip-portal/sd-tooltip-portal.tsx"],"sourcesContent":["import { Component, Element, Event, EventEmitter, Listen, Prop, h } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'sd-tooltip-portal',\r\n shadow: true,\r\n})\r\nexport class SdTooltipPortal {\r\n @Element() el!: HTMLElement;\r\n @Prop() to: HTMLElement \| string = 'body';\r\n @Prop() parentRef: HTMLElement \| null = null;\r\n @Prop() offset: [number, number] = [0, 0];\r\n @Prop() zIndex: number = 9999;\r\n @Prop() placement: 'top' \| 'bottom' \| 'left' \| 'right' = 'bottom';\r\n @Prop() open: boolean = false;\r\n\r\n @Event() sdClose!: EventEmitter<void>;\r\n\r\n private container?: HTMLElement;\r\n private wrapper?: HTMLElement;\r\n private rafId?: number;\r\n private isInsideClick = false;\r\n\r\n private resizeObserver?: ResizeObserver;\r\n private mutationObserver?: MutationObserver;\r\n\r\n private static readonly ARROW_SIZE = 11.2;\r\n\r\n componentDidLoad() {\r\n this.container = this.resolveContainer();\r\n this.createWrapper();\r\n this.moveSlotContent();\r\n\r\n // DOM이 완전히 렌더링된 후 위치 계산\r\n requestAnimationFrame(() => {\r\n this.updatePosition();\r\n if (this.wrapper) {\r\n this.wrapper.style.visibility = 'visible'; // 위치 계산 후 표시\r\n }\r\n });\r\n\r\n this.observeParent();\r\n }\r\n\r\n componentDidRender() {\r\n if (!this.wrapper) return;\r\n\r\n // this.wrapper.style.display = this.open ? 'block' : 'none';\r\n // if (this.open) this.updatePosition();\r\n\r\n if (this.open) {\r\n this.wrapper.style.display = 'block';\r\n // RAF를 사용해서 다음 프레임에 위치 업데이트\r\n requestAnimationFrame(() => {\r\n this.updatePosition();\r\n if (this.wrapper) {\r\n this.wrapper.style.visibility = 'visible';\r\n }\r\n });\r\n } else {\r\n this.wrapper.style.display = 'none';\r\n this.wrapper.style.visibility = 'hidden';\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n if (this.rafId) cancelAnimationFrame(this.rafId);\r\n this.unobserveParent();\r\n this.wrapper?.remove();\r\n }\r\n\r\n private resolveContainer(): HTMLElement {\r\n const el = typeof this.to === 'string' ? document.querySelector(this.to) : this.to;\r\n return el instanceof HTMLElement ? el : document.body;\r\n }\r\n\r\n private createWrapper() {\r\n this.wrapper = document.createElement('div');\r\n Object.assign(this.wrapper.style, {\r\n position: 'absolute',\r\n zIndex: this.zIndex.toString(),\r\n transition: 'opacity 0.4s',\r\n top: '-9999px',\r\n left: '-9999px',\r\n });\r\n this.container!.appendChild(this.wrapper);\r\n }\r\n\r\n private moveSlotContent() {\r\n if (!this.wrapper) return;\r\n const nodes = Array.from(this.el.childNodes).filter(n => n.nodeType !== Node.COMMENT_NODE);\r\n nodes.forEach(n => this.wrapper!.appendChild(n));\r\n }\r\n\r\n // 위치 갱신 (scroll / resize)\r\n @Listen('scroll', { target: 'window' })\r\n @Listen('resize', { target: 'window' })\r\n updatePosition() {\r\n if (this.rafId) cancelAnimationFrame(this.rafId);\r\n\r\n this.rafId = requestAnimationFrame(() => {\r\n if (!this.parentRef \|\| !this.wrapper) return;\r\n\r\n const rect = this.parentRef.getBoundingClientRect();\r\n if (!rect.width && !rect.height) return; // 요소가 보이지 않는 경우\r\n\r\n const [offsetX, offsetY] = this.offset;\r\n const ARROW_SIZE = SdTooltipPortal.ARROW_SIZE;\r\n\r\n let top = 0;\r\n let left = 0;\r\n\r\n switch (this.placement) {\r\n case 'top':\r\n top = rect.top + window.scrollY - this.wrapper.offsetHeight + offsetY - ARROW_SIZE;\r\n left = rect.left + window.scrollX + rect.width / 2 - this.wrapper.offsetWidth / 2 + offsetX;\r\n break;\r\n\r\n case 'bottom':\r\n top = rect.bottom + window.scrollY + offsetY + ARROW_SIZE;\r\n left = rect.left + window.scrollX + rect.width / 2 - this.wrapper.offsetWidth / 2 + offsetX;\r\n break;\r\n\r\n case 'left':\r\n top = rect.top + window.scrollY + rect.height / 2 - this.wrapper.offsetHeight / 2 + offsetY;\r\n left = rect.left + window.scrollX - this.wrapper.offsetWidth - offsetX - ARROW_SIZE;\r\n break;\r\n\r\n case 'right':\r\n top = rect.top + window.scrollY + rect.height / 2 - this.wrapper.offsetHeight / 2 + offsetY;\r\n left = rect.right + window.scrollX + offsetX + ARROW_SIZE;\r\n break;\r\n }\r\n\r\n Object.assign(this.wrapper!.style, {\r\n top: `${top}px`,\r\n left: `${left}px`,\r\n });\r\n });\r\n }\r\n\r\n // parentRef의 이동 / 크기변경 감지\r\n private observeParent() {\r\n if (!this.parentRef) return;\r\n\r\n this.resizeObserver = new ResizeObserver(() => this.updatePosition());\r\n this.resizeObserver.observe(this.parentRef);\r\n\r\n this.mutationObserver = new MutationObserver(() => this.updatePosition());\r\n this.mutationObserver.observe(document.body, {\r\n childList: true,\r\n subtree: true,\r\n });\r\n }\r\n\r\n private unobserveParent() {\r\n this.resizeObserver?.disconnect();\r\n this.mutationObserver?.disconnect();\r\n }\r\n\r\n // 외부 클릭 감지\r\n @Listen('mousedown', { target: 'window' })\r\n handleMouseDown(e: MouseEvent) {\r\n this.isInsideClick = !!(this.wrapper && this.wrapper.contains(e.target as Node));\r\n }\r\n\r\n @Listen('click', { target: 'window' })\r\n handleWindowClick(e: MouseEvent) {\r\n if (this.isInsideClick) {\r\n this.isInsideClick = false;\r\n return;\r\n }\r\n if (this.wrapper?.contains(e.target as Node)) return;\r\n this.sdClose.emit();\r\n }\r\n\r\n render() {\r\n return <slot></slot>;\r\n }\r\n}\r\n"],"version":3}
1	+ {"file":"p-D267VRcj.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-tooltip-portal/sd-tooltip-portal.tsx"],"sourcesContent":["import { Component, Element, Event, EventEmitter, Listen, Prop, h } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'sd-tooltip-portal',\r\n shadow: true,\r\n})\r\nexport class SdTooltipPortal {\r\n @Element() el!: HTMLElement;\r\n @Prop() to: HTMLElement \| string = 'body';\r\n @Prop() parentRef: HTMLElement \| null = null;\r\n @Prop() offset: [number, number] = [0, 0];\r\n @Prop() zIndex: number = 9999;\r\n @Prop() placement: 'top' \| 'bottom' \| 'left' \| 'right' = 'bottom';\r\n @Prop() open: boolean = false;\r\n\r\n @Event() sdClose!: EventEmitter<void>;\r\n\r\n private container?: HTMLElement;\r\n private wrapper?: HTMLElement;\r\n private rafId?: number;\r\n private isInsideClick = false;\r\n\r\n private resizeObserver?: ResizeObserver;\r\n private mutationObserver?: MutationObserver;\r\n\r\n private static readonly ARROW_SIZE = 11.2;\r\n\r\n componentDidLoad() {\r\n this.container = this.resolveContainer();\r\n this.createWrapper();\r\n this.moveSlotContent();\r\n\r\n // DOM이 완전히 렌더링된 후 위치 계산\r\n requestAnimationFrame(() => {\r\n this.updatePosition();\r\n if (this.wrapper) {\r\n this.wrapper.style.visibility = 'visible'; // 위치 계산 후 표시\r\n }\r\n });\r\n\r\n this.observeParent();\r\n }\r\n\r\n componentDidRender() {\r\n if (!this.wrapper) return;\r\n\r\n // this.wrapper.style.display = this.open ? 'block' : 'none';\r\n // if (this.open) this.updatePosition();\r\n\r\n if (this.open) {\r\n this.wrapper.style.display = 'block';\r\n // RAF를 사용해서 다음 프레임에 위치 업데이트\r\n requestAnimationFrame(() => {\r\n this.updatePosition();\r\n if (this.wrapper) {\r\n this.wrapper.style.visibility = 'visible';\r\n }\r\n });\r\n } else {\r\n this.wrapper.style.display = 'none';\r\n this.wrapper.style.visibility = 'hidden';\r\n }\r\n }\r\n\r\n disconnectedCallback() {\r\n if (this.rafId) cancelAnimationFrame(this.rafId);\r\n this.unobserveParent();\r\n this.wrapper?.remove();\r\n }\r\n\r\n private resolveContainer(): HTMLElement {\r\n const el = typeof this.to === 'string' ? document.querySelector(this.to) : this.to;\r\n return el instanceof HTMLElement ? el : document.body;\r\n }\r\n\r\n private createWrapper() {\r\n this.wrapper = document.createElement('div');\r\n Object.assign(this.wrapper.style, {\r\n position: 'absolute',\r\n zIndex: this.zIndex.toString(),\r\n transition: 'opacity 0.4s',\r\n top: '-9999px',\r\n left: '-9999px',\r\n });\r\n this.container!.appendChild(this.wrapper);\r\n }\r\n\r\n private moveSlotContent() {\r\n if (!this.wrapper) return;\r\n const nodes = Array.from(this.el.childNodes).filter(n => n.nodeType !== Node.COMMENT_NODE);\r\n nodes.forEach(n => this.wrapper!.appendChild(n));\r\n }\r\n\r\n // 위치 갱신 (scroll / resize)\r\n @Listen('scroll', { target: 'window' })\r\n @Listen('resize', { target: 'window' })\r\n updatePosition() {\r\n if (this.rafId) cancelAnimationFrame(this.rafId);\r\n\r\n this.rafId = requestAnimationFrame(() => {\r\n if (!this.parentRef \|\| !this.wrapper) return;\r\n\r\n const rect = this.parentRef.getBoundingClientRect();\r\n if (!rect.width && !rect.height) return; // 요소가 보이지 않는 경우\r\n\r\n const [offsetX, offsetY] = this.offset;\r\n const ARROW_SIZE = SdTooltipPortal.ARROW_SIZE;\r\n\r\n let top = 0;\r\n let left = 0;\r\n\r\n switch (this.placement) {\r\n case 'top':\r\n top = rect.top + window.scrollY - this.wrapper.offsetHeight + offsetY - ARROW_SIZE;\r\n left = rect.left + window.scrollX + rect.width / 2 - this.wrapper.offsetWidth / 2 + offsetX;\r\n break;\r\n\r\n case 'bottom':\r\n top = rect.bottom + window.scrollY + offsetY + ARROW_SIZE;\r\n left = rect.left + window.scrollX + rect.width / 2 - this.wrapper.offsetWidth / 2 + offsetX;\r\n break;\r\n\r\n case 'left':\r\n top = rect.top + window.scrollY + rect.height / 2 - this.wrapper.offsetHeight / 2 + offsetY;\r\n left = rect.left + window.scrollX - this.wrapper.offsetWidth - offsetX - ARROW_SIZE;\r\n break;\r\n\r\n case 'right':\r\n top = rect.top + window.scrollY + rect.height / 2 - this.wrapper.offsetHeight / 2 + offsetY;\r\n left = rect.right + window.scrollX + offsetX + ARROW_SIZE;\r\n break;\r\n }\r\n\r\n Object.assign(this.wrapper!.style, {\r\n top: `${top}px`,\r\n left: `${left}px`,\r\n });\r\n });\r\n }\r\n\r\n // parentRef의 이동 / 크기변경 감지\r\n private observeParent() {\r\n if (!this.parentRef) return;\r\n\r\n this.resizeObserver = new ResizeObserver(() => this.updatePosition());\r\n this.resizeObserver.observe(this.parentRef);\r\n\r\n this.mutationObserver = new MutationObserver(() => this.updatePosition());\r\n this.mutationObserver.observe(document.body, {\r\n childList: true,\r\n subtree: true,\r\n });\r\n }\r\n\r\n private unobserveParent() {\r\n this.resizeObserver?.disconnect();\r\n this.mutationObserver?.disconnect();\r\n }\r\n\r\n // 외부 클릭 감지\r\n @Listen('mousedown', { target: 'window' })\r\n handleMouseDown(e: MouseEvent) {\r\n this.isInsideClick = !!(this.wrapper && this.wrapper.contains(e.target as Node));\r\n }\r\n\r\n @Listen('click', { target: 'window' })\r\n handleWindowClick(e: MouseEvent) {\r\n if (this.isInsideClick) {\r\n this.isInsideClick = false;\r\n return;\r\n }\r\n if (this.wrapper?.contains(e.target as Node)) return;\r\n this.sdClose.emit();\r\n }\r\n\r\n render() {\r\n return <slot></slot>;\r\n }\r\n}\r\n"],"version":3}

package/dist/components/{p-CI-1-u3u.js → p-DVFPBdfj.js} RENAMED Viewed

@@ -312,7 +312,7 @@ const SdIcon = /*@__PURE__*/ proxyCustomElement(class SdIcon extends H {
     }
     render() {
         const IconComponent = Icons[this.name]?.[this.size];
-        return (h("i", { key: 'bd94fdfbe96f53ff5c15ed51826678658b92173f', class: this.getIconClasses(), style: this.iconStyle }, h(IconComponent, { key: 'c13fce9315b416b3162b98abf6f6354f61d6db68', color: this.resolvedColor })));
+        return (h("i", { key: '2618a42977f5d3340d9e2daf15b4ddda67689cf5', class: this.getIconClasses(), style: this.iconStyle }, h(IconComponent, { key: 'f8ff1fe92433c2ba82fed4223fc6e4678e52c34b', color: this.resolvedColor })));
     }
     static get style() { return sdIconCss; }
 }, [770, "sd-icon", {
@@ -338,6 +338,6 @@ function defineCustomElement() {
 }
 export { SdIcon as S, defineCustomElement as d };
-//# sourceMappingURL=p-CI-1-u3u.js.map
+//# sourceMappingURL=p-DVFPBdfj.js.map
-//# sourceMappingURL=p-CI-1-u3u.js.map
+//# sourceMappingURL=p-DVFPBdfj.js.map