@sellmate/design-system 0.0.28 → 0.0.31

package/dist/components/{p-c8NhJgfj.js.map → p-BLVHOrsi.js.map}

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

package/dist/components/{p-8g6E1lU1.js → p-BNY55XpQ.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CbnL1UUF.js';
-import { d as defineCustomElement$2 } from './p-BClhb3Gm.js';
-import { d as defineCustomElement$1 } from './p-CWi3wc4b.js';
+import { d as defineCustomElement$2 } from './p-zEI1HiVv.js';
+import { d as defineCustomElement$1 } from './p-X8UHtq2f.js';
 
 const sdSelectOptionCss = "sd-select-option{display:block;height:fit-content;line-height:0}sd-select-option .sd-select__option{display:flex;padding:4px 12px;font-size:12px;line-height:20px;cursor:pointer}sd-select-option .sd-select__option__checkbox-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}sd-select-option .sd-select__option--focused{background-color:#e6f1ff}sd-select-option .sd-select__option--selected:not(:hover):not(.sd-select__option--use-checkbox),sd-select-option .sd-select__option--focused:not(:hover):not(.sd-select__option--use-checkbox){color:#0075ff;font-weight:700}sd-select-option .sd-select__option--disabled{color:#aaaaaa;cursor:not-allowed}sd-select-option .sd-select__option:hover:not(.sd-select__option--disabled){background-color:#0075ff;color:white}";
 
@@ -36,7 +36,7 @@ const SdSelectOption = /*@__PURE__*/ proxyCustomElement(class SdSelectOption ext
         }
     };
     render() {
-        return (h(Host, { key: 'f627f75ea5e3765390729eac31e02e78ca084e95' }, h("div", { key: 'ce5f8aa53fb8ae3a3b165c5778aa352a99d0ddf8', class: {
+        return (h(Host, { key: '57acf795fbb642249d9716fc8fa4123f2d939d2b' }, h("div", { key: '6653deafa3142a3bf9b67290dae411c29fc38f41', class: {
                 'sd-select__option': true,
                 'sd-select__option--selected': this.isSelected,
                 'sd-select__option--disabled': !!this.option.disabled,
@@ -92,6 +92,6 @@ function defineCustomElement() {
 }
 
 export { SdSelectOption as S, defineCustomElement as d };
-//# sourceMappingURL=p-8g6E1lU1.js.map
+//# sourceMappingURL=p-BNY55XpQ.js.map
 
-//# sourceMappingURL=p-8g6E1lU1.js.map
+//# sourceMappingURL=p-BNY55XpQ.js.map

package/dist/components/{p-8g6E1lU1.js.map → p-BNY55XpQ.js.map}

@@ -1 +1 @@
-{"file":"p-8g6E1lU1.js","mappings":";;;;AAAA,MAAM,iBAAiB,GAAG,g0BAAg0B;;MCiB70B,cAAc,iBAAAA,kBAAA,CAAA,MAAA,cAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAGlB,IAAA,MAAM;AACN,IAAA,KAAK;IACL,UAAU,GAAY,KAAK;IAC3B,SAAS,GAAY,KAAK;AAC1B,IAAA,WAAW;IACX,QAAQ,GAAY,KAAK;IACzB,WAAW,GAAY,KAAK;IAE3B,SAAS,GAAY,KAAK;AAGnC,IAAA,MAAM,UAAU,GAAA;AACf,QAAA,OAAO,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ;;AAGrB,IAAA,WAAW;AAMZ,IAAA,WAAW,GAAG,CAAC,KAAiB,KAAI;QAC3C,KAAK,CAAC,eAAe,EAAE;AAEvB,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAC5C,YAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;gBACrB,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,KAAK;AACL,aAAA,CAAC;;AAEJ,KAAC;IAED,MAAM,GAAA;QACL,QACC,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACJ,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,KAAK,EAAE;AACN,gBAAA,mBAAmB,EAAE,IAAI;gBACzB,6BAA6B,EAAE,IAAI,CAAC,UAAU;AAC9C,gBAAA,6BAA6B,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ;gBACrD,4BAA4B,EAAE,IAAI,CAAC,SAAS;gBAC5C,iCAAiC,EAAE,IAAI,CAAC,WAAW;AACnD,aAAA,EACD,YAAY,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EAC3C,YAAY,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,EAC5C,KAAK,EAAE,IAAI,CAAC,WAAW,EACX,YAAA,EAAA,IAAI,CAAC,KAAK,EACtB,OAAO,EAAE,IAAI,CAAC,WAAW,EAExB,EAAA,IAAI,CAAC,WAAW,IAChB,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,qCAAqC,EAAA,EAC/C,CAAA,CAAA,aAAA,EAAA,EACC,OAAO,EAAE,IAAI,CAAC,UAAU,EACxB,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;;;;;;;;YAQ9B,OAAO,EAAE,CAAC,IAAG;gBACZ,CAAC,CAAC,cAAc,EAAE;AAClB,gBAAA,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC;AACpB,aAAC,EACa,CAAA,EACf,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,yBAAyB,EAAE,EAAA,IAAI,CAAC,MAAM,CAAC,KAAK,CAAQ,CAC3D,KAEN,IAAI,CAAC,MAAM,CAAC,KAAK,CACjB,CACI,CACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-select/sd-select-option/sd-select-option.scss?tag=sd-select-option","src/components/sd-select/sd-select-option/sd-select-option.tsx"],"sourcesContent":["@import 'variables';\n\nsd-select-option {\n display: block;\n height: fit-content;\n line-height: 0;\n .sd-select__option {\n  display: flex;\n  padding: 4px 12px;\n  font-size: 12px;\n  line-height: 20px;\n  cursor: pointer;\n\n  &__checkbox-wrapper {\n   display: flex;\n   width: 100%;\n   column-gap: 8px;\n   align-items: center;\n   overflow: hidden;\n   white-space: nowrap;\n   text-overflow: ellipsis;\n  }\n\n  &--focused {\n   background-color: $brilliantblue_20;\n  }\n\n  &--selected,\n  &--focused {\n   &:not(:hover):not(.sd-select__option--use-checkbox) {\n    color: $brilliantblue_75;\n    font-weight: 700;\n   }\n  }\n\n  &--disabled {\n   color: $grey_55;\n   cursor: not-allowed;\n  }\n\n  &:hover {\n   &:not(.sd-select__option--disabled) {\n    background-color: $brilliantblue_75;\n    color: white;\n   }\n  }\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport type { SelectOption } from '../../../types/select';\n\n@Component({\n tag: 'sd-select-option',\n styleUrl: 'sd-select-option.scss',\n})\nexport class SdSelectOption {\n @Element() el!: HTMLElement;\n\n @Prop() option!: SelectOption;\n @Prop() index!: number;\n @Prop() isSelected: boolean = false;\n @Prop() isFocused: boolean = false;\n @Prop() optionStyle?: { [key: string]: string };\n @Prop() disabled: boolean = false;\n @Prop() useCheckbox: boolean = false;\n\n @State() isHovered: boolean = false;\n\n @Method()\n async isDisabled(): Promise<boolean> {\n  return !!this.option.disabled;\n }\n\n @Event() optionClick!: EventEmitter<{\n  option: SelectOption;\n  index: number;\n  event: MouseEvent;\n }>;\n\n private handleClick = (event: MouseEvent) => {\n  event.stopPropagation();\n\n  if (!this.option.disabled && !this.disabled) {\n   this.optionClick.emit({\n    option: this.option,\n    index: this.index,\n    event,\n   });\n  }\n };\n\n render() {\n  return (\n   <Host>\n    <div\n     class={{\n      'sd-select__option': true,\n      'sd-select__option--selected': this.isSelected,\n      'sd-select__option--disabled': !!this.option.disabled,\n      'sd-select__option--focused': this.isFocused,\n      'sd-select__option--use-checkbox': this.useCheckbox,\n     }}\n     onMouseEnter={() => (this.isHovered = true)}\n     onMouseLeave={() => (this.isHovered = false)}\n     style={this.optionStyle}\n     data-index={this.index}\n     onClick={this.handleClick}\n    >\n     {this.useCheckbox ? (\n      <div class=\"sd-select__option__checkbox-wrapper\">\n       <sd-checkbox\n        checked={this.isSelected}\n        disabled={this.option.disabled}\n        //   checkboxStyle={\n        //    !this.isSelected\n        //     ? { borderColor: '#888' }\n        //     : this.isHovered\n        //       ? { borderColor: 'white' }\n        //       : { borderColor: '#0075ff' }\n        //   }\n        onClick={e => {\n         e.preventDefault();\n         this.handleClick(e);\n        }}\n       ></sd-checkbox>\n       <span class=\"sd-select__option-label\">{this.option.label}</span>\n      </div>\n     ) : (\n      this.option.label\n     )}\n    </div>\n   </Host>\n  );\n }\n}\n"],"version":3}
+{"file":"p-BNY55XpQ.js","mappings":";;;;AAAA,MAAM,iBAAiB,GAAG,g0BAAg0B;;MCiB70B,cAAc,iBAAAA,kBAAA,CAAA,MAAA,cAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAGlB,IAAA,MAAM;AACN,IAAA,KAAK;IACL,UAAU,GAAY,KAAK;IAC3B,SAAS,GAAY,KAAK;AAC1B,IAAA,WAAW;IACX,QAAQ,GAAY,KAAK;IACzB,WAAW,GAAY,KAAK;IAE3B,SAAS,GAAY,KAAK;AAGnC,IAAA,MAAM,UAAU,GAAA;AACf,QAAA,OAAO,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ;;AAGrB,IAAA,WAAW;AAMZ,IAAA,WAAW,GAAG,CAAC,KAAiB,KAAI;QAC3C,KAAK,CAAC,eAAe,EAAE;AAEvB,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAC5C,YAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;gBACrB,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,KAAK;AACL,aAAA,CAAC;;AAEJ,KAAC;IAED,MAAM,GAAA;QACL,QACC,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACJ,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,KAAK,EAAE;AACN,gBAAA,mBAAmB,EAAE,IAAI;gBACzB,6BAA6B,EAAE,IAAI,CAAC,UAAU;AAC9C,gBAAA,6BAA6B,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ;gBACrD,4BAA4B,EAAE,IAAI,CAAC,SAAS;gBAC5C,iCAAiC,EAAE,IAAI,CAAC,WAAW;AACnD,aAAA,EACD,YAAY,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EAC3C,YAAY,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,EAC5C,KAAK,EAAE,IAAI,CAAC,WAAW,EACX,YAAA,EAAA,IAAI,CAAC,KAAK,EACtB,OAAO,EAAE,IAAI,CAAC,WAAW,EAExB,EAAA,IAAI,CAAC,WAAW,IAChB,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,qCAAqC,EAAA,EAC/C,CAAA,CAAA,aAAA,EAAA,EACC,OAAO,EAAE,IAAI,CAAC,UAAU,EACxB,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;;;;;;;;YAQ9B,OAAO,EAAE,CAAC,IAAG;gBACZ,CAAC,CAAC,cAAc,EAAE;AAClB,gBAAA,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC;AACpB,aAAC,EACa,CAAA,EACf,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,yBAAyB,EAAE,EAAA,IAAI,CAAC,MAAM,CAAC,KAAK,CAAQ,CAC3D,KAEN,IAAI,CAAC,MAAM,CAAC,KAAK,CACjB,CACI,CACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-select/sd-select-option/sd-select-option.scss?tag=sd-select-option","src/components/sd-select/sd-select-option/sd-select-option.tsx"],"sourcesContent":["@import 'variables';\n\nsd-select-option {\n display: block;\n height: fit-content;\n line-height: 0;\n .sd-select__option {\n  display: flex;\n  padding: 4px 12px;\n  font-size: 12px;\n  line-height: 20px;\n  cursor: pointer;\n\n  &__checkbox-wrapper {\n   display: flex;\n   width: 100%;\n   column-gap: 8px;\n   align-items: center;\n   overflow: hidden;\n   white-space: nowrap;\n   text-overflow: ellipsis;\n  }\n\n  &--focused {\n   background-color: $brilliantblue_20;\n  }\n\n  &--selected,\n  &--focused {\n   &:not(:hover):not(.sd-select__option--use-checkbox) {\n    color: $brilliantblue_75;\n    font-weight: 700;\n   }\n  }\n\n  &--disabled {\n   color: $grey_55;\n   cursor: not-allowed;\n  }\n\n  &:hover {\n   &:not(.sd-select__option--disabled) {\n    background-color: $brilliantblue_75;\n    color: white;\n   }\n  }\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport type { SelectOption } from '../../../types/select';\n\n@Component({\n tag: 'sd-select-option',\n styleUrl: 'sd-select-option.scss',\n})\nexport class SdSelectOption {\n @Element() el!: HTMLElement;\n\n @Prop() option!: SelectOption;\n @Prop() index!: number;\n @Prop() isSelected: boolean = false;\n @Prop() isFocused: boolean = false;\n @Prop() optionStyle?: { [key: string]: string };\n @Prop() disabled: boolean = false;\n @Prop() useCheckbox: boolean = false;\n\n @State() isHovered: boolean = false;\n\n @Method()\n async isDisabled(): Promise<boolean> {\n  return !!this.option.disabled;\n }\n\n @Event() optionClick!: EventEmitter<{\n  option: SelectOption;\n  index: number;\n  event: MouseEvent;\n }>;\n\n private handleClick = (event: MouseEvent) => {\n  event.stopPropagation();\n\n  if (!this.option.disabled && !this.disabled) {\n   this.optionClick.emit({\n    option: this.option,\n    index: this.index,\n    event,\n   });\n  }\n };\n\n render() {\n  return (\n   <Host>\n    <div\n     class={{\n      'sd-select__option': true,\n      'sd-select__option--selected': this.isSelected,\n      'sd-select__option--disabled': !!this.option.disabled,\n      'sd-select__option--focused': this.isFocused,\n      'sd-select__option--use-checkbox': this.useCheckbox,\n     }}\n     onMouseEnter={() => (this.isHovered = true)}\n     onMouseLeave={() => (this.isHovered = false)}\n     style={this.optionStyle}\n     data-index={this.index}\n     onClick={this.handleClick}\n    >\n     {this.useCheckbox ? (\n      <div class=\"sd-select__option__checkbox-wrapper\">\n       <sd-checkbox\n        checked={this.isSelected}\n        disabled={this.option.disabled}\n        //   checkboxStyle={\n        //    !this.isSelected\n        //     ? { borderColor: '#888' }\n        //     : this.isHovered\n        //       ? { borderColor: 'white' }\n        //       : { borderColor: '#0075ff' }\n        //   }\n        onClick={e => {\n         e.preventDefault();\n         this.handleClick(e);\n        }}\n       ></sd-checkbox>\n       <span class=\"sd-select__option-label\">{this.option.label}</span>\n      </div>\n     ) : (\n      this.option.label\n     )}\n    </div>\n   </Host>\n  );\n }\n}\n"],"version":3}

package/dist/components/{p-BVE3eRxw.js → p-BZjhXFoV.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CbnL1UUF.js';
 import { r as resolveColor } from './p-BYf-ybt2.js';
-import { d as defineCustomElement$1 } from './p-CWi3wc4b.js';
+import { d as defineCustomElement$1 } from './p-X8UHtq2f.js';
 
 const sdButtonCss = ".sd-button{text-decoration:none;cursor:pointer;border-radius:4px;transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center}.sd-button--xs{padding:0 8px;font-size:12px;font-weight:500;line-height:20px;min-height:24px}.sd-button--sm{padding:0 12px;font-size:12px;font-weight:500;line-height:20px;min-height:28px}.sd-button--md{padding:0 20px;font-size:16px;font-weight:500;line-height:26px;min-height:34px}.sd-button--lg{padding:0 28px;font-size:18px;font-weight:500;line-height:30px;min-height:62px}.sd-button--primary{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary::before{content:\"\";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline{background:white;border:1px solid var(--button-color);color:var(--button-color)}.sd-button--outline::before{content:\"\";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline .sd-button__content{position:relative;z-index:1}.sd-button--ghost{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost::before{content:\"\";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost .sd-button__content{position:relative;z-index:1}.sd-button--disabled{border:1px solid #cccccc;background:#e1e1e1;color:#888888;cursor:not-allowed !important}.sd-button--icon-only{padding:0;width:fit-content;height:fit-content;aspect-ratio:1/1}.sd-button--no-hover:hover::before{opacity:0 !important}.sd-button .sd-button__content{display:inline-flex;align-items:center;justify-content:center;gap:4px;z-index:1;font-weight:500}";
 
@@ -97,6 +97,6 @@ function defineCustomElement() {
 }
 
 export { SdButton as S, defineCustomElement as d };
-//# sourceMappingURL=p-BVE3eRxw.js.map
+//# sourceMappingURL=p-BZjhXFoV.js.map
 
-//# sourceMappingURL=p-BVE3eRxw.js.map
+//# sourceMappingURL=p-BZjhXFoV.js.map

package/dist/components/{p-BVE3eRxw.js.map → p-BZjhXFoV.js.map}

@@ -1 +1 @@
-{"file":"p-BVE3eRxw.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-button/sd-button.scss?tag=sd-button","src/components/sd-button/sd-button.tsx"],"sourcesContent":["@import 'variables';\n\n.sd-button {\n text-decoration: none;\n cursor: pointer;\n border-radius: 4px;\n transition: all 0.2s ease-in-out;\n position: relative;\n overflow: hidden;\n white-space: nowrap;\n -webkit-user-select: none;\n user-select: none;\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n &--xs {\n  padding: 0 8px;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 20px;\n  min-height: 24px;\n }\n &--sm {\n  padding: 0 12px;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 20px;\n  min-height: 28px;\n }\n &--md {\n  padding: 0 20px;\n  font-size: 16px;\n  font-weight: 500;\n  line-height: 26px;\n  min-height: 34px;\n }\n &--lg {\n  padding: 0 28px;\n  font-size: 18px;\n  font-weight: 500;\n  line-height: 30px;\n  min-height: 62px;\n }\n &--primary {\n  background-color: var(--button-color);\n  color: white;\n  transition: filter 0.2s ease;\n\n  &::before {\n   content: '';\n   position: absolute;\n   inset: 0;\n   background: #000000;\n   opacity: 0;\n   transition: opacity 0.2s ease;\n   z-index: 0;\n  }\n\n  &:hover:not(.sd-button--disabled):not(.sd-button--loading)::before {\n   opacity: 0.25;\n  }\n }\n\n &--outline {\n  background: white;\n  border: 1px solid var(--button-color);\n  color: var(--button-color);\n\n  &::before {\n   content: '';\n   position: absolute;\n   inset: 0;\n   background: var(--button-color);\n   opacity: 0;\n   transition: opacity 0.2s ease;\n   z-index: 0;\n  }\n\n  &:hover:not(.sd-button--disabled):not(.sd-button--loading)::before {\n   opacity: 0.15;\n  }\n\n  .sd-button__content {\n   position: relative;\n   z-index: 1;\n  }\n }\n &--ghost {\n  background-color: transparent;\n  color: var(--button-color);\n  border-color: transparent;\n\n  &::before {\n   content: '';\n   position: absolute;\n   inset: 0;\n   background: var(--button-color);\n   opacity: 0;\n   transition: opacity 0.2s ease;\n   z-index: 0;\n  }\n\n  &:hover:not(.sd-button--disabled):not(.sd-button--loading)::before {\n   opacity: 0.15;\n  }\n\n  .sd-button__content {\n   position: relative;\n   z-index: 1;\n  }\n }\n &--disabled {\n  border: 1px solid $grey_45;\n  background: $grey_30;\n  color: $grey_65;\n  cursor: not-allowed !important;\n }\n &--icon-only {\n  padding: 0;\n  width: fit-content;\n  height: fit-content;\n  aspect-ratio: 1 / 1;\n }\n &--no-hover {\n  &:hover::before {\n   opacity: 0 !important;\n  }\n }\n\n .sd-button__content {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 4px;\n\n  z-index: 1;\n  font-weight: 500;\n }\n}\n\n// /* Focus styles */\n// .sd-button:focus-visible {\n//  outline: 2px solid $primary;\n//  outline-offset: 2px;\n// }\n\n// /* High contrast mode support */\n// @media (prefers-contrast: high) {\n//  .sd-button {\n//   border-width: 2px;\n//  }\n// }\n","import { Component, Prop, h, Element, Event, EventEmitter, Host } from '@stencil/core';\nimport { resolveColor } from '../../utils/color';\n\nexport type ButtonVariant = 'primary' | 'outline' | 'ghost';\nexport type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';\n\nconst ICON_SIZES: { [key in ButtonSize]: number } = {\n xs: 12,\n sm: 16,\n md: 20,\n lg: 24,\n};\n\n@Component({\n tag: 'sd-button',\n styleUrl: 'sd-button.scss',\n})\nexport class SdButton {\n @Element() el!: HTMLElement;\n\n @Prop() variant?: ButtonVariant = 'primary';\n @Prop() size: ButtonSize = 'sm';\n @Prop() color: string = '#025497';\n @Prop() label: string = '';\n @Prop() disabled: boolean = false;\n @Prop() type: 'button' | 'submit' | 'reset' = 'button';\n @Prop() icon?: IconName;\n @Prop() iconColor?: string;\n @Prop() iconSize?: number;\n @Prop() iconRight?: IconName;\n @Prop() noHover: boolean = false;\n @Prop() class: string = '';\n @Event() sdClick!: EventEmitter<MouseEvent>;\n\n private handleClick = (event: MouseEvent) => {\n  if (this.disabled) {\n   event.preventDefault();\n   event.stopPropagation();\n   return;\n  }\n  this.sdClick.emit(event);\n };\n\n private getButtonClasses(): string {\n  const classes = ['sd-button'];\n\n  classes.push(`sd-button--${this.variant}`);\n  classes.push(`sd-button--${this.size}`);\n  classes.push(`sd-button--color-${this.color}`);\n\n  if (this.disabled) {\n   classes.push('sd-button--disabled');\n  }\n\n  if (!this.label && (this.icon || this.iconRight)) {\n   classes.push('sd-button--icon-only');\n  }\n\n  if (this.noHover) {\n   classes.push('sd-button--no-hover');\n  }\n\n  return classes.join(' ');\n }\n\n render() {\n  const buttonClasses = this.getButtonClasses();\n  // 유틸로 색상 키 -> HEX 매핑 (없으면 원본 그대로)\n  const resolvedColor = resolveColor(this.color);\n\n  return (\n   <Host style={{ '--button-color': resolvedColor }}>\n    <button\n     class={`${buttonClasses} ${this.class}`}\n     type={this.type}\n     disabled={this.disabled}\n     onClick={this.handleClick}\n    >\n     <div class=\"sd-button__content\">\n      {this.icon && (\n       <sd-icon\n        class=\"sd-button__icon sd-button__icon--left\"\n        name={this.icon}\n        size={this.iconSize ? this.iconSize : ICON_SIZES[this.size!]}\n        color={\n         this.iconColor ? this.iconColor : this.variant === 'primary' ? '#fff' : resolvedColor\n        }\n       ></sd-icon>\n      )}\n\n      {this.label && <div class=\"sd-button__label\">{this.label}</div>}\n\n      {this.iconRight && (\n       <sd-icon\n        class=\"sd-button__icon sd-button__icon--right\"\n        name={this.iconRight}\n        size={ICON_SIZES[this.size!]}\n        color={this.variant === 'primary' ? '#fff' : resolvedColor}\n       ></sd-icon>\n      )}\n     </div>\n    </button>\n   </Host>\n  );\n }\n}\n"],"version":3}
+{"file":"p-BZjhXFoV.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-button/sd-button.scss?tag=sd-button","src/components/sd-button/sd-button.tsx"],"sourcesContent":["@import 'variables';\n\n.sd-button {\n text-decoration: none;\n cursor: pointer;\n border-radius: 4px;\n transition: all 0.2s ease-in-out;\n position: relative;\n overflow: hidden;\n white-space: nowrap;\n -webkit-user-select: none;\n user-select: none;\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n &--xs {\n  padding: 0 8px;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 20px;\n  min-height: 24px;\n }\n &--sm {\n  padding: 0 12px;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 20px;\n  min-height: 28px;\n }\n &--md {\n  padding: 0 20px;\n  font-size: 16px;\n  font-weight: 500;\n  line-height: 26px;\n  min-height: 34px;\n }\n &--lg {\n  padding: 0 28px;\n  font-size: 18px;\n  font-weight: 500;\n  line-height: 30px;\n  min-height: 62px;\n }\n &--primary {\n  background-color: var(--button-color);\n  color: white;\n  transition: filter 0.2s ease;\n\n  &::before {\n   content: '';\n   position: absolute;\n   inset: 0;\n   background: #000000;\n   opacity: 0;\n   transition: opacity 0.2s ease;\n   z-index: 0;\n  }\n\n  &:hover:not(.sd-button--disabled):not(.sd-button--loading)::before {\n   opacity: 0.25;\n  }\n }\n\n &--outline {\n  background: white;\n  border: 1px solid var(--button-color);\n  color: var(--button-color);\n\n  &::before {\n   content: '';\n   position: absolute;\n   inset: 0;\n   background: var(--button-color);\n   opacity: 0;\n   transition: opacity 0.2s ease;\n   z-index: 0;\n  }\n\n  &:hover:not(.sd-button--disabled):not(.sd-button--loading)::before {\n   opacity: 0.15;\n  }\n\n  .sd-button__content {\n   position: relative;\n   z-index: 1;\n  }\n }\n &--ghost {\n  background-color: transparent;\n  color: var(--button-color);\n  border-color: transparent;\n\n  &::before {\n   content: '';\n   position: absolute;\n   inset: 0;\n   background: var(--button-color);\n   opacity: 0;\n   transition: opacity 0.2s ease;\n   z-index: 0;\n  }\n\n  &:hover:not(.sd-button--disabled):not(.sd-button--loading)::before {\n   opacity: 0.15;\n  }\n\n  .sd-button__content {\n   position: relative;\n   z-index: 1;\n  }\n }\n &--disabled {\n  border: 1px solid $grey_45;\n  background: $grey_30;\n  color: $grey_65;\n  cursor: not-allowed !important;\n }\n &--icon-only {\n  padding: 0;\n  width: fit-content;\n  height: fit-content;\n  aspect-ratio: 1 / 1;\n }\n &--no-hover {\n  &:hover::before {\n   opacity: 0 !important;\n  }\n }\n\n .sd-button__content {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 4px;\n\n  z-index: 1;\n  font-weight: 500;\n }\n}\n\n// /* Focus styles */\n// .sd-button:focus-visible {\n//  outline: 2px solid $primary;\n//  outline-offset: 2px;\n// }\n\n// /* High contrast mode support */\n// @media (prefers-contrast: high) {\n//  .sd-button {\n//   border-width: 2px;\n//  }\n// }\n","import { Component, Prop, h, Element, Event, EventEmitter, Host } from '@stencil/core';\nimport { resolveColor } from '../../utils/color';\n\nexport type ButtonVariant = 'primary' | 'outline' | 'ghost';\nexport type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';\n\nconst ICON_SIZES: { [key in ButtonSize]: number } = {\n xs: 12,\n sm: 16,\n md: 20,\n lg: 24,\n};\n\n@Component({\n tag: 'sd-button',\n styleUrl: 'sd-button.scss',\n})\nexport class SdButton {\n @Element() el!: HTMLElement;\n\n @Prop() variant?: ButtonVariant = 'primary';\n @Prop() size: ButtonSize = 'sm';\n @Prop() color: string = '#025497';\n @Prop() label: string = '';\n @Prop() disabled: boolean = false;\n @Prop() type: 'button' | 'submit' | 'reset' = 'button';\n @Prop() icon?: IconName;\n @Prop() iconColor?: string;\n @Prop() iconSize?: number;\n @Prop() iconRight?: IconName;\n @Prop() noHover: boolean = false;\n @Prop() class: string = '';\n @Event() sdClick!: EventEmitter<MouseEvent>;\n\n private handleClick = (event: MouseEvent) => {\n  if (this.disabled) {\n   event.preventDefault();\n   event.stopPropagation();\n   return;\n  }\n  this.sdClick.emit(event);\n };\n\n private getButtonClasses(): string {\n  const classes = ['sd-button'];\n\n  classes.push(`sd-button--${this.variant}`);\n  classes.push(`sd-button--${this.size}`);\n  classes.push(`sd-button--color-${this.color}`);\n\n  if (this.disabled) {\n   classes.push('sd-button--disabled');\n  }\n\n  if (!this.label && (this.icon || this.iconRight)) {\n   classes.push('sd-button--icon-only');\n  }\n\n  if (this.noHover) {\n   classes.push('sd-button--no-hover');\n  }\n\n  return classes.join(' ');\n }\n\n render() {\n  const buttonClasses = this.getButtonClasses();\n  // 유틸로 색상 키 -> HEX 매핑 (없으면 원본 그대로)\n  const resolvedColor = resolveColor(this.color);\n\n  return (\n   <Host style={{ '--button-color': resolvedColor }}>\n    <button\n     class={`${buttonClasses} ${this.class}`}\n     type={this.type}\n     disabled={this.disabled}\n     onClick={this.handleClick}\n    >\n     <div class=\"sd-button__content\">\n      {this.icon && (\n       <sd-icon\n        class=\"sd-button__icon sd-button__icon--left\"\n        name={this.icon}\n        size={this.iconSize ? this.iconSize : ICON_SIZES[this.size!]}\n        color={\n         this.iconColor ? this.iconColor : this.variant === 'primary' ? '#fff' : resolvedColor\n        }\n       ></sd-icon>\n      )}\n\n      {this.label && <div class=\"sd-button__label\">{this.label}</div>}\n\n      {this.iconRight && (\n       <sd-icon\n        class=\"sd-button__icon sd-button__icon--right\"\n        name={this.iconRight}\n        size={ICON_SIZES[this.size!]}\n        color={this.variant === 'primary' ? '#fff' : resolvedColor}\n       ></sd-icon>\n      )}\n     </div>\n    </button>\n   </Host>\n  );\n }\n}\n"],"version":3}

package/dist/components/{p-DuhvG9b9.js → p-DobE7cC4.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment } from './p-CbnL1UUF.js';
-import { d as defineCustomElement$1 } from './p-CWi3wc4b.js';
+import { d as defineCustomElement$1 } from './p-X8UHtq2f.js';
 
 const sdPaginationCss = ".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}";
 
@@ -124,6 +124,6 @@ function defineCustomElement() {
 }
 
 export { SdPagination as S, defineCustomElement as d };
-//# sourceMappingURL=p-DuhvG9b9.js.map
+//# sourceMappingURL=p-DobE7cC4.js.map
 
-//# sourceMappingURL=p-DuhvG9b9.js.map
+//# sourceMappingURL=p-DobE7cC4.js.map

package/dist/components/{p-DuhvG9b9.js.map → p-DobE7cC4.js.map}

@@ -1 +1 @@
-{"file":"p-DuhvG9b9.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-pagination/sd-pagination.scss?tag=sd-pagination","src/components/sd-pagination/sd-pagination.tsx"],"sourcesContent":["@import 'variables';\n\n.sd-pagination {\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-content: center;\n gap: 8px;\n color: $grey_80;\n width: 100%;\n font-size: 12px;\n\n .prepend-btns {\n  display: flex;\n  flex-flow: row nowrap;\n  align-items: center;\n  gap: 8px;\n  width: 60px;\n\n  button {\n   width: 26px;\n   height: 26px;\n   border: 0;\n   background: none;\n\n   &:hover {\n    border: 1px solid $oceanblue_70;\n    border-radius: 14px;\n   }\n  }\n }\n\n .append-btns {\n  display: flex;\n  flex-flow: row nowrap;\n  align-items: center;\n  gap: 8px;\n  width: 60px;\n\n  button {\n   width: 26px;\n   height: 26px;\n   border: 0;\n   background: none;\n\n   &:hover {\n    border: 1px solid $oceanblue_70;\n    border-radius: 14px;\n   }\n  }\n }\n\n .pagination-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 14px;\n  outline: none;\n  border: none;\n  cursor: pointer;\n  height: 26px;\n  color: $grey_80;\n  width: var(--pagination-btn-width, 26px);\n\n  &--selected {\n   background-color: $oceanblue_70;\n   color: white;\n  }\n\n  &:hover {\n   border: 1px solid $oceanblue_70;\n  }\n }\n\n &--simple {\n  .pagination-info {\n   line-height: 26px;\n   display: flex;\n   flex-flow: row nowrap;\n   align-items: center;\n   gap: 8px;\n   .current-page,\n   .last-page {\n    padding: 0 2px;\n   }\n  }\n }\n}\n","import { Component, Prop, Event, EventEmitter, h, Watch, Fragment } from '@stencil/core';\n\nconst BUTTON_WIDTH: Record<number, number> = {\n 1: 26,\n 2: 36,\n 3: 42,\n 4: 50,\n 5: 58,\n};\n\nconst PER_PAGE = 10;\n\n@Component({\n tag: 'sd-pagination',\n styleUrl: 'sd-pagination.scss',\n})\nexport class SdPagination {\n @Prop() currentPage: number = 1;\n @Prop() lastPage: number = 1;\n @Prop() simple: boolean = false;\n\n @Event() pageChange!: EventEmitter<number>;\n\n @Watch('currentPage')\n @Watch('lastPage')\n onPropChange() {\n  console.log('Pagination props changed', {\n   currentPage: this.currentPage,\n   lastPage: this.lastPage,\n  });\n }\n\n private get paginationClasses() {\n  const classes = ['sd-pagination'];\n\n  if (this.simple) {\n   classes.push('sd-pagination--simple');\n  }\n  return classes.join(' ');\n }\n\n private get pageNumbers() {\n  const start = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;\n  const end = Math.min(start + PER_PAGE - 1, this.lastPage);\n  return Array.from({ length: end - start + 1 }, (_, i) => start + i);\n }\n\n private get buttonWidth() {\n  const lastPageNum = this.pageNumbers.at(-1) ?? 1;\n  const maxPageLength: number = lastPageNum.toString().length;\n  return BUTTON_WIDTH[maxPageLength] || BUTTON_WIDTH[1];\n }\n\n private handlePageChange(page: number) {\n  if (page < 1 || page > this.lastPage) return;\n  this.pageChange.emit(page);\n }\n\n private handleGroupChange(direction: 'forward' | 'backward') {\n  const delta = direction === 'forward' ? PER_PAGE : -PER_PAGE;\n  const newPage = Math.min(Math.max(this.currentPage + delta, 1), this.lastPage);\n  this.handlePageChange(newPage);\n }\n\n private get isFirstGroup() {\n  return this.currentPage <= PER_PAGE;\n }\n\n private get isLastGroup() {\n  const startPageGroup = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;\n  return startPageGroup + PER_PAGE - 1 >= this.lastPage;\n }\n\n private renderPrevButtons() {\n  if (this.simple) {\n   if (this.currentPage <= 1) return null;\n\n   return (\n    <Fragment>\n     <button aria-label=\"Go to first page\" onClick={() => this.handlePageChange(1)}>\n      <sd-icon name=\"arrowLeftEnd\" size=\"12\" color=\"#222222\" />\n     </button>\n     <button\n      aria-label=\"Go to previous page\"\n      onClick={() => this.handlePageChange(this.currentPage - 1)}\n     >\n      <sd-icon name=\"arrowLeft\" size=\"12\" color=\"#222222\" />\n     </button>\n    </Fragment>\n   );\n  }\n\n  if (!this.isFirstGroup) {\n   return (\n    <Fragment>\n     <button aria-label=\"Go to first page\" onClick={() => this.handlePageChange(1)}>\n      <sd-icon name=\"arrowLeftEnd\" size=\"12\" color=\"#222222\" />\n     </button>\n     <button\n      aria-label=\"Go to previous page group\"\n      onClick={() => this.handleGroupChange('backward')}\n     >\n      <sd-icon name=\"arrowLeft\" size=\"12\" color=\"#222222\" />\n     </button>\n    </Fragment>\n   );\n  }\n }\n\n private renderNextButtons() {\n  if (this.simple) {\n   if (this.currentPage >= this.lastPage) return null;\n\n   return (\n    <Fragment>\n     <button\n      aria-label=\"Go to next page\"\n      onClick={() => this.handlePageChange(this.currentPage + 1)}\n     >\n      <sd-icon name=\"arrowRight\" size=\"12\" color=\"#222222\" />\n     </button>\n     <button aria-label=\"Go to last page\" onClick={() => this.handlePageChange(this.lastPage)}>\n      <sd-icon name=\"arrowRightEnd\" size=\"12\" color=\"#222222\" />\n     </button>\n    </Fragment>\n   );\n  }\n\n  if (!this.isLastGroup) {\n   return (\n    <Fragment>\n     <button aria-label=\"Go to next page group\" onClick={() => this.handleGroupChange('forward')}>\n      <sd-icon name=\"arrowRight\" size=\"12\" color=\"#222222\" />\n     </button>\n     <button aria-label=\"Go to last page\" onClick={() => this.handlePageChange(this.lastPage)}>\n      <sd-icon name=\"arrowRightEnd\" size=\"12\" color=\"#222222\" />\n     </button>\n    </Fragment>\n   );\n  }\n }\n\n render() {\n  return (\n   <div class={this.paginationClasses}>\n    <div class=\"prepend-btns\">{this.renderPrevButtons()}</div>\n\n    {this.simple ? (\n     <div class=\"pagination-info\">\n      <span class=\"current-page\">{this.currentPage}</span>\n      <span>/</span>\n      <span class=\"last-page\">{this.lastPage}</span>\n     </div>\n    ) : (\n     this.pageNumbers.map(n => (\n      <button\n       type=\"button\"\n       aria-current={this.currentPage === n ? 'page' : undefined}\n       class={{\n        'pagination-btn': true,\n        'pagination-btn--selected': this.currentPage === n,\n       }}\n       disabled={this.currentPage === n}\n       style={{\n        '--pagination-btn-width': `${this.buttonWidth}px`,\n       }}\n       onClick={() => this.handlePageChange(n)}\n      >\n       {n}\n      </button>\n     ))\n    )}\n\n    <div class=\"append-btns\">{this.renderNextButtons()}</div>\n   </div>\n  );\n }\n}\n"],"version":3}
+{"file":"p-DobE7cC4.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-pagination/sd-pagination.scss?tag=sd-pagination","src/components/sd-pagination/sd-pagination.tsx"],"sourcesContent":["@import 'variables';\n\n.sd-pagination {\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-content: center;\n gap: 8px;\n color: $grey_80;\n width: 100%;\n font-size: 12px;\n\n .prepend-btns {\n  display: flex;\n  flex-flow: row nowrap;\n  align-items: center;\n  gap: 8px;\n  width: 60px;\n\n  button {\n   width: 26px;\n   height: 26px;\n   border: 0;\n   background: none;\n\n   &:hover {\n    border: 1px solid $oceanblue_70;\n    border-radius: 14px;\n   }\n  }\n }\n\n .append-btns {\n  display: flex;\n  flex-flow: row nowrap;\n  align-items: center;\n  gap: 8px;\n  width: 60px;\n\n  button {\n   width: 26px;\n   height: 26px;\n   border: 0;\n   background: none;\n\n   &:hover {\n    border: 1px solid $oceanblue_70;\n    border-radius: 14px;\n   }\n  }\n }\n\n .pagination-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 14px;\n  outline: none;\n  border: none;\n  cursor: pointer;\n  height: 26px;\n  color: $grey_80;\n  width: var(--pagination-btn-width, 26px);\n\n  &--selected {\n   background-color: $oceanblue_70;\n   color: white;\n  }\n\n  &:hover {\n   border: 1px solid $oceanblue_70;\n  }\n }\n\n &--simple {\n  .pagination-info {\n   line-height: 26px;\n   display: flex;\n   flex-flow: row nowrap;\n   align-items: center;\n   gap: 8px;\n   .current-page,\n   .last-page {\n    padding: 0 2px;\n   }\n  }\n }\n}\n","import { Component, Prop, Event, EventEmitter, h, Watch, Fragment } from '@stencil/core';\n\nconst BUTTON_WIDTH: Record<number, number> = {\n 1: 26,\n 2: 36,\n 3: 42,\n 4: 50,\n 5: 58,\n};\n\nconst PER_PAGE = 10;\n\n@Component({\n tag: 'sd-pagination',\n styleUrl: 'sd-pagination.scss',\n})\nexport class SdPagination {\n @Prop() currentPage: number = 1;\n @Prop() lastPage: number = 1;\n @Prop() simple: boolean = false;\n\n @Event() pageChange!: EventEmitter<number>;\n\n @Watch('currentPage')\n @Watch('lastPage')\n onPropChange() {\n  console.log('Pagination props changed', {\n   currentPage: this.currentPage,\n   lastPage: this.lastPage,\n  });\n }\n\n private get paginationClasses() {\n  const classes = ['sd-pagination'];\n\n  if (this.simple) {\n   classes.push('sd-pagination--simple');\n  }\n  return classes.join(' ');\n }\n\n private get pageNumbers() {\n  const start = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;\n  const end = Math.min(start + PER_PAGE - 1, this.lastPage);\n  return Array.from({ length: end - start + 1 }, (_, i) => start + i);\n }\n\n private get buttonWidth() {\n  const lastPageNum = this.pageNumbers.at(-1) ?? 1;\n  const maxPageLength: number = lastPageNum.toString().length;\n  return BUTTON_WIDTH[maxPageLength] || BUTTON_WIDTH[1];\n }\n\n private handlePageChange(page: number) {\n  if (page < 1 || page > this.lastPage) return;\n  this.pageChange.emit(page);\n }\n\n private handleGroupChange(direction: 'forward' | 'backward') {\n  const delta = direction === 'forward' ? PER_PAGE : -PER_PAGE;\n  const newPage = Math.min(Math.max(this.currentPage + delta, 1), this.lastPage);\n  this.handlePageChange(newPage);\n }\n\n private get isFirstGroup() {\n  return this.currentPage <= PER_PAGE;\n }\n\n private get isLastGroup() {\n  const startPageGroup = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;\n  return startPageGroup + PER_PAGE - 1 >= this.lastPage;\n }\n\n private renderPrevButtons() {\n  if (this.simple) {\n   if (this.currentPage <= 1) return null;\n\n   return (\n    <Fragment>\n     <button aria-label=\"Go to first page\" onClick={() => this.handlePageChange(1)}>\n      <sd-icon name=\"arrowLeftEnd\" size=\"12\" color=\"#222222\" />\n     </button>\n     <button\n      aria-label=\"Go to previous page\"\n      onClick={() => this.handlePageChange(this.currentPage - 1)}\n     >\n      <sd-icon name=\"arrowLeft\" size=\"12\" color=\"#222222\" />\n     </button>\n    </Fragment>\n   );\n  }\n\n  if (!this.isFirstGroup) {\n   return (\n    <Fragment>\n     <button aria-label=\"Go to first page\" onClick={() => this.handlePageChange(1)}>\n      <sd-icon name=\"arrowLeftEnd\" size=\"12\" color=\"#222222\" />\n     </button>\n     <button\n      aria-label=\"Go to previous page group\"\n      onClick={() => this.handleGroupChange('backward')}\n     >\n      <sd-icon name=\"arrowLeft\" size=\"12\" color=\"#222222\" />\n     </button>\n    </Fragment>\n   );\n  }\n }\n\n private renderNextButtons() {\n  if (this.simple) {\n   if (this.currentPage >= this.lastPage) return null;\n\n   return (\n    <Fragment>\n     <button\n      aria-label=\"Go to next page\"\n      onClick={() => this.handlePageChange(this.currentPage + 1)}\n     >\n      <sd-icon name=\"arrowRight\" size=\"12\" color=\"#222222\" />\n     </button>\n     <button aria-label=\"Go to last page\" onClick={() => this.handlePageChange(this.lastPage)}>\n      <sd-icon name=\"arrowRightEnd\" size=\"12\" color=\"#222222\" />\n     </button>\n    </Fragment>\n   );\n  }\n\n  if (!this.isLastGroup) {\n   return (\n    <Fragment>\n     <button aria-label=\"Go to next page group\" onClick={() => this.handleGroupChange('forward')}>\n      <sd-icon name=\"arrowRight\" size=\"12\" color=\"#222222\" />\n     </button>\n     <button aria-label=\"Go to last page\" onClick={() => this.handlePageChange(this.lastPage)}>\n      <sd-icon name=\"arrowRightEnd\" size=\"12\" color=\"#222222\" />\n     </button>\n    </Fragment>\n   );\n  }\n }\n\n render() {\n  return (\n   <div class={this.paginationClasses}>\n    <div class=\"prepend-btns\">{this.renderPrevButtons()}</div>\n\n    {this.simple ? (\n     <div class=\"pagination-info\">\n      <span class=\"current-page\">{this.currentPage}</span>\n      <span>/</span>\n      <span class=\"last-page\">{this.lastPage}</span>\n     </div>\n    ) : (\n     this.pageNumbers.map(n => (\n      <button\n       type=\"button\"\n       aria-current={this.currentPage === n ? 'page' : undefined}\n       class={{\n        'pagination-btn': true,\n        'pagination-btn--selected': this.currentPage === n,\n       }}\n       disabled={this.currentPage === n}\n       style={{\n        '--pagination-btn-width': `${this.buttonWidth}px`,\n       }}\n       onClick={() => this.handlePageChange(n)}\n      >\n       {n}\n      </button>\n     ))\n    )}\n\n    <div class=\"append-btns\">{this.renderNextButtons()}</div>\n   </div>\n  );\n }\n}\n"],"version":3}

package/dist/components/{p-CQILI9BE.js → p-Dvtwm2UI.js}

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, h, F as Fragment } from './p-CbnL1UUF.js';
 import { T as TooltipArrow } from './p-wA4KCOG0.js';
-import { d as defineCustomElement$3 } from './p-BVE3eRxw.js';
-import { d as defineCustomElement$2 } from './p-CWi3wc4b.js';
-import { d as defineCustomElement$1 } from './p-c8NhJgfj.js';
+import { d as defineCustomElement$3 } from './p-BZjhXFoV.js';
+import { d as defineCustomElement$2 } from './p-X8UHtq2f.js';
+import { d as defineCustomElement$1 } from './p-BLVHOrsi.js';
 
 const sdTooltipCss = "sd-tooltip [slot=content]{display:none}sd-tooltip .sd-tooltip{position:relative;cursor:pointer;display:inline-block}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;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__content p{margin:0}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}";
 
@@ -55,20 +55,20 @@ const SdTooltip = /*@__PURE__*/ proxyCustomElement(class SdTooltip extends H {
             : {
                 onClick: () => (this.showTooltip = !this.showTooltip),
             };
-        return (h(Fragment, { key: '2a4473864df0253d22d03a7b1512d6261d2c5f1e' }, 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: '48ba8d56f7ee68ac71bd7076c98f8e7081635de5', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, h("div", { key: 'edb64ac6facd530f02a3c663a4d7e728270bb914', class: {
+        return (h(Fragment, { key: '45dbef1d93b082f8fe42c003f997aa80ad297ee5' }, 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: '7357fe6678832a74c567b24e404d14d75a77b13f', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, h("div", { key: '3add41a611cb55fddaae7733b6db9ec996561723', class: {
                 'sd-tooltip-menu': true,
                 [`sd-tooltip-menu--${this.type}`]: true,
                 [`sd-tooltip-menu--${this.placement}`]: true,
                 'sd-tooltip-menu--with-close': this.useClose,
                 [`bg-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,
                 [`text-${SdTooltip.COLOR_OF_TYPE[this.type].text}`]: true,
-            } }, h("i", { key: '2907f18d268eed0d0e70707b1fb113ca1b6ce1a6', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: 'fd6417e7cad6464f5830accca7842f9c2d5431ca', class: {
+            } }, h("i", { key: 'f62cfc386831412cb958da88a41e0487be40d119', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: 'daab1b1028832d95fb05456b96981cdeb1e31c4e', class: {
                 [`text-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,
-            } })), h("div", { key: '30e7d57e6bdd47ca5da01c8e94e6d29cc174de58', class: "sd-tooltip-menu__content", ref: el => {
+            } })), h("div", { key: 'ab7ca38aa68cf8279ff0d372651a4e26b217781c', class: "sd-tooltip-menu__content", ref: el => {
                 if (el && this.slotContent && !el.hasChildNodes()) {
                     el.appendChild(this.slotContent.cloneNode(true));
                 }
-            } }, !this.slotContent && h("span", { key: '9e6afb40c06db772ed94fd90c73713a1134e2866' }, this.el.textContent)), this.useClose && (h("div", { key: '8679d07e7d2e027f4a96ebaecd64b1fac9ecf503', class: "sd-tooltip-menu__close-button" }, h("button", { key: 'aa018b14eeeb08f872af25d93c0bd36708bf36e8', type: "button", "aria-label": "Close tooltip", title: "Close tooltip", onClick: () => this.handleClose() }, h("sd-icon", { key: '0a0d3c6c246adccdb9b31502f13a1189a0a94554', name: "close", size: "12", color: "#AAAAAA" })))))))));
+            } }, !this.slotContent && h("span", { key: 'f5768e8b7e3033f64797aba77a504d57236e51e3' }, this.el.textContent)), this.useClose && (h("div", { key: '94bdf692fabf190912a64d6051957031b2964ae5', class: "sd-tooltip-menu__close-button" }, h("button", { key: '8826745fb1dab139358bc0d430d622abca333e5e', type: "button", "aria-label": "Close tooltip", title: "Close tooltip", onClick: () => this.handleClose() }, h("sd-icon", { key: '863f114251ec302425224a7385dd23292f7f6340', name: "close", size: "12", color: "#AAAAAA" })))))))));
     }
     static get style() { return sdTooltipCss; }
 }, [768, "sd-tooltip", {
@@ -116,6 +116,6 @@ function defineCustomElement() {
 }
 
 export { SdTooltip as S, defineCustomElement as d };
-//# sourceMappingURL=p-CQILI9BE.js.map
+//# sourceMappingURL=p-Dvtwm2UI.js.map
 
-//# sourceMappingURL=p-CQILI9BE.js.map
+//# sourceMappingURL=p-Dvtwm2UI.js.map

package/dist/components/{p-CQILI9BE.js.map → p-Dvtwm2UI.js.map}

@@ -1 +1 @@
-{"file":"p-CQILI9BE.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,6kCAA6kC;;MCSrlC,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;;;;;;;;IAGb,OAAO,GAAsB,OAAO;IACpC,SAAS,GAAwC,KAAK;IACtD,KAAK,GAAW,SAAS;IACzB,IAAI,GAAgD,SAAS;IAE7D,IAAI,GAAa,aAAa;IAC9B,QAAQ,GAAW,EAAE;IAErB,KAAK,GAAW,EAAE;IAClB,UAAU,GAAe,IAAI;IAC7B,aAAa,GAAkB,SAAS;IAExC,OAAO,GAAY,IAAI;IAEvB,QAAQ,GAAY,KAAK;IAExB,WAAW,GAAY,KAAK;IAC5B,WAAW,GAAuB,IAAI;IAEvC,OAAgB,aAAa,GAAG;QACvC,OAAO,EAAE,EAAE,UAAU,EAAE,cAAc,EAAE,IAAI,EAAE,OAAO,EAAE;QACtD,OAAO,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE;QACjD,MAAM,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,IAAI,EAAE,WAAW,EAAE;QACtD,MAAM,EAAE,EAAE,UAAU,EAAE,kBAAkB,EAAE,IAAI,EAAE,kBAAkB,EAAE;KACpE;AAEO,IAAA,QAAQ;IAER,WAAW,GAAG,MAAK;AAC1B,QAAA,IAAI,CAAC,WAAW,GAAG,KAAK;AACzB,KAAC;;;;IAKD,iBAAiB,GAAA;QAChB,MAAM,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,kBAAkB,CAAC;QAC3D,IAAI,SAAS,EAAE;YACd,IAAI,CAAC,WAAW,GAAG,SAAS,CAAC,SAAS,CAAC,IAAI,CAAgB;;;IAI7D,MAAM,GAAA;AACL,QAAA,MAAM,aAAa,GAClB,IAAI,CAAC,OAAO,KAAK;AAChB,cAAE;gBACC,YAAY,EAAE,OAAO,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;gBAC7C,YAAY,EAAE,OAAO,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;AAC9C;AACH,cAAE;AACC,gBAAA,OAAO,EAAE,OAAO,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC;aACrD;AAEL,QAAA,QACC,EAAC,QAAQ,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACP,IAAI,CAAC,KAAK,IACV,CAAA,CAAA,WAAA,EAAA,EACC,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,EAC/B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,UAAU,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,KAAK,EAAC,YAAY,EACd,GAAA,aAAa,GACL,KAEb,CAAA,CAAA,SAAA,EAAA,EACC,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,EAC/B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAC,YAAY,EAAA,GACd,aAAa,EAAA,CACP,CACX,EAEA,IAAI,CAAC,WAAW,KAChB,CAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,SAAS,EAAE,IAAI,CAAC,QAAQ,EACxB,SAAS,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,EACnC,SAAS,EAAE,IAAI,CAAC,SAAS,EAAA,EAEzB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,KAAK,EAAE;AACN,gBAAA,iBAAiB,EAAE,IAAI;AACvB,gBAAA,CAAC,oBAAoB,IAAI,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;AACvC,gBAAA,CAAC,oBAAoB,IAAI,CAAC,SAAS,CAAE,CAAA,GAAG,IAAI;gBAC5C,6BAA6B,EAAE,IAAI,CAAC,QAAQ;AAC5C,gBAAA,CAAC,CAAM,GAAA,EAAA,SAAS,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,UAAU,CAAE,CAAA,GAAG,IAAI;AAC7D,gBAAA,CAAC,CAAQ,KAAA,EAAA,SAAS,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;AACzD,aAAA,EAAA,EAED,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAE,CAAkD,+CAAA,EAAA,IAAI,CAAC,SAAS,CAAE,CAAA,EAAA,EAC3E,CAAC,CAAA,YAAY,EACZ,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE;AACN,gBAAA,CAAC,CAAQ,KAAA,EAAA,SAAS,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,UAAU,CAAE,CAAA,GAAG,IAAI;aAC/D,EAAA,CACc,CACb,EAEJ,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,0BAA0B,EAChC,GAAG,EAAE,EAAE,IAAG;AACT,gBAAA,IAAI,EAAE,IAAI,IAAI,CAAC,WAAW,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,EAAE;AAClD,oBAAA,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;;aAEjD,EAEA,EAAA,CAAC,IAAI,CAAC,WAAW,IAAI,CAAO,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,CAAC,EAAE,CAAC,WAAW,CAAQ,CACnD,EAEL,IAAI,CAAC,QAAQ,KACb,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,+BAA+B,EAAA,EACzC,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,IAAI,EAAC,QAAQ,gBACF,eAAe,EAC1B,KAAK,EAAC,eAAe,EACrB,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,EAAA,EAEjC,CAAS,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAW,CAAA,CAClD,CACJ,CACN,CACI,CACa,CACpB,CACS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-tooltip/sd-tooltip.scss?tag=sd-tooltip","src/components/sd-tooltip/sd-tooltip.tsx"],"sourcesContent":["sd-tooltip {\n [slot='content'] {\n  display: none;\n }\n\n .sd-tooltip {\n  position: relative;\n  cursor: pointer;\n  display: inline-block;\n }\n}\n\n.sd-tooltip-menu {\n width: fit-content;\n padding: 8px 16px;\n border-radius: 4px;\n font-size: 12px;\n position: relative;\n box-sizing: border-box;\n display: flex;\n align-items: start;\n justify-content: center;\n gap: 12px;\n\n &--with-close {\n  padding-right: 12px !important;\n }\n\n &__arrow {\n  position: absolute;\n  display: flex;\n  width: 9.6px;\n  height: 7.2px;\n  svg {\n   width: 100%;\n   height: 100%;\n  }\n  &--top {\n   bottom: -7.2px;\n   left: 50%;\n   transform: translateX(-50%);\n  }\n  &--bottom {\n   top: -7.2px;\n   left: 50%;\n   transform: translateX(-50%) rotate(180deg);\n  }\n  &--left {\n   right: -7.2px;\n   top: 50%;\n   transform: translateY(-50%) rotate(-90deg);\n  }\n  &--right {\n   left: -7.2px;\n   top: 50%;\n   transform: translateY(-50%) rotate(90deg);\n  }\n }\n\n &__content {\n  line-height: 20px;\n  font-weight: 500;\n\n  p {\n   margin: 0;\n  }\n }\n\n &__close-button {\n  padding-top: 4px;\n  display: flex;\n  button {\n   padding: 0;\n   background: none;\n   border: none;\n   cursor: pointer;\n  }\n }\n}\n","import { Component, Element, Fragment, Prop, State, h } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\nimport { ButtonSize, ButtonVariant } from '../sd-button/sd-button';\nimport { TooltipArrow } from '../assets/tooltipArrow';\n\n@Component({\n tag: 'sd-tooltip',\n styleUrl: 'sd-tooltip.scss',\n})\nexport class SdTooltip {\n @Element() el!: HTMLElement;\n\n @Prop() trigger: 'hover' | 'click' = 'hover';\n @Prop() placement: 'top' | 'bottom' | 'left' | 'right' = 'top';\n @Prop() color: string = '#01BB4B';\n @Prop() type: 'default' | 'caution' | 'notice' | 'accent' = 'default';\n\n @Prop() icon: IconName = 'helpOutline';\n @Prop() iconSize: number = 12;\n\n @Prop() label: string = '';\n @Prop() buttonSize: ButtonSize = 'sm';\n @Prop() buttonVariant: ButtonVariant = 'primary';\n\n @Prop() noHover: boolean = true;\n\n @Prop() useClose: boolean = false;\n\n @State() showTooltip: boolean = false;\n @State() slotContent: HTMLElement | null = null;\n\n private static readonly COLOR_OF_TYPE = {\n  default: { background: 'oceanblue_85', text: 'white' },\n  caution: { background: 'red_20', text: 'red_70' },\n  notice: { background: 'orange_10', text: 'orange_65' },\n  accent: { background: 'brilliantblue_20', text: 'brilliantblue_75' },\n };\n\n private buttonEl?: HTMLStencilElement;\n\n private handleClose = () => {\n  this.showTooltip = false;\n };\n\n // 현재 tooltip popover가 조건부 렌더링이여서 초기 slot이 렌더링 되지 않은 시점에\n // 데이터 매핑에 실패 (light dom에 저장된 slot내용을 shadow dom을 찾지못해 매핑 실패)\n // 따라서 slot내용을 받은 후에 복제하여 state에 저장\n componentWillLoad() {\n  const contentEl = this.el.querySelector('[slot=\"content\"]');\n  if (contentEl) {\n   this.slotContent = contentEl.cloneNode(true) as HTMLElement;\n  }\n }\n\n render() {\n  const handleTrigger =\n   this.trigger === 'hover'\n    ? {\n       onMouseEnter: () => (this.showTooltip = true),\n       onMouseLeave: () => (this.showTooltip = false),\n      }\n    : {\n       onClick: () => (this.showTooltip = !this.showTooltip),\n      };\n\n  return (\n   <Fragment>\n    {this.label ? (\n     <sd-button\n      ref={el => (this.buttonEl = el)}\n      label={this.label}\n      icon={this.icon}\n      size={this.buttonSize}\n      color={this.color}\n      variant={this.buttonVariant}\n      class=\"sd-tooltip\"\n      {...handleTrigger}\n     ></sd-button>\n    ) : (\n     <sd-icon\n      ref={el => (this.buttonEl = el)}\n      name={this.icon}\n      size={this.iconSize}\n      color={this.color}\n      class=\"sd-tooltip\"\n      {...handleTrigger}\n     ></sd-icon>\n    )}\n\n    {this.showTooltip && (\n     <sd-tooltip-portal\n      parentRef={this.buttonEl}\n      onSdClose={() => this.handleClose()}\n      placement={this.placement}\n     >\n      <div\n       class={{\n        'sd-tooltip-menu': true,\n        [`sd-tooltip-menu--${this.type}`]: true,\n        [`sd-tooltip-menu--${this.placement}`]: true,\n        'sd-tooltip-menu--with-close': this.useClose,\n        [`bg-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,\n        [`text-${SdTooltip.COLOR_OF_TYPE[this.type].text}`]: true,\n       }}\n      >\n       <i class={`sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}`}>\n        <TooltipArrow\n         class={{\n          [`text-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,\n         }}\n        ></TooltipArrow>\n       </i>\n\n       <div\n        class=\"sd-tooltip-menu__content\"\n        ref={el => {\n         if (el && this.slotContent && !el.hasChildNodes()) {\n          el.appendChild(this.slotContent.cloneNode(true));\n         }\n        }}\n       >\n        {!this.slotContent && <span>{this.el.textContent}</span>}\n       </div>\n\n       {this.useClose && (\n        <div class=\"sd-tooltip-menu__close-button\">\n         <button\n          type=\"button\"\n          aria-label=\"Close tooltip\"\n          title=\"Close tooltip\"\n          onClick={() => this.handleClose()}\n         >\n          <sd-icon name=\"close\" size=\"12\" color=\"#AAAAAA\"></sd-icon>\n         </button>\n        </div>\n       )}\n      </div>\n     </sd-tooltip-portal>\n    )}\n   </Fragment>\n  );\n }\n}\n"],"version":3}
+{"file":"p-Dvtwm2UI.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-tooltip/sd-tooltip.scss?tag=sd-tooltip","src/components/sd-tooltip/sd-tooltip.tsx"],"sourcesContent":["sd-tooltip {\n [slot='content'] {\n  display: none;\n }\n\n .sd-tooltip {\n  position: relative;\n  cursor: pointer;\n  display: inline-block;\n }\n}\n\n.sd-tooltip-menu {\n width: fit-content;\n padding: 8px 16px;\n border-radius: 4px;\n font-size: 12px;\n position: relative;\n box-sizing: border-box;\n display: flex;\n align-items: start;\n justify-content: center;\n gap: 12px;\n\n &--with-close {\n  padding-right: 12px !important;\n }\n\n &__arrow {\n  position: absolute;\n  display: flex;\n  width: 9.6px;\n  height: 7.2px;\n  svg {\n   width: 100%;\n   height: 100%;\n  }\n  &--top {\n   bottom: -7.2px;\n   left: 50%;\n   transform: translateX(-50%);\n  }\n  &--bottom {\n   top: -7.2px;\n   left: 50%;\n   transform: translateX(-50%) rotate(180deg);\n  }\n  &--left {\n   right: -7.2px;\n   top: 50%;\n   transform: translateY(-50%) rotate(-90deg);\n  }\n  &--right {\n   left: -7.2px;\n   top: 50%;\n   transform: translateY(-50%) rotate(90deg);\n  }\n }\n\n &__content {\n  line-height: 20px;\n  font-weight: 500;\n\n  p {\n   margin: 0;\n  }\n }\n\n &__close-button {\n  padding-top: 4px;\n  display: flex;\n  button {\n   padding: 0;\n   background: none;\n   border: none;\n   cursor: pointer;\n  }\n }\n}\n","import { Component, Element, Fragment, Prop, State, h } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\nimport { ButtonSize, ButtonVariant } from '../sd-button/sd-button';\nimport { TooltipArrow } from '../assets/tooltipArrow';\n\n@Component({\n tag: 'sd-tooltip',\n styleUrl: 'sd-tooltip.scss',\n})\nexport class SdTooltip {\n @Element() el!: HTMLElement;\n\n @Prop() trigger: 'hover' | 'click' = 'hover';\n @Prop() placement: 'top' | 'bottom' | 'left' | 'right' = 'top';\n @Prop() color: string = '#01BB4B';\n @Prop() type: 'default' | 'caution' | 'notice' | 'accent' = 'default';\n\n @Prop() icon: IconName = 'helpOutline';\n @Prop() iconSize: number = 12;\n\n @Prop() label: string = '';\n @Prop() buttonSize: ButtonSize = 'sm';\n @Prop() buttonVariant: ButtonVariant = 'primary';\n\n @Prop() noHover: boolean = true;\n\n @Prop() useClose: boolean = false;\n\n @State() showTooltip: boolean = false;\n @State() slotContent: HTMLElement | null = null;\n\n private static readonly COLOR_OF_TYPE = {\n  default: { background: 'oceanblue_85', text: 'white' },\n  caution: { background: 'red_20', text: 'red_70' },\n  notice: { background: 'orange_10', text: 'orange_65' },\n  accent: { background: 'brilliantblue_20', text: 'brilliantblue_75' },\n };\n\n private buttonEl?: HTMLStencilElement;\n\n private handleClose = () => {\n  this.showTooltip = false;\n };\n\n // 현재 tooltip popover가 조건부 렌더링이여서 초기 slot이 렌더링 되지 않은 시점에\n // 데이터 매핑에 실패 (light dom에 저장된 slot내용을 shadow dom을 찾지못해 매핑 실패)\n // 따라서 slot내용을 받은 후에 복제하여 state에 저장\n componentWillLoad() {\n  const contentEl = this.el.querySelector('[slot=\"content\"]');\n  if (contentEl) {\n   this.slotContent = contentEl.cloneNode(true) as HTMLElement;\n  }\n }\n\n render() {\n  const handleTrigger =\n   this.trigger === 'hover'\n    ? {\n       onMouseEnter: () => (this.showTooltip = true),\n       onMouseLeave: () => (this.showTooltip = false),\n      }\n    : {\n       onClick: () => (this.showTooltip = !this.showTooltip),\n      };\n\n  return (\n   <Fragment>\n    {this.label ? (\n     <sd-button\n      ref={el => (this.buttonEl = el)}\n      label={this.label}\n      icon={this.icon}\n      size={this.buttonSize}\n      color={this.color}\n      variant={this.buttonVariant}\n      class=\"sd-tooltip\"\n      {...handleTrigger}\n     ></sd-button>\n    ) : (\n     <sd-icon\n      ref={el => (this.buttonEl = el)}\n      name={this.icon}\n      size={this.iconSize}\n      color={this.color}\n      class=\"sd-tooltip\"\n      {...handleTrigger}\n     ></sd-icon>\n    )}\n\n    {this.showTooltip && (\n     <sd-tooltip-portal\n      parentRef={this.buttonEl}\n      onSdClose={() => this.handleClose()}\n      placement={this.placement}\n     >\n      <div\n       class={{\n        'sd-tooltip-menu': true,\n        [`sd-tooltip-menu--${this.type}`]: true,\n        [`sd-tooltip-menu--${this.placement}`]: true,\n        'sd-tooltip-menu--with-close': this.useClose,\n        [`bg-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,\n        [`text-${SdTooltip.COLOR_OF_TYPE[this.type].text}`]: true,\n       }}\n      >\n       <i class={`sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}`}>\n        <TooltipArrow\n         class={{\n          [`text-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,\n         }}\n        ></TooltipArrow>\n       </i>\n\n       <div\n        class=\"sd-tooltip-menu__content\"\n        ref={el => {\n         if (el && this.slotContent && !el.hasChildNodes()) {\n          el.appendChild(this.slotContent.cloneNode(true));\n         }\n        }}\n       >\n        {!this.slotContent && <span>{this.el.textContent}</span>}\n       </div>\n\n       {this.useClose && (\n        <div class=\"sd-tooltip-menu__close-button\">\n         <button\n          type=\"button\"\n          aria-label=\"Close tooltip\"\n          title=\"Close tooltip\"\n          onClick={() => this.handleClose()}\n         >\n          <sd-icon name=\"close\" size=\"12\" color=\"#AAAAAA\"></sd-icon>\n         </button>\n        </div>\n       )}\n      </div>\n     </sd-tooltip-portal>\n    )}\n   </Fragment>\n  );\n }\n}\n"],"version":3}

