@sellmate/design-system 0.0.53 → 0.0.54

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (118) hide show
  1. package/dist/cjs/design-system.cjs.js +1 -1
  2. package/dist/cjs/loader.cjs.js +1 -1
  3. package/dist/cjs/{sd-button_21.cjs.entry.js → sd-button_23.cjs.entry.js} +591 -80
  4. package/dist/cjs/sd-popover.cjs.entry.js +2 -2
  5. package/dist/cjs/sd-progress.cjs.entry.js +2 -2
  6. package/dist/cjs/sd-select-multiple.cjs.entry.js +266 -0
  7. package/dist/cjs/sd-tbody_3.cjs.entry.js +3 -3
  8. package/dist/cjs/sd-td.cjs.entry.js +2 -2
  9. package/dist/collection/collection-manifest.json +1 -0
  10. package/dist/collection/components/sd-number-input/sd-number-input.css +128 -0
  11. package/dist/collection/components/sd-number-input/sd-number-input.js +744 -0
  12. package/dist/collection/components/sd-number-input/sd-number-input.js.map +1 -0
  13. package/dist/collection/components/sd-pagination/sd-pagination.js +2 -2
  14. package/dist/collection/components/sd-popover/sd-popover.js +2 -2
  15. package/dist/collection/components/sd-portal/sd-portal.js +1 -1
  16. package/dist/collection/components/sd-progress/sd-progress.js +2 -2
  17. package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +1 -1
  18. package/dist/collection/components/sd-select-multiple/sd-select-multiple.js +2 -2
  19. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.css +5 -0
  20. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js +91 -42
  21. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js.map +1 -1
  22. package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js +3 -3
  23. package/dist/collection/components/sd-table/sd-tbody/sd-tbody.js +1 -1
  24. package/dist/collection/components/sd-table/sd-td/sd-td.js +2 -2
  25. package/dist/collection/components/sd-table/sd-th/sd-th.js +1 -1
  26. package/dist/collection/components/sd-table/sd-tr/sd-tr.js +1 -1
  27. package/dist/collection/components/sd-toggle/sd-toggle.js +1 -1
  28. package/dist/collection/components/sd-toggle-button/sd-toggle-button.js +1 -1
  29. package/dist/collection/components/sd-tooltip/sd-tooltip.js +4 -4
  30. package/dist/collection/components/sd-tooltip-portal/sd-tooltip-portal.js +1 -1
  31. package/dist/components/{p-CYadUxId.js → p-BBNolp5g.js} +3 -3
  32. package/dist/components/{p-CYadUxId.js.map → p-BBNolp5g.js.map} +1 -1
  33. package/dist/components/{p-71Aop19u.js → p-BH3t01Im.js} +5 -5
  34. package/dist/components/{p-71Aop19u.js.map → p-BH3t01Im.js.map} +1 -1
  35. package/dist/components/{p-Be8w5kOo.js → p-BqxmCDlz.js} +7 -7
  36. package/dist/components/{p-Be8w5kOo.js.map → p-BqxmCDlz.js.map} +1 -1
  37. package/dist/components/{p-B13lOU0D.js → p-C5T02a4h.js} +4 -4
  38. package/dist/components/{p-B13lOU0D.js.map → p-C5T02a4h.js.map} +1 -1
  39. package/dist/components/{p-Cf-LyLYk.js → p-CEDtmtIo.js} +3 -3
  40. package/dist/components/{p-Cf-LyLYk.js.map → p-CEDtmtIo.js.map} +1 -1
  41. package/dist/components/{p-DP33nj_I.js → p-Cx3euWvk.js} +3 -3
  42. package/dist/components/{p-DP33nj_I.js.map → p-Cx3euWvk.js.map} +1 -1
  43. package/dist/components/{p-ChQIkICO.js → p-DdeknsBE.js} +3 -3
  44. package/dist/components/{p-ChQIkICO.js.map → p-DdeknsBE.js.map} +1 -1
  45. package/dist/components/{p-j-ZEdgz4.js → p-GHGGjwP3.js} +3 -3
  46. package/dist/components/{p-j-ZEdgz4.js.map → p-GHGGjwP3.js.map} +1 -1
  47. package/dist/components/{p-B4wWf5r8.js → p-XAhTfI7Q.js} +4 -4
  48. package/dist/components/{p-B4wWf5r8.js.map → p-XAhTfI7Q.js.map} +1 -1
  49. package/dist/components/{p-CVtij2QI.js → p-at_j60O8.js} +3 -3
  50. package/dist/components/{p-CVtij2QI.js.map → p-at_j60O8.js.map} +1 -1
  51. package/dist/components/sd-date-picker.js +1 -1
  52. package/dist/components/sd-date-range-picker.js +1 -1
  53. package/dist/components/sd-guide.js +1 -1
  54. package/dist/components/sd-number-input.d.ts +11 -0
  55. package/dist/components/sd-number-input.js +335 -0
  56. package/dist/components/sd-number-input.js.map +1 -0
  57. package/dist/components/sd-pagination.js +1 -1
  58. package/dist/components/sd-popover.js +3 -3
  59. package/dist/components/sd-portal.js +1 -1
  60. package/dist/components/sd-progress.js +2 -2
  61. package/dist/components/sd-select-multiple-group.js +74 -45
  62. package/dist/components/sd-select-multiple-group.js.map +1 -1
  63. package/dist/components/sd-select-multiple.js +4 -4
  64. package/dist/components/sd-select-option-group.js +1 -1
  65. package/dist/components/sd-select-option.js +1 -1
  66. package/dist/components/sd-select.js +1 -1
  67. package/dist/components/sd-table-backup.js +6 -6
  68. package/dist/components/sd-table.js +9 -9
  69. package/dist/components/sd-tbody.js +1 -1
  70. package/dist/components/sd-td.js +2 -2
  71. package/dist/components/sd-th.js +1 -1
  72. package/dist/components/sd-toggle-button.js +1 -1
  73. package/dist/components/sd-toggle.js +1 -1
  74. package/dist/components/sd-tooltip-portal.js +1 -1
  75. package/dist/components/sd-tooltip.js +1 -1
  76. package/dist/components/sd-tr.js +1 -1
  77. package/dist/design-system/design-system.esm.js +1 -1
  78. package/dist/design-system/p-26266f8c.entry.js +2 -0
  79. package/dist/design-system/p-2df41cc3.entry.js +2 -0
  80. package/dist/design-system/p-2df41cc3.entry.js.map +1 -0
  81. package/dist/design-system/p-3cc7957d.entry.js +2 -0
  82. package/dist/design-system/p-a18c202d.entry.js +2 -0
  83. package/dist/design-system/{p-0cbdb34f.entry.js → p-b0668ce9.entry.js} +2 -2
  84. package/dist/design-system/{p-d02b3369.entry.js → p-f9e04bf9.entry.js} +2 -2
  85. package/dist/design-system/p-f9e04bf9.entry.js.map +1 -0
  86. package/dist/esm/design-system.js +1 -1
  87. package/dist/esm/loader.js +1 -1
  88. package/dist/esm/{sd-button_21.entry.js → sd-button_23.entry.js} +589 -80
  89. package/dist/esm/sd-popover.entry.js +2 -2
  90. package/dist/esm/sd-progress.entry.js +2 -2
  91. package/dist/esm/sd-select-multiple.entry.js +264 -0
  92. package/dist/esm/sd-select-multiple.entry.js.map +1 -0
  93. package/dist/esm/sd-tbody_3.entry.js +3 -3
  94. package/dist/esm/sd-td.entry.js +2 -2
  95. package/dist/types/components/sd-number-input/sd-number-input.d.ts +58 -0
  96. package/dist/types/components/sd-select-multiple-group/sd-select-multiple-group.d.ts +2 -0
  97. package/dist/types/components.d.ts +145 -0
  98. package/hydrate/index.js +407 -68
  99. package/hydrate/index.mjs +407 -68
  100. package/package.json +1 -1
  101. package/dist/cjs/sd-select-multiple-group.cjs.entry.js +0 -406
  102. package/dist/cjs/sd-select-option-group.cjs.entry.js +0 -69
  103. package/dist/design-system/p-1e7a06ef.entry.js +0 -2
  104. package/dist/design-system/p-761882f5.entry.js +0 -2
  105. package/dist/design-system/p-790ae9ce.entry.js +0 -2
  106. package/dist/design-system/p-790ae9ce.entry.js.map +0 -1
  107. package/dist/design-system/p-a8e8fc17.entry.js +0 -2
  108. package/dist/design-system/p-d02b3369.entry.js.map +0 -1
  109. package/dist/design-system/p-e492d625.entry.js +0 -2
  110. package/dist/design-system/p-e492d625.entry.js.map +0 -1
  111. package/dist/esm/sd-select-multiple-group.entry.js +0 -404
  112. package/dist/esm/sd-select-multiple-group.entry.js.map +0 -1
  113. package/dist/esm/sd-select-option-group.entry.js +0 -67
  114. package/dist/esm/sd-select-option-group.entry.js.map +0 -1
  115. /package/dist/design-system/{p-1e7a06ef.entry.js.map → p-26266f8c.entry.js.map} +0 -0
  116. /package/dist/design-system/{p-761882f5.entry.js.map → p-3cc7957d.entry.js.map} +0 -0
  117. /package/dist/design-system/{p-a8e8fc17.entry.js.map → p-a18c202d.entry.js.map} +0 -0
  118. /package/dist/design-system/{p-0cbdb34f.entry.js.map → p-b0668ce9.entry.js.map} +0 -0
