@sellmate/design-system 0.0.0 → 0.0.1

package/dist/design-system/sd-table.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-table.entry.esm.js","sources":["src/components/sd-table/sd-table.scss?tag=sd-table","src/components/sd-table/sd-table.tsx"],"sourcesContent":["@import '../../styles/global.scss';\r\n\r\n.sd-table__container {\r\n width: 100%;\r\n border: 1px solid $grey_30;\r\n border-radius: 8px;\r\n font-size: 12px;\r\n overflow: hidden;\r\n\r\n .sd-table__middle {\r\n  overflow: auto;\r\n  will-change: scroll-position;\r\n  height: 100%;\r\n  @extend %scrollBar;\r\n\r\n  .sd-table {\r\n   width: 100%;\r\n   border-collapse: collapse;\r\n   border-spacing: 0;\r\n   table-layout: fixed;\r\n\r\n   &--selectable {\r\n    td.sd-td--selected,\r\n    th.sd-th--selected {\r\n     width: 52px !important;\r\n     max-width: 52px !important;\r\n     min-width: 52px !important;\r\n     padding: 0 10px 0 24px;\r\n     text-align: left;\r\n    }\r\n   }\r\n\r\n   &--sticky-header {\r\n    thead {\r\n     position: sticky;\r\n     top: 0;\r\n     z-index: 2;\r\n    }\r\n   }\r\n\r\n   &--no-data {\r\n    thead {\r\n     opacity: 0.4;\r\n     tr {\r\n      th {\r\n       &.sd-th {\r\n        border-bottom: 1px solid rgba(225, 225, 225, 0.4) !important;\r\n       }\r\n      }\r\n     }\r\n    }\r\n   }\r\n\r\n   td,\r\n   th,\r\n   .sd-th__content--label {\r\n    overflow: hidden;\r\n    white-space: nowrap;\r\n    text-overflow: ellipsis;\r\n    word-break: keep-all;\r\n   }\r\n\r\n   thead {\r\n    height: 36px;\r\n\r\n    tr {\r\n     width: 100%;\r\n\r\n     th {\r\n      background: $th-bg;\r\n      height: 36px;\r\n      padding: 0 16px;\r\n      font-weight: 500;\r\n      vertical-align: middle;\r\n      border-bottom: 1px solid $grey_30;\r\n      -webkit-user-select: none;\r\n      user-select: none;\r\n      position: relative;\r\n\r\n      &.sd-th {\r\n       .sd-th__content {\r\n        display: flex;\r\n        flex-flow: row nowrap;\r\n        align-items: center;\r\n        gap: 4px;\r\n\r\n\r\n        &--left {\r\n         justify-content: flex-start;\r\n        }\r\n        &--center {\r\n         justify-content: center;\r\n        }\r\n        &--right {\r\n         justify-content: flex-end;\r\n        }\r\n       }\r\n\r\n       .sd-th__resizer {\r\n        position: absolute;\r\n        top: 50%;\r\n        right: 0;\r\n        transform: translateY(-50%);\r\n        width: 4px;\r\n        height: 16px;\r\n        cursor: col-resize;\r\n        z-index: 3;\r\n        border-left: 1px solid $grey_45;\r\n        border-right: 1px solid $grey_45;\r\n       }\r\n      }\r\n     }\r\n    }\r\n   }\r\n\r\n   tbody {\r\n    tr {\r\n     &:last-of-type {\r\n      td {\r\n       border-bottom: none;\r\n      }\r\n     }\r\n     td {\r\n      height: 44px;\r\n      padding: 0 16px;\r\n      border-bottom: 1px solid $grey_30;\r\n      background: white;\r\n      vertical-align: middle;\r\n\r\n      &.sd-td {\r\n       &--left {\r\n        text-align: left;\r\n       }\r\n       &--center {\r\n        text-align: center;\r\n       }\r\n       &--right {\r\n        text-align: right;\r\n       }\r\n      }\r\n     }\r\n    }\r\n   }\r\n  }\r\n }\r\n\r\n .sd-table__bottom {\r\n  background: white;\r\n  text-align: center;\r\n }\r\n}\r\n\r\n.sd-table__pagination {\r\n background: $grey_05;\r\n height: 48px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border: 1px solid $grey_30;\r\n border-top: none;\r\n border-radius: 8px;\r\n}\r\n","import { Component, Element, Prop, State, Event, Watch, h, EventEmitter } from '@stencil/core';\r\n\r\nexport type SdTableSortDir = 'asc' | 'desc' | 'none';\r\n\r\nexport interface SdTableColumn {\r\n name: string;\r\n label: string;\r\n field: string | ((row: any) => any);\r\n align?: 'left' | 'center' | 'right';\r\n width?: string;\r\n format?: (value: any, row: any) => string;\r\n visible?: boolean;\r\n usePageMoveIcon?: boolean;\r\n tooltip?: string[];\r\n tooltipOptions?: { [key: string]: any };\r\n}\r\n\r\nexport interface Row {\r\n [key: string]: any;\r\n}\r\n\r\n@Component({\r\n tag: 'sd-table',\r\n styleUrl: 'sd-table.scss',\r\n})\r\nexport class SdTable {\r\n @Element() el!: HTMLElement;\r\n\r\n @Prop() columns: SdTableColumn[] = [];\r\n @Prop({ mutable: true }) rows: Row[] = [];\r\n @Prop({ mutable: true }) selected: Set<Row> = new Set();\r\n @Prop() rowKey: string = 'id';\r\n @Prop() selectable: boolean = false;\r\n @Prop() resizable: boolean = false;\r\n @Prop() stickyHeader: boolean = false;\r\n @Prop() noDataLabel: string = '데이터가 없습니다.';\r\n @Prop() pagination?: {\r\n  page: number;\r\n  rowsPerPage: number;\r\n  lastPage?: number;\r\n };\r\n @Prop() bodyCellRenderer?: (\r\n  column: SdTableColumn,\r\n  row: Row,\r\n ) => HTMLElement | string | null | undefined;\r\n\r\n @Event() sdSelectChange!: EventEmitter<Row[]>;\r\n @Event() sdPageChange!: EventEmitter<number>;\r\n\r\n @State() currentPage: number = this.pagination?.page || 1;\r\n @State() innerRows: { [key: string]: any }[] = this.rows;\r\n @State() innerSelected: Set<{ [key: string]: any }> = new Set(this.selected);\r\n @State() columnWidths: number[] = [];\r\n\r\n @Watch('columns')\r\n watchColumns(newCols: SdTableColumn[]) {\r\n  this.columnWidths = newCols.map(c => parseInt(c.width || '120', 10));\r\n }\r\n\r\n @Watch('selected')\r\n watchSelected(newSelected: Set<Row>) {\r\n  this.innerSelected = new Set(newSelected);\r\n }\r\n\r\n @Watch('pagination')\r\n watchPagination(newVal: { page: number; rowsPerPage: number; lastPage?: number } | undefined) {\r\n  if (newVal?.page && newVal.page !== this.currentPage) this.currentPage = newVal.page;\r\n }\r\n\r\n componentWillLoad() {\r\n  this.innerRows = [...this.rows];\r\n  this.innerSelected = new Set(this.selected);\r\n  this.columnWidths = this.columns.map(c => parseInt(c.width || '120', 10));\r\n }\r\n\r\n private get paginatedRows(): { [key: string]: any }[] {\r\n  if (!this.pagination) return this.innerRows;\r\n\r\n  const { rowsPerPage = this.rows.length } = this.pagination || {};\r\n\r\n  const result = this.innerRows.slice(\r\n   (this.currentPage - 1) * rowsPerPage,\r\n   this.currentPage * rowsPerPage,\r\n  );\r\n\r\n  return result;\r\n }\r\n\r\n private get lastPageNumber(): number {\r\n  const { lastPage, rowsPerPage = this.rows.length } = this.pagination || {};\r\n\r\n  return lastPage ?? Math.max(1, Math.ceil(this.rows.length / rowsPerPage));\r\n }\r\n\r\n private get sdTableClasses() {\r\n  return [\r\n   'sd-table',\r\n   this.stickyHeader && 'sd-table--sticky-header',\r\n   this.selectable && 'sd-table--selectable',\r\n   this.resizable && 'sd-table--resizable',\r\n   !this.innerRows.length && 'sd-table--no-data',\r\n  ]\r\n   .filter(Boolean)\r\n   .join(' ');\r\n }\r\n\r\n private get visibleColumns(): SdTableColumn[] {\r\n  return this.columns.filter(col => col.visible !== false);\r\n }\r\n\r\n private updateRowSelect(row: Row) {\r\n  const selectedArray = Array.from(this.innerSelected);\r\n  const exists = this.isRowSelected(row);\r\n  const newSelected = exists\r\n   ? selectedArray.filter(r => r[this.rowKey] !== row[this.rowKey])\r\n   : [...selectedArray, row];\r\n\r\n  // 동일 상태면 set하지 않음 → 불필요 렌더 방지\r\n  if (newSelected.length === selectedArray.length) return;\r\n\r\n  this.innerSelected = new Set(newSelected);\r\n  this.sdSelectChange.emit(Array.from(this.innerSelected));\r\n }\r\n\r\n private get isAllChecked(): boolean | null {\r\n  const total = this.paginatedRows.length;\r\n  const selectedCount = this.paginatedRows.filter(row =>\r\n   Array.from(this.innerSelected).some(\r\n    selectedRow => selectedRow[this.rowKey] === row[this.rowKey],\r\n   ),\r\n  ).length;\r\n\r\n  if (selectedCount === 0) return false; // 아무것도 안 선택됨\r\n  if (selectedCount === total) return true; // 전부 선택됨\r\n  return null; // 일부만 선택됨\r\n }\r\n\r\n private get selectedKeyMap(): Map<any, boolean> {\r\n  return new Map(Array.from(this.innerSelected).map(r => [r[this.rowKey], true]));\r\n }\r\n\r\n private isRowSelected(row: Row): boolean {\r\n  return this.selectedKeyMap.has(row[this.rowKey]);\r\n }\r\n\r\n private toggleSelectAll(checked: boolean | any[]) {\r\n  if (checked) {\r\n   const pageRows = new Set([...this.paginatedRows]);\r\n   this.innerSelected = new Set([...this.innerSelected, ...pageRows]);\r\n  } else {\r\n   const currentPageKeys = this.paginatedRows.map(r => r[this.rowKey]);\r\n   this.innerSelected = new Set(\r\n    [...this.innerSelected].filter(r => !currentPageKeys.includes(r[this.rowKey])),\r\n   );\r\n  }\r\n\r\n  this.sdSelectChange.emit(Array.from(this.innerSelected));\r\n }\r\n\r\n private handleResize(index: number, event: MouseEvent) {\r\n  const startX = event.clientX;\r\n  const startWidth = this.columnWidths[index];\r\n\r\n  const handleMouseMove = (moveEvent: MouseEvent) => {\r\n   const newWidth = Math.max(startWidth + moveEvent.clientX - startX, 50);\r\n\r\n   this.columnWidths = this.columnWidths.map((width, idx) => (idx === index ? newWidth : width));\r\n  };\r\n\r\n  const handleMouseUp = () => {\r\n   document.removeEventListener('mousemove', handleMouseMove);\r\n   document.removeEventListener('mouseup', handleMouseUp);\r\n  };\r\n\r\n  document.addEventListener('mousemove', handleMouseMove);\r\n  document.addEventListener('mouseup', handleMouseUp);\r\n }\r\n\r\n private renderHeader() {\r\n  return (\r\n   <thead>\r\n    <tr>\r\n     {this.selectable && (\r\n      <th\r\n       class=\"sd-th sd-th--selected\"\r\n       style={{\r\n        width: '52px',\r\n        minWidth: '52px',\r\n        maxWidth: '52px',\r\n       }}\r\n      >\r\n       <sd-checkbox\r\n        checked={this.isAllChecked}\r\n        disabled={!this.paginatedRows.length}\r\n        onSdChange={(e: CustomEvent<boolean | any[]>) => this.toggleSelectAll(e.detail)}\r\n       ></sd-checkbox>\r\n      </th>\r\n     )}\r\n     {this.visibleColumns.map((col, colIdx) => (\r\n      <th\r\n       class=\"sd-th\"\r\n       key={col.name}\r\n       style={{\r\n        minWidth: `${this.columnWidths[colIdx] as number}px`,\r\n        maxWidth: `${this.columnWidths[colIdx] as number}px`,\r\n        width: `${this.columnWidths[colIdx] as number}px`,\r\n       }}\r\n      >\r\n       <div class={`sd-th__content sd-th__content--${col.align || 'left'}`}>\r\n        <div class=\"sd-th__content--label\">{col.label}</div>\r\n\r\n        {col.usePageMoveIcon && <sd-icon name=\"pageMove\" size=\"12\" color=\"#006AC1\" />}\r\n\r\n        {col.tooltip && (\r\n         <sd-tooltip {...col.tooltipOptions}>\r\n          {col.tooltip.map(text => (\r\n           <div>{text}</div>\r\n          ))}\r\n         </sd-tooltip>\r\n         // TODO: sd-tooltip 추가 예정\r\n         //  <div></div>\r\n        )}\r\n       </div>\r\n\r\n       {this.resizable && (\r\n        <div\r\n         class=\"sd-th__resizer\"\r\n         onMouseDown={(evt: MouseEvent) => this.handleResize(colIdx, evt)}\r\n        ></div>\r\n       )}\r\n      </th>\r\n     ))}\r\n    </tr>\r\n   </thead>\r\n  );\r\n }\r\n\r\n private getRowData = (column: SdTableColumn, row: Row) => {\r\n  const { field, format, name } = column;\r\n\r\n  // 기본 필드 선택\r\n  const value = field ? (typeof field === 'string' ? row[field] : field(row)) : row[name];\r\n\r\n  // 포맷 적용\r\n  return format ? format(value, row) : value;\r\n };\r\n\r\n private renderBody() {\r\n  if (!this.paginatedRows.length)\r\n   return (\r\n    <tbody part=\"tbody-empty\">\r\n     <tr>\r\n      <td colSpan={this.visibleColumns.length + (this.selectable ? 1 : 0)}>{this.noDataLabel}</td>\r\n     </tr>\r\n    </tbody>\r\n   );\r\n\r\n  return (\r\n   <tbody>\r\n    {this.paginatedRows.map(row => (\r\n     <tr key={row[this.rowKey]} class=\"hover:bg-Grey_Lighten-6\">\r\n      {this.selectable && (\r\n       <td class=\"sd-td sd-td--selected\">\r\n        <sd-checkbox\r\n         checked={this.isRowSelected(row)}\r\n         disabled={!this.paginatedRows.length}\r\n         onSdChange={() => this.updateRowSelect(row)}\r\n        ></sd-checkbox>\r\n       </td>\r\n      )}\r\n      {this.visibleColumns.map(column => {\r\n       const rendered = this.bodyCellRenderer?.(column, row);\r\n\r\n       return (\r\n        <td\r\n         key={column.name}\r\n         part={`td-${column.name}`}\r\n         class={`sd-td sd-td--${column.align || 'left'}`}\r\n        >\r\n         {rendered ? (\r\n          typeof rendered === 'string' ? (\r\n           <span innerHTML={rendered}></span>\r\n          ) : (\r\n           rendered\r\n          )\r\n         ) : (\r\n          this.getRowData(column, row)\r\n         )}\r\n        </td>\r\n       );\r\n      })}\r\n     </tr>\r\n    ))}\r\n   </tbody>\r\n  );\r\n }\r\n\r\n render() {\r\n  return (\r\n   <>\r\n    <div class={`sd-table__container`}>\r\n     <div class=\"sd-table__middle\">\r\n      <table part=\"table\" class={this.sdTableClasses}>\r\n       {this.renderHeader()}\r\n\r\n       {this.renderBody()}\r\n      </table>\r\n     </div>\r\n\r\n     <div class=\"sd-table__bottom\"></div>\r\n    </div>\r\n    {this.pagination && this.innerRows.length > 0 && (\r\n     <div class=\"sd-table__pagination\">\r\n      <sd-pagination\r\n       currentPage={this.currentPage}\r\n       lastPage={this.lastPageNumber}\r\n       onPageChange={(e: CustomEvent<number>) => {\r\n        this.currentPage = e.detail;\r\n        this.sdPageChange.emit(this.currentPage);\r\n       }}\r\n      ></sd-pagination>\r\n     </div>\r\n    )}\r\n   </>\r\n  );\r\n }\r\n}\r\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"sd-table.entry.esm.js","sources":["src/components/sd-table/sd-table.scss?tag=sd-table","src/components/sd-table/sd-table.tsx"],"sourcesContent":["@import '../../styles/global.scss';\r\n\r\n.sd-table__container {\r\n width: 100%;\r\n border: 1px solid $grey_30;\r\n border-radius: 8px;\r\n font-size: 12px;\r\n overflow: hidden;\r\n\r\n .sd-table__middle {\r\n  overflow: auto;\r\n  will-change: scroll-position;\r\n  height: var(--table-height, auto);\r\n  @extend %scrollBar;\r\n\r\n  .sd-table {\r\n   width: 100%;\r\n   border-collapse: separate;\r\n   border-spacing: 0;\r\n   table-layout: fixed;\r\n\r\n   &--selectable {\r\n    td.sd-td--selected,\r\n    th.sd-th--selected {\r\n     width: 52px !important;\r\n     max-width: 52px !important;\r\n     min-width: 52px !important;\r\n     padding: 0 10px 0 24px;\r\n     text-align: left;\r\n    }\r\n   }\r\n\r\n   &--sticky-header {\r\n    thead {\r\n     position: sticky;\r\n     top: 0;\r\n     z-index: 2;\r\n    }\r\n   }\r\n\r\n   &--sticky-column {\r\n    th.sticky-left,\r\n    th.sticky-right {\r\n     position: sticky;\r\n     background-color: $th-bg;\r\n     z-index: 200 !important;\r\n    }\r\n    td.sticky-left,\r\n    td.sticky-right {\r\n     position: sticky;\r\n     background-color: white;\r\n     z-index: 100 !important;\r\n    }\r\n\r\n    .sticky-left {\r\n     left: var(--sticky-left-offset, 0);\r\n    }\r\n    .sticky-right {\r\n     right: var(--sticky-right-offset, 0);\r\n    }\r\n\r\n    th.sticky-cell {\r\n     position: sticky;\r\n     z-index: 102;\r\n     background-color: $th-bg;\r\n    }\r\n    td.sticky-cell {\r\n     position: sticky;\r\n     z-index: 101;\r\n     background-color: white;\r\n    }\r\n   }\r\n\r\n   &--scrolled-left {\r\n    th.sticky-left-edge,\r\n    td.sticky-left-edge {\r\n     overflow: visible;\r\n     &:after {\r\n      content: '';\r\n      position: absolute;\r\n      top: 0;\r\n      left: 100%;\r\n      right: -20px;\r\n      width: 20px;\r\n      height: 100%;\r\n      z-index: 101 !important;\r\n      box-shadow: inset 12px 0 20px -25px;\r\n      opacity: 1;\r\n      pointer-events: none;\r\n     }\r\n    }\r\n   }\r\n\r\n   &--scrolled-right {\r\n    th.sticky-right-edge,\r\n    td.sticky-right-edge {\r\n     overflow: visible;\r\n\r\n     &:after {\r\n      content: '';\r\n      position: absolute;\r\n      top: 0;\r\n      left: -20px;\r\n      width: 20px;\r\n      height: 100%;\r\n      z-index: 101 !important;\r\n      box-shadow: inset -12px 0 20px -25px;\r\n      opacity: 1;\r\n      pointer-events: none;\r\n     }\r\n    }\r\n   }\r\n\r\n   &--no-data {\r\n    thead {\r\n     opacity: 0.4;\r\n     tr {\r\n      th {\r\n       &.sd-th {\r\n        border-bottom: 1px solid rgba(225, 225, 225, 0.4) !important;\r\n       }\r\n      }\r\n     }\r\n    }\r\n   }\r\n\r\n   td,\r\n   th,\r\n   .sd-th__content--label {\r\n    overflow: hidden;\r\n    white-space: nowrap;\r\n    text-overflow: ellipsis;\r\n    word-break: keep-all;\r\n   }\r\n\r\n   thead {\r\n    height: 36px;\r\n\r\n    tr {\r\n     width: 100%;\r\n\r\n     th {\r\n      background: $th-bg;\r\n      height: 36px;\r\n      padding: 0 16px;\r\n      font-weight: 500;\r\n      vertical-align: middle;\r\n      border-bottom: 1px solid $grey_30;\r\n      -webkit-user-select: none;\r\n      user-select: none;\r\n      position: relative;\r\n\r\n      &.sd-th {\r\n       .sd-th__content {\r\n        display: flex;\r\n        flex-flow: row nowrap;\r\n        align-items: center;\r\n        gap: 4px;\r\n\r\n        &--left {\r\n         justify-content: flex-start;\r\n        }\r\n        &--center {\r\n         justify-content: center;\r\n        }\r\n        &--right {\r\n         justify-content: flex-end;\r\n        }\r\n       }\r\n\r\n       .sd-th__resizer {\r\n        position: absolute;\r\n        top: 50%;\r\n        right: 0;\r\n        transform: translateY(-50%);\r\n        width: 4px;\r\n        height: 16px;\r\n        cursor: col-resize;\r\n        z-index: 3;\r\n        border-left: 1px solid $grey_45;\r\n        border-right: 1px solid $grey_45;\r\n       }\r\n      }\r\n     }\r\n    }\r\n   }\r\n\r\n   tbody {\r\n    tr {\r\n     &:last-of-type {\r\n      td {\r\n       border-bottom: none;\r\n      }\r\n     }\r\n     td {\r\n      height: 44px;\r\n      padding: 0 16px;\r\n      border-bottom: 1px solid $grey_30;\r\n      background: white;\r\n      vertical-align: middle;\r\n\r\n      &.sd-td {\r\n       &--left {\r\n        text-align: left;\r\n       }\r\n       &--center {\r\n        text-align: center;\r\n       }\r\n       &--right {\r\n        text-align: right;\r\n       }\r\n      }\r\n     }\r\n    }\r\n   }\r\n  }\r\n }\r\n\r\n .sd-table__bottom {\r\n  background: white;\r\n  text-align: center;\r\n }\r\n}\r\n\r\n.sd-table__pagination {\r\n background: $grey_05;\r\n height: 48px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border: 1px solid $grey_30;\r\n border-top: none;\r\n border-radius: 8px;\r\n}\r\n","import {\r\n Component,\r\n Element,\r\n Prop,\r\n State,\r\n Event,\r\n Watch,\r\n h,\r\n EventEmitter,\r\n Host,\r\n} from '@stencil/core';\r\n\r\nexport type SdTableSortDir = 'asc' | 'desc' | 'none';\r\n\r\nexport interface SdTableColumn {\r\n name: string;\r\n label: string;\r\n field: string | ((row: any) => any);\r\n align?: 'left' | 'center' | 'right';\r\n width?: string;\r\n format?: (value: any, row: any) => string;\r\n visible?: boolean;\r\n usePageMoveIcon?: boolean;\r\n tooltip?: string[];\r\n tooltipOptions?: Record<string, any>;\r\n}\r\n\r\nexport interface Row {\r\n [key: string]: any;\r\n}\r\n\r\n@Component({\r\n tag: 'sd-table',\r\n styleUrl: 'sd-table.scss',\r\n})\r\nexport class SdTable {\r\n @Element() el!: HTMLElement;\r\n\r\n @Prop() columns: SdTableColumn[] = [];\r\n @Prop({ mutable: true }) rows: Row[] = [];\r\n @Prop({ mutable: true }) selected: Set<Row> = new Set();\r\n @Prop() rowKey: string = 'id';\r\n @Prop() selectable: boolean = false;\r\n @Prop() resizable: boolean = false;\r\n @Prop() height?: number;\r\n @Prop() stickyHeader: boolean = false;\r\n @Prop() stickyColumn: { left?: number; right?: number } = { left: 0, right: 0 };\r\n @Prop() noDataLabel: string = '데이터가 없습니다.';\r\n @Prop() pagination?: {\r\n  page: number;\r\n  rowsPerPage: number;\r\n  lastPage?: number;\r\n };\r\n @Prop() bodyCellRenderer?: (\r\n  column: SdTableColumn,\r\n  row: Row,\r\n ) => HTMLElement | string | null | undefined;\r\n\r\n @Event() sdSelectChange!: EventEmitter<Row[]>;\r\n @Event() sdPageChange!: EventEmitter<number>;\r\n\r\n @State() currentPage: number = this.pagination?.page || 1;\r\n @State() innerRows: Row[] = [];\r\n @State() innerSelected: Set<Row> = new Set();\r\n @State() columnWidths: number[] = [];\r\n @State() scrolledLeft: boolean = false;\r\n @State() scrolledRight: boolean = false;\r\n\r\n @Watch('columns')\r\n handleColumnsChange(newCols: SdTableColumn[]) {\r\n  this.columnWidths = newCols.map(c => parseInt(c.width || '120', 10));\r\n }\r\n\r\n @Watch('rows')\r\n handleRowsChange(newRows: Row[]) {\r\n  this.innerRows = [...newRows];\r\n }\r\n\r\n @Watch('selected')\r\n handleSelectedChange(newSelected: Set<Row>) {\r\n  this.innerSelected = new Set(newSelected);\r\n }\r\n\r\n @Watch('pagination')\r\n handlePaginationChange(\r\n  newVal?: { page: number; rowsPerPage: number; lastPage?: number } | undefined,\r\n ) {\r\n  if (newVal?.page && newVal.page !== this.currentPage) this.currentPage = newVal.page;\r\n }\r\n\r\n componentWillLoad() {\r\n  this.innerRows = [...this.rows];\r\n  this.innerSelected = new Set(this.selected);\r\n  this.columnWidths = this.columns.map(c => parseInt(c.width || '120', 10));\r\n }\r\n\r\n componentDidLoad() {\r\n  const middle = this.el.querySelector('.sd-table__middle');\r\n  if (!middle) return;\r\n\r\n  const onScroll = () => {\r\n   const { scrollLeft, scrollWidth, clientWidth } = middle as HTMLElement;\r\n   this.scrolledLeft = scrollLeft > 0;\r\n   this.scrolledRight = scrollLeft + clientWidth < scrollWidth;\r\n  };\r\n  middle.addEventListener('scroll', onScroll, { passive: true });\r\n  onScroll();\r\n }\r\n\r\n // ----- Derived getters -----\r\n private get visibleColumns(): SdTableColumn[] {\r\n  return this.columns.filter(col => col.visible !== false);\r\n }\r\n\r\n private get paginatedRows(): Row[] {\r\n  if (!this.pagination) return this.innerRows;\r\n\r\n  const { rowsPerPage = this.rows.length } = this.pagination || {};\r\n\r\n  const result = this.innerRows.slice(\r\n   (this.currentPage - 1) * rowsPerPage,\r\n   this.currentPage * rowsPerPage,\r\n  );\r\n\r\n  return result;\r\n }\r\n\r\n private get lastPageNumber(): number {\r\n  const { lastPage, rowsPerPage = this.rows.length } = this.pagination || {};\r\n\r\n  return lastPage ?? Math.max(1, Math.ceil(this.rows.length / rowsPerPage));\r\n }\r\n\r\n private get sdTableClasses() {\r\n  return [\r\n   'sd-table',\r\n   this.stickyHeader && 'sd-table--sticky-header',\r\n   this.selectable && 'sd-table--selectable',\r\n   this.resizable && 'sd-table--resizable',\r\n   !this.innerRows.length && 'sd-table--no-data',\r\n   ((this.stickyColumn?.left ?? 0) > 0 || (this.stickyColumn?.right ?? 0) > 0) &&\r\n    'sd-table--sticky-column',\r\n   this.scrolledLeft && 'sd-table--scrolled-left',\r\n   this.scrolledRight && 'sd-table--scrolled-right',\r\n  ]\r\n   .filter(Boolean)\r\n   .join(' ');\r\n }\r\n\r\n // ----- Selection -----\r\n private isRowSelected(row: Row): boolean {\r\n  return Array.from(this.innerSelected).some(r => r[this.rowKey] === row[this.rowKey]);\r\n }\r\n\r\n private updateRowSelect(row: Row) {\r\n  const selectedArray = Array.from(this.innerSelected);\r\n  const exists = this.isRowSelected(row);\r\n  const newSelected = exists\r\n   ? selectedArray.filter(r => r[this.rowKey] !== row[this.rowKey])\r\n   : [...selectedArray, row];\r\n\r\n  // 동일 상태면 set하지 않음 → 불필요 렌더 방지\r\n  if (newSelected.length === selectedArray.length) return;\r\n\r\n  this.innerSelected = new Set(newSelected);\r\n  this.sdSelectChange.emit(Array.from(this.innerSelected));\r\n }\r\n\r\n private toggleSelectAll(checked: boolean | any[]) {\r\n  if (checked) {\r\n   const pageRows = new Set([...this.paginatedRows]);\r\n   this.innerSelected = new Set([...this.innerSelected, ...pageRows]);\r\n  } else {\r\n   const currentPageKeys = this.paginatedRows.map(r => r[this.rowKey]);\r\n   this.innerSelected = new Set(\r\n    [...this.innerSelected].filter(r => !currentPageKeys.includes(r[this.rowKey])),\r\n   );\r\n  }\r\n\r\n  this.sdSelectChange.emit(Array.from(this.innerSelected));\r\n }\r\n\r\n private get isAllChecked(): boolean | null {\r\n  const total = this.paginatedRows.length;\r\n  const selectedCount = this.paginatedRows.filter(row =>\r\n   Array.from(this.innerSelected).some(\r\n    selectedRow => selectedRow[this.rowKey] === row[this.rowKey],\r\n   ),\r\n  ).length;\r\n\r\n  if (selectedCount === 0) return false; // 아무것도 안 선택됨\r\n  if (selectedCount === total) return true; // 전부 선택됨\r\n  return null; // 일부만 선택됨\r\n }\r\n\r\n // ----- Helpers -----\r\n private getStickyStyle(colIdx: number) {\r\n  const leftOffset =\r\n   this.columnWidths.slice(0, colIdx).reduce((a, b) => a + b, 0) + (this.selectable ? 52 : 0);\r\n  const rightOffset = this.columnWidths\r\n   .filter((_, i) => i >= this.visibleColumns.length - (this.stickyColumn.right || 0) && i > colIdx)\r\n   .reduce((a, b) => a + b, 0);\r\n  return {\r\n   '--sticky-left-offset': `${leftOffset}px`,\r\n   '--sticky-right-offset': `${rightOffset}px`,\r\n   'width': `${this.columnWidths[colIdx]}px`,\r\n   'minWidth': `${this.columnWidths[colIdx]}px`,\r\n   'maxWidth': `${this.columnWidths[colIdx]}px`,\r\n  };\r\n }\r\n\r\n private handleResize(index: number, event: MouseEvent) {\r\n  const startX = event.clientX;\r\n  const startWidth = this.columnWidths[index];\r\n\r\n  const handleMouseMove = (moveEvent: MouseEvent) => {\r\n   const newWidth = Math.max(startWidth + moveEvent.clientX - startX, 50);\r\n\r\n   this.columnWidths = this.columnWidths.map((width, idx) => (idx === index ? newWidth : width));\r\n  };\r\n\r\n  const handleMouseUp = () => {\r\n   document.removeEventListener('mousemove', handleMouseMove);\r\n   document.removeEventListener('mouseup', handleMouseUp);\r\n  };\r\n\r\n  document.addEventListener('mousemove', handleMouseMove);\r\n  document.addEventListener('mouseup', handleMouseUp);\r\n }\r\n\r\n private getCellValue(column: SdTableColumn, row: Row) {\r\n  const { field, format, name } = column;\r\n  const value = typeof field === 'function' ? field(row) : field ? row[field] : row[name];\r\n  return format ? format(value, row) : value;\r\n }\r\n\r\n // ----- Render -----\r\n private renderHeader() {\r\n  return (\r\n   <thead>\r\n    <tr>\r\n     {this.selectable && (\r\n      <th\r\n       class=\"sd-th sd-th--selected\"\r\n       style={{\r\n        width: '52px',\r\n        minWidth: '52px',\r\n        maxWidth: '52px',\r\n       }}\r\n      >\r\n       <sd-checkbox\r\n        checked={this.isAllChecked}\r\n        disabled={!this.paginatedRows.length}\r\n        onSdChange={(e: CustomEvent<boolean | any[]>) => this.toggleSelectAll(e.detail)}\r\n       ></sd-checkbox>\r\n      </th>\r\n     )}\r\n     {this.visibleColumns.map((col, colIdx) => (\r\n      <th\r\n       key={col.name}\r\n       class={{\r\n        'sd-th': true,\r\n        'sticky-left': Boolean(this.stickyColumn.left && colIdx < this.stickyColumn.left),\r\n        'sticky-right': Boolean(\r\n         this.stickyColumn.right && colIdx >= this.visibleColumns.length - this.stickyColumn.right!,\r\n        ),\r\n        'sticky-left-edge': Boolean(\r\n         this.stickyColumn.left && colIdx === this.stickyColumn.left - 1,\r\n        ),\r\n        'sticky-right-edge': Boolean(\r\n         this.stickyColumn.right &&\r\n          colIdx === this.visibleColumns.length - this.stickyColumn.right!,\r\n        ),\r\n       }}\r\n       style={this.getStickyStyle(colIdx)}\r\n      >\r\n       <div class={`sd-th__content sd-th__content--${col.align || 'left'}`}>\r\n        <div class=\"sd-th__content--label\">{col.label}</div>\r\n\r\n        {col.usePageMoveIcon && <sd-icon name=\"pageMove\" size=\"12\" color=\"#006AC1\" />}\r\n\r\n        {col.tooltip && (\r\n         <sd-tooltip {...col.tooltipOptions}>\r\n          {col.tooltip.map(text => (\r\n           <div>{text}</div>\r\n          ))}\r\n         </sd-tooltip>\r\n        )}\r\n       </div>\r\n\r\n       {this.resizable && (\r\n        <div\r\n         class=\"sd-th__resizer\"\r\n         onMouseDown={(evt: MouseEvent) => this.handleResize(colIdx, evt)}\r\n        ></div>\r\n       )}\r\n      </th>\r\n     ))}\r\n    </tr>\r\n   </thead>\r\n  );\r\n }\r\n\r\n private renderBody() {\r\n  if (!this.paginatedRows.length)\r\n   return (\r\n    <tbody part=\"tbody-empty\">\r\n     <tr>\r\n      <td colSpan={this.visibleColumns.length + (this.selectable ? 1 : 0)}>{this.noDataLabel}</td>\r\n     </tr>\r\n    </tbody>\r\n   );\r\n\r\n  return (\r\n   <tbody>\r\n    {this.paginatedRows.map(row => (\r\n     <tr key={row[this.rowKey]} class=\"hover:bg-Grey_Lighten-6\">\r\n      {this.selectable && (\r\n       <td class=\"sd-td sd-td--selected\">\r\n        <sd-checkbox\r\n         checked={this.isRowSelected(row)}\r\n         disabled={!this.paginatedRows.length}\r\n         onSdChange={() => this.updateRowSelect(row)}\r\n        ></sd-checkbox>\r\n       </td>\r\n      )}\r\n      {this.visibleColumns.map((column, colIdx) => {\r\n       const rendered = this.bodyCellRenderer?.(column, row);\r\n\r\n       return (\r\n        <td\r\n         key={column.name}\r\n         part={`td-${column.name}`}\r\n         class={{\r\n          'sd-td': true,\r\n          [`sd-td--${column.align || 'left'}`]: true,\r\n          'sticky-left': Boolean(this.stickyColumn.left && colIdx < this.stickyColumn.left),\r\n          'sticky-right': Boolean(\r\n           this.stickyColumn.right &&\r\n            colIdx >= this.visibleColumns.length - this.stickyColumn.right!,\r\n          ),\r\n          'sticky-left-edge': Boolean(\r\n           this.stickyColumn.left && colIdx === this.stickyColumn.left - 1,\r\n          ),\r\n          'sticky-right-edge': Boolean(\r\n           this.stickyColumn.right &&\r\n            colIdx === this.visibleColumns.length - this.stickyColumn.right!,\r\n          ),\r\n         }}\r\n         style={this.getStickyStyle(colIdx)}\r\n        >\r\n         {rendered ? (\r\n          typeof rendered === 'string' ? (\r\n           <span innerHTML={rendered}></span>\r\n          ) : (\r\n           rendered\r\n          )\r\n         ) : (\r\n          this.getCellValue(column, row)\r\n         )}\r\n        </td>\r\n       );\r\n      })}\r\n     </tr>\r\n    ))}\r\n   </tbody>\r\n  );\r\n }\r\n\r\n render() {\r\n  return (\r\n   <Host>\r\n    <div class=\"sd-table__container\">\r\n     <div\r\n      class=\"sd-table__middle\"\r\n      style={{\r\n       '--table-height': this.height ? `${this.height}px` : 'auto',\r\n      }}\r\n     >\r\n      <table part=\"table\" class={this.sdTableClasses}>\r\n       {this.renderHeader()}\r\n\r\n       {this.renderBody()}\r\n      </table>\r\n     </div>\r\n\r\n     <div class=\"sd-table__bottom\"></div>\r\n    </div>\r\n    {this.pagination && this.innerRows.length > 0 && (\r\n     <div class=\"sd-table__pagination\">\r\n      <sd-pagination\r\n       currentPage={this.currentPage}\r\n       lastPage={this.lastPageNumber}\r\n       onPageChange={(e: CustomEvent<number>) => {\r\n        this.currentPage = e.detail;\r\n        this.sdPageChange.emit(this.currentPage);\r\n       }}\r\n      ></sd-pagination>\r\n     </div>\r\n    )}\r\n   </Host>\r\n  );\r\n }\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/esm/design-system.js

@@ -16,6 +16,6 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["sd-button_8",[[258,"sd-date-picker",{"date":[1],"label":[1],"selectable":[16],"disabled":[4],"isOpen":[32],"currentDate":[32],"currentYear":[32],"currentMonth":[32]}],[257,"sd-tooltip",{"trigger":[513],"placement":[513],"color":[513],"icon":[513],"iconSize":[514,"icon-size"],"label":[1],"buttonSize":[513,"button-size"],"buttonVariant":[513,"button-variant"],"noHover":[4,"no-hover"],"useClose":[4,"use-close"],"showTooltip":[32]}],[258,"sd-date-box",{"date":[8],"disabled":[4],"selected":[4],"isStartDate":[4,"is-start-date"],"isEndDate":[4,"is-end-date"],"isToday":[4,"is-today"],"inRange":[4,"in-range"],"type":[1]}],[257,"sd-button",{"variant":[1],"size":[1],"color":[1],"label":[1],"disabled":[4],"type":[1],"icon":[1],"iconRight":[1,"icon-right"],"noHover":[4,"no-hover"]}],[260,"sd-input",{"value":[1032],"label":[1],"placeholder":[1],"disabled":[4],"clearable":[4],"width":[8],"barcode":[4],"rules":[16],"autoFocus":[4,"auto-focus"],"status":[1],"inputClass":[1,"input-class"],"readonly":[4],"inputStyle":[16],"internalValue":[32],"error":[32],"focused":[32],"hovered":[32],"getNativeElement":[64]},null,{"value":["valueChanged"],"internalValue":["internalValueChanged"]}],[260,"sd-portal",{"to":[1],"parentRef":[16],"offset":[16],"zIndex":[2,"z-index"],"open":[4]},[[9,"scroll","updatePosition"],[9,"resize","updatePosition"],[9,"mousedown","handleMouseDown"],[8,"click","handleWindowClick"]]],[257,"sd-tooltip-portal",{"to":[1],"parentRef":[16],"offset":[16],"zIndex":[2,"z-index"],"placement":[1],"open":[4]},[[9,"scroll","updatePosition"],[9,"resize","updatePosition"],[9,"mousedown","handleMouseDown"],[8,"click","handleWindowClick"]]],[258,"sd-icon",{"name":[1],"size":[8],"color":[1],"rotate":[2],"label":[1]}]]],["sd-table",[[256,"sd-table",{"columns":[16],"rows":[1040],"selected":[1040],"rowKey":[1,"row-key"],"selectable":[4],"resizable":[4],"stickyHeader":[4,"sticky-header"],"noDataLabel":[1,"no-data-label"],"pagination":[16],"bodyCellRenderer":[16],"currentPage":[32],"innerRows":[32],"innerSelected":[32],"columnWidths":[32]},null,{"columns":["watchColumns"],"selected":["watchSelected"],"pagination":["watchPagination"]}]]],["sd-select",[[260,"sd-select",{"value":[1032],"label":[1],"options":[1040],"placeholder":[1],"optionPlaceholder":[1,"option-placeholder"],"width":[1],"dropdownHeight":[1,"dropdown-height"],"disabled":[4],"clearable":[4],"searchable":[4],"containerStyle":[16],"triggerStyle":[16],"dropdownStyle":[16],"optionStyle":[16],"labelStyle":[16],"optionRenderer":[16],"filteredOptions":[32],"isOpen":[32],"searchText":[32],"itemIndex":[32],"isScrolled":[32]},null,{"value":["valueChanged"],"options":["optionsChanged"],"searchText":["searchTextChanged"],"itemIndex":["itemIndexChanged"],"isOpen":["isOpenChanged"]}]]],["sd-date-range-picker",[[258,"sd-date-range-picker",{"date":[16],"label":[1],"selectable":[16],"maxRange":[2,"max-range"],"disabled":[4],"isOpen":[32],"dateRange":[32],"hoverDate":[32],"prevYear":[32],"prevMonth":[32]}]]],["sd-popover",[[257,"sd-popover",{"show":[1028],"placement":[513],"color":[513],"icon":[513],"iconSize":[514,"icon-size"],"label":[1],"buttonSize":[513,"button-size"],"buttonVariant":[513,"button-variant"],"menuTitle":[513,"title"],"messages":[16],"buttons":[16],"menuClass":[1,"menu-class"],"noHover":[4,"no-hover"],"useClose":[4,"use-close"],"showPopover":[32],"slotContent":[32]},null,{"show":["watchShowHandler"]}]]],["sd-tag",[[257,"sd-tag",{"size":[1],"color":[1],"rounded":[4],"label":[1],"bgColor":[1,"bg-color"],"textColor":[1,"text-color"]}]]],["sd-checkbox",[[257,"sd-checkbox",{"checked":[8],"val":[8],"disabled":[4],"label":[1],"checkboxStyle":[16],"isChecked":[32]},null,{"checked":["watchValueHandler"]}]]],["sd-select-option",[[257,"sd-select-option",{"option":[16],"index":[2],"isSelected":[4,"is-selected"],"isFocused":[4,"is-focused"],"optionStyle":[16],"disabled":[4],"useCheckbox":[4,"use-checkbox"],"isHovered":[32],"isDisabled":[64]}]]],["sd-pagination",[[257,"sd-pagination",{"currentPage":[2,"current-page"],"lastPage":[2,"last-page"],"simple":[4]},null,{"currentPage":["onPropChange"],"lastPage":["onPropChange"]}]]]], options);
+  return bootstrapLazy([["sd-button_8",[[258,"sd-date-picker",{"date":[1],"label":[1],"selectable":[16],"disabled":[4],"isOpen":[32],"currentDate":[32],"currentYear":[32],"currentMonth":[32]}],[257,"sd-tooltip",{"trigger":[513],"placement":[513],"color":[513],"icon":[513],"iconSize":[514,"icon-size"],"label":[1],"buttonSize":[513,"button-size"],"buttonVariant":[513,"button-variant"],"noHover":[4,"no-hover"],"useClose":[4,"use-close"],"showTooltip":[32]}],[258,"sd-date-box",{"date":[8],"disabled":[4],"selected":[4],"isStartDate":[4,"is-start-date"],"isEndDate":[4,"is-end-date"],"isToday":[4,"is-today"],"inRange":[4,"in-range"],"type":[1]}],[257,"sd-button",{"variant":[1],"size":[1],"color":[1],"label":[1],"disabled":[4],"type":[1],"icon":[1],"iconRight":[1,"icon-right"],"noHover":[4,"no-hover"]}],[260,"sd-input",{"value":[1032],"label":[1],"placeholder":[1],"disabled":[4],"clearable":[4],"width":[8],"barcode":[4],"rules":[16],"autoFocus":[4,"auto-focus"],"status":[1],"inputClass":[1,"input-class"],"readonly":[4],"inputStyle":[16],"internalValue":[32],"error":[32],"focused":[32],"hovered":[32],"getNativeElement":[64]},null,{"value":["valueChanged"],"internalValue":["internalValueChanged"]}],[260,"sd-portal",{"to":[1],"parentRef":[16],"offset":[16],"zIndex":[2,"z-index"],"open":[4]},[[9,"scroll","updatePosition"],[9,"resize","updatePosition"],[9,"mousedown","handleMouseDown"],[8,"click","handleWindowClick"]]],[257,"sd-tooltip-portal",{"to":[1],"parentRef":[16],"offset":[16],"zIndex":[2,"z-index"],"placement":[1],"open":[4]},[[9,"scroll","updatePosition"],[9,"resize","updatePosition"],[9,"mousedown","handleMouseDown"],[8,"click","handleWindowClick"]]],[258,"sd-icon",{"name":[1],"size":[8],"color":[1],"rotate":[2],"label":[1]}]]],["sd-table",[[256,"sd-table",{"columns":[16],"rows":[1040],"selected":[1040],"rowKey":[1,"row-key"],"selectable":[4],"resizable":[4],"height":[2],"stickyHeader":[4,"sticky-header"],"stickyColumn":[16],"noDataLabel":[1,"no-data-label"],"pagination":[16],"bodyCellRenderer":[16],"currentPage":[32],"innerRows":[32],"innerSelected":[32],"columnWidths":[32],"scrolledLeft":[32],"scrolledRight":[32]},null,{"columns":["handleColumnsChange"],"rows":["handleRowsChange"],"selected":["handleSelectedChange"],"pagination":["handlePaginationChange"]}]]],["sd-select",[[260,"sd-select",{"value":[1032],"label":[1],"options":[1040],"placeholder":[1],"optionPlaceholder":[1,"option-placeholder"],"width":[1],"dropdownHeight":[1,"dropdown-height"],"disabled":[4],"clearable":[4],"searchable":[4],"containerStyle":[16],"triggerStyle":[16],"dropdownStyle":[16],"optionStyle":[16],"labelStyle":[16],"optionRenderer":[16],"filteredOptions":[32],"isOpen":[32],"searchText":[32],"itemIndex":[32],"isScrolled":[32]},null,{"value":["valueChanged"],"options":["optionsChanged"],"searchText":["searchTextChanged"],"itemIndex":["itemIndexChanged"],"isOpen":["isOpenChanged"]}]]],["sd-date-range-picker",[[258,"sd-date-range-picker",{"date":[16],"label":[1],"selectable":[16],"maxRange":[2,"max-range"],"disabled":[4],"isOpen":[32],"dateRange":[32],"hoverDate":[32],"prevYear":[32],"prevMonth":[32]}]]],["sd-popover",[[257,"sd-popover",{"show":[1028],"placement":[513],"color":[513],"icon":[513],"iconSize":[514,"icon-size"],"label":[1],"buttonSize":[513,"button-size"],"buttonVariant":[513,"button-variant"],"menuTitle":[513,"title"],"messages":[16],"buttons":[16],"menuClass":[1,"menu-class"],"noHover":[4,"no-hover"],"useClose":[4,"use-close"],"showPopover":[32],"slotContent":[32]},null,{"show":["watchShowHandler"]}]]],["sd-tag",[[257,"sd-tag",{"size":[1],"color":[1],"rounded":[4],"label":[1],"bgColor":[1,"bg-color"],"textColor":[1,"text-color"]}]]],["sd-checkbox",[[257,"sd-checkbox",{"checked":[8],"val":[8],"disabled":[4],"label":[1],"checkboxStyle":[16],"isChecked":[32]},null,{"checked":["watchValueHandler"]}]]],["sd-select-option",[[257,"sd-select-option",{"option":[16],"index":[2],"isSelected":[4,"is-selected"],"isFocused":[4,"is-focused"],"optionStyle":[16],"disabled":[4],"useCheckbox":[4,"use-checkbox"],"isHovered":[32],"isDisabled":[64]}]]],["sd-pagination",[[257,"sd-pagination",{"currentPage":[2,"current-page"],"lastPage":[2,"last-page"],"simple":[4]},null,{"currentPage":["onPropChange"],"lastPage":["onPropChange"]}]]]], options);
 });
 //# sourceMappingURL=design-system.js.map