package/dist/components/{p-BE9Qgz8_.js → p-RnzZWR4A.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CbnL1UUF.js';
-import { d as defineCustomElement$1 } from './p-CWi3wc4b.js';
+import { d as defineCustomElement$1 } from './p-X8UHtq2f.js';
 
 const sdInputCss = "sd-icon{line-height:0}sd-icon .sd-icon{line-height:0;vertical-align:middle}sd-icon .sd-icon--rotate-90{transform:rotate(90deg)}sd-icon .sd-icon--rotate-180{transform:rotate(180deg)}sd-icon .sd-icon--rotate-270{transform:rotate(270deg)}.sd-input{display:flex;width:var(--input-width, 100%);align-items:center;height:28px;padding:4px 8px;border:1px solid #aaaaaa;border-radius:4px;color:#333333;font-size:12px;line-height:20px;background:white}.sd-input--hovered,.sd-input--focused{border-color:#0075ff;box-shadow:0 0 4px 0 rgba(0, 113, 255, 0.4)}.sd-input.sd-input--error{border-color:#fb4444}.sd-input.sd-input--pass{border-color:#2bce6c}.sd-input.sd-input--barcode:not(.sd-input--disabled){background-color:#fafaa1}.sd-input.sd-input--disabled{background-color:#eeeeee !important;border-color:#cccccc !important;cursor:not-allowed !important;box-shadow:none !important}.sd-input.sd-input--disabled .sd-input__native_element{color:#888888 !important}.sd-input .sd-input__native_element{display:block;width:100%;height:20px;line-height:20px;border:none;outline:none;background:transparent;font-size:inherit;color:#333333;margin-left:4px;margin-right:4px;padding-block:0;padding-inline:0}.sd-input .sd-input__native_element::placeholder{font-size:12px;height:20px;line-height:20px;color:#aaaaaa}.sd-input .sd-input__clear-icon{cursor:pointer;margin-left:8px}";
 
@@ -162,6 +162,6 @@ function defineCustomElement() {
 }
 
 export { SdInput as S, defineCustomElement as d };
-//# sourceMappingURL=p-BE9Qgz8_.js.map
+//# sourceMappingURL=p-RnzZWR4A.js.map
 
-//# sourceMappingURL=p-BE9Qgz8_.js.map
+//# sourceMappingURL=p-RnzZWR4A.js.map

package/dist/components/{p-BE9Qgz8_.js.map → p-RnzZWR4A.js.map}

@@ -1 +1 @@
-{"file":"p-BE9Qgz8_.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-input/sd-input.scss?tag=sd-input","src/components/sd-input/sd-input.tsx"],"sourcesContent":["@import 'variables';\n@import '../sd-icon/sd-icon.scss';\n\n.sd-input {\n display: flex;\n width: var(--input-width, 100%);\n align-items: center;\n height: 28px;\n padding: 4px 8px;\n border: 1px solid $grey_55;\n border-radius: 4px;\n color: $grey_90;\n font-size: 12px;\n line-height: 20px;\n background: white;\n\n &--hovered,\n &--focused {\n  border-color: $brilliantblue_75;\n  box-shadow: 0 0 4px 0 #0071ff66;\n }\n\n &.sd-input--error {\n  border-color: $red_70;\n }\n\n &.sd-input--pass {\n  border-color: $green_65;\n }\n\n &.sd-input--barcode:not(.sd-input--disabled) {\n  background-color: $olive_15;\n }\n\n &.sd-input--disabled {\n  background-color: $grey_20 !important;\n  border-color: $grey_45 !important;\n  cursor: not-allowed !important;\n  box-shadow: none !important;\n  .sd-input__native_element {\n   color: $grey_65 !important;\n  }\n }\n\n .sd-input__native_element {\n  display: block;\n  width: 100%;\n  height: 20px;\n  line-height: 20px;\n  border: none;\n  outline: none;\n  background: transparent;\n  font-size: inherit;\n  color: $grey_90;\n  margin-left: 4px;\n  margin-right: 4px;\n  padding-block: 0;\n  padding-inline: 0;\n\n  &::placeholder {\n   font-size: 12px;\n   height: 20px;\n   line-height: 20px;\n   color: $grey_55;\n  }\n }\n\n .sd-input__clear-icon {\n  cursor: pointer;\n  margin-left: 8px;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n State,\n Watch,\n Event,\n EventEmitter,\n h,\n Method,\n} from '@stencil/core';\n\n@Component({\n tag: 'sd-input',\n styleUrl: 'sd-input.scss',\n})\nexport class SdInput {\n @Element() el!: HTMLElement;\n\n @Prop({ mutable: true }) value?: string | number | null = null;\n @Prop() label?: string;\n @Prop() placeholder: string = '입력해 주세요.';\n @Prop() disabled: boolean = false;\n @Prop() clearable: boolean = false;\n @Prop() width?: number | string;\n @Prop() barcode?: boolean = false;\n @Prop() rules?: Array<(value: string | number | null) => boolean | string>;\n @Prop() autoFocus: boolean = false;\n @Prop() status?: 'default' | 'pass' | 'error';\n @Prop() inputClass: string = '';\n @Prop() readonly: boolean = false;\n\n //  props - custom styles\n @Prop() inputStyle: { [key: string]: string } = {};\n\n @State() private internalValue: string | number | null = null;\n @State() private error: boolean = false;\n @State() private focused: boolean = false;\n @State() private hovered: boolean = false;\n\n private nativeEl: HTMLInputElement | undefined = undefined;\n\n @Event() sdClick?: EventEmitter<string | number | null>;\n @Event() sdInput?: EventEmitter<string | number | null>;\n @Event() sdChange?: EventEmitter<string | number | null>;\n @Event() sdFocus?: EventEmitter<Event>;\n @Event() sdBlur?: EventEmitter<Event>;\n\n @Watch('value')\n valueChanged(newValue: string | number | null) {\n  this.internalValue = newValue;\n }\n\n @Watch('internalValue')\n internalValueChanged(newValue: string | number | null) {\n  if (newValue !== this.value) {\n   this.value = newValue;\n   this.sdInput?.emit(this.value);\n  }\n\n  if (!this.rules || this.rules.length === 0) return;\n  this.error = false;\n  for (const rule of this.rules) {\n   const result = rule(newValue);\n   if (result !== true) {\n    this.error = true;\n    break;\n   }\n  }\n }\n\n @Method()\n async getNativeElement(): Promise<HTMLInputElement | null> {\n  return this.nativeEl || null;\n }\n\n componentWillLoad() {\n  if (this.value) {\n   this.internalValue = this.value;\n  }\n }\n\n private handleInput = (event: Event) => {\n  const target = event.target as HTMLInputElement;\n  this.internalValue = target.value;\n  this.sdInput?.emit(this.internalValue);\n };\n\n private handleChange = (event: Event) => {\n  const target = event.target as HTMLInputElement;\n  this.internalValue = target.value;\n  this.sdChange?.emit(this.internalValue);\n };\n\n private handleFocus = (type: 'focus' | 'blur', event: Event) => {\n  this.focused = type === 'focus';\n\n  if (type === 'blur') this.sdBlur?.emit(event);\n  else this.sdFocus?.emit(event);\n };\n\n getInputStatus() {\n  // input 상태 우선순위: hovered > focused > status(상태 주입) > error(rules 검사)\n  if (this.disabled) return 'sd-input--disabled';\n  if (this.hovered) return 'sd-input--hovered';\n  if (this.focused) return 'sd-input--focused';\n  if (this.status) return `sd-input--${this.status}`;\n  if (this.error) return 'sd-input--error';\n  return '';\n }\n\n render() {\n  const inputWidth = this.width\n   ? {\n      '--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,\n     }\n   : {};\n\n  return (\n   <Host style={inputWidth}>\n    {this.label && <div class=\"sd-input__label\">{this.label}</div>}\n    <label\n     class={{\n      'sd-input': true,\n      [this.getInputStatus()]: true,\n      'sd-input--barcode': !!this.barcode,\n     }}\n     onMouseEnter={() => (this.hovered = true)}\n     onMouseLeave={() => (this.hovered = false)}\n     style={this.inputStyle}\n    >\n     <slot name=\"prefix\"></slot>\n     <input\n      ref={el => (this.nativeEl = el)}\n      class={`sd-input__native_element ${this.inputClass}`}\n      type=\"text\"\n      value={this.internalValue || ''}\n      placeholder={this.placeholder}\n      disabled={this.disabled}\n      readonly={this.readonly}\n      autofocus={this.autoFocus}\n      onInput={this.handleInput}\n      onChange={this.handleChange}\n      onFocus={event => this.handleFocus('focus', event)}\n      onBlur={event => this.handleFocus('blur', event)}\n     />\n     <slot name=\"suffix\"></slot>\n     {this.clearable && this.internalValue && (\n      <sd-icon\n       name=\"close\"\n       color=\"#888\"\n       class=\"sd-input__clear-icon\"\n       onClick={() => {\n        this.internalValue = '';\n        this.sdChange?.emit(this.internalValue);\n        this.sdInput?.emit(this.internalValue);\n       }}\n      />\n     )}\n    </label>\n   </Host>\n  );\n }\n}\n"],"version":3}
+{"file":"p-RnzZWR4A.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-input/sd-input.scss?tag=sd-input","src/components/sd-input/sd-input.tsx"],"sourcesContent":["@import 'variables';\n@import '../sd-icon/sd-icon.scss';\n\n.sd-input {\n display: flex;\n width: var(--input-width, 100%);\n align-items: center;\n height: 28px;\n padding: 4px 8px;\n border: 1px solid $grey_55;\n border-radius: 4px;\n color: $grey_90;\n font-size: 12px;\n line-height: 20px;\n background: white;\n\n &--hovered,\n &--focused {\n  border-color: $brilliantblue_75;\n  box-shadow: 0 0 4px 0 #0071ff66;\n }\n\n &.sd-input--error {\n  border-color: $red_70;\n }\n\n &.sd-input--pass {\n  border-color: $green_65;\n }\n\n &.sd-input--barcode:not(.sd-input--disabled) {\n  background-color: $olive_15;\n }\n\n &.sd-input--disabled {\n  background-color: $grey_20 !important;\n  border-color: $grey_45 !important;\n  cursor: not-allowed !important;\n  box-shadow: none !important;\n  .sd-input__native_element {\n   color: $grey_65 !important;\n  }\n }\n\n .sd-input__native_element {\n  display: block;\n  width: 100%;\n  height: 20px;\n  line-height: 20px;\n  border: none;\n  outline: none;\n  background: transparent;\n  font-size: inherit;\n  color: $grey_90;\n  margin-left: 4px;\n  margin-right: 4px;\n  padding-block: 0;\n  padding-inline: 0;\n\n  &::placeholder {\n   font-size: 12px;\n   height: 20px;\n   line-height: 20px;\n   color: $grey_55;\n  }\n }\n\n .sd-input__clear-icon {\n  cursor: pointer;\n  margin-left: 8px;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n State,\n Watch,\n Event,\n EventEmitter,\n h,\n Method,\n} from '@stencil/core';\n\n@Component({\n tag: 'sd-input',\n styleUrl: 'sd-input.scss',\n})\nexport class SdInput {\n @Element() el!: HTMLElement;\n\n @Prop({ mutable: true }) value?: string | number | null = null;\n @Prop() label?: string;\n @Prop() placeholder: string = '입력해 주세요.';\n @Prop() disabled: boolean = false;\n @Prop() clearable: boolean = false;\n @Prop() width?: number | string;\n @Prop() barcode?: boolean = false;\n @Prop() rules?: Array<(value: string | number | null) => boolean | string>;\n @Prop() autoFocus: boolean = false;\n @Prop() status?: 'default' | 'pass' | 'error';\n @Prop() inputClass: string = '';\n @Prop() readonly: boolean = false;\n\n //  props - custom styles\n @Prop() inputStyle: { [key: string]: string } = {};\n\n @State() private internalValue: string | number | null = null;\n @State() private error: boolean = false;\n @State() private focused: boolean = false;\n @State() private hovered: boolean = false;\n\n private nativeEl: HTMLInputElement | undefined = undefined;\n\n @Event() sdClick?: EventEmitter<string | number | null>;\n @Event() sdInput?: EventEmitter<string | number | null>;\n @Event() sdChange?: EventEmitter<string | number | null>;\n @Event() sdFocus?: EventEmitter<Event>;\n @Event() sdBlur?: EventEmitter<Event>;\n\n @Watch('value')\n valueChanged(newValue: string | number | null) {\n  this.internalValue = newValue;\n }\n\n @Watch('internalValue')\n internalValueChanged(newValue: string | number | null) {\n  if (newValue !== this.value) {\n   this.value = newValue;\n   this.sdInput?.emit(this.value);\n  }\n\n  if (!this.rules || this.rules.length === 0) return;\n  this.error = false;\n  for (const rule of this.rules) {\n   const result = rule(newValue);\n   if (result !== true) {\n    this.error = true;\n    break;\n   }\n  }\n }\n\n @Method()\n async getNativeElement(): Promise<HTMLInputElement | null> {\n  return this.nativeEl || null;\n }\n\n componentWillLoad() {\n  if (this.value) {\n   this.internalValue = this.value;\n  }\n }\n\n private handleInput = (event: Event) => {\n  const target = event.target as HTMLInputElement;\n  this.internalValue = target.value;\n  this.sdInput?.emit(this.internalValue);\n };\n\n private handleChange = (event: Event) => {\n  const target = event.target as HTMLInputElement;\n  this.internalValue = target.value;\n  this.sdChange?.emit(this.internalValue);\n };\n\n private handleFocus = (type: 'focus' | 'blur', event: Event) => {\n  this.focused = type === 'focus';\n\n  if (type === 'blur') this.sdBlur?.emit(event);\n  else this.sdFocus?.emit(event);\n };\n\n getInputStatus() {\n  // input 상태 우선순위: hovered > focused > status(상태 주입) > error(rules 검사)\n  if (this.disabled) return 'sd-input--disabled';\n  if (this.hovered) return 'sd-input--hovered';\n  if (this.focused) return 'sd-input--focused';\n  if (this.status) return `sd-input--${this.status}`;\n  if (this.error) return 'sd-input--error';\n  return '';\n }\n\n render() {\n  const inputWidth = this.width\n   ? {\n      '--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,\n     }\n   : {};\n\n  return (\n   <Host style={inputWidth}>\n    {this.label && <div class=\"sd-input__label\">{this.label}</div>}\n    <label\n     class={{\n      'sd-input': true,\n      [this.getInputStatus()]: true,\n      'sd-input--barcode': !!this.barcode,\n     }}\n     onMouseEnter={() => (this.hovered = true)}\n     onMouseLeave={() => (this.hovered = false)}\n     style={this.inputStyle}\n    >\n     <slot name=\"prefix\"></slot>\n     <input\n      ref={el => (this.nativeEl = el)}\n      class={`sd-input__native_element ${this.inputClass}`}\n      type=\"text\"\n      value={this.internalValue || ''}\n      placeholder={this.placeholder}\n      disabled={this.disabled}\n      readonly={this.readonly}\n      autofocus={this.autoFocus}\n      onInput={this.handleInput}\n      onChange={this.handleChange}\n      onFocus={event => this.handleFocus('focus', event)}\n      onBlur={event => this.handleFocus('blur', event)}\n     />\n     <slot name=\"suffix\"></slot>\n     {this.clearable && this.internalValue && (\n      <sd-icon\n       name=\"close\"\n       color=\"#888\"\n       class=\"sd-input__clear-icon\"\n       onClick={() => {\n        this.internalValue = '';\n        this.sdChange?.emit(this.internalValue);\n        this.sdInput?.emit(this.internalValue);\n       }}\n      />\n     )}\n    </label>\n   </Host>\n  );\n }\n}\n"],"version":3}