@@ -0,0 +1 @@
1
+ {"file":"sd-number-input.js","mappings":"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","names":["SdNumberInput","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-number-input/sd-number-input.scss?tag=sd-number-input","src/components/sd-number-input/sd-number-input.tsx"],"sourcesContent":["@import 'variables';\r\n@import '../sd-icon/sd-icon.scss';\r\n\r\n.sd-number-input {\r\n box-sizing: border-box;\r\n display: flex;\r\n width: var(--input-width, 100%);\r\n align-items: center;\r\n height: 28px;\r\n padding: 4px 8px;\r\n border: 1px solid $grey_55;\r\n border-radius: 4px;\r\n color: $grey_90;\r\n font-size: 12px;\r\n line-height: 20px;\r\n background: white;\r\n position: relative;\r\n\r\n &--hovered {\r\n border-color: $brilliantblue_75;\r\n box-shadow: 0 0 4px 0 #0071ff66;\r\n }\r\n\r\n &.sd-number-input--error {\r\n border-color: $red_70;\r\n }\r\n\r\n &.sd-number-input--pass {\r\n border-color: $green_65;\r\n }\r\n\r\n &.sd-number-input--disabled {\r\n background-color: $grey_20 !important;\r\n border-color: $grey_45 !important;\r\n cursor: not-allowed !important;\r\n box-shadow: none !important;\r\n\r\n .sd-number-input__input {\r\n color: $grey_65 !important;\r\n }\r\n }\r\n\r\n .sd-number-input__input {\r\n display: block;\r\n width: 100%;\r\n height: 20px;\r\n line-height: 20px;\r\n border: none;\r\n outline: none;\r\n background: transparent;\r\n font-size: inherit;\r\n color: $grey_90;\r\n margin-left: 4px;\r\n margin-right: 4px;\r\n padding-block: 0;\r\n padding-inline: 0;\r\n text-align: right;\r\n\r\n &::placeholder {\r\n font-size: 12px;\r\n height: 20px;\r\n line-height: 20px;\r\n color: $grey_55;\r\n }\r\n }\r\n\r\n .sd-number-input__clear-icon {\r\n cursor: pointer;\r\n margin-left: 8px;\r\n }\r\n\r\n .sd-number-input__buttons {\r\n padding: 4px;\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n position: absolute;\r\n inset: 0;\r\n opacity: 0;\r\n pointer-events: none;\r\n transition: opacity 0.2s ease;\r\n }\r\n\r\n .sd-number-input__button {\r\n width: 20px;\r\n height: 20px;\r\n border: none;\r\n border-radius: 2px;\r\n background-color: $brilliantblue_10;\r\n cursor: pointer;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 0;\r\n margin: 0;\r\n transition: background-color 0.2s ease;\r\n\r\n &:hover:not(:disabled) {\r\n background-color: $brilliantblue_20;\r\n }\r\n\r\n &:disabled {\r\n background-color: $grey_20;\r\n cursor: not-allowed;\r\n }\r\n\r\n &--decrement {\r\n border-bottom-left-radius: 0;\r\n border-bottom-right-radius: 0;\r\n }\r\n\r\n &--increment {\r\n border-top-left-radius: 0;\r\n border-top-right-radius: 0;\r\n }\r\n }\r\n\r\n .sd-number-input__label {\r\n margin-bottom: 8px;\r\n font-weight: 500;\r\n color: $grey_90;\r\n }\r\n}\r\n\r\nsd-number-input:focus-within {\r\n .sd-number-input__buttons {\r\n opacity: 1;\r\n pointer-events: auto;\r\n }\r\n\r\n .sd-number-input {\r\n border-color: $brilliantblue_75;\r\n box-shadow: 0 0 4px 0 #0071ff66;\r\n }\r\n}\r\n","import {\r\n Component,\r\n Element,\r\n Host,\r\n Prop,\r\n State,\r\n Watch,\r\n Event,\r\n EventEmitter,\r\n h,\r\n Method,\r\n} from '@stencil/core'\r\n\r\n@Component({\r\n tag: 'sd-number-input',\r\n styleUrl: 'sd-number-input.scss',\r\n})\r\nexport class SdNumberInput {\r\n @Element() el!: HTMLElement;\r\n\r\n @Prop() min: number = Number.NEGATIVE_INFINITY;\r\n @Prop() max: number = Number.POSITIVE_INFINITY;\r\n @Prop() step: number = 1;\r\n @Prop() useButton: boolean = false;\r\n @Prop() useDecimal: boolean = false;\r\n\r\n @Prop({ mutable: true }) value?: string | number | null = null;\r\n @Prop() label?: string;\r\n @Prop() placeholder: string = '입력해 주세요.';\r\n @Prop() disabled: boolean = false;\r\n @Prop() width?: number | string;\r\n @Prop() rules?: Array<(value: string | number | null) => boolean | string>;\r\n @Prop() autoFocus: boolean = false;\r\n @Prop() status?: 'default' | 'pass' | 'error';\r\n @Prop() inputClass: string = '';\r\n @Prop() readonly: boolean = false;\r\n @Prop() inputStyle: { [key: string]: string } = {};\r\n\r\n @State() private internalValue: number | null = null;\r\n @State() private displayValue: string = '';\r\n @State() private hovered: boolean = false;\r\n @State() private error: boolean = false;\r\n\r\n private nativeEl: HTMLInputElement | undefined = undefined;\r\n\r\n @Event() sdIncrement?: EventEmitter<{ currentVal: number; prevVal: number }>;\r\n @Event() sdDecrement?: EventEmitter<{ currentVal: number; prevVal: number }>;\r\n @Event() sdInput?: EventEmitter<number | null>;\r\n @Event() sdChange?: EventEmitter<number | null>;\r\n @Event() sdFocus?: EventEmitter<Event>;\r\n @Event() sdBlur?: EventEmitter<Event>;\r\n\r\n private formatWithCommas(value: number | null): string {\r\n if (value === null || value === undefined) return '';\r\n\r\n const isNegative = value < 0;\r\n const absValue = Math.abs(value);\r\n\r\n const [intPart, decPart] = absValue.toString().split('.');\r\n const formatted = (+intPart).toLocaleString();\r\n\r\n const result = isNegative ? '-' + formatted : formatted;\r\n return decPart ? result + '.' + decPart : String(result);\r\n }\r\n\r\n private parseInput(input: string): number | null {\r\n if (!input || input.trim() === '') return null;\r\n\r\n const cleaned = input.replace(/,/g, '').trim();\r\n\r\n // -로 시작을 할 수 있을 수 있고, 소수점 0.n | .n\r\n if (!/^-?(\\d+\\.?\\d*|\\d*\\.\\d+)$/.test(cleaned)) {\r\n return null;\r\n }\r\n\r\n const parsed = parseFloat(cleaned);\r\n\r\n if (isNaN(parsed)) return null;\r\n\r\n // 소수점 사용 하지 않는데 . 이 있는 경우\r\n if (!this.useDecimal && cleaned.includes('.')) {\r\n return null;\r\n }\r\n\r\n return parsed;\r\n }\r\n\r\n private clampMinMax(value: number): number {\r\n return Math.min(Math.max(value, this.min), this.max);\r\n }\r\n\r\n private updateDisplay() {\r\n this.displayValue = this.formatWithCommas(this.internalValue);\r\n }\r\n\r\n private isIncrementDisabled(): boolean {\r\n if (this.disabled || this.readonly) return true;\r\n if (this.internalValue !== null) {\r\n return this.internalValue >= this.max;\r\n }\r\n return false;\r\n }\r\n\r\n private isDecrementDisabled(): boolean {\r\n if (this.disabled || this.readonly) return true;\r\n if (this.internalValue !== null) {\r\n return this.internalValue <= this.min;\r\n }\r\n return false;\r\n }\r\n\r\n @Watch('value')\r\n valueChanged(newValue: string | number | null) {\r\n if (newValue === null || newValue === '') {\r\n this.internalValue = null;\r\n } else {\r\n const parsed = typeof newValue === 'string' ? this.parseInput(newValue) : newValue;\r\n if (parsed !== null) {\r\n this.internalValue = this.clampMinMax(parsed);\r\n }\r\n }\r\n this.updateDisplay();\r\n }\r\n\r\n @Watch('internalValue')\r\n internalValueChanged(newValue: number | null) {\r\n this.updateDisplay();\r\n\r\n if (newValue !== this.value) {\r\n this.value = newValue;\r\n this.sdInput?.emit(newValue);\r\n }\r\n\r\n if (!this.rules || this.rules.length === 0) return;\r\n this.error = false;\r\n for (const rule of this.rules) {\r\n const result = rule(newValue);\r\n if (result !== true) {\r\n this.error = true;\r\n break;\r\n }\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n if (this.value !== null && this.value !== undefined) {\r\n const parsed = typeof this.value === 'string' ? this.parseInput(this.value) : this.value;\r\n if (parsed !== null) {\r\n this.internalValue = this.clampMinMax(parsed);\r\n }\r\n }\r\n this.updateDisplay();\r\n }\r\n\r\n private handleInput = (event: Event) => {\r\n const target = event.target as HTMLInputElement;\r\n const inputValue = target.value;\r\n\r\n if (inputValue === '') {\r\n this.internalValue = null;\r\n this.displayValue = '';\r\n return;\r\n }\r\n\r\n const commasRemoved = inputValue.replace(/,/g, '');\r\n\r\n // 만약에 소수점 (.) 이 여러개 일 경우\r\n const decimalCount = (commasRemoved.match(/\\./g) || []).length;\r\n if (decimalCount > 1) {\r\n target.value = this.displayValue;\r\n return;\r\n }\r\n\r\n // 가능: \"-\", \".\", \"-.\" (단순 기호만 있는 경우)\r\n if (commasRemoved === '-' || commasRemoved === '.' || commasRemoved === '-.') {\r\n target.value = commasRemoved;\r\n return;\r\n }\r\n\r\n // 숫자 뒤에 . 이 있는 경우 (예: \"1000.\") -> 콤마 포맷 적용 + . 유지\r\n if (commasRemoved.endsWith('.') && decimalCount === 1) {\r\n const numberPart = commasRemoved.slice(0, -1);\r\n const parsed = this.parseInput(numberPart);\r\n if (parsed !== null) {\r\n const formatted = this.formatWithCommas(parsed);\r\n target.value = formatted + '.';\r\n return;\r\n }\r\n }\r\n\r\n const parsed = this.parseInput(commasRemoved);\r\n\r\n if (parsed !== null) {\r\n if (parsed < this.min) {\r\n target.value = this.displayValue;\r\n return;\r\n }\r\n\r\n if (parsed > this.max) {\r\n target.value = this.displayValue;\r\n return;\r\n }\r\n\r\n this.internalValue = parsed;\r\n\r\n this.displayValue = this.formatWithCommas(parsed);\r\n target.value = this.displayValue;\r\n } else {\r\n target.value = this.displayValue;\r\n }\r\n };\r\n\r\n private handleChange = (event: Event) => {\r\n const target = event.target as HTMLInputElement;\r\n const inputValue = target.value;\r\n\r\n if (inputValue === '') {\r\n this.internalValue = null;\r\n } else {\r\n const parsed = this.parseInput(inputValue);\r\n if (parsed !== null) {\r\n this.internalValue = this.clampMinMax(parsed);\r\n }\r\n }\r\n\r\n this.sdChange?.emit(this.internalValue);\r\n };\r\n\r\n private handleFocus = (event: Event) => {\r\n this.sdFocus?.emit(event);\r\n };\r\n\r\n private handleBlur = (event: Event) => {\r\n this.updateDisplay();\r\n if (this.nativeEl) {\r\n this.nativeEl.value = this.displayValue;\r\n }\r\n this.sdBlur?.emit(event);\r\n };\r\n\r\n private handleKeyDown = (event: KeyboardEvent) => {\r\n if (event.key === 'ArrowUp') {\r\n event.preventDefault();\r\n this.handleIncrement();\r\n } else if (event.key === 'ArrowDown') {\r\n event.preventDefault();\r\n this.handleDecrement();\r\n }\r\n };\r\n\r\n private handleIncrement = () => {\r\n if (this.isIncrementDisabled()) return;\r\n\r\n const currentVal = this.internalValue ?? (this.min ?? 0);\r\n let nextVal = currentVal + this.step;\r\n\r\n if (nextVal > this.max) {\r\n nextVal = this.max;\r\n }\r\n\r\n if (nextVal === currentVal) return;\r\n\r\n this.sdIncrement?.emit({ currentVal: nextVal, prevVal: currentVal });\r\n\r\n this.internalValue = nextVal;\r\n this.sdChange?.emit(nextVal);\r\n };\r\n\r\n private handleDecrement = () => {\r\n if (this.isDecrementDisabled()) return;\r\n\r\n const currentVal = this.internalValue ?? (this.min ?? 0);\r\n let nextVal = currentVal - this.step;\r\n\r\n if (nextVal < this.min) {\r\n nextVal = this.min;\r\n }\r\n\r\n if (nextVal === currentVal) return;\r\n\r\n this.sdDecrement?.emit({ currentVal: nextVal, prevVal: currentVal });\r\n\r\n this.internalValue = nextVal;\r\n this.sdChange?.emit(nextVal);\r\n };\r\n\r\n @Method()\r\n async getNativeElement(): Promise<HTMLInputElement | null> {\r\n return this.nativeEl || null;\r\n }\r\n\r\n getInputStatus() {\r\n if (this.disabled) return 'sd-number-input--disabled';\r\n if (this.hovered) return 'sd-number-input--hovered';\r\n if (this.status) return `sd-number-input--${this.status}`;\r\n if (this.error) return 'sd-number-input--error';\r\n return '';\r\n }\r\n\r\n render() {\r\n const inputWidth = this.width\r\n ? {\r\n '--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,\r\n }\r\n : {};\r\n\r\n const inputStyles = {\r\n textAlign: this.useButton ? 'center' : 'right',\r\n };\r\n\r\n return (\r\n <Host style={inputWidth} onFocus={this.handleFocus} onBlur={this.handleBlur}>\r\n {this.useButton ? 'use buttons' : 'dont use buttons'}\r\n {this.label && <div class=\"sd-number-input__label\">{this.label}</div>}\r\n <label\r\n class={{\r\n 'sd-number-input': true,\r\n [this.getInputStatus()]: true,\r\n 'sd-number-input--with-buttons': this.useButton,\r\n }}\r\n onMouseEnter={() => (this.hovered = true)}\r\n onMouseLeave={() => (this.hovered = false)}\r\n style={this.inputStyle}\r\n >\r\n <input\r\n ref={el => (this.nativeEl = el)}\r\n class={`sd-number-input__input ${this.inputClass}`}\r\n type=\"text\"\r\n inputMode=\"numeric\"\r\n value={this.displayValue}\r\n placeholder={this.placeholder}\r\n disabled={this.disabled}\r\n readonly={this.readonly}\r\n autofocus={this.autoFocus}\r\n onInput={this.handleInput}\r\n onChange={this.handleChange}\r\n onKeyDown={this.handleKeyDown}\r\n style={inputStyles}\r\n />\r\n\r\n {this.useButton && (\r\n <div class=\"sd-number-input__buttons\">\r\n <button\r\n type=\"button\"\r\n class={{\r\n 'sd-number-input__button': true,\r\n 'sd-number-input__button--decrement': true,\r\n }}\r\n disabled={this.isDecrementDisabled()}\r\n onClick={this.handleDecrement}\r\n tabindex={-1}\r\n >\r\n <sd-icon name=\"minus\" size={12} color={this.isDecrementDisabled() ? '#CCCCCC' : '#2D8DFF'} />\r\n </button>\r\n <button\r\n type=\"button\"\r\n class={{\r\n 'sd-number-input__button': true,\r\n 'sd-number-input__button--increment': true,\r\n }}\r\n disabled={this.isIncrementDisabled()}\r\n onClick={this.handleIncrement}\r\n tabindex={-1}\r\n >\r\n <sd-icon name=\"add\" size={12} color={this.isIncrementDisabled() ? '#CCCCCC' : '#2D8DFF'} />\r\n </button>\r\n </div>\r\n )}\r\n </label>\r\n </Host>\r\n )\r\n }\r\n}\r\n"],"version":3}
@@ -1,4 +1,4 @@
1
- import { S as SdPagination$1, d as defineCustomElement$1 } from './p-B4wWf5r8.js';
1
+ import { S as SdPagination$1, d as defineCustomElement$1 } from './p-XAhTfI7Q.js';
2
2
 
3
3
  const SdPagination = SdPagination$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, h, F as Fragment, t as transformTag } from
2
2
  import { T as TooltipArrow } from './p-BDkKpeVz.js';
3
3
  import { d as defineCustomElement$4 } from './p-B05GJor3.js';
4
4
  import { d as defineCustomElement$3 } from './p-CV5tKC24.js';