package/dist/esm/loader.js

@@ -4,7 +4,7 @@ export { s as setNonce } from './index-F7bQTYmD.js';
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy([["sd-button_8",[[258,"sd-date-picker",{"date":[1],"label":[1],"selectable":[16],"disabled":[4],"isOpen":[32],"currentDate":[32],"currentYear":[32],"currentMonth":[32]}],[257,"sd-tooltip",{"trigger":[513],"placement":[513],"color":[513],"icon":[513],"iconSize":[514,"icon-size"],"label":[1],"buttonSize":[513,"button-size"],"buttonVariant":[513,"button-variant"],"noHover":[4,"no-hover"],"useClose":[4,"use-close"],"showTooltip":[32]}],[258,"sd-date-box",{"date":[8],"disabled":[4],"selected":[4],"isStartDate":[4,"is-start-date"],"isEndDate":[4,"is-end-date"],"isToday":[4,"is-today"],"inRange":[4,"in-range"],"type":[1]}],[257,"sd-button",{"variant":[1],"size":[1],"color":[1],"label":[1],"disabled":[4],"type":[1],"icon":[1],"iconRight":[1,"icon-right"],"noHover":[4,"no-hover"]}],[260,"sd-input",{"value":[1032],"label":[1],"placeholder":[1],"disabled":[4],"clearable":[4],"width":[8],"barcode":[4],"rules":[16],"autoFocus":[4,"auto-focus"],"status":[1],"inputClass":[1,"input-class"],"readonly":[4],"inputStyle":[16],"internalValue":[32],"error":[32],"focused":[32],"hovered":[32],"getNativeElement":[64]},null,{"value":["valueChanged"],"internalValue":["internalValueChanged"]}],[260,"sd-portal",{"to":[1],"parentRef":[16],"offset":[16],"zIndex":[2,"z-index"],"open":[4]},[[9,"scroll","updatePosition"],[9,"resize","updatePosition"],[9,"mousedown","handleMouseDown"],[8,"click","handleWindowClick"]]],[257,"sd-tooltip-portal",{"to":[1],"parentRef":[16],"offset":[16],"zIndex":[2,"z-index"],"placement":[1],"open":[4]},[[9,"scroll","updatePosition"],[9,"resize","updatePosition"],[9,"mousedown","handleMouseDown"],[8,"click","handleWindowClick"]]],[258,"sd-icon",{"name":[1],"size":[8],"color":[1],"rotate":[2],"label":[1]}]]],["sd-table",[[256,"sd-table",{"columns":[16],"rows":[1040],"selected":[1040],"rowKey":[1,"row-key"],"selectable":[4],"resizable":[4],"stickyHeader":[4,"sticky-header"],"noDataLabel":[1,"no-data-label"],"pagination":[16],"bodyCellRenderer":[16],"currentPage":[32],"innerRows":[32],"innerSelected":[32],"columnWidths":[32]},null,{"columns":["watchColumns"],"selected":["watchSelected"],"pagination":["watchPagination"]}]]],["sd-select",[[260,"sd-select",{"value":[1032],"label":[1],"options":[1040],"placeholder":[1],"optionPlaceholder":[1,"option-placeholder"],"width":[1],"dropdownHeight":[1,"dropdown-height"],"disabled":[4],"clearable":[4],"searchable":[4],"containerStyle":[16],"triggerStyle":[16],"dropdownStyle":[16],"optionStyle":[16],"labelStyle":[16],"optionRenderer":[16],"filteredOptions":[32],"isOpen":[32],"searchText":[32],"itemIndex":[32],"isScrolled":[32]},null,{"value":["valueChanged"],"options":["optionsChanged"],"searchText":["searchTextChanged"],"itemIndex":["itemIndexChanged"],"isOpen":["isOpenChanged"]}]]],["sd-date-range-picker",[[258,"sd-date-range-picker",{"date":[16],"label":[1],"selectable":[16],"maxRange":[2,"max-range"],"disabled":[4],"isOpen":[32],"dateRange":[32],"hoverDate":[32],"prevYear":[32],"prevMonth":[32]}]]],["sd-popover",[[257,"sd-popover",{"show":[1028],"placement":[513],"color":[513],"icon":[513],"iconSize":[514,"icon-size"],"label":[1],"buttonSize":[513,"button-size"],"buttonVariant":[513,"button-variant"],"menuTitle":[513,"title"],"messages":[16],"buttons":[16],"menuClass":[1,"menu-class"],"noHover":[4,"no-hover"],"useClose":[4,"use-close"],"showPopover":[32],"slotContent":[32]},null,{"show":["watchShowHandler"]}]]],["sd-tag",[[257,"sd-tag",{"size":[1],"color":[1],"rounded":[4],"label":[1],"bgColor":[1,"bg-color"],"textColor":[1,"text-color"]}]]],["sd-checkbox",[[257,"sd-checkbox",{"checked":[8],"val":[8],"disabled":[4],"label":[1],"checkboxStyle":[16],"isChecked":[32]},null,{"checked":["watchValueHandler"]}]]],["sd-select-option",[[257,"sd-select-option",{"option":[16],"index":[2],"isSelected":[4,"is-selected"],"isFocused":[4,"is-focused"],"optionStyle":[16],"disabled":[4],"useCheckbox":[4,"use-checkbox"],"isHovered":[32],"isDisabled":[64]}]]],["sd-pagination",[[257,"sd-pagination",{"currentPage":[2,"current-page"],"lastPage":[2,"last-page"],"simple":[4]},null,{"currentPage":["onPropChange"],"lastPage":["onPropChange"]}]]]], options);
+  return bootstrapLazy([["sd-button_8",[[258,"sd-date-picker",{"date":[1],"label":[1],"selectable":[16],"disabled":[4],"isOpen":[32],"currentDate":[32],"currentYear":[32],"currentMonth":[32]}],[257,"sd-tooltip",{"trigger":[513],"placement":[513],"color":[513],"icon":[513],"iconSize":[514,"icon-size"],"label":[1],"buttonSize":[513,"button-size"],"buttonVariant":[513,"button-variant"],"noHover":[4,"no-hover"],"useClose":[4,"use-close"],"showTooltip":[32]}],[258,"sd-date-box",{"date":[8],"disabled":[4],"selected":[4],"isStartDate":[4,"is-start-date"],"isEndDate":[4,"is-end-date"],"isToday":[4,"is-today"],"inRange":[4,"in-range"],"type":[1]}],[257,"sd-button",{"variant":[1],"size":[1],"color":[1],"label":[1],"disabled":[4],"type":[1],"icon":[1],"iconRight":[1,"icon-right"],"noHover":[4,"no-hover"]}],[260,"sd-input",{"value":[1032],"label":[1],"placeholder":[1],"disabled":[4],"clearable":[4],"width":[8],"barcode":[4],"rules":[16],"autoFocus":[4,"auto-focus"],"status":[1],"inputClass":[1,"input-class"],"readonly":[4],"inputStyle":[16],"internalValue":[32],"error":[32],"focused":[32],"hovered":[32],"getNativeElement":[64]},null,{"value":["valueChanged"],"internalValue":["internalValueChanged"]}],[260,"sd-portal",{"to":[1],"parentRef":[16],"offset":[16],"zIndex":[2,"z-index"],"open":[4]},[[9,"scroll","updatePosition"],[9,"resize","updatePosition"],[9,"mousedown","handleMouseDown"],[8,"click","handleWindowClick"]]],[257,"sd-tooltip-portal",{"to":[1],"parentRef":[16],"offset":[16],"zIndex":[2,"z-index"],"placement":[1],"open":[4]},[[9,"scroll","updatePosition"],[9,"resize","updatePosition"],[9,"mousedown","handleMouseDown"],[8,"click","handleWindowClick"]]],[258,"sd-icon",{"name":[1],"size":[8],"color":[1],"rotate":[2],"label":[1]}]]],["sd-table",[[256,"sd-table",{"columns":[16],"rows":[1040],"selected":[1040],"rowKey":[1,"row-key"],"selectable":[4],"resizable":[4],"height":[2],"stickyHeader":[4,"sticky-header"],"stickyColumn":[16],"noDataLabel":[1,"no-data-label"],"pagination":[16],"bodyCellRenderer":[16],"currentPage":[32],"innerRows":[32],"innerSelected":[32],"columnWidths":[32],"scrolledLeft":[32],"scrolledRight":[32]},null,{"columns":["handleColumnsChange"],"rows":["handleRowsChange"],"selected":["handleSelectedChange"],"pagination":["handlePaginationChange"]}]]],["sd-select",[[260,"sd-select",{"value":[1032],"label":[1],"options":[1040],"placeholder":[1],"optionPlaceholder":[1,"option-placeholder"],"width":[1],"dropdownHeight":[1,"dropdown-height"],"disabled":[4],"clearable":[4],"searchable":[4],"containerStyle":[16],"triggerStyle":[16],"dropdownStyle":[16],"optionStyle":[16],"labelStyle":[16],"optionRenderer":[16],"filteredOptions":[32],"isOpen":[32],"searchText":[32],"itemIndex":[32],"isScrolled":[32]},null,{"value":["valueChanged"],"options":["optionsChanged"],"searchText":["searchTextChanged"],"itemIndex":["itemIndexChanged"],"isOpen":["isOpenChanged"]}]]],["sd-date-range-picker",[[258,"sd-date-range-picker",{"date":[16],"label":[1],"selectable":[16],"maxRange":[2,"max-range"],"disabled":[4],"isOpen":[32],"dateRange":[32],"hoverDate":[32],"prevYear":[32],"prevMonth":[32]}]]],["sd-popover",[[257,"sd-popover",{"show":[1028],"placement":[513],"color":[513],"icon":[513],"iconSize":[514,"icon-size"],"label":[1],"buttonSize":[513,"button-size"],"buttonVariant":[513,"button-variant"],"menuTitle":[513,"title"],"messages":[16],"buttons":[16],"menuClass":[1,"menu-class"],"noHover":[4,"no-hover"],"useClose":[4,"use-close"],"showPopover":[32],"slotContent":[32]},null,{"show":["watchShowHandler"]}]]],["sd-tag",[[257,"sd-tag",{"size":[1],"color":[1],"rounded":[4],"label":[1],"bgColor":[1,"bg-color"],"textColor":[1,"text-color"]}]]],["sd-checkbox",[[257,"sd-checkbox",{"checked":[8],"val":[8],"disabled":[4],"label":[1],"checkboxStyle":[16],"isChecked":[32]},null,{"checked":["watchValueHandler"]}]]],["sd-select-option",[[257,"sd-select-option",{"option":[16],"index":[2],"isSelected":[4,"is-selected"],"isFocused":[4,"is-focused"],"optionStyle":[16],"disabled":[4],"useCheckbox":[4,"use-checkbox"],"isHovered":[32],"isDisabled":[64]}]]],["sd-pagination",[[257,"sd-pagination",{"currentPage":[2,"current-page"],"lastPage":[2,"last-page"],"simple":[4]},null,{"currentPage":["onPropChange"],"lastPage":["onPropChange"]}]]]], options);
 };
 
 export { defineCustomElements };