package/dist/components/{p-CTKP1VO1.js → p-T0Fd7Ziu.js}

@@ -1,10 +1,10 @@
 import { p as proxyCustomElement, d as createEvent, h, c as Host } from './p-CbnL1UUF.js';
 import { B as BaseDropdownEvent, S as SelectKeyboardNavigation } from './p-BvuTaRpn.js';
-import { d as defineCustomElement$5 } from './p-BClhb3Gm.js';
-import { d as defineCustomElement$4 } from './p-CWi3wc4b.js';
-import { d as defineCustomElement$3 } from './p-BE9Qgz8_.js';
+import { d as defineCustomElement$5 } from './p-zEI1HiVv.js';
+import { d as defineCustomElement$4 } from './p-X8UHtq2f.js';
+import { d as defineCustomElement$3 } from './p-RnzZWR4A.js';
 import { d as defineCustomElement$2 } from './p-DXyjyA0e.js';
-import { d as defineCustomElement$1 } from './p-8g6E1lU1.js';
+import { d as defineCustomElement$1 } from './p-BNY55XpQ.js';
 
 const sdSelectCss = ".sd-select__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select__dropdown::-webkit-scrollbar-track{background-color:transparent}.sd-select{display:flex;width:var(--select-width, 200px);height:28px;position:relative;color:#333333;cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white}.sd-select:hover:not(.sd-select--disabled){background:#f6f6f6}.sd-select.sd-select--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}.sd-select.sd-select--disabled .sd-select__label{border-right:1px solid #cccccc}.sd-select.sd-select--disabled .sd-select__trigger{color:#888888}.sd-select.sd-select--disabled .sd-select__trigger:focus,.sd-select.sd-select--disabled .sd-select__trigger:focus-visible,.sd-select.sd-select--disabled .sd-select__trigger:focus-within{outline:none !important}.sd-select__label{font-size:12px;line-height:20px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6;display:inline-block;white-space:nowrap}.sd-select__container{position:relative;width:100%;display:flex}.sd-select__container .sd-select__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}.sd-select__container .sd-select__trigger .sd-select__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400;text-align:left}.sd-select__container .sd-select__trigger .sd-select__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}.sd-select__container .sd-select__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}.sd-select__container .sd-select__arrow--open{transform:rotate(180deg)}.sd-select__dropdown{width:var(--select-dropdown-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333;display:flex;flex-direction:column}.sd-select__dropdown .sd-select__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select__dropdown .sd-select__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select__dropdown .sd-select__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px;text-align:left}";
 
@@ -318,6 +318,6 @@ function defineCustomElement() {
 }
 
 export { SdSelect as S, defineCustomElement as d };
-//# sourceMappingURL=p-CTKP1VO1.js.map
+//# sourceMappingURL=p-T0Fd7Ziu.js.map
 
-//# sourceMappingURL=p-CTKP1VO1.js.map
+//# sourceMappingURL=p-T0Fd7Ziu.js.map