5
- import { d as defineCustomElement$2 } from './p-DP33nj_I.js';
5
+ import { d as defineCustomElement$2 } from './p-Cx3euWvk.js';
6
6
 
7
7
  const sdPopoverCss = () => `.sd-popover{position:relative;cursor:pointer;display:inline-block}`;
8
8
 
@@ -43,11 +43,11 @@ const SdPopover$1 = /*@__PURE__*/ proxyCustomElement(class SdPopover extends H {
43
43
  this.showPopover = false;
44
44
  };
45
45
  render() {
46
- return (h(Fragment, { key: 'fa06f3ff6641006a75c3ed0912f8f2dc6ca2da56' }, 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: () => (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: () => (this.showPopover = !this.showPopover) })), this.showPopover && (h("sd-tooltip-portal", { key: 'f433e3bc5e325bf9d70fae10b6777fe77e52061f', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, h("div", { key: '7fa463878475d3c2ce86d006912c35b585d7bed0', class: {
46
+ return (h(Fragment, { key: '1300f5f84d96ef65840d8daec85dc53dba2c407c' }, 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: () => (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: () => (this.showPopover = !this.showPopover) })), this.showPopover && (h("sd-tooltip-portal", { key: '73b7feb032125495c7df8bbcecee042b59c91886', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, h("div", { key: 'b6209c9654fe11e148206ef49c8a304b1f72f068', class: {
47
47
  'sd-popover-menu': true,
48
48
  [`sd-popover-menu--${this.placement}`]: true,
49
49
  [this.menuClass]: !!this.menuClass,
50
- } }, h("i", { key: '90a23aea2730ec9dbc2b9ca77ef0a4ef13777006', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: '9246c25e04ea2dd6716e20ac01060ff7acc23fa9' })), h("div", { key: 'dd6f350fbb5f5a49302593b3c24faf6bf59bb9ec', class: "sd-popover-menu__content" }, this.menuTitle && h("div", { key: 'c9aae4e0eaa0e1ab4f1447907f2dbe0e6e988bbf', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (h("div", { key: '2ed497a7d543f4638756524b4062c9df57b20aa0', class: "sd-popover-menu__messages" }, this.messages.map(message => (h("div", null, message))))), this.buttons.length > 0 && (h("div", { key: '5ddf4ec18128bc58c77a3017fc1a621591adb67b', 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: 'e7bbb527601bda49a4d4e5c28a555acb5714bd5b', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, h("sd-icon", { key: '0e0ec3542195f3eb6955ef68ab82d947460271d3', name: "close", size: "12", color: "#AAAAAA" }))))))));
50
+ } }, h("i", { key: 'c788234f854fe0704ffffdc89dd297277916e7f1', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: '5d5b4aa3815b815ebe4bebc81f307ba62f781af1' })), h("div", { key: '6305c611f72e1e57ff90562a05568777ff3e5db0', class: "sd-popover-menu__content" }, this.menuTitle && h("div", { key: 'da81708c8925e82c6b28b2d582f17d588f9fceae', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (h("div", { key: 'd0d00ce577b6de6efd546fadafc5d487f5e9b0b9', class: "sd-popover-menu__messages" }, this.messages.map(message => (h("div", null, message))))), this.buttons.length > 0 && (h("div", { key: '3ce2714f038a72ffd1017e00521bf2c05fe8730c', 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: '4c551c170b13797cb725e3e0ae42623dc983286a', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, h("sd-icon", { key: '1c4620527b33feba50d06709ed0c9185be4094b4', name: "close", size: "12", color: "#AAAAAA" }))))))));
51
51
  }
52
52
  static get watchers() { return {
53
53
  "show": ["watchShowHandler"]
@@ -1,4 +1,4 @@
1
- import { S as SdPortal$1, d as defineCustomElement$1 } from './p-CYadUxId.js';
1
+ import { S as SdPortal$1, d as defineCustomElement$1 } from './p-BBNolp5g.js';
2
2
 
3
3
  const SdPortal = SdPortal$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -22,10 +22,10 @@ const SdProgress$1 = /*@__PURE__*/ proxyCustomElement(class SdProgress extends H
22
22
  error: '#FB4444',
23
23
  };
24
24
  render() {
25
- return (h(Host, { key: 'ecd9801daf4fcb4a3a680286354c436b1423778a', style: {
25
+ return (h(Host, { key: '351f3fda014f276d22b02b09f92ed7895a43ea85', style: {
26
26
  '--progress-color': this.statusColor[this.status],
27
27
  '--progress-percentage': `${this.percentage}%`,
28
- } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && h("div", { key: '167d080cefe222ac28d966bbcf0aca4a122c98ea', class: "sd-progress__label" }, this.label)));
28
+ } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && h("div", { key: '3b41b3fdb26fdf283792172de45fbcff37e1c90e', class: "sd-progress__label" }, this.label)));
29
29
  }
30
30
  renderBarProgress() {
31
31
  return (h("div", { class: `sd-progress__bar sd-progress__bar--${this.status}` }, h("div", { class: ['sd-progress__bar__percent', this.percentage < 100 ? 'proceed' : ''].join(' ') }), h("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--left" }, this.percentage, "%"), h("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--right" }, this.percentage, "%")));
@@ -3,10 +3,10 @@ import { B as BaseDropdownEvent, S as SelectKeyboardNavigation } from './p-B3H_u
3
3
  import { d as defineCustomElement$6 } from './p-C7kMNSz9.js';
4
4
  import { d as defineCustomElement$5 } from './p-CV5tKC24.js';
5
5
  import { d as defineCustomElement$4 } from './p-DY9yCaP9.js';
6
- import { d as defineCustomElement$3 } from './p-CYadUxId.js';
7
- import { d as defineCustomElement$2 } from './p-71Aop19u.js';
6
+ import { d as defineCustomElement$3 } from './p-BBNolp5g.js';
7
+ import { d as defineCustomElement$2 } from './p-BH3t01Im.js';
8
8
 
9
- const sdSelectMultipleGroupCss = () => `.sd-select-multiple-group__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select-multiple-group__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select-multiple-group__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-track{background-color:transparent}sd-select-multiple-group{display:inline-block;height:fit-content}sd-select-multiple-group .sd-select-multiple-group{display:flex;flex-wrap:nowrap;width:var(--select-width, 200px);cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white;color:#333333}sd-select-multiple-group .sd-select-multiple-group:hover:not(.sd-select-multiple-group--disabled){background:#f6f6f6}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__label{border-right:1px solid #cccccc}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger{color:#888888}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus,sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-visible,sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-within{outline:none !important}sd-select-multiple-group .sd-select-multiple-group__label{font-size:12px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6}sd-select-multiple-group .sd-select-multiple-group__container{position:relative;width:100%;display:flex}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__arrow--open{transform:rotate(180deg)}.sd-select-multiple-group__dropdown{width:var(--select-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container sd-input{width:100%}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select-multiple-group__dropdown .sd-select-multiple-group__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px}`;
9
+ const sdSelectMultipleGroupCss = () => `.sd-select-multiple-group__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select-multiple-group__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select-multiple-group__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-track{background-color:transparent}sd-select-multiple-group{display:inline-block;height:fit-content}sd-select-multiple-group .sd-select-multiple-group{display:flex;flex-wrap:nowrap;width:var(--select-width, 200px);cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white;color:#333333}sd-select-multiple-group .sd-select-multiple-group:hover:not(.sd-select-multiple-group--disabled){background:#f6f6f6}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__label{border-right:1px solid #cccccc}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger{color:#888888}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus,sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-visible,sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-within{outline:none !important}sd-select-multiple-group .sd-select-multiple-group__label{font-size:12px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6}sd-select-multiple-group .sd-select-multiple-group__container{position:relative;width:100%;display:flex}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__arrow--open{transform:rotate(180deg)}.sd-select-multiple-group__dropdown{width:var(--select-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333;opacity:0.5;transition:opacity 0.15s ease-in}.sd-select-multiple-group__dropdown--ready{opacity:1}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container sd-input{width:100%}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select-multiple-group__dropdown .sd-select-multiple-group__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px}`;
10
10
 
11
11
  const SdSelectMultipleGroup$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectMultipleGroup extends BaseDropdownEvent {
12
12
  constructor(registerHost) {
@@ -47,6 +47,7 @@ const SdSelectMultipleGroup$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectM
47
47
  searchText = null;
48
48
  itemIndex = -1;
49
49
  isScrolled = false;
50
+ isDropdownReady = false;
50
51
  // events
51
52
  sdChange;
52
53
  dropDownShow;
@@ -75,8 +76,10 @@ const SdSelectMultipleGroup$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectM
75
76
  searchInput?.blur();
76
77
  }
77
78
  }
78
- const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple-group__dropdown sd-select-option-group') || []);
79
- const currentItem = optionElements?.[this.itemIndex];
79
+ const optionElements = Array.from(this.dropdownRef?.querySelectorAll('sd-select-option-group') || []);
80
+ // useAll 사용시 "전체" 옵션 포함한 인덱스 사용
81
+ const actualIndex = this.useAll ? this.itemIndex + 1 : this.itemIndex;
82
+ const currentItem = optionElements?.[actualIndex];
80
83
  if (!currentItem || !this.isOpen)
81
84
  return;
82
85
  this.optionRef = currentItem;
@@ -90,28 +93,43 @@ const SdSelectMultipleGroup$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectM
90
93
  async isOpenChanged() {
91
94
  // Base class의 이벤트 관리 호출 - 다른 select와의 이벤트 충돌 방지
92
95
  this.onDropdownToggle(this.isOpen);
93
- const selectedOption = this.getSelectedOption();
94
- if (!selectedOption) {
95
- this.itemIndex = -1;
96
- }
97
- else {
98
- this.itemIndex = this.options.indexOf(selectedOption[0]);
99
- }
100
96
  this.dropDownShow?.emit({ isOpen: this.isOpen });
101
- if (this.isOpen === false)
97
+ this.isDropdownReady = false;
98
+ if (this.isOpen === false) {
102
99
  return;
103
- await new Promise(resolve => setTimeout(resolve, 10));
104
- const optionElements = Array.from(this.dropdownRef?.querySelectorAll('.sd-select-multiple__dropdown sd-select-item') || []);
105
- const currentItem = optionElements?.[this.itemIndex];
106
- // 드롭다운이 열릴 때 검색 입력에 포커스
107
- if (this.searchable) {
108
- const searchInput = await this.getNativeInputElement();
109
- searchInput?.focus({ preventScroll: true });
110
100
  }
111
- if (!currentItem)
112
- return;
113
- await new Promise(resolve => setTimeout(resolve, 10)); // 추가 딜레이
114
- this.scrollToOption(currentItem);
101
+ // DOM 렌더링을 기다리기 위해 이중 requestAnimationFrame 사용 - (레이아웃/스타일 계산 - 페인트 이후)
102
+ requestAnimationFrame(() => {
103
+ requestAnimationFrame(async () => {
104
+ const selectedOptions = this.getSelectedOption();
105
+ // 선택된 옵션이 있으면 첫 번째 선택된 항목으로 스크롤
106
+ if (selectedOptions && selectedOptions.length > 0) {
107
+ const selectedIndex = this.options.indexOf(selectedOptions[0]);
108
+ const optionElements = Array.from(this.dropdownRef?.querySelectorAll('sd-select-option-group') || []);
109
+ // useAll 사용시 "전체" 옵션 포함한 인덱스 사용
110
+ const actualIndex = this.useAll ? selectedIndex + 1 : selectedIndex;
111
+ // 선택된 옵션이 화면 가운데에 오도록 index 조정
112
+ const targetIndex = Math.min(actualIndex + 4, optionElements.length - 1);
113
+ const currentItem = optionElements?.[targetIndex];
114
+ if (currentItem) {
115
+ this.scrollToOption(currentItem);
116
+ }
117
+ }
118
+ this.isDropdownReady = true;
119
+ if (this.searchable) {
120
+ const searchInput = await this.getNativeInputElement();
121
+ if (searchInput) {
122
+ requestAnimationFrame(() => {
123
+ searchInput.focus({ preventScroll: true });
124
+ });
125
+ }
126
+ }
127
+ });
128
+ });
129
+ }
130
+ async open() {
131
+ await new Promise(resolve => setTimeout(resolve, 0));
132
+ this.isOpen = true;
115
133
  }
116
134
  componentWillLoad() {
117
135
  // props가 모두 설정된 후에 실행되므로 올바른 options 값을 가져올 수 있음
@@ -326,35 +344,41 @@ const SdSelectMultipleGroup$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectM
326
344
  closeDropdown() {
327
345
  this.isOpen = false;
328
346
  }
329
- scrollToOption(optionElement) {
347
+ async scrollToOption(optionElement) {
330
348
  if (!this.dropdownRef || !optionElement)
331
349
  return;
332
- const dropdown = this.dropdownRef;
333
- const optionTop = optionElement.offsetTop;
334
- const optionHeight = optionElement.offsetHeight;
335
- const dropdownScrollTop = dropdown.scrollTop;
336
- const dropdownHeight = dropdown.clientHeight;
337
- const searchContainer = dropdown.querySelector('.sd-select__search-container');
338
- const searchOffset = searchContainer ? searchContainer.offsetHeight : 0;
339
- const visibleTop = dropdownScrollTop + searchOffset;
340
- const visibleBottom = dropdownScrollTop + dropdownHeight;
341
- if (optionTop < visibleTop) {
342
- dropdown.scrollTop = optionTop - searchOffset;
343
- }
344
- else if (optionTop + optionHeight > visibleBottom) {
345
- dropdown.scrollTop = optionTop + optionHeight - dropdownHeight + searchOffset;
346
- }
350
+ requestAnimationFrame(() => {
351
+ const dropdown = this.dropdownRef;
352
+ const optionTop = optionElement.offsetTop;
353
+ const optionHeight = optionElement.offsetHeight;
354
+ const dropdownScrollTop = dropdown.scrollTop;
355
+ const dropdownHeight = dropdown.clientHeight;
356
+ const searchContainer = dropdown.querySelector('.sd-select-multiple-group__search-container');
357
+ const searchOffset = searchContainer ? searchContainer.offsetHeight : 0;
358
+ const visibleContentHeight = dropdownHeight - searchOffset;
359
+ const visibleTop = dropdownScrollTop + searchOffset;
360
+ const visibleBottom = dropdownScrollTop + dropdownHeight;
361
+ if (optionTop < visibleTop) {
362
+ dropdown.scrollTo({ top: optionTop - searchOffset, behavior: 'instant' });
363
+ }
364
+ else if (optionTop + optionHeight > visibleBottom) {
365
+ dropdown.scrollTo({
366
+ top: optionTop + optionHeight - visibleContentHeight - searchOffset,
367
+ behavior: 'instant',
368
+ });
369
+ }
370
+ });
347
371
  }
348
372
  render() {
349
373
  const style = {
350
374
  '--select-width': this.width || '200px',
351
375
  '--select-dropdown-height': this.dropdownHeight || '260px',
352
376
  };
353
- return (h(Host, { key: 'efc8661d6cd2e043b5e43e0872de3a9bff6d57a6', style: style }, h("div", { key: 'e9f7615f75cb28974dececc8e847e868aef8210c', class: {
377
+ return (h(Host, { key: '00e3f75c997fe76087ddfa2d9fef2ddb11a10a3e', style: style }, h("div", { key: 'f7e5a9f0d3704e0cfb014c8b7a84e6c93d61d31b', class: {
354
378
  'sd-select-multiple-group': true,
355
379
  'sd-select-multiple-group--open': this.isOpen,
356
380
  'sd-select-multiple-group--disabled': this.disabled,
357
- }, style: this.containerStyle, ref: el => (this.selectRef = el) }, this.renderLabel(this.label, this.labelStyle), h("div", { key: '37ea4df1408eebde9e9e6d6d42579a3c40da325a', class: "sd-select-multiple-group__container" }, this.renderTrigger(), this.renderDropdown()))));
381
+ }, style: this.containerStyle, ref: el => (this.selectRef = el) }, this.renderLabel(this.label, this.labelStyle), h("div", { key: '5b4d771e6ba76ce56974eeee2f01e6a267f557f5', class: "sd-select-multiple-group__container" }, this.renderTrigger(), this.renderDropdown()))));
358
382
  }
359
383
  renderLabel(label, labelStyle) {
360
384
  if (!label)
@@ -378,7 +402,10 @@ const SdSelectMultipleGroup$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectM
378
402
  };
379
403
  if (this.isOpen === false)
380
404
  return null;
381
- return (h("sd-portal", { open: this.isOpen, parentRef: this.selectRef, onSdClose: this.closeDropdown }, h("div", { class: "sd-select-multiple-group__dropdown", style: { ...style, ...this.dropdownStyle }, onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (h("div", { class: {
405
+ return (h("sd-portal", { open: this.isOpen, parentRef: this.selectRef, onSdClose: this.closeDropdown }, h("div", { style: { width: '0', height: '0', overflow: 'visible' } }, h("div", { class: {
406
+ 'sd-select-multiple-group__dropdown': true,
407
+ 'sd-select-multiple-group__dropdown--ready': this.isDropdownReady,
408
+ }, style: { ...style, ...this.dropdownStyle }, onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (h("div", { class: {
382
409
  'sd-select-multiple-group__search-container': true,
383
410
  'sd-select-multiple-group__search-container--scrolled': this.isScrolled,
384
411
  }, onClick: event => event.stopPropagation() }, h("sd-input", { ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdInput: event => {
@@ -395,7 +422,7 @@ const SdSelectMultipleGroup$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectM
395
422
  return;
396
423
  }
397
424
  this.handleOptionClick(detail);
398
- }, useCheckbox: this.useCheckbox, ...(option.type !== 'item' && { countInfo: this.getChildrenOptions(option) }) })))))) : (h("slot", { name: "option-placeholder" }, h("div", { class: 'sd-select-multiple-group__option-placeholder', style: this.optionStyle }, this.optionPlaceholder))))));
425
+ }, useCheckbox: this.useCheckbox, ...(option.type !== 'item' && { countInfo: this.getChildrenOptions(option) }) })))))) : (h("slot", { name: "option-placeholder" }, h("div", { class: 'sd-select-multiple-group__option-placeholder', style: this.optionStyle }, this.optionPlaceholder)))))));
399
426
  }
400
427
  static get watchers() { return {
401
428
  "value": ["valueChanged"],
@@ -430,7 +457,9 @@ const SdSelectMultipleGroup$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectM
430
457
  "isOpen": [32],
431
458
  "searchText": [32],
432
459
  "itemIndex": [32],
433
- "isScrolled": [32]
460
+ "isScrolled": [32],
461
+ "isDropdownReady": [32],
462
+ "open": [64]
434
463
  }, undefined, {
435
464
  "value": ["valueChanged"],
436
465
  "options": ["optionsChanged"],
@@ -1 +1 @@
1
- {"file":"sd-select-multiple-group.js","mappings":"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","names":["SdSelectMultipleGroup","__stencil_proxyCustomElement"],"sources":["src/components/sd-select-multiple-group/sd-select-multiple-group.scss?tag=sd-select-multiple-group","src/components/sd-select-multiple-group/sd-select-multiple-group.tsx"],"sourcesContent":["@import 'variables';\r\n@import 'extend';\r\n\r\nsd-select-multiple-group {\r\n display: inline-block;\r\n height: fit-content;\r\n .sd-select-multiple-group {\r\n display: flex;\r\n flex-wrap: nowrap;\r\n width: var(--select-width, 200px);\r\n cursor: pointer;\r\n user-select: none;\r\n border: 1px solid $grey_55;\r\n border-radius: 4px;\r\n background-color: white;\r\n color: $grey_90;\r\n\r\n &:hover:not(.sd-select-multiple-group--disabled) {\r\n background: $grey_10;\r\n }\r\n\r\n &.sd-select-multiple-group--disabled {\r\n cursor: not-allowed;\r\n background-color: $grey_20;\r\n border-color: $grey_45;\r\n\r\n .sd-select-multiple-group__label {\r\n border-right: 1px solid $grey_45;\r\n }\r\n\r\n .sd-select-multiple-group__trigger {\r\n color: $grey_65;\r\n &:focus,\r\n &:focus-visible,\r\n &:focus-within {\r\n outline: none !important;\r\n }\r\n }\r\n }\r\n\r\n &__label {\r\n font-size: 12px;\r\n font-weight: 500;\r\n color: $grey_90;\r\n padding: 4px 12px;\r\n border-right: 1px solid $grey_45;\r\n border-radius: 4px 0 0 4px;\r\n background-color: $grey_10;\r\n }\r\n\r\n &__container {\r\n position: relative;\r\n width: 100%;\r\n display: flex;\r\n\r\n .sd-select-multiple-group__trigger {\r\n padding: 4px 20px 4px 12px;\r\n display: flex;\r\n width: 100%;\r\n align-items: center;\r\n\r\n .sd-select-multiple-group__value {\r\n flex: 1;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n line-height: 20px;\r\n font-size: 12px;\r\n font-weight: 400;\r\n }\r\n\r\n .sd-select-multiple-group__clear {\r\n margin: 0 4px;\r\n width: 8px;\r\n height: 8px;\r\n background-color: transparent;\r\n outline: none;\r\n border: none;\r\n }\r\n }\r\n\r\n .sd-select-multiple-group__arrow {\r\n position: absolute;\r\n top: 8px;\r\n right: 8px;\r\n width: 12px;\r\n height: 12px;\r\n color: $grey_65;\r\n transition: transform 0.3s ease;\r\n\r\n &--open {\r\n transform: rotate(180deg);\r\n }\r\n }\r\n }\r\n }\r\n}\r\n\r\n.sd-select-multiple-group__dropdown {\r\n @extend %scrollBar;\r\n width: var(--select-width, 200px);\r\n max-height: var(--select-dropdown-height, 260px);\r\n padding-bottom: 2px;\r\n background-color: white;\r\n box-shadow: 2px 2px 12px 2px rgba(0, 0, 0, 0.1);\r\n border-radius: 4px;\r\n overflow-y: auto;\r\n color: $grey_90;\r\n\r\n .sd-select-multiple-group__search-container {\r\n position: sticky;\r\n top: 0;\r\n display: flex;\r\n width: 100%;\r\n background-color: white;\r\n align-items: center;\r\n padding: 4px 8px;\r\n\r\n sd-input {\r\n width: 100%;\r\n }\r\n\r\n &--scrolled {\r\n box-shadow: 2px 2px 8px 2px rgba(0, 0, 0, 0.2);\r\n }\r\n }\r\n\r\n .sd-select-multiple-group__option-placeholder {\r\n padding: 4px 12px;\r\n font-size: 12px;\r\n line-height: 20px;\r\n }\r\n}\r\n","import {\r\n Component,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n Fragment,\r\n Host,\r\n Prop,\r\n State,\r\n Watch,\r\n h,\r\n} from '@stencil/core';\r\nimport { BaseDropdownEvent } from '../../utils/base-dropdown-event';\r\nimport { SelectMultipleEvents, SelectOption, SelectStyleProps } from '../sd-select/sd-select';\r\nimport { SelectKeyboardNavigation } from '../../utils/select-keyboard-navigation';\r\n\r\nexport interface SelectOptionGroup extends SelectOption {\r\n type: 'group' | 'subgroup' | 'item' | 'all';\r\n parent?: string;\r\n}\r\n\r\n@Component({\r\n tag: 'sd-select-multiple-group',\r\n styleUrl: 'sd-select-multiple-group.scss',\r\n})\r\nexport class SdSelectMultipleGroup extends BaseDropdownEvent {\r\n @Element() el!: HTMLElement;\r\n\r\n // props\r\n @Prop({ mutable: true }) value: SelectOptionGroup[] | null = null;\r\n @Prop() label: string = '';\r\n @Prop({ mutable: true }) options: SelectOptionGroup[] = [];\r\n @Prop() placeholder: string = '선택';\r\n @Prop() optionPlaceholder: string = '옵션이 없습니다.';\r\n @Prop() width: string = '200px';\r\n @Prop() dropdownHeight: string = '260px';\r\n @Prop() disabled: boolean = false;\r\n @Prop() clearable: boolean = false;\r\n @Prop() searchable: boolean = false;\r\n @Prop() useCheckbox: boolean = false;\r\n @Prop() useAll: boolean = false;\r\n @Prop() allCheckedLabel = '전체';\r\n @Prop() allCheckOptionLabel = '전체';\r\n\r\n // props - custom styles\r\n @Prop() containerStyle: SelectStyleProps['containerStyle'] = {};\r\n @Prop() triggerStyle: SelectStyleProps['triggerStyle'] = {};\r\n @Prop() dropdownStyle: SelectStyleProps['dropdownStyle'] = {};\r\n @Prop() optionStyle: SelectStyleProps['optionStyle'] = {};\r\n @Prop() labelStyle: SelectStyleProps['labelStyle'] = {};\r\n\r\n // props - custom slots\r\n @Prop() optionRenderer?: (option: SelectOption, index: number, isSelected: boolean) => any;\r\n\r\n // states\r\n @State() filteredOptions = this.options;\r\n @State() isOpen: boolean = false;\r\n @State() searchText: string | null = null;\r\n @State() itemIndex: number = -1;\r\n @State() isScrolled: boolean = false;\r\n\r\n // events\r\n @Event() sdChange?: EventEmitter<SelectMultipleEvents['sdChange']>;\r\n @Event() dropDownShow?: EventEmitter<SelectMultipleEvents['dropDownShow']>;\r\n\r\n private selectRef?: HTMLElement;\r\n private searchRef?: HTMLSdInputElement;\r\n private optionRef?: HTMLSdSelectOptionGroupElement;\r\n private dropdownRef?: HTMLElement;\r\n\r\n @Watch('value')\r\n valueChanged() {\r\n this.sdChange?.emit(this.value);\r\n }\r\n\r\n @Watch('options')\r\n optionsChanged() {\r\n this.filteredOptions = this.options;\r\n this.filterOptions();\r\n }\r\n\r\n @Watch('searchText')\r\n searchTextChanged() {\r\n this.filterOptions();\r\n }\r\n\r\n @Watch('itemIndex')\r\n async itemIndexChanged(newIndex: number, oldIndex: number) {\r\n if (this.searchable) {\r\n const searchInput = await this.getNativeInputElement();\r\n if (this.itemIndex === -1) {\r\n searchInput?.focus({ preventScroll: true });\r\n return;\r\n } else if (searchInput?.matches(':focus')) {\r\n searchInput?.blur();\r\n }\r\n }\r\n\r\n const optionElements = Array.from(\r\n this.dropdownRef?.querySelectorAll(\r\n '.sd-select-multiple-group__dropdown sd-select-option-group',\r\n ) || [],\r\n );\r\n const currentItem = optionElements?.[this.itemIndex];\r\n\r\n if (!currentItem || !this.isOpen) return;\r\n\r\n this.optionRef = currentItem as HTMLSdSelectOptionGroupElement;\r\n const isOptionDisabled = await this.optionRef.isDisabled();\r\n\r\n if (isOptionDisabled) {\r\n newIndex > oldIndex ? this.itemIndex++ : this.itemIndex--;\r\n return;\r\n }\r\n\r\n this.scrollToOption(currentItem as HTMLElement);\r\n }\r\n\r\n @Watch('isOpen')\r\n async isOpenChanged() {\r\n // Base class의 이벤트 관리 호출 - 다른 select와의 이벤트 충돌 방지\r\n this.onDropdownToggle(this.isOpen);\r\n\r\n const selectedOption = this.getSelectedOption();\r\n if (!selectedOption) {\r\n this.itemIndex = -1;\r\n } else {\r\n this.itemIndex = this.options.indexOf(selectedOption[0]);\r\n }\r\n\r\n this.dropDownShow?.emit({ isOpen: this.isOpen });\r\n\r\n if (this.isOpen === false) return;\r\n\r\n await new Promise(resolve => setTimeout(resolve, 10));\r\n\r\n const optionElements = Array.from(\r\n this.dropdownRef?.querySelectorAll('.sd-select-multiple__dropdown sd-select-item') || [],\r\n );\r\n const currentItem = optionElements?.[this.itemIndex];\r\n\r\n // 드롭다운이 열릴 때 검색 입력에 포커스\r\n if (this.searchable) {\r\n const searchInput = await this.getNativeInputElement();\r\n searchInput?.focus({ preventScroll: true });\r\n }\r\n\r\n if (!currentItem) return;\r\n\r\n await new Promise(resolve => setTimeout(resolve, 10)); // 추가 딜레이\r\n this.scrollToOption(currentItem as HTMLElement);\r\n }\r\n\r\n componentWillLoad() {\r\n // props가 모두 설정된 후에 실행되므로 올바른 options 값을 가져올 수 있음\r\n this.filteredOptions = this.options;\r\n this.initializeEvent(); // global dropdown Manager에 등록 + 이벤트 핸들러 초기화\r\n }\r\n\r\n disconnectedCallback() {\r\n this.cleanupEvent(); // global dropdown Manager에서 제거 + 이벤트 정리\r\n }\r\n\r\n protected handleDocumentClick(event: Event): void {\r\n if (!this.selectRef?.contains(event.target as Node)) {\r\n this.isOpen = false;\r\n }\r\n }\r\n\r\n protected handleDocumentKeydown(keyboardEvent: KeyboardEvent): void {\r\n keyboardEvent.stopPropagation();\r\n const targetKey = ['ArrowDown', 'ArrowUp', 'Enter', 'Escape'];\r\n if (!targetKey.includes(keyboardEvent.key)) return;\r\n\r\n keyboardEvent.preventDefault();\r\n switch (keyboardEvent.key) {\r\n case 'ArrowDown':\r\n case 'ArrowUp':\r\n const keyboardNavigation = new SelectKeyboardNavigation(this.searchable, this.filteredOptions);\r\n const nextIndex = keyboardNavigation.getNextIndex(this.itemIndex, keyboardEvent.key);\r\n this.itemIndex = nextIndex;\r\n break;\r\n case 'Enter':\r\n const selectedOption = this.filteredOptions[this.itemIndex];\r\n if (selectedOption && !selectedOption.disabled) {\r\n this.handleOptionSelection(selectedOption);\r\n }\r\n break;\r\n case 'Escape':\r\n this.isOpen = false;\r\n break;\r\n }\r\n }\r\n\r\n // event handlers\r\n handleTriggerClick = (event: Event) => {\r\n event.stopPropagation();\r\n\r\n if (!this.disabled) {\r\n this.isOpen = !this.isOpen;\r\n this.dropDownShow?.emit({ isOpen: this.isOpen });\r\n }\r\n };\r\n\r\n handleAllOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n }) => {\r\n if (detail.isSelected) {\r\n // 이미 선택된 옵션인 경우, 선택 해제\r\n const filterDisabledOptions = this.filteredOptions.filter(\r\n opt => opt.type === 'item' && !opt.disabled,\r\n );\r\n this.value =\r\n this.value?.filter(\r\n selected => !filterDisabledOptions.some(opt => opt.value === selected.value),\r\n ) || this.value;\r\n } else {\r\n // 새로운 옵션 선택\r\n const valueSet = new Set([\r\n ...(this.value || []),\r\n ...this.filteredOptions.filter(opt => opt.type === 'item' && !opt.disabled),\r\n ]);\r\n this.value = Array.from(valueSet);\r\n }\r\n };\r\n\r\n handleOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n }) => {\r\n const { option, event } = detail;\r\n event.stopPropagation();\r\n\r\n if (option.type === 'group') this.handleGroupOptionClick(detail);\r\n if (option.type === 'subgroup') this.handleSubGroupOptionClick(detail);\r\n if (option.type === 'item') this.handleOptionSelection(option);\r\n };\r\n\r\n handleGroupOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n }) => {\r\n const { option, isSelected } = detail;\r\n const childOptions = this.filteredOptions.filter(\r\n opt => opt.parent === option.value && !opt.disabled,\r\n );\r\n\r\n childOptions.forEach(subgroup => {\r\n this.handleSubGroupOptionClick({\r\n option: subgroup,\r\n isSelected: isSelected || isSelected === null,\r\n });\r\n });\r\n };\r\n\r\n handleSubGroupOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n }) => {\r\n const { option, isSelected } = detail;\r\n\r\n const childOptions = this.filteredOptions.filter(\r\n opt => opt.parent === option.value && !opt.disabled,\r\n );\r\n\r\n if (isSelected || isSelected === null) {\r\n // 모든 자식 옵션이 선택된 경우, 모두 선택 해제\r\n this.value =\r\n this.value?.filter(selected => !childOptions.some(child => child.value === selected.value)) ||\r\n null;\r\n } else {\r\n // 일부 또는 전체 자식 옵션이 선택되지 않은 경우, 모두 선택\r\n const newSelections = childOptions.filter(\r\n child => !this.value?.some(selected => selected.value === child.value),\r\n );\r\n this.value = [...(this.value || []), ...newSelections];\r\n }\r\n };\r\n\r\n private filterOptions() {\r\n if (!this.searchText || this.searchText.trim() === '') {\r\n // 검색어가 없으면 전체 옵션 표시\r\n this.filteredOptions = this.options;\r\n return;\r\n }\r\n\r\n const searchTerm = this.searchText.toLowerCase();\r\n const matchedOptions = new Set<SelectOptionGroup>();\r\n\r\n // 1. 직접 매칭되는 옵션들 찾기\r\n this.options.forEach(option => {\r\n if (option.label.toLowerCase().includes(searchTerm)) {\r\n matchedOptions.add(option);\r\n\r\n // 매칭된 옵션의 상위 그룹들도 포함\r\n this.addParentGroups(option, matchedOptions);\r\n }\r\n });\r\n\r\n // 2. Set을 배열로 변환하고 원본 순서 유지\r\n this.filteredOptions = this.options.filter(option => matchedOptions.has(option));\r\n }\r\n\r\n private addParentGroups(option: SelectOptionGroup, matchedSet: Set<SelectOptionGroup>) {\r\n if (!option.parent) return;\r\n\r\n const parentOption = this.options.find(opt => opt.value === option.parent);\r\n if (parentOption && !matchedSet.has(parentOption)) {\r\n matchedSet.add(parentOption);\r\n // 재귀적으로 상위 그룹들도 추가\r\n this.addParentGroups(parentOption, matchedSet);\r\n }\r\n }\r\n\r\n private getSelectedOption(): SelectOptionGroup[] {\r\n return this.options.filter(option => this.value?.includes(option));\r\n }\r\n\r\n private handleDropdownScroll = (event: Event) => {\r\n const target = event.target as HTMLElement;\r\n const scrollTop = target.scrollTop;\r\n\r\n // 스크롤이 조금이라도 되면 그림자 표시\r\n this.isScrolled = scrollTop > 0;\r\n };\r\n\r\n private async getNativeInputElement(): Promise<HTMLInputElement | null> {\r\n if (this.searchRef) {\r\n return this.searchRef.getNativeElement();\r\n }\r\n return null;\r\n }\r\n\r\n private handleOptionSelection = (option: SelectOptionGroup) => {\r\n if (!option || option.disabled) return;\r\n\r\n const isAlreadySelected = this.value?.some(opt => opt.value === option.value);\r\n if (isAlreadySelected) {\r\n // 이미 선택된 옵션인 경우, 선택 해제\r\n this.value = this.value?.filter(opt => opt.value !== option.value) || null;\r\n } else {\r\n // 새로운 옵션 선택\r\n this.value = [...(this.value || []), option];\r\n }\r\n };\r\n\r\n private getAllItemsUnderOption(\r\n parentOption: SelectOptionGroup,\r\n includeDisabled: boolean = false,\r\n ): SelectOptionGroup[] {\r\n const filterChildrenWithParent = (option: SelectOptionGroup) =>\r\n option.parent === parentOption.value && (includeDisabled || !option.disabled);\r\n\r\n if (parentOption.type === 'subgroup') {\r\n return this.filteredOptions.filter(\r\n option => filterChildrenWithParent(option) && option.type === 'item',\r\n );\r\n }\r\n\r\n const allItems: SelectOptionGroup[] = [];\r\n const childOptions = this.filteredOptions.filter(filterChildrenWithParent);\r\n const subgroupOptions = childOptions.filter(option => option.type === 'subgroup');\r\n subgroupOptions.forEach(subgroup => {\r\n const itemsUnderSubgroup = this.filteredOptions.filter(\r\n option =>\r\n option.parent === subgroup.value &&\r\n option.type === 'item' &&\r\n (includeDisabled ? true : !option.disabled),\r\n );\r\n allItems.push(...itemsUnderSubgroup);\r\n });\r\n const directItems = childOptions.filter(option => option.type === 'item');\r\n allItems.push(...directItems);\r\n\r\n return allItems;\r\n }\r\n\r\n private isAllChildrenSelected(groupOption: SelectOptionGroup): boolean | null {\r\n const allItems = this.getAllItemsUnderOption(groupOption);\r\n\r\n if (allItems.length === 0) return false;\r\n\r\n const selectedItems = allItems.filter(item =>\r\n this.value?.some(selected => selected.value === item.value),\r\n );\r\n\r\n if (selectedItems.length === allItems.length) return true;\r\n if (selectedItems.length > 0) return null;\r\n return false;\r\n }\r\n\r\n private getChildrenOptions(parentOption: SelectOptionGroup) {\r\n const allItems = this.getAllItemsUnderOption(parentOption, true);\r\n const selectedCount = allItems.filter(item =>\r\n this.value?.some(val => val.value === item.value),\r\n ).length;\r\n\r\n return {\r\n selectedCount,\r\n totalCount: allItems.length,\r\n };\r\n }\r\n\r\n private isAllOptionsSelected(): boolean {\r\n if (!this.value || this.value.length === 0) return false;\r\n\r\n const selectableItems = this.options.filter(opt => opt.type === 'item' && !opt.disabled);\r\n\r\n if (selectableItems.length === 0) return false;\r\n\r\n const selectedValues = new Set(this.value.map(v => v.value));\r\n return selectableItems.every(option => selectedValues.has(option.value));\r\n }\r\n\r\n private getTriggerLabel() {\r\n const selectedOption = this.getSelectedOption();\r\n if (!selectedOption) return '선택';\r\n\r\n if (selectedOption.length === 0) return this.placeholder;\r\n\r\n const isAllChecked = this.isAllOptionsSelected();\r\n\r\n return isAllChecked\r\n ? this.allCheckedLabel\r\n : selectedOption.map(option => option.label).join(', ');\r\n }\r\n\r\n closeDropdown() {\r\n this.isOpen = false;\r\n }\r\n\r\n private scrollToOption(optionElement: HTMLElement) {\r\n if (!this.dropdownRef || !optionElement) return;\r\n\r\n const dropdown = this.dropdownRef;\r\n const optionTop = optionElement.offsetTop;\r\n const optionHeight = optionElement.offsetHeight;\r\n const dropdownScrollTop = dropdown.scrollTop;\r\n const dropdownHeight = dropdown.clientHeight;\r\n\r\n const searchContainer = dropdown.querySelector('.sd-select__search-container');\r\n const searchOffset = searchContainer ? (searchContainer as HTMLElement).offsetHeight : 0;\r\n\r\n const visibleTop = dropdownScrollTop + searchOffset;\r\n const visibleBottom = dropdownScrollTop + dropdownHeight;\r\n\r\n if (optionTop < visibleTop) {\r\n dropdown.scrollTop = optionTop - searchOffset;\r\n } else if (optionTop + optionHeight > visibleBottom) {\r\n dropdown.scrollTop = optionTop + optionHeight - dropdownHeight + searchOffset;\r\n }\r\n }\r\n\r\n render() {\r\n const style = {\r\n '--select-width': this.width || '200px',\r\n '--select-dropdown-height': this.dropdownHeight || '260px',\r\n };\r\n\r\n return (\r\n <Host style={style}>\r\n <div\r\n class={{\r\n 'sd-select-multiple-group': true,\r\n 'sd-select-multiple-group--open': this.isOpen,\r\n 'sd-select-multiple-group--disabled': this.disabled,\r\n }}\r\n style={this.containerStyle}\r\n ref={el => (this.selectRef = el)}\r\n >\r\n {this.renderLabel(this.label, this.labelStyle)}\r\n <div class=\"sd-select-multiple-group__container\">\r\n {this.renderTrigger()}\r\n {this.renderDropdown()}\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n\r\n private renderLabel(label?: string, labelStyle?: { [key: string]: string }) {\r\n if (!label) return null;\r\n\r\n return (\r\n <label class=\"sd-select-multiple-group__label\" style={labelStyle}>\r\n {label}\r\n </label>\r\n );\r\n }\r\n\r\n private renderTrigger() {\r\n const selectedOption = this.getSelectedOption();\r\n return (\r\n <div\r\n class=\"sd-select-multiple-group__trigger\"\r\n tabindex={this.disabled ? -1 : 0}\r\n onClick={this.handleTriggerClick}\r\n style={this.triggerStyle}\r\n >\r\n <span class=\"sd-select-multiple-group__value\">{this.getTriggerLabel()}</span>\r\n {this.clearable && selectedOption?.length > 0 && !this.disabled && (\r\n <sd-icon\r\n key=\"close-icon\"\r\n name=\"close\"\r\n size={10}\r\n color=\"#888\"\r\n class=\"sd-select-multiple-group__clear\"\r\n onClick={event => {\r\n event.stopPropagation();\r\n this.value = null;\r\n }}\r\n ></sd-icon>\r\n )}\r\n\r\n <sd-icon\r\n key=\"arrow-icon\"\r\n name=\"arrowDown\"\r\n color=\"#888\"\r\n class={{\r\n 'sd-select-multiple-group__arrow': true,\r\n 'sd-select-multiple-group__arrow--open': this.isOpen,\r\n }}\r\n ></sd-icon>\r\n </div>\r\n );\r\n }\r\n\r\n private renderDropdown() {\r\n const style = {\r\n '--select-width': this.width || '200px',\r\n '--select-dropdown-height': this.dropdownHeight || '260px',\r\n };\r\n\r\n if (this.isOpen === false) return null;\r\n\r\n return (\r\n <sd-portal open={this.isOpen} parentRef={this.selectRef} onSdClose={this.closeDropdown}>\r\n <div\r\n class=\"sd-select-multiple-group__dropdown\"\r\n style={{ ...style, ...this.dropdownStyle }}\r\n onScroll={this.handleDropdownScroll}\r\n ref={el => (this.dropdownRef = el)}\r\n >\r\n {this.searchable && (\r\n <div\r\n class={{\r\n 'sd-select-multiple-group__search-container': true,\r\n 'sd-select-multiple-group__search-container--scrolled': this.isScrolled,\r\n }}\r\n onClick={event => event.stopPropagation()}\r\n >\r\n <sd-input\r\n ref={el => (this.searchRef = el)}\r\n value={this.searchText}\r\n placeholder=\"검색\"\r\n clearable\r\n inputStyle={{ 'padding-left': '8px' }}\r\n autofocus\r\n onSdInput={event => {\r\n this.searchText = String(event?.detail);\r\n }}\r\n onSdFocus={() => {\r\n this.itemIndex = -1;\r\n }}\r\n onKeyDown={e => {\r\n if (e.code === 'Enter') e.stopPropagation();\r\n }}\r\n >\r\n <sd-icon name=\"search\" size={16} color=\"#737373\" slot=\"prefix\"></sd-icon>\r\n </sd-input>\r\n </div>\r\n )}\r\n\r\n {this.filteredOptions.length > 0 ? (\r\n <Fragment>\r\n {this.useAll && (\r\n <sd-select-option-group\r\n option={{ label: this.allCheckOptionLabel, value: '', type: 'all' }}\r\n index={0}\r\n isSelected={this.isAllOptionsSelected()}\r\n isFocused={this.itemIndex === 0}\r\n optionStyle={this.optionStyle}\r\n onOptionClick={({\r\n detail,\r\n }: {\r\n detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n };\r\n }) => this.handleAllOptionClick(detail)}\r\n useCheckbox={this.useCheckbox}\r\n useIndicator={false}\r\n ></sd-select-option-group>\r\n )}\r\n {this.filteredOptions.map((option, index) => (\r\n <slot name={`option-${option.value}`}>\r\n <sd-select-option-group\r\n option={option}\r\n index={index}\r\n isSelected={\r\n option.type === 'item'\r\n ? this.value?.some(selected => selected.value === option.value)\r\n : this.isAllChildrenSelected(option)\r\n }\r\n isFocused={index === this.itemIndex}\r\n optionStyle={this.optionStyle}\r\n onOptionClick={({\r\n detail,\r\n }: {\r\n detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n };\r\n }) => {\r\n if (option.type !== 'item' && !this.useCheckbox) {\r\n return;\r\n }\r\n\r\n this.handleOptionClick(detail);\r\n }}\r\n useCheckbox={this.useCheckbox}\r\n {...(option.type !== 'item' && { countInfo: this.getChildrenOptions(option) })}\r\n ></sd-select-option-group>\r\n </slot>\r\n ))}\r\n </Fragment>\r\n ) : (\r\n <slot name=\"option-placeholder\">\r\n <div class={'sd-select-multiple-group__option-placeholder'} style={this.optionStyle}>\r\n {this.optionPlaceholder}\r\n </div>\r\n </slot>\r\n )}\r\n </div>\r\n </sd-portal>\r\n );\r\n }\r\n}\r\n"],"version":3}
1
+ {"file":"sd-select-multiple-group.js","mappings":"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","names":["SdSelectMultipleGroup","__stencil_proxyCustomElement"],"sources":["src/components/sd-select-multiple-group/sd-select-multiple-group.scss?tag=sd-select-multiple-group","src/components/sd-select-multiple-group/sd-select-multiple-group.tsx"],"sourcesContent":["@import 'variables';\r\n@import 'extend';\r\n\r\nsd-select-multiple-group {\r\n display: inline-block;\r\n height: fit-content;\r\n .sd-select-multiple-group {\r\n display: flex;\r\n flex-wrap: nowrap;\r\n width: var(--select-width, 200px);\r\n cursor: pointer;\r\n user-select: none;\r\n border: 1px solid $grey_55;\r\n border-radius: 4px;\r\n background-color: white;\r\n color: $grey_90;\r\n\r\n &:hover:not(.sd-select-multiple-group--disabled) {\r\n background: $grey_10;\r\n }\r\n\r\n &.sd-select-multiple-group--disabled {\r\n cursor: not-allowed;\r\n background-color: $grey_20;\r\n border-color: $grey_45;\r\n\r\n .sd-select-multiple-group__label {\r\n border-right: 1px solid $grey_45;\r\n }\r\n\r\n .sd-select-multiple-group__trigger {\r\n color: $grey_65;\r\n &:focus,\r\n &:focus-visible,\r\n &:focus-within {\r\n outline: none !important;\r\n }\r\n }\r\n }\r\n\r\n &__label {\r\n font-size: 12px;\r\n font-weight: 500;\r\n color: $grey_90;\r\n padding: 4px 12px;\r\n border-right: 1px solid $grey_45;\r\n border-radius: 4px 0 0 4px;\r\n background-color: $grey_10;\r\n }\r\n\r\n &__container {\r\n position: relative;\r\n width: 100%;\r\n display: flex;\r\n\r\n .sd-select-multiple-group__trigger {\r\n padding: 4px 20px 4px 12px;\r\n display: flex;\r\n width: 100%;\r\n align-items: center;\r\n\r\n .sd-select-multiple-group__value {\r\n flex: 1;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n line-height: 20px;\r\n font-size: 12px;\r\n font-weight: 400;\r\n }\r\n\r\n .sd-select-multiple-group__clear {\r\n margin: 0 4px;\r\n width: 8px;\r\n height: 8px;\r\n background-color: transparent;\r\n outline: none;\r\n border: none;\r\n }\r\n }\r\n\r\n .sd-select-multiple-group__arrow {\r\n position: absolute;\r\n top: 8px;\r\n right: 8px;\r\n width: 12px;\r\n height: 12px;\r\n color: $grey_65;\r\n transition: transform 0.3s ease;\r\n\r\n &--open {\r\n transform: rotate(180deg);\r\n }\r\n }\r\n }\r\n }\r\n}\r\n\r\n.sd-select-multiple-group__dropdown {\r\n @extend %scrollBar;\r\n width: var(--select-width, 200px);\r\n max-height: var(--select-dropdown-height, 260px);\r\n padding-bottom: 2px;\r\n background-color: white;\r\n box-shadow: 2px 2px 12px 2px rgba(0, 0, 0, 0.1);\r\n border-radius: 4px;\r\n overflow-y: auto;\r\n color: $grey_90;\r\n opacity: 0.5;\r\n transition: opacity 0.15s ease-in;\r\n\r\n &--ready {\r\n opacity: 1;\r\n }\r\n\r\n .sd-select-multiple-group__search-container {\r\n position: sticky;\r\n top: 0;\r\n display: flex;\r\n width: 100%;\r\n background-color: white;\r\n align-items: center;\r\n padding: 4px 8px;\r\n\r\n sd-input {\r\n width: 100%;\r\n }\r\n\r\n &--scrolled {\r\n box-shadow: 2px 2px 8px 2px rgba(0, 0, 0, 0.2);\r\n }\r\n }\r\n\r\n .sd-select-multiple-group__option-placeholder {\r\n padding: 4px 12px;\r\n font-size: 12px;\r\n line-height: 20px;\r\n }\r\n}\r\n","import {\r\n Component,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n Fragment,\r\n Host,\r\n Method,\r\n Prop,\r\n State,\r\n Watch,\r\n h,\r\n} from '@stencil/core';\r\nimport { BaseDropdownEvent } from '../../utils/base-dropdown-event';\r\nimport { SelectMultipleEvents, SelectOption, SelectStyleProps } from '../sd-select/sd-select';\r\nimport { SelectKeyboardNavigation } from '../../utils/select-keyboard-navigation';\r\n\r\nexport interface SelectOptionGroup extends SelectOption {\r\n type: 'group' | 'subgroup' | 'item' | 'all';\r\n parent?: string;\r\n}\r\n\r\n@Component({\r\n tag: 'sd-select-multiple-group',\r\n styleUrl: 'sd-select-multiple-group.scss',\r\n})\r\nexport class SdSelectMultipleGroup extends BaseDropdownEvent {\r\n @Element() el!: HTMLElement;\r\n\r\n // props\r\n @Prop({ mutable: true }) value: SelectOptionGroup[] | null = null;\r\n @Prop() label: string = '';\r\n @Prop({ mutable: true }) options: SelectOptionGroup[] = [];\r\n @Prop() placeholder: string = '선택';\r\n @Prop() optionPlaceholder: string = '옵션이 없습니다.';\r\n @Prop() width: string = '200px';\r\n @Prop() dropdownHeight: string = '260px';\r\n @Prop() disabled: boolean = false;\r\n @Prop() clearable: boolean = false;\r\n @Prop() searchable: boolean = false;\r\n @Prop() useCheckbox: boolean = false;\r\n @Prop() useAll: boolean = false;\r\n @Prop() allCheckedLabel = '전체';\r\n @Prop() allCheckOptionLabel = '전체';\r\n\r\n // props - custom styles\r\n @Prop() containerStyle: SelectStyleProps['containerStyle'] = {};\r\n @Prop() triggerStyle: SelectStyleProps['triggerStyle'] = {};\r\n @Prop() dropdownStyle: SelectStyleProps['dropdownStyle'] = {};\r\n @Prop() optionStyle: SelectStyleProps['optionStyle'] = {};\r\n @Prop() labelStyle: SelectStyleProps['labelStyle'] = {};\r\n\r\n // props - custom slots\r\n @Prop() optionRenderer?: (option: SelectOption, index: number, isSelected: boolean) => any;\r\n\r\n // states\r\n @State() filteredOptions = this.options;\r\n @State() isOpen: boolean = false;\r\n @State() searchText: string | null = null;\r\n @State() itemIndex: number = -1;\r\n @State() isScrolled: boolean = false;\r\n @State() isDropdownReady: boolean = false;\r\n\r\n // events\r\n @Event() sdChange?: EventEmitter<SelectMultipleEvents['sdChange']>;\r\n @Event() dropDownShow?: EventEmitter<SelectMultipleEvents['dropDownShow']>;\r\n\r\n private selectRef?: HTMLElement;\r\n private searchRef?: HTMLSdInputElement;\r\n private optionRef?: HTMLSdSelectOptionGroupElement;\r\n private dropdownRef?: HTMLElement;\r\n\r\n @Watch('value')\r\n valueChanged() {\r\n this.sdChange?.emit(this.value);\r\n }\r\n\r\n @Watch('options')\r\n optionsChanged() {\r\n this.filteredOptions = this.options;\r\n this.filterOptions();\r\n }\r\n\r\n @Watch('searchText')\r\n searchTextChanged() {\r\n this.filterOptions();\r\n }\r\n\r\n @Watch('itemIndex')\r\n async itemIndexChanged(newIndex: number, oldIndex: number) {\r\n if (this.searchable) {\r\n const searchInput = await this.getNativeInputElement();\r\n if (this.itemIndex === -1) {\r\n searchInput?.focus({ preventScroll: true });\r\n return;\r\n } else if (searchInput?.matches(':focus')) {\r\n searchInput?.blur();\r\n }\r\n }\r\n\r\n const optionElements = Array.from(\r\n this.dropdownRef?.querySelectorAll('sd-select-option-group') || [],\r\n );\r\n\r\n // useAll 사용시 \"전체\" 옵션 포함한 인덱스 사용\r\n const actualIndex = this.useAll ? this.itemIndex + 1 : this.itemIndex;\r\n const currentItem = optionElements?.[actualIndex];\r\n\r\n if (!currentItem || !this.isOpen) return;\r\n\r\n this.optionRef = currentItem as HTMLSdSelectOptionGroupElement;\r\n const isOptionDisabled = await this.optionRef.isDisabled();\r\n\r\n if (isOptionDisabled) {\r\n newIndex > oldIndex ? this.itemIndex++ : this.itemIndex--;\r\n return;\r\n }\r\n\r\n this.scrollToOption(currentItem as HTMLElement);\r\n }\r\n\r\n @Watch('isOpen')\r\n async isOpenChanged() {\r\n // Base class의 이벤트 관리 호출 - 다른 select와의 이벤트 충돌 방지\r\n this.onDropdownToggle(this.isOpen);\r\n this.dropDownShow?.emit({ isOpen: this.isOpen });\r\n this.isDropdownReady = false;\r\n\r\n if (this.isOpen === false) {\r\n return;\r\n }\r\n\r\n // DOM 렌더링을 기다리기 위해 이중 requestAnimationFrame 사용 - (레이아웃/스타일 계산 - 페인트 이후)\r\n requestAnimationFrame(() => {\r\n requestAnimationFrame(async () => {\r\n const selectedOptions = this.getSelectedOption();\r\n\r\n // 선택된 옵션이 있으면 첫 번째 선택된 항목으로 스크롤\r\n if (selectedOptions && selectedOptions.length > 0) {\r\n const selectedIndex = this.options.indexOf(selectedOptions[0]);\r\n const optionElements = Array.from(\r\n this.dropdownRef?.querySelectorAll('sd-select-option-group') || [],\r\n );\r\n\r\n // useAll 사용시 \"전체\" 옵션 포함한 인덱스 사용\r\n const actualIndex = this.useAll ? selectedIndex + 1 : selectedIndex;\r\n // 선택된 옵션이 화면 가운데에 오도록 index 조정\r\n const targetIndex = Math.min(actualIndex + 4, optionElements.length - 1);\r\n const currentItem = optionElements?.[targetIndex];\r\n\r\n if (currentItem) {\r\n this.scrollToOption(currentItem as HTMLElement);\r\n }\r\n }\r\n\r\n this.isDropdownReady = true;\r\n\r\n if (this.searchable) {\r\n const searchInput = await this.getNativeInputElement();\r\n\r\n if (searchInput) {\r\n requestAnimationFrame(() => {\r\n searchInput.focus({ preventScroll: true });\r\n });\r\n }\r\n }\r\n });\r\n });\r\n }\r\n\r\n @Method()\r\n async open(): Promise<void> {\r\n await new Promise(resolve => setTimeout(resolve, 0));\r\n this.isOpen = true;\r\n }\r\n\r\n componentWillLoad() {\r\n // props가 모두 설정된 후에 실행되므로 올바른 options 값을 가져올 수 있음\r\n this.filteredOptions = this.options;\r\n this.initializeEvent(); // global dropdown Manager에 등록 + 이벤트 핸들러 초기화\r\n }\r\n\r\n disconnectedCallback() {\r\n this.cleanupEvent(); // global dropdown Manager에서 제거 + 이벤트 정리\r\n }\r\n\r\n protected handleDocumentClick(event: Event): void {\r\n if (!this.selectRef?.contains(event.target as Node)) {\r\n this.isOpen = false;\r\n }\r\n }\r\n\r\n protected handleDocumentKeydown(keyboardEvent: KeyboardEvent): void {\r\n keyboardEvent.stopPropagation();\r\n const targetKey = ['ArrowDown', 'ArrowUp', 'Enter', 'Escape'];\r\n if (!targetKey.includes(keyboardEvent.key)) return;\r\n\r\n keyboardEvent.preventDefault();\r\n switch (keyboardEvent.key) {\r\n case 'ArrowDown':\r\n case 'ArrowUp':\r\n const keyboardNavigation = new SelectKeyboardNavigation(this.searchable, this.filteredOptions);\r\n const nextIndex = keyboardNavigation.getNextIndex(this.itemIndex, keyboardEvent.key);\r\n this.itemIndex = nextIndex;\r\n break;\r\n case 'Enter':\r\n const selectedOption = this.filteredOptions[this.itemIndex];\r\n if (selectedOption && !selectedOption.disabled) {\r\n this.handleOptionSelection(selectedOption);\r\n }\r\n break;\r\n case 'Escape':\r\n this.isOpen = false;\r\n break;\r\n }\r\n }\r\n\r\n // event handlers\r\n handleTriggerClick = (event: Event) => {\r\n event.stopPropagation();\r\n\r\n if (!this.disabled) {\r\n this.isOpen = !this.isOpen;\r\n this.dropDownShow?.emit({ isOpen: this.isOpen });\r\n }\r\n };\r\n\r\n handleAllOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n }) => {\r\n if (detail.isSelected) {\r\n // 이미 선택된 옵션인 경우, 선택 해제\r\n const filterDisabledOptions = this.filteredOptions.filter(\r\n opt => opt.type === 'item' && !opt.disabled,\r\n );\r\n this.value =\r\n this.value?.filter(\r\n selected => !filterDisabledOptions.some(opt => opt.value === selected.value),\r\n ) || this.value;\r\n } else {\r\n // 새로운 옵션 선택\r\n const valueSet = new Set([\r\n ...(this.value || []),\r\n ...this.filteredOptions.filter(opt => opt.type === 'item' && !opt.disabled),\r\n ]);\r\n this.value = Array.from(valueSet);\r\n }\r\n };\r\n\r\n handleOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n }) => {\r\n const { option, event } = detail;\r\n event.stopPropagation();\r\n\r\n if (option.type === 'group') this.handleGroupOptionClick(detail);\r\n if (option.type === 'subgroup') this.handleSubGroupOptionClick(detail);\r\n if (option.type === 'item') this.handleOptionSelection(option);\r\n };\r\n\r\n handleGroupOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n }) => {\r\n const { option, isSelected } = detail;\r\n const childOptions = this.filteredOptions.filter(\r\n opt => opt.parent === option.value && !opt.disabled,\r\n );\r\n\r\n childOptions.forEach(subgroup => {\r\n this.handleSubGroupOptionClick({\r\n option: subgroup,\r\n isSelected: isSelected || isSelected === null,\r\n });\r\n });\r\n };\r\n\r\n handleSubGroupOptionClick = (detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n }) => {\r\n const { option, isSelected } = detail;\r\n\r\n const childOptions = this.filteredOptions.filter(\r\n opt => opt.parent === option.value && !opt.disabled,\r\n );\r\n\r\n if (isSelected || isSelected === null) {\r\n // 모든 자식 옵션이 선택된 경우, 모두 선택 해제\r\n this.value =\r\n this.value?.filter(selected => !childOptions.some(child => child.value === selected.value)) ||\r\n null;\r\n } else {\r\n // 일부 또는 전체 자식 옵션이 선택되지 않은 경우, 모두 선택\r\n const newSelections = childOptions.filter(\r\n child => !this.value?.some(selected => selected.value === child.value),\r\n );\r\n this.value = [...(this.value || []), ...newSelections];\r\n }\r\n };\r\n\r\n private filterOptions() {\r\n if (!this.searchText || this.searchText.trim() === '') {\r\n // 검색어가 없으면 전체 옵션 표시\r\n this.filteredOptions = this.options;\r\n return;\r\n }\r\n\r\n const searchTerm = this.searchText.toLowerCase();\r\n const matchedOptions = new Set<SelectOptionGroup>();\r\n\r\n // 1. 직접 매칭되는 옵션들 찾기\r\n this.options.forEach(option => {\r\n if (option.label.toLowerCase().includes(searchTerm)) {\r\n matchedOptions.add(option);\r\n\r\n // 매칭된 옵션의 상위 그룹들도 포함\r\n this.addParentGroups(option, matchedOptions);\r\n }\r\n });\r\n\r\n // 2. Set을 배열로 변환하고 원본 순서 유지\r\n this.filteredOptions = this.options.filter(option => matchedOptions.has(option));\r\n }\r\n\r\n private addParentGroups(option: SelectOptionGroup, matchedSet: Set<SelectOptionGroup>) {\r\n if (!option.parent) return;\r\n\r\n const parentOption = this.options.find(opt => opt.value === option.parent);\r\n if (parentOption && !matchedSet.has(parentOption)) {\r\n matchedSet.add(parentOption);\r\n // 재귀적으로 상위 그룹들도 추가\r\n this.addParentGroups(parentOption, matchedSet);\r\n }\r\n }\r\n\r\n private getSelectedOption(): SelectOptionGroup[] {\r\n return this.options.filter(option => this.value?.includes(option));\r\n }\r\n\r\n private handleDropdownScroll = (event: Event) => {\r\n const target = event.target as HTMLElement;\r\n const scrollTop = target.scrollTop;\r\n\r\n // 스크롤이 조금이라도 되면 그림자 표시\r\n this.isScrolled = scrollTop > 0;\r\n };\r\n\r\n private async getNativeInputElement(): Promise<HTMLInputElement | null> {\r\n if (this.searchRef) {\r\n return this.searchRef.getNativeElement();\r\n }\r\n return null;\r\n }\r\n\r\n private handleOptionSelection = (option: SelectOptionGroup) => {\r\n if (!option || option.disabled) return;\r\n\r\n const isAlreadySelected = this.value?.some(opt => opt.value === option.value);\r\n if (isAlreadySelected) {\r\n // 이미 선택된 옵션인 경우, 선택 해제\r\n this.value = this.value?.filter(opt => opt.value !== option.value) || null;\r\n } else {\r\n // 새로운 옵션 선택\r\n this.value = [...(this.value || []), option];\r\n }\r\n };\r\n\r\n private getAllItemsUnderOption(\r\n parentOption: SelectOptionGroup,\r\n includeDisabled: boolean = false,\r\n ): SelectOptionGroup[] {\r\n const filterChildrenWithParent = (option: SelectOptionGroup) =>\r\n option.parent === parentOption.value && (includeDisabled || !option.disabled);\r\n\r\n if (parentOption.type === 'subgroup') {\r\n return this.filteredOptions.filter(\r\n option => filterChildrenWithParent(option) && option.type === 'item',\r\n );\r\n }\r\n\r\n const allItems: SelectOptionGroup[] = [];\r\n const childOptions = this.filteredOptions.filter(filterChildrenWithParent);\r\n const subgroupOptions = childOptions.filter(option => option.type === 'subgroup');\r\n subgroupOptions.forEach(subgroup => {\r\n const itemsUnderSubgroup = this.filteredOptions.filter(\r\n option =>\r\n option.parent === subgroup.value &&\r\n option.type === 'item' &&\r\n (includeDisabled ? true : !option.disabled),\r\n );\r\n allItems.push(...itemsUnderSubgroup);\r\n });\r\n const directItems = childOptions.filter(option => option.type === 'item');\r\n allItems.push(...directItems);\r\n\r\n return allItems;\r\n }\r\n\r\n private isAllChildrenSelected(groupOption: SelectOptionGroup): boolean | null {\r\n const allItems = this.getAllItemsUnderOption(groupOption);\r\n\r\n if (allItems.length === 0) return false;\r\n\r\n const selectedItems = allItems.filter(item =>\r\n this.value?.some(selected => selected.value === item.value),\r\n );\r\n\r\n if (selectedItems.length === allItems.length) return true;\r\n if (selectedItems.length > 0) return null;\r\n return false;\r\n }\r\n\r\n private getChildrenOptions(parentOption: SelectOptionGroup) {\r\n const allItems = this.getAllItemsUnderOption(parentOption, true);\r\n const selectedCount = allItems.filter(item =>\r\n this.value?.some(val => val.value === item.value),\r\n ).length;\r\n\r\n return {\r\n selectedCount,\r\n totalCount: allItems.length,\r\n };\r\n }\r\n\r\n private isAllOptionsSelected(): boolean {\r\n if (!this.value || this.value.length === 0) return false;\r\n\r\n const selectableItems = this.options.filter(opt => opt.type === 'item' && !opt.disabled);\r\n\r\n if (selectableItems.length === 0) return false;\r\n\r\n const selectedValues = new Set(this.value.map(v => v.value));\r\n return selectableItems.every(option => selectedValues.has(option.value));\r\n }\r\n\r\n private getTriggerLabel() {\r\n const selectedOption = this.getSelectedOption();\r\n if (!selectedOption) return '선택';\r\n\r\n if (selectedOption.length === 0) return this.placeholder;\r\n\r\n const isAllChecked = this.isAllOptionsSelected();\r\n\r\n return isAllChecked\r\n ? this.allCheckedLabel\r\n : selectedOption.map(option => option.label).join(', ');\r\n }\r\n\r\n closeDropdown() {\r\n this.isOpen = false;\r\n }\r\n\r\n private async scrollToOption(optionElement: HTMLElement) {\r\n if (!this.dropdownRef || !optionElement) return;\r\n\r\n requestAnimationFrame(() => {\r\n const dropdown = this.dropdownRef;\r\n const optionTop = optionElement.offsetTop;\r\n const optionHeight = optionElement.offsetHeight;\r\n const dropdownScrollTop = dropdown!.scrollTop;\r\n const dropdownHeight = dropdown!.clientHeight;\r\n\r\n const searchContainer = dropdown!.querySelector('.sd-select-multiple-group__search-container');\r\n const searchOffset = searchContainer ? (searchContainer as HTMLElement).offsetHeight : 0;\r\n\r\n const visibleContentHeight = dropdownHeight - searchOffset;\r\n const visibleTop = dropdownScrollTop + searchOffset;\r\n const visibleBottom = dropdownScrollTop + dropdownHeight;\r\n\r\n if (optionTop < visibleTop) {\r\n dropdown!.scrollTo({ top: optionTop - searchOffset, behavior: 'instant' });\r\n } else if (optionTop + optionHeight > visibleBottom) {\r\n dropdown!.scrollTo({\r\n top: optionTop + optionHeight - visibleContentHeight - searchOffset,\r\n behavior: 'instant',\r\n });\r\n }\r\n });\r\n }\r\n\r\n render() {\r\n const style = {\r\n '--select-width': this.width || '200px',\r\n '--select-dropdown-height': this.dropdownHeight || '260px',\r\n };\r\n\r\n return (\r\n <Host style={style}>\r\n <div\r\n class={{\r\n 'sd-select-multiple-group': true,\r\n 'sd-select-multiple-group--open': this.isOpen,\r\n 'sd-select-multiple-group--disabled': this.disabled,\r\n }}\r\n style={this.containerStyle}\r\n ref={el => (this.selectRef = el)}\r\n >\r\n {this.renderLabel(this.label, this.labelStyle)}\r\n <div class=\"sd-select-multiple-group__container\">\r\n {this.renderTrigger()}\r\n {this.renderDropdown()}\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n\r\n private renderLabel(label?: string, labelStyle?: { [key: string]: string }) {\r\n if (!label) return null;\r\n\r\n return (\r\n <label class=\"sd-select-multiple-group__label\" style={labelStyle}>\r\n {label}\r\n </label>\r\n );\r\n }\r\n\r\n private renderTrigger() {\r\n const selectedOption = this.getSelectedOption();\r\n return (\r\n <div\r\n class=\"sd-select-multiple-group__trigger\"\r\n tabindex={this.disabled ? -1 : 0}\r\n onClick={this.handleTriggerClick}\r\n style={this.triggerStyle}\r\n >\r\n <span class=\"sd-select-multiple-group__value\">{this.getTriggerLabel()}</span>\r\n {this.clearable && selectedOption?.length > 0 && !this.disabled && (\r\n <sd-icon\r\n key=\"close-icon\"\r\n name=\"close\"\r\n size={10}\r\n color=\"#888\"\r\n class=\"sd-select-multiple-group__clear\"\r\n onClick={event => {\r\n event.stopPropagation();\r\n this.value = null;\r\n }}\r\n ></sd-icon>\r\n )}\r\n\r\n <sd-icon\r\n key=\"arrow-icon\"\r\n name=\"arrowDown\"\r\n color=\"#888\"\r\n class={{\r\n 'sd-select-multiple-group__arrow': true,\r\n 'sd-select-multiple-group__arrow--open': this.isOpen,\r\n }}\r\n ></sd-icon>\r\n </div>\r\n );\r\n }\r\n\r\n private renderDropdown() {\r\n const style = {\r\n '--select-width': this.width || '200px',\r\n '--select-dropdown-height': this.dropdownHeight || '260px',\r\n };\r\n\r\n if (this.isOpen === false) return null;\r\n\r\n return (\r\n <sd-portal open={this.isOpen} parentRef={this.selectRef} onSdClose={this.closeDropdown}>\r\n <div style={{ width: '0', height: '0', overflow: 'visible' }}>\r\n <div\r\n class={{\r\n 'sd-select-multiple-group__dropdown': true,\r\n 'sd-select-multiple-group__dropdown--ready': this.isDropdownReady,\r\n }}\r\n style={{ ...style, ...this.dropdownStyle }}\r\n onScroll={this.handleDropdownScroll}\r\n ref={el => (this.dropdownRef = el)}\r\n >\r\n {this.searchable && (\r\n <div\r\n class={{\r\n 'sd-select-multiple-group__search-container': true,\r\n 'sd-select-multiple-group__search-container--scrolled': this.isScrolled,\r\n }}\r\n onClick={event => event.stopPropagation()}\r\n >\r\n <sd-input\r\n ref={el => (this.searchRef = el)}\r\n value={this.searchText}\r\n placeholder=\"검색\"\r\n clearable\r\n inputStyle={{ 'padding-left': '8px' }}\r\n autofocus\r\n onSdInput={event => {\r\n this.searchText = String(event?.detail);\r\n }}\r\n onSdFocus={() => {\r\n this.itemIndex = -1;\r\n }}\r\n onKeyDown={e => {\r\n if (e.code === 'Enter') e.stopPropagation();\r\n }}\r\n >\r\n <sd-icon name=\"search\" size={16} color=\"#737373\" slot=\"prefix\"></sd-icon>\r\n </sd-input>\r\n </div>\r\n )}\r\n\r\n {this.filteredOptions.length > 0 ? (\r\n <Fragment>\r\n {this.useAll && (\r\n <sd-select-option-group\r\n option={{ label: this.allCheckOptionLabel, value: '', type: 'all' }}\r\n index={0}\r\n isSelected={this.isAllOptionsSelected()}\r\n isFocused={this.itemIndex === 0}\r\n optionStyle={this.optionStyle}\r\n onOptionClick={({\r\n detail,\r\n }: {\r\n detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n };\r\n }) => this.handleAllOptionClick(detail)}\r\n useCheckbox={this.useCheckbox}\r\n useIndicator={false}\r\n ></sd-select-option-group>\r\n )}\r\n {this.filteredOptions.map((option, index) => (\r\n <slot name={`option-${option.value}`}>\r\n <sd-select-option-group\r\n option={option}\r\n index={index}\r\n isSelected={\r\n option.type === 'item'\r\n ? this.value?.some(selected => selected.value === option.value)\r\n : this.isAllChildrenSelected(option)\r\n }\r\n isFocused={index === this.itemIndex}\r\n optionStyle={this.optionStyle}\r\n onOptionClick={({\r\n detail,\r\n }: {\r\n detail: {\r\n option: SelectOptionGroup;\r\n isSelected: boolean | null;\r\n index: number;\r\n event: MouseEvent;\r\n };\r\n }) => {\r\n if (option.type !== 'item' && !this.useCheckbox) {\r\n return;\r\n }\r\n\r\n this.handleOptionClick(detail);\r\n }}\r\n useCheckbox={this.useCheckbox}\r\n {...(option.type !== 'item' && { countInfo: this.getChildrenOptions(option) })}\r\n ></sd-select-option-group>\r\n </slot>\r\n ))}\r\n </Fragment>\r\n ) : (\r\n <slot name=\"option-placeholder\">\r\n <div class={'sd-select-multiple-group__option-placeholder'} style={this.optionStyle}>\r\n {this.optionPlaceholder}\r\n </div>\r\n </slot>\r\n )}\r\n </div>\r\n </div>\r\n </sd-portal>\r\n );\r\n }\r\n}\r\n"],"version":3}
@@ -3,8 +3,8 @@ import { B as BaseDropdownEvent, S as SelectKeyboardNavigation } from './p-B3H_u
3
3
  import { d as defineCustomElement$6 } from './p-C7kMNSz9.js';
4
4
  import { d as defineCustomElement$5 } from './p-CV5tKC24.js';
5
5
  import { d as defineCustomElement$4 } from './p-DY9yCaP9.js';
6
- import { d as defineCustomElement$3 } from './p-CYadUxId.js';
7
- import { d as defineCustomElement$2 } from './p-j-ZEdgz4.js';
6
+ import { d as defineCustomElement$3 } from './p-BBNolp5g.js';
7
+ import { d as defineCustomElement$2 } from './p-GHGGjwP3.js';
8
8
 
9
9
  const sdSelectMultipleCss = () => `.sd-select-multiple__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select-multiple__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select-multiple__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select-multiple__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select-multiple__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select-multiple__dropdown::-webkit-scrollbar-track{background-color:transparent}:host{display:inline-block;height:fit-content;position:relative}.sd-select-multiple{display:flex;flex-wrap:nowrap;width:var(--select-width, 200px);height:28px;cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white}.sd-select-multiple:hover:not(.sd-select-multiple--disabled){background:#f6f6f6}.sd-select-multiple.sd-select-multiple--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__label{border-right:1px solid #cccccc}.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger{color:#888888}.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger:focus,.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger:focus-visible,.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger:focus-within{outline:none !important}.sd-select-multiple__label{font-size:12px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6}.sd-select-multiple__container{position:relative;width:100%;display:flex}.sd-select-multiple__container .sd-select-multiple__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}.sd-select-multiple__container .sd-select-multiple__trigger .sd-select-multiple__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400}.sd-select-multiple__container .sd-select-multiple__trigger .sd-select-multiple__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}.sd-select-multiple__container .sd-select-multiple__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}.sd-select-multiple__container .sd-select-multiple__arrow--open{transform:rotate(180deg)}.sd-select-multiple__dropdown{width:var(--select-dropdown-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333}.sd-select-multiple__dropdown .sd-select-multiple__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px;z-index:1}.sd-select-multiple__dropdown .sd-select-multiple__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select-multiple__dropdown .sd-select-multiple__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px;text-align:left}`;
10
10
 
@@ -223,11 +223,11 @@ const SdSelectMultiple$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectMultip
223
223
  '--select-width': this.width || '200px',
224
224
  '--select-dropdown-height': this.dropdownHeight || '260px',
225
225
  };
226
- return (h(Host, { key: '24d4287067a9706099a20c46abee2d25a8271c1c', style: style }, h("div", { key: '8b6f63ea974841ded9607c592d2c866a32bdccdf', class: {
226
+ return (h(Host, { key: 'b80f1d57e87db4e921436b726cfeac4618a13d6b', style: style }, h("div", { key: '43ae0ae2ec83cef2cad1ae59764b5463bb66eda0', class: {
227
227
  'sd-select-multiple': true,
228
228
  'sd-select-multiple--open': this.isOpen,
229
229
  'sd-select-multiple--disabled': this.disabled,
230
- }, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), h("div", { key: '2d35e79a95e5cd2ec8b055ca4d7a38e70ac13936', class: "sd-select-multiple__container" }, this.renderTrigger(), this.renderDropdown()))));
230
+ }, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), h("div", { key: '8802336bea4e78aa6ccf1a567d238005ff58c29b', class: "sd-select-multiple__container" }, this.renderTrigger(), this.renderDropdown()))));
231
231
  }
232
232
  renderLabel(label) {
233
233
  if (!label)
@@ -1,4 +1,4 @@
1
- import { S as SdSelectOptionGroup$1, d as defineCustomElement$1 } from './p-71Aop19u.js';
1
+ import { S as SdSelectOptionGroup$1, d as defineCustomElement$1 } from './p-BH3t01Im.js';
2
2
 
3
3
  const SdSelectOptionGroup = SdSelectOptionGroup$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { S as SdSelectOption$1, d as defineCustomElement$1 } from './p-j-ZEdgz4.js';
1
+ import { S as SdSelectOption$1, d as defineCustomElement$1 } from './p-GHGGjwP3.js';
2
2
 
3
3
  const SdSelectOption = SdSelectOption$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -1,4 +1,4 @@
1
- import { S as SdSelect$1, d as defineCustomElement$1 } from './p-B13lOU0D.js';
1
+ import { S as SdSelect$1, d as defineCustomElement$1 } from './p-C5T02a4h.js';
2
2
 
3
3
  const SdSelect = SdSelect$1;
4
4
  const defineCustomElement = defineCustomElement$1;