package/dist/esm/sd-button_8.entry.js

@@ -183,9 +183,9 @@ const SdDatePicker = class {
         this.isOpen = false;
     };
     render() {
-        return (h(Host, { key: 'ed22c291167d6f58359965e87e675ecc389ed27d', class: "sd-date-picker" }, h("sd-input", { key: 'b6ae29a87fc173d74662d41c058d86da99ffe33f', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
+        return (h(Host, { key: 'dbd67742832c1f9678485a6fafe793b8c19395f2', class: "sd-date-picker" }, h("sd-input", { key: '26b387b4e8c33d170635fdb0125f0894a12abfa6', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
                 margin: '0 0 0 8px',
-            }, onClick: () => this.openMenu() }, h("sd-icon", { key: '59cadea9188e4ee1fecd9d4ee8349b5d0f961c31', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: '0df7999251fc02c84b2c9f05c3aa6902763edb88', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: '73a8072467283d8f661e9028cc25fbc4eaf9a9e0', class: "sd-date-picker__menu" }, h("div", { key: '10f1e2c9c630173d99546ad38852767fc3c6f1c1', class: "sd-date-picker__header" }, h("div", { key: '47637f7f0aec7e731dced3c220820994c47d30ec', class: "year-nav" }, h("button", { key: 'b495c8cff4c9bc079dda84652a9c270a172f79af', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, h("sd-icon", { key: 'c8fd0243a74eaf2c3173f474244a5689031eca21', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: '1e4b33e5989c26914239952c5382a6e17a4f5d18', class: "year-nav__current" }, this.currentYear), h("button", { key: '702317c39b7aabfe7be001551c491c01c7ab9d76', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, h("sd-icon", { key: 'a736c37a05978a0ef22f57dbcb6d259d96cbf7d8', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: 'eab84391c34fceadd69edeca1fdb9a45bc4e175b', class: "month-nav" }, h("button", { key: '13b2e9ebfce3e0f97f39dc7cf055868110ea23b0', type: "button", name: "prev-month", title: "Previous       ", onClick: () => this.handleUpdateMonth('prev') }, h("sd-icon", { key: '95759c06454ab5d9ccda3c69e436304b2315fe0e', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: '1d9652661b313c187b0bbfce80a3458328b32e62', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), h("button", { key: '9135f7e87128d047926a52afe01da1b478aa78b0', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, h("sd-icon", { key: 'e6639e131b11e75f56b8c31517b2e4ac6c7f8e94', name: "arrowRight", size: "12", color: "#CCCCCC" })))), h("div", { key: 'd245002d138a3fcf536b97b5dcaaa19a6e10ce68', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (h("div", { key: day, class: "day" }, day)))), h("div", { key: '15a57a6d69c0482c151d75d9688d2cf96986553d', class: "sd-date-picker__body" }, [
+            }, onClick: () => this.openMenu() }, h("sd-icon", { key: '3c65f96a7c80f2dbf4649d5618cdf519114e23e8', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: 'b78942513d1c64f769459278590a4b87f0775526', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: '626fa36202c8c5f2a751ac9bf6abed5e0381723f', class: "sd-date-picker__menu" }, h("div", { key: 'bd59b131f8f93d302150f36fb4c2310ef7cdfc9f', class: "sd-date-picker__header" }, h("div", { key: '3dc8d16ecf2876d0769b9adcda02d4fe836f3268', class: "year-nav" }, h("button", { key: 'c6f3df9d9544bce27b85022752cc5eaf9587ed39', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, h("sd-icon", { key: '1d8f98c51edee251cac8bba943a343f975b8a2bd', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: '61bd8e35d4c2a9df14a639dd3c819c7ed76dbeaf', class: "year-nav__current" }, this.currentYear), h("button", { key: 'd25371e346c10874320eabb4676bc0c6da7c012c', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, h("sd-icon", { key: '5f5bd27d9913d10d149519ddad9897c85112c78a', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: '6d7e4d48f57505a2222c05045eb1cb06c2300d8b', class: "month-nav" }, h("button", { key: '63f6797933af76b5878367b736f23f147d6ee156', type: "button", name: "prev-month", title: "Previous       ", onClick: () => this.handleUpdateMonth('prev') }, h("sd-icon", { key: 'feb2ec0c59c4736c513583c0b5e402ff5a543a4f', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: 'bcc888f53e0d1f820597c0dd11d79742551aaa61', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), h("button", { key: 'c5d24783ef37dc24eaba8097836597b7b65afbf8', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, h("sd-icon", { key: '674211cfa9f75d11e03a18fd3c5565f474315f0a', name: "arrowRight", size: "12", color: "#CCCCCC" })))), h("div", { key: 'c81c81032ea7272a4fb131c5e12dca6331874399', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (h("div", { key: day, class: "day" }, day)))), h("div", { key: '5a7f23318c89e9b9e644de4dd675d51fb222aa93', class: "sd-date-picker__body" }, [
             ...this.calendar.prevMonthDays,
             ...this.calendar.days,
             ...this.calendar.afterMonthDays,
@@ -440,7 +440,7 @@ const SdIcon = class {
     }
     render() {
         const IconComponent = Icons[this.name]?.[this.size];
-        return (h("i", { key: '22187dcae433b8061e080f97eb9c798a097ae10f', class: this.getIconClasses() }, h(IconComponent, { key: '0eb660cb7d46855cf4e054d33be4f2b964c3de24', color: this.color })));
+        return (h("i", { key: '30977b51dcabd6e45df3cb9e56496bc87aecb25f', class: this.getIconClasses() }, h(IconComponent, { key: 'a4f46dfd37fdcb8655a89582bd33ad1f34d0a9b7', color: this.color })));
     }
 };
 SdIcon.style = sdIconCss;
@@ -545,11 +545,11 @@ const SdInput = class {
                 '--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,
             }
             : {};
-        return (h(Host, { key: 'fa343c7e8ef9913c1afb641967988743561c612a', style: inputWidth }, this.label && h("div", { key: 'ad1220351663e6ad454c4a5294f9e2022003c120', class: "sd-input__label" }, this.label), h("label", { key: '2ce9645a317d709988aeb81eb6a7d8db479cd5dd', class: {
+        return (h(Host, { key: 'b01d939e0fb4b9d524fff9683686d8d253a8eecf', style: inputWidth }, this.label && h("div", { key: '346385bdc560de391146f0c0ddd018456a37a61e', class: "sd-input__label" }, this.label), h("label", { key: '4cdc9831e793411f5706c5a1e1d50bb8c43f8785', class: {
                 'sd-input': true,
                 [this.getInputStatus()]: true,
                 'sd-input--barcode': !!this.barcode,
-            }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, h("slot", { key: '7b9780262267abf2872fd12b2a4124d90c3b6e4a', name: "prefix" }), h("input", { key: '3e07dfd3ba2ea08bce7e981d70c2cabd4bc3f42f', ref: el => (this.nativeEl = el), class: `sd-input__native_element ${this.inputClass}`, type: "text", value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onChange: this.handleChange, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event) }), h("slot", { key: '98cad28b73f6b9b9d84656d47a14ed7468ae8824', name: "suffix" }), this.clearable && this.internalValue && (h("sd-icon", { key: '560ec33b375822cf88e29d759eb54176e0c5a593', name: "close", color: "#888", style: { marginRight: '-4px', marginLeft: '8px', cursor: 'pointer' }, onClick: () => {
+            }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, h("slot", { key: 'ecaa663e9f7187369fdb6176914d30b5f9ba58f1', name: "prefix" }), h("input", { key: 'a2ca59d9d382b3c6b0c4d60f7d1b3f010dd2309f', ref: el => (this.nativeEl = el), class: `sd-input__native_element ${this.inputClass}`, type: "text", value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onChange: this.handleChange, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event) }), h("slot", { key: '6d7088d2963f9abd9f67fa46362e4704170cab92', name: "suffix" }), this.clearable && this.internalValue && (h("sd-icon", { key: '316af2379845fdd28d64205fe004db14af57c620', name: "close", color: "#888", style: { marginRight: '-4px', marginLeft: '8px', cursor: 'pointer' }, onClick: () => {
                 this.internalValue = '';
                 this.sdChange?.emit(this.internalValue);
                 this.sdInput?.emit(this.internalValue);
@@ -659,7 +659,7 @@ const SdPortal = class {
         this.sdClose.emit();
     }
     render() {
-        return h("slot", { key: 'f8c0b220e951cbc2a92d582f13d52ed8bec37835' });
+        return h("slot", { key: 'afda2f6a1d9df008cd61bec755730911f8a78ad5' });
     }
 };
 
@@ -695,11 +695,11 @@ const SdTooltip = class {
             : {
                 onClick: () => (console.log('click tooltip'), (this.showTooltip = !this.showTooltip)),
             };
-        return (h(Fragment, { key: '6df2db541ae90063277111942f4d199af1c3a557' }, 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: '01a4fbeed7ce42c5a79c9177d4b7116c65a7669a', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, h("div", { key: 'bd2218c8e60447738305b5baa267010693cbce7f', class: {
+        return (h(Fragment, { key: '59b3dae6a52e0222d374414c9b5c048d4316dfc3' }, 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: 'a3170e8fcec8f32b757e1aee6d34aca2ad73473f', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, h("div", { key: 'da74b401f08522a893d42fa1f43c3ad841487740', class: {
                 'sd-tooltip-menu': true,
                 [`sd-tooltip-menu--${this.placement}`]: true,
                 'sd-tooltip-menu--with-close': this.useClose,
-            } }, h("i", { key: 'b7e5ff5af6145122052c4c168b42da4c63be0b04', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: '096ad89de6704d57a2219f9f763687567a8d19bd' })), h("div", { key: '913387543ddc605cf7aeb4608fcdabd11b99b279', class: "sd-tooltip-menu__content" }, h("slot", { key: '9047cb381a46cf2df1f3477f7376f329cd765451' }, this.el.textContent)), this.useClose && (h("div", { key: '3c4b51798ad7352b6d8b6220f23373c25cb59d44', class: "sd-tooltip-menu__close-button" }, h("button", { key: '76bc8dd90d795c7b3db746badd9c5b93d5ba6696', onClick: () => this.handleClose() }, h("sd-icon", { key: '25a961b9d6613334feacf5ef1c23f8060a3b01f6', name: "close", size: "12", color: "#AAAAAA" })))))))));
+            } }, h("i", { key: '4c43e4e435e0aea4a5c37a17fb513b074c165e7c', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: 'd622a668ce8060d54023c5644a00f72b2812b1d8' })), h("div", { key: '8ddc2c7eb11e45f64f8cccd86de7aaa1aa2c9e77', class: "sd-tooltip-menu__content" }, h("slot", { key: 'b309b4c4ba5dd154866ea19bffe9e9bb8d2507b1' }, this.el.textContent)), this.useClose && (h("div", { key: '11b93866fc4e154e77585b0870d850614108a46a', class: "sd-tooltip-menu__close-button" }, h("button", { key: 'a8a6550f4e6e9d776330ef78f3a5395277dc8c8b', onClick: () => this.handleClose() }, h("sd-icon", { key: 'ff32d1cb8f73c13a4d65b8cc61371399a799d582', name: "close", size: "12", color: "#AAAAAA" })))))))));
     }
 };
 SdTooltip.style = sdTooltipCss;
@@ -852,7 +852,7 @@ const SdTooltipPortal = class {
         this.sdClose.emit();
     }
     render() {
-        return h("slot", { key: '0850a19467e0fd6d1dbd710145128aa51100f27e' });
+        return h("slot", { key: '3d42ac26283280aa2c4fa7778d688882add3a102' });
     }
 };
 

package/dist/esm/sd-checkbox.entry.js

@@ -67,7 +67,7 @@ const SdCheckbox = class {
         this.sdChange.emit(newValue);
     };
     render() {
-        return (h("label", { key: 'e760e88c168373b626e88eb6928351db2d06814f', class: this.getCheckboxClasses() }, h("input", { key: '7a672f8bb2c21c0766a176e16b534900bddd4516', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onChange: this.handleChange }), h("div", { key: '1a8dfa49a5044ac7c6e94461dd6efb94d2773d6f', class: "sd-checkbox__bg", style: this.checkboxStyle }, this.isChecked ? h("sd-icon", { name: "check", size: 12, color: this.disabled ? '#888888' : 'white' }) : null), this.label && h("span", { key: '580a836825d4e3efc3261960eaa3a08f6d259145', class: "sd-checkbox__label" }, this.label)));
+        return (h("label", { key: '9c03212ed43f1b2d654b5bc51f3b3395117726d1', class: this.getCheckboxClasses() }, h("input", { key: '767ebdd2cd5cfc55a87d08238deb2097e840d15b', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onChange: this.handleChange }), h("div", { key: '7ff4281881ab6bf2435eb20c267913972c17de74', class: "sd-checkbox__bg", style: this.checkboxStyle }, this.isChecked ? h("sd-icon", { name: "check", size: 12, color: this.disabled ? '#888888' : 'white' }) : null), this.label && h("span", { key: 'f1ab9b7a6c2e1107229e485cb22eba652a50c56d', class: "sd-checkbox__label" }, this.label)));
     }
     static get watchers() { return {
         "checked": ["watchValueHandler"]

package/dist/esm/sd-date-range-picker.entry.js

@@ -155,9 +155,9 @@ const SdDateRangePicker = class {
         this.isOpen = false;
     };
     render() {
-        return (h(Host, { key: '8295d8910e5abf4ab0f3174a1aeaec53d3ead44a', class: "sd-date-range-picker" }, h("sd-input", { key: '99d99a57714b854b0734ddb0c76beaea8fda1450', ref: el => (this.inputEl = el), value: `${this.dateRange[0]} ~ ${this.dateRange[1]}`, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
+        return (h(Host, { key: '408ebfe4aa4b4efa5954c4ff17b68cdb3f1461dc', class: "sd-date-range-picker" }, h("sd-input", { key: 'd972b04328bcd480c0e894324aa72d6f53dc2d2c', ref: el => (this.inputEl = el), value: `${this.dateRange[0]} ~ ${this.dateRange[1]}`, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
                 margin: '0 0 0 8px',
-            }, onClick: () => this.openMenu() }, h("sd-icon", { key: '9d3c0a074ec21e474b10344281b76cb4992c25bf', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: '3964777d0aee33ec772d7edc1041f950d191db1f', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: 'd83bd847e939b7f30bf8df7cb6e9bb11364d7e70', class: "sd-date-range-picker__menu" }, h("div", { key: '573bdf93913131f4adcfc4b88b977c3d1a85facb', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, h("button", { key: 'f68b395aca3bb29edf1349a4816367402be6ec7a', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, h("sd-icon", { key: '3455821789ce342728019468a47ba273600afaec', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("div", { key: 'f54edaf7115e26005ef8c90c38aeb13330109811', class: "header-label" }, this.prevYear), h("button", { key: 'd125ddcef705da622695d2b651b29f1937b32d61', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, h("sd-icon", { key: '1102774699793fdc4ba5d5d98f7def967ce15f7d', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: '1bef887154291161c9f9a7f98ef5e989de606a89', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (h(Fragment, null, index === 1 && h("div", { class: "separator" }), h("div", { key: index, class: "calendar-container" }, h("div", { class: "calendar-header" }, h("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, h("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
+            }, onClick: () => this.openMenu() }, h("sd-icon", { key: 'cab8030f513f8c21a4ce98541d8a151f683dd5ac', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: '85f7c501c761fd65e78ddad2ec7ed0f4495d820b', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: '476b0c448249146fbaabd407cbecc6a1661274d1', class: "sd-date-range-picker__menu" }, h("div", { key: '253e49de7d0f59e36e52b1bd56dae17a241be915', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, h("button", { key: 'f883f76c05a2c8566fa5199e6e8baa9732c19a41', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, h("sd-icon", { key: '39a777b3ce984b96eda0bfb62773626385c05e18', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("div", { key: '87086582b252950a153db62876a508466a96c775', class: "header-label" }, this.prevYear), h("button", { key: '155482939ac63554d2d0d959c8055f9357c9bb1b', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, h("sd-icon", { key: 'a18971fa1aa195450bff9d650ef6fee5afe294b4', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: '58584b34903ca208b611f27b8639c36edee861f4', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (h(Fragment, null, index === 1 && h("div", { class: "separator" }), h("div", { key: index, class: "calendar-container" }, h("div", { class: "calendar-header" }, h("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, h("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
             ? `${this.prevYear}.${String(this.prevMonth).padStart(2, '0')}`
             : `${this.nextYear}.${String(this.nextMonth).padStart(2, '0')}`), h("div", { class: "calendar-days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (h("sd-date-box", { key: day, date: day, disabled: true, class: "day" })))), h("div", { class: "calendar-body mt-12pxr grid grid-cols-7 gap-y-8pxr" }, [...calendar.prevMonthDays, ...calendar.days, ...calendar.afterMonthDays].map((day, idx) => (h("sd-date-box", { key: `prev${day}_${idx}`, date: !day ? '' : Number(day), selected: this.dateRange.some(date => date ===
                 this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), type: this.getDateBoxType(this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), isToday: today ===

package/dist/esm/sd-pagination.entry.js

@@ -80,12 +80,12 @@ const SdPagination = class {
         }
     }
     render() {
-        return (h("div", { key: 'bfdf84cf7017a8c03818b49e37910600d054a6a4', class: this.paginationClasses }, h("div", { key: '941b419069a4e510c4eba45a5615960b7bce091b', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (h("div", { class: "pagination-info" }, h("span", { class: "current-page" }, this.currentPage), h("span", null, "/"), h("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (h("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
+        return (h("div", { key: '92c957c60ffeeeda3e63539f9c3cab2a095dbc7c', class: this.paginationClasses }, h("div", { key: '52ac01ba1fc359e4115b1e2e6e36a128d8e14872', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (h("div", { class: "pagination-info" }, h("span", { class: "current-page" }, this.currentPage), h("span", null, "/"), h("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (h("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
                 'pagination-btn': true,
                 'pagination-btn--selected': this.currentPage === n,
             }, disabled: this.currentPage === n, style: {
                 '--pagination-btn-width': `${this.buttonWidth}px`,
-            }, onClick: () => this.handlePageChange(n) }, n)))), h("div", { key: '2e6b8a0c9be36763c5ca3d040400a4e88bfc8d44', class: "append-btns" }, this.renderNextButtons())));
+            }, onClick: () => this.handlePageChange(n) }, n)))), h("div", { key: '3546d87c8903e81bcdc63b06dd32bd6d2499e4fc', class: "append-btns" }, this.renderNextButtons())));
     }
     static get watchers() { return {
         "currentPage": ["onPropChange"],

package/dist/esm/sd-popover.entry.js

@@ -37,11 +37,11 @@ const SdPopover = class {
         this.showPopover = false;
     };
     render() {
-        return (h(Fragment, { key: '7eaf12e3cf5530093c0357bd928d956442ffb16c' }, 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-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })), this.showPopover && (h("sd-tooltip-portal", { key: '2ba62338919c55d4a94276441987a166a14bff32', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, h("div", { key: '6f0da4c5d3924d37a4e8d36623fae620bdeb9ca1', class: {
+        return (h(Fragment, { key: '9aec040a3383939f677e753d9464fb59158d5222' }, 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-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })), this.showPopover && (h("sd-tooltip-portal", { key: '5f81b8619b7c89c24112c179b38d741521db5172', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, h("div", { key: '0bb3e6d03cdfbba23f6db385df69779468b3cfde', class: {
                 'sd-popover-menu': true,
                 [`sd-popover-menu--${this.placement}`]: true,
                 [this.menuClass]: !!this.menuClass,
-            } }, h("i", { key: 'b011af453bd14103d820b58d2774313d5e9855d6', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: 'eb94e11a4e760bae02cd55c7e77cc73344ae345c' })), h("div", { key: 'a088dc687074decb819d066b39a465879dfae3f9', class: "sd-popover-menu__content" }, this.menuTitle && h("div", { key: '30c845a1b50a9237f6a7f685cd65aa4211fbf82b', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (h("div", { key: 'd1c94716035cd7a1349e4249f2f4042c53091f3f', class: "sd-popover-menu__messages" }, this.messages.map(message => (h("div", null, message))))), this.buttons.length > 0 && (h("div", { key: '898eab4ec36a330b530a283e97238d89d52a23c6', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (h("sd-button", { ...button })))))), this.useClose && (h("button", { key: '08241065cbbc872c3b29dc90a4d55e37588fc0ec', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, h("sd-icon", { key: '2b011d6fb9c0b58e43fa136ff5e1c01e98848ec7', name: "close", size: "12", color: "#AAAAAA" }))))))));
+            } }, h("i", { key: 'c7d1c7cbe97c30e98f20a19714af784c2baeedbb', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: 'b6785978514bbc0c003ac31c1558887a5a12b61a' })), h("div", { key: '90b03b3e7d35df967c85e2a118241962ef38565b', class: "sd-popover-menu__content" }, this.menuTitle && h("div", { key: '3891421b76a7a497c79a5b991d6ba53260689875', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (h("div", { key: '18eeae75241b756f99bd905edf202249e4bc8127', class: "sd-popover-menu__messages" }, this.messages.map(message => (h("div", null, message))))), this.buttons.length > 0 && (h("div", { key: '3babbd30d59d9de39e57c4643d8c3d51c0e83fd5', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (h("sd-button", { ...button })))))), this.useClose && (h("button", { key: '9416d777768cec79799e32adc68fb7efece9f46d', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, h("sd-icon", { key: '87ca1c2934cf5417baccbd257f789afdfaad3785', name: "close", size: "12", color: "#AAAAAA" }))))))));
     }
     static get watchers() { return {
         "show": ["watchShowHandler"]

package/dist/esm/sd-select-option.entry.js

@@ -31,7 +31,7 @@ const SdSelectOption = class {
         }
     };
     render() {
-        return (h("div", { key: 'cd4584964378612508ce0dda478f26d7e1a4bc78', class: {
+        return (h("div", { key: '5ecd5d5c8b000e6b505be3cb198396871ac5a7d8', class: {
                 'sd-select__option': true,
                 'sd-select__option--selected': this.isSelected,
                 'sd-select__option--disabled': !!this.option.disabled,