@j-solution/components 1.6.0 → 1.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -7
- package/assets/jwms-portal-frontend-CwxPfHfa.css +1 -0
- package/assets/styles/j-components.css +1 -1
- package/assets/styles/themes.css +107 -0
- package/components/atoms/JAvatar.vue.cjs +1 -1
- package/components/atoms/JAvatar.vue.cjs.map +1 -1
- package/components/atoms/JAvatar.vue.js +10 -7
- package/components/atoms/JAvatar.vue.js.map +1 -1
- package/components/atoms/JBadge.vue.cjs +1 -1
- package/components/atoms/JBadge.vue.cjs.map +1 -1
- package/components/atoms/JBadge.vue.js +7 -6
- package/components/atoms/JBadge.vue.js.map +1 -1
- package/components/atoms/JButton.vue.cjs +1 -1
- package/components/atoms/JButton.vue.cjs.map +1 -1
- package/components/atoms/JButton.vue.js +5 -5
- package/components/atoms/JButton.vue.js.map +1 -1
- package/components/atoms/JDatepicker.vue.cjs +1 -1
- package/components/atoms/JDatepicker.vue.cjs.map +1 -1
- package/components/atoms/JDatepicker.vue.js +10 -10
- package/components/atoms/JDatepicker.vue.js.map +1 -1
- package/components/atoms/JEditor.vue.cjs +1 -1
- package/components/atoms/JEditor.vue.js +1 -1
- package/components/atoms/JEditor.vue2.cjs +1 -1
- package/components/atoms/JEditor.vue2.cjs.map +1 -1
- package/components/atoms/JEditor.vue2.js +31 -17
- package/components/atoms/JEditor.vue2.js.map +1 -1
- package/components/atoms/JGrid.vue.cjs +1 -1
- package/components/atoms/JGrid.vue.js +2 -2
- package/components/atoms/JGrid.vue2.cjs +1 -1
- package/components/atoms/JGrid.vue2.cjs.map +1 -1
- package/components/atoms/JGrid.vue2.js +45 -33
- package/components/atoms/JGrid.vue2.js.map +1 -1
- package/components/atoms/JIcon.vue.cjs +1 -1
- package/components/atoms/JIcon.vue.cjs.map +1 -1
- package/components/atoms/JIcon.vue.js +14 -13
- package/components/atoms/JIcon.vue.js.map +1 -1
- package/components/atoms/JKbd.vue.cjs +1 -1
- package/components/atoms/JKbd.vue.cjs.map +1 -1
- package/components/atoms/JKbd.vue.js +13 -10
- package/components/atoms/JKbd.vue.js.map +1 -1
- package/components/atoms/JLabel.vue.cjs +1 -1
- package/components/atoms/JLabel.vue.cjs.map +1 -1
- package/components/atoms/JLabel.vue.js +4 -4
- package/components/atoms/JLabel.vue.js.map +1 -1
- package/components/atoms/JLink.vue.cjs +1 -1
- package/components/atoms/JLink.vue.cjs.map +1 -1
- package/components/atoms/JLink.vue.js +5 -5
- package/components/atoms/JLink.vue.js.map +1 -1
- package/components/atoms/JPreview.vue.cjs +1 -1
- package/components/atoms/JPreview.vue.js +2 -2
- package/components/atoms/JPreview.vue2.cjs +1 -1
- package/components/atoms/JPreview.vue2.cjs.map +1 -1
- package/components/atoms/JPreview.vue2.js +33 -20
- package/components/atoms/JPreview.vue2.js.map +1 -1
- package/components/atoms/JProgress.vue.cjs +1 -1
- package/components/atoms/JProgress.vue.cjs.map +1 -1
- package/components/atoms/JProgress.vue.js +15 -9
- package/components/atoms/JProgress.vue.js.map +1 -1
- package/components/atoms/JRadio.vue.cjs +1 -1
- package/components/atoms/JRadio.vue.cjs.map +1 -1
- package/components/atoms/JRadio.vue.js +1 -1
- package/components/atoms/JRadio.vue.js.map +1 -1
- package/components/atoms/JSearchCombo.vue.cjs +1 -1
- package/components/atoms/JSearchCombo.vue.cjs.map +1 -1
- package/components/atoms/JSearchCombo.vue.js +38 -37
- package/components/atoms/JSearchCombo.vue.js.map +1 -1
- package/components/atoms/JSpinner.vue.cjs +1 -1
- package/components/atoms/JSpinner.vue.cjs.map +1 -1
- package/components/atoms/JSpinner.vue.js +8 -7
- package/components/atoms/JSpinner.vue.js.map +1 -1
- package/components/atoms/JSplitter.vue.cjs +1 -1
- package/components/atoms/JSplitter.vue.cjs.map +1 -1
- package/components/atoms/JSplitter.vue.js +32 -27
- package/components/atoms/JSplitter.vue.js.map +1 -1
- package/components/atoms/JTooltip.vue.cjs +1 -1
- package/components/atoms/JTooltip.vue.cjs.map +1 -1
- package/components/atoms/JTooltip.vue.js +18 -15
- package/components/atoms/JTooltip.vue.js.map +1 -1
- package/components/examples/ExampleCrudPage.vue.cjs +2 -0
- package/components/examples/ExampleCrudPage.vue.cjs.map +1 -0
- package/components/examples/ExampleCrudPage.vue.js +358 -0
- package/components/examples/ExampleCrudPage.vue.js.map +1 -0
- package/components/examples/ExampleCrudPage.vue2.cjs +2 -0
- package/components/examples/ExampleCrudPage.vue2.cjs.map +1 -0
- package/components/examples/ExampleCrudPage.vue2.js +5 -0
- package/components/examples/ExampleCrudPage.vue2.js.map +1 -0
- package/components/examples/ExampleTabMappingPage.vue.cjs +2 -0
- package/components/examples/ExampleTabMappingPage.vue.cjs.map +1 -0
- package/components/examples/ExampleTabMappingPage.vue.js +522 -0
- package/components/examples/ExampleTabMappingPage.vue.js.map +1 -0
- package/components/examples/ExampleTabMappingPage.vue2.cjs +2 -0
- package/components/examples/ExampleTabMappingPage.vue2.cjs.map +1 -0
- package/components/examples/ExampleTabMappingPage.vue2.js +5 -0
- package/components/examples/ExampleTabMappingPage.vue2.js.map +1 -0
- package/components/molecules/JBreadcrumb.vue.cjs +1 -1
- package/components/molecules/JBreadcrumb.vue.cjs.map +1 -1
- package/components/molecules/JBreadcrumb.vue.js +3 -3
- package/components/molecules/JBreadcrumb.vue.js.map +1 -1
- package/components/molecules/JFormField.vue.cjs +1 -1
- package/components/molecules/JFormField.vue.cjs.map +1 -1
- package/components/molecules/JFormField.vue.js +26 -24
- package/components/molecules/JFormField.vue.js.map +1 -1
- package/components/molecules/JTabs.vue.cjs +1 -1
- package/components/molecules/JTabs.vue.js +1 -1
- package/components/molecules/JTabs.vue2.cjs +1 -1
- package/components/molecules/JTabs.vue2.cjs.map +1 -1
- package/components/molecules/JTabs.vue2.js +7 -7
- package/components/molecules/JTabs.vue2.js.map +1 -1
- package/components/molecules/JTitlebar.vue.cjs +1 -1
- package/components/molecules/JTitlebar.vue.cjs.map +1 -1
- package/components/molecules/JTitlebar.vue.js +35 -36
- package/components/molecules/JTitlebar.vue.js.map +1 -1
- package/components/organisms/JFilterBar.vue.cjs +1 -1
- package/components/organisms/JFilterBar.vue.cjs.map +1 -1
- package/components/organisms/JFilterBar.vue.js +5 -5
- package/components/organisms/JFilterBar.vue.js.map +1 -1
- package/components/organisms/JHeader.vue.cjs +1 -1
- package/components/organisms/JHeader.vue.cjs.map +1 -1
- package/components/organisms/JHeader.vue.js +25 -23
- package/components/organisms/JHeader.vue.js.map +1 -1
- package/components/organisms/JModal.vue.cjs +1 -1
- package/components/organisms/JModal.vue.cjs.map +1 -1
- package/components/organisms/JModal.vue.js +30 -27
- package/components/organisms/JModal.vue.js.map +1 -1
- package/components/organisms/JSidebarAdvanced.vue.cjs +1 -1
- package/components/organisms/JSidebarAdvanced.vue.js +7 -7
- package/components/organisms/JSidebarAdvanced.vue2.cjs +1 -1
- package/components/organisms/JSidebarAdvanced.vue2.cjs.map +1 -1
- package/components/organisms/JSidebarAdvanced.vue2.js +40 -40
- package/components/organisms/JSidebarAdvanced.vue2.js.map +1 -1
- package/components/organisms/JSidebarSimple/JDynamicMenuItem.vue.cjs +1 -1
- package/components/organisms/JSidebarSimple/JDynamicMenuItem.vue.cjs.map +1 -1
- package/components/organisms/JSidebarSimple/JDynamicMenuItem.vue.js +83 -63
- package/components/organisms/JSidebarSimple/JDynamicMenuItem.vue.js.map +1 -1
- package/components/organisms/JSidebarSimple.vue.cjs +1 -1
- package/components/organisms/JSidebarSimple.vue.js +2 -2
- package/components/organisms/JSidebarSimple.vue2.cjs +1 -1
- package/components/organisms/JSidebarSimple.vue2.cjs.map +1 -1
- package/components/organisms/JSidebarSimple.vue2.js +2 -2
- package/components/organisms/JSidebarSimple.vue2.js.map +1 -1
- package/components/shadcn/AccordionTrigger.vue.cjs +1 -1
- package/components/shadcn/AccordionTrigger.vue.cjs.map +1 -1
- package/components/shadcn/AccordionTrigger.vue.js +3 -3
- package/components/shadcn/AccordionTrigger.vue.js.map +1 -1
- package/components/shadcn/CardContent.vue.cjs +1 -1
- package/components/shadcn/CardContent.vue.cjs.map +1 -1
- package/components/shadcn/CardContent.vue.js +1 -1
- package/components/shadcn/CardContent.vue.js.map +1 -1
- package/components/shadcn/CardDescription.vue.cjs +1 -1
- package/components/shadcn/CardDescription.vue.cjs.map +1 -1
- package/components/shadcn/CardDescription.vue.js +1 -1
- package/components/shadcn/CardDescription.vue.js.map +1 -1
- package/components/shadcn/CardFooter.vue.cjs +1 -1
- package/components/shadcn/CardFooter.vue.cjs.map +1 -1
- package/components/shadcn/CardFooter.vue.js +7 -7
- package/components/shadcn/CardFooter.vue.js.map +1 -1
- package/components/shadcn/CardHeader.vue.cjs +1 -1
- package/components/shadcn/CardHeader.vue.cjs.map +1 -1
- package/components/shadcn/CardHeader.vue.js +8 -8
- package/components/shadcn/CardHeader.vue.js.map +1 -1
- package/components/shadcn/CardTitle.vue.cjs +1 -1
- package/components/shadcn/CardTitle.vue.cjs.map +1 -1
- package/components/shadcn/CardTitle.vue.js +5 -5
- package/components/shadcn/CardTitle.vue.js.map +1 -1
- package/components/shadcn/Input.vue.cjs +1 -1
- package/components/shadcn/Input.vue.cjs.map +1 -1
- package/components/shadcn/Input.vue.js +1 -1
- package/components/shadcn/Input.vue.js.map +1 -1
- package/components/shadcn/SelectTrigger.vue.cjs +1 -1
- package/components/shadcn/SelectTrigger.vue.cjs.map +1 -1
- package/components/shadcn/SelectTrigger.vue.js +2 -2
- package/components/shadcn/SelectTrigger.vue.js.map +1 -1
- package/components/shadcn/Switch.vue.cjs +1 -1
- package/components/shadcn/Switch.vue.cjs.map +1 -1
- package/components/shadcn/Switch.vue.js +2 -2
- package/components/shadcn/Switch.vue.js.map +1 -1
- package/components/shadcn/TabsList.vue.cjs +1 -1
- package/components/shadcn/TabsList.vue.cjs.map +1 -1
- package/components/shadcn/TabsList.vue.js +1 -1
- package/components/shadcn/TabsList.vue.js.map +1 -1
- package/components/shadcn/TabsTrigger.vue.cjs +1 -1
- package/components/shadcn/TabsTrigger.vue.cjs.map +1 -1
- package/components/shadcn/TabsTrigger.vue.js +4 -4
- package/components/shadcn/TabsTrigger.vue.js.map +1 -1
- package/components/shadcn/Textarea.vue.cjs +1 -1
- package/components/shadcn/Textarea.vue.cjs.map +1 -1
- package/components/shadcn/Textarea.vue.js +2 -2
- package/components/shadcn/Textarea.vue.js.map +1 -1
- package/components/shadcn/index.cjs +1 -1
- package/components/shadcn/index.cjs.map +1 -1
- package/components/shadcn/index.js +8 -7
- package/components/shadcn/index.js.map +1 -1
- package/index.cjs +1 -1
- package/index.js +76 -72
- package/package.json +1 -1
- package/types/index.d.ts +742 -15
- package/assets/jwms-portal-frontend-DntSIcYt.css +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JRadio.vue.js","sources":["../../../../src/components/atoms/JRadio.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { RadioGroup, RadioGroupItem } from '@/components/shadcn'\r\n\r\nexport interface Option {\r\n value: string | number\r\n label: string\r\n disabled?: boolean\r\n}\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'primary' // 강조 스타일 (파랑)\r\n | 'success' // 성공 스타일 (초록)\r\n | 'danger' // 위험 스타일 (빨강)\r\n | 'sm' // 작은 크기\r\n | 'lg' // 큰 크기\r\n | 'horizontal' // 가로 배치\r\n | 'vertical' // 세로 배치\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n modelValue?: string | number\r\n options?: Option[]\r\n disabled?: boolean\r\n required?: boolean\r\n name?: string\r\n id?: string\r\n class?: string\r\n /** 스타일 프리셋 */\r\n styletype?: StyleType\r\n }>(),\r\n {\r\n options: () => [],\r\n disabled: false,\r\n required: false,\r\n styletype: 'default',\r\n },\r\n)\r\n\r\nconst emit = defineEmits<{\r\n 'update:modelValue': [value: string | number]\r\n 'change': [value: string | number]\r\n}>()\r\n\r\n/**\r\n * styletype -> class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { groupClass: string; itemClass: string }> = {\r\n default: { \r\n groupClass: '',\r\n itemClass: '',\r\n },\r\n primary: { \r\n groupClass: '',\r\n itemClass: 'border-blue-500 text-blue-500',\r\n },\r\n success: { \r\n groupClass: '',\r\n itemClass: 'border-green-500 text-green-600',\r\n },\r\n danger: { \r\n groupClass: '',\r\n itemClass: 'border-destructive text-destructive',\r\n },\r\n sm: { \r\n groupClass: '',\r\n itemClass: 'h-3.5 w-3.5',\r\n },\r\n lg: { \r\n groupClass: '',\r\n itemClass: 'h-5 w-5',\r\n },\r\n horizontal: { \r\n groupClass: 'flex flex-row gap-4',\r\n itemClass: '',\r\n },\r\n vertical: { \r\n groupClass: 'grid gap-2',\r\n itemClass: '',\r\n },\r\n}\r\n\r\nconst groupClass = computed(() => {\r\n const styleKey = props.styletype || 'default'\r\n const preset = STYLE_PRESETS[styleKey] ?? STYLE_PRESETS.default\r\n return [preset?.groupClass, props.class].filter(Boolean).join(' ')\r\n})\r\n\r\nconst itemClass = computed(() => {\r\n const styleKey = props.styletype || 'default'\r\n const preset = STYLE_PRESETS[styleKey] ?? STYLE_PRESETS.default\r\n return preset?.itemClass\r\n})\r\n\r\nconst handleChange = (value: string) => {\r\n emit('update:modelValue', value)\r\n emit('change', value)\r\n}\r\n</script>\r\n\r\n<template>\r\n <RadioGroup \r\n :model-value=\"String(modelValue)\" \r\n :disabled=\"disabled\"\r\n :required=\"required\"\r\n :name=\"name\"\r\n :id=\"id\"\r\n :class=\"groupClass\" \r\n @update:model-value=\"handleChange\"\r\n >\r\n <div v-for=\"option in options\" :key=\"option.value\" :class=\"styletype === 'vertical' ? 'block' : 'flex items-center space-x-2'\">\r\n <RadioGroupItem \r\n :id=\"String(option.value)\" \r\n :value=\"String(option.value)\" \r\n :disabled=\"option.disabled\"\r\n :class=\"itemClass\"\r\n />\r\n <label\
|
|
1
|
+
{"version":3,"file":"JRadio.vue.js","sources":["../../../../src/components/atoms/JRadio.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { RadioGroup, RadioGroupItem } from '@/components/shadcn'\r\n\r\nexport interface Option {\r\n value: string | number\r\n label: string\r\n disabled?: boolean\r\n}\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'primary' // 강조 스타일 (파랑)\r\n | 'success' // 성공 스타일 (초록)\r\n | 'danger' // 위험 스타일 (빨강)\r\n | 'sm' // 작은 크기\r\n | 'lg' // 큰 크기\r\n | 'horizontal' // 가로 배치\r\n | 'vertical' // 세로 배치\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n modelValue?: string | number\r\n options?: Option[]\r\n disabled?: boolean\r\n required?: boolean\r\n name?: string\r\n id?: string\r\n class?: string\r\n /** 스타일 프리셋 */\r\n styletype?: StyleType\r\n }>(),\r\n {\r\n options: () => [],\r\n disabled: false,\r\n required: false,\r\n styletype: 'default',\r\n },\r\n)\r\n\r\nconst emit = defineEmits<{\r\n 'update:modelValue': [value: string | number]\r\n 'change': [value: string | number]\r\n}>()\r\n\r\n/**\r\n * styletype -> class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { groupClass: string; itemClass: string }> = {\r\n default: { \r\n groupClass: '',\r\n itemClass: '',\r\n },\r\n primary: { \r\n groupClass: '',\r\n itemClass: 'border-blue-500 text-blue-500',\r\n },\r\n success: { \r\n groupClass: '',\r\n itemClass: 'border-green-500 text-green-600',\r\n },\r\n danger: { \r\n groupClass: '',\r\n itemClass: 'border-destructive text-destructive',\r\n },\r\n sm: { \r\n groupClass: '',\r\n itemClass: 'h-3.5 w-3.5',\r\n },\r\n lg: { \r\n groupClass: '',\r\n itemClass: 'h-5 w-5',\r\n },\r\n horizontal: { \r\n groupClass: 'flex flex-row gap-4',\r\n itemClass: '',\r\n },\r\n vertical: { \r\n groupClass: 'grid gap-2',\r\n itemClass: '',\r\n },\r\n}\r\n\r\nconst groupClass = computed(() => {\r\n const styleKey = props.styletype || 'default'\r\n const preset = STYLE_PRESETS[styleKey] ?? STYLE_PRESETS.default\r\n return [preset?.groupClass, props.class].filter(Boolean).join(' ')\r\n})\r\n\r\nconst itemClass = computed(() => {\r\n const styleKey = props.styletype || 'default'\r\n const preset = STYLE_PRESETS[styleKey] ?? STYLE_PRESETS.default\r\n return preset?.itemClass\r\n})\r\n\r\nconst handleChange = (value: string) => {\r\n emit('update:modelValue', value)\r\n emit('change', value)\r\n}\r\n</script>\r\n\r\n<template>\r\n <RadioGroup \r\n :model-value=\"String(modelValue)\" \r\n :disabled=\"disabled\"\r\n :required=\"required\"\r\n :name=\"name\"\r\n :id=\"id\"\r\n :class=\"groupClass\" \r\n @update:model-value=\"handleChange\"\r\n >\r\n <div v-for=\"option in options\" :key=\"option.value\" :class=\"styletype === 'vertical' ? 'block' : 'flex items-center space-x-2'\">\r\n <RadioGroupItem \r\n :id=\"String(option.value)\" \r\n :value=\"String(option.value)\" \r\n :disabled=\"option.disabled\"\r\n :class=\"itemClass\"\r\n />\r\n <label\n :for=\"String(option.value)\"\n class=\"text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\"\n >\n {{ option.label }}\n </label>\n </div>\r\n </RadioGroup>\r\n</template>\r\n"],"names":["props","__props","emit","__emit","STYLE_PRESETS","groupClass","computed","styleKey","itemClass","handleChange","value","_createBlock","_unref","RadioGroup","_createElementBlock","_Fragment","_renderList","option","_createVNode","RadioGroupItem","_createElementVNode","_toDisplayString","_hoisted_1"],"mappings":";;;;;;;;;;;;;;;;;;AAoBA,UAAMA,IAAQC,GAoBRC,IAAOC,GAQPC,IAA8E;AAAA,MAClF,SAAS;AAAA,QACP,YAAY;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,MAEb,SAAS;AAAA,QACP,YAAY;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,MAEb,SAAS;AAAA,QACP,YAAY;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,MAEb,QAAQ;AAAA,QACN,YAAY;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,MAEb,IAAI;AAAA,QACF,YAAY;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,MAEb,IAAI;AAAA,QACF,YAAY;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,MAEb,YAAY;AAAA,QACV,YAAY;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,MAEb,UAAU;AAAA,QACR,YAAY;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,IACb,GAGIC,IAAaC,EAAS,MAAM;AAChC,YAAMC,IAAWP,EAAM,aAAa;AAEpC,aAAO,EADQI,EAAcG,CAAQ,KAAKH,EAAc,UACxC,YAAYJ,EAAM,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,IACnE,CAAC,GAEKQ,IAAYF,EAAS,MAAM;AAC/B,YAAMC,IAAWP,EAAM,aAAa;AAEpC,cADeI,EAAcG,CAAQ,KAAKH,EAAc,UACzC;AAAA,IACjB,CAAC,GAEKK,IAAe,CAACC,MAAkB;AACtC,MAAAR,EAAK,qBAAqBQ,CAAK,GAC/BR,EAAK,UAAUQ,CAAK;AAAA,IACtB;2BAIEC,EAuBaC,EAAAC,CAAA,GAAA;AAAA,MAtBV,eAAa,OAAOZ,EAAA,UAAU;AAAA,MAC9B,UAAUA,EAAA;AAAA,MACV,UAAUA,EAAA;AAAA,MACV,MAAMA,EAAA;AAAA,MACN,IAAIA,EAAA;AAAA,MACJ,SAAOI,EAAA,KAAU;AAAA,MACjB,uBAAoBI;AAAA,IAAA;iBAEhB,MAAyB;AAAA,gBAA9BK,EAaMC,GAAA,MAAAC,EAbgBf,EAAA,SAAO,CAAjBgB,YAAZH,EAaM,OAAA;AAAA,UAb0B,KAAKG,EAAO;AAAA,UAAQ,SAAOhB,EAAA,cAAS,aAAA,UAAA,6BAAA;AAAA,QAAA;UAClEiB,EAKEN,EAAAO,CAAA,GAAA;AAAA,YAJC,IAAI,OAAOF,EAAO,KAAK;AAAA,YACvB,OAAO,OAAOA,EAAO,KAAK;AAAA,YAC1B,UAAUA,EAAO;AAAA,YACjB,SAAOT,EAAA,KAAS;AAAA,UAAA;UAEnBY,EAKQ,SAAA;AAAA,YAJL,KAAK,OAAOH,EAAO,KAAK;AAAA,YACzB,OAAM;AAAA,UAAA,GAEHI,EAAAJ,EAAO,KAAK,GAAA,GAAAK,CAAA;AAAA,QAAA;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),n=require("lucide-vue-next"),o=require("../../lib/utils.cjs");require("../shadcn/index.cjs");const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),n=require("lucide-vue-next"),o=require("../../lib/utils.cjs");require("../shadcn/index.cjs");const b=require("../shadcn/Combobox.vue.cjs"),x=require("../shadcn/ComboboxAnchor.vue.cjs"),_=require("../shadcn/ComboboxTrigger.vue.cjs"),v=require("../shadcn/Button.vue.cjs"),C=require("../shadcn/ComboboxList.vue.cjs"),h=require("../shadcn/ComboboxInput.vue.cjs"),y=require("../shadcn/ComboboxEmpty.vue.cjs"),g=require("../shadcn/ComboboxGroup.vue.cjs"),V=require("../shadcn/ComboboxItem.vue.cjs"),q={class:"relative w-full max-w-sm items-center"},N={class:"absolute start-0 inset-y-0 flex items-center justify-center px-2.5"},w=e.defineComponent({__name:"JSearchCombo",props:{modelValue:{},options:{default:()=>[]},placeholder:{default:"선택해주세요."},searchPlaceholder:{default:""},emptyText:{default:"검색 결과가 없습니다."},disabled:{type:Boolean,default:!1},required:{type:Boolean,default:!1},name:{},id:{},multiple:{type:Boolean,default:!1},class:{},styletype:{default:"default"}},emits:["update:modelValue","change","focus","blur"],setup(t,{emit:c}){const d=t,r=c,i={default:{variant:"outline",buttonClass:"h-8 text-xs px-2.5"},error:{variant:"outline",buttonClass:"h-8 text-xs px-2.5 border-destructive text-destructive",inputClass:"border-destructive focus:ring-destructive"},success:{variant:"outline",buttonClass:"h-8 text-xs px-2.5 border-green-500 text-green-700",inputClass:"border-green-500 focus:ring-green-500"},warning:{variant:"outline",buttonClass:"h-8 text-xs px-2.5 border-amber-500 text-amber-700",inputClass:"border-amber-500 focus:ring-amber-500"},sm:{variant:"outline",buttonClass:"h-7 text-[11px] px-2",inputClass:"h-7 text-[11px] px-2 py-1"},lg:{variant:"outline",buttonClass:"h-10 text-sm px-3",inputClass:"h-10 text-sm px-3 py-2"}},s=e.computed(()=>{const a=d.styletype||"default";return i[a]??i.default}),p=e.computed(()=>o.cn("justify-between",s.value?.buttonClass,d.class)),f=e.computed(()=>o.cn("pl-8 pr-2 py-1.5 focus-visible:ring-0 border-0 border-b rounded-none h-8 text-xs",s.value?.inputClass)),m=a=>{r("update:modelValue",a),r("change",a)};return(a,l)=>(e.openBlock(),e.createBlock(e.unref(b.default),{"model-value":t.modelValue,by:"label",disabled:t.disabled,required:t.required,name:t.name,"onUpdate:modelValue":l[2]||(l[2]=u=>m(u))},{default:e.withCtx(()=>[e.createVNode(e.unref(x.default),{"as-child":""},{default:e.withCtx(()=>[e.createVNode(e.unref(_.default),{"as-child":""},{default:e.withCtx(()=>[e.createVNode(e.unref(v.default),{id:t.id,variant:s.value.variant,class:e.normalizeClass(p.value),disabled:t.disabled,onFocus:l[0]||(l[0]=u=>r("focus",u)),onBlur:l[1]||(l[1]=u=>r("blur",u))},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.modelValue?.label??t.placeholder)+" ",1),e.createVNode(e.unref(n.ChevronsUpDown),{class:"ml-2 h-3.5 w-3.5 shrink-0 opacity-50"})]),_:1},8,["id","variant","class","disabled"])]),_:1})]),_:1}),e.createVNode(e.unref(C.default),null,{default:e.withCtx(()=>[e.createElementVNode("div",q,[e.createVNode(e.unref(h.default),{class:e.normalizeClass(f.value),placeholder:t.searchPlaceholder},null,8,["class","placeholder"]),e.createElementVNode("span",N,[e.createVNode(e.unref(n.Search),{class:"size-3.5 text-muted-foreground"})])]),e.createVNode(e.unref(y.default),null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.emptyText),1)]),_:1}),e.createVNode(e.unref(g.default),null,{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,u=>(e.openBlock(),e.createBlock(e.unref(V.default),{key:u.value,value:u},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(u.label)+" ",1),t.modelValue?.value===u.value?(e.openBlock(),e.createBlock(e.unref(n.Check),{key:0,class:e.normalizeClass(e.unref(o.cn)("ml-auto h-3.5 w-3.5"))},null,8,["class"])):e.createCommentVNode("",!0)]),_:2},1032,["value"]))),128))]),_:1})]),_:1})]),_:1},8,["model-value","disabled","required","name"]))}});exports.default=w;
|
|
2
2
|
//# sourceMappingURL=JSearchCombo.vue.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JSearchCombo.vue.cjs","sources":["../../../../src/components/atoms/JSearchCombo.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { Check, ChevronsUpDown, Search } from 'lucide-vue-next'\r\nimport { cn } from '@/lib/utils'\r\nimport {\r\n Button,\r\n Combobox,\r\n ComboboxAnchor,\r\n ComboboxEmpty,\r\n ComboboxGroup,\r\n ComboboxInput,\r\n ComboboxItem,\r\n ComboboxList,\r\n ComboboxTrigger,\r\n} from '@/components/shadcn'\r\n\r\nexport interface ComboboxOption {\r\n value: string | number\r\n label: string\r\n}\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'error' // 에러 상태\r\n | 'success' // 성공 상태\r\n | 'warning' // 경고 상태\r\n | 'sm' // 작은 크기\r\n | 'lg' // 큰 크기\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n modelValue?: ComboboxOption\r\n options?: ComboboxOption[]\r\n placeholder?: string\r\n searchPlaceholder?: string\r\n emptyText?: string\r\n disabled?: boolean\r\n required?: boolean\r\n name?: string\r\n id?: string\r\n multiple?: boolean\r\n class?: string\r\n /** 스타일 프리셋 */\r\n styletype?: StyleType\r\n }>(),\r\n {\r\n options: () => [],\r\n placeholder: '선택해주세요.',\r\n searchPlaceholder: '',\r\n emptyText: '검색 결과가 없습니다.',\r\n disabled: false,\r\n required: false,\r\n multiple: false,\r\n styletype: 'default',\r\n },\r\n)\r\n\r\nconst emit = defineEmits<{\r\n 'update:modelValue': [value: ComboboxOption | undefined]\r\n 'change': [value: ComboboxOption | undefined]\r\n 'focus': [event: FocusEvent]\r\n 'blur': [event: FocusEvent]\r\n}>()\r\n\r\n/**\r\n * styletype -> variant/class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { variant: 'default' | 'outline' | 'destructive' | 'secondary' | 'ghost' | 'link', buttonClass?: string, inputClass?: string }> = {\
|
|
1
|
+
{"version":3,"file":"JSearchCombo.vue.cjs","sources":["../../../../src/components/atoms/JSearchCombo.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { Check, ChevronsUpDown, Search } from 'lucide-vue-next'\r\nimport { cn } from '@/lib/utils'\r\nimport {\r\n Button,\r\n Combobox,\r\n ComboboxAnchor,\r\n ComboboxEmpty,\r\n ComboboxGroup,\r\n ComboboxInput,\r\n ComboboxItem,\r\n ComboboxList,\r\n ComboboxTrigger,\r\n} from '@/components/shadcn'\r\n\r\nexport interface ComboboxOption {\r\n value: string | number\r\n label: string\r\n}\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'error' // 에러 상태\r\n | 'success' // 성공 상태\r\n | 'warning' // 경고 상태\r\n | 'sm' // 작은 크기\r\n | 'lg' // 큰 크기\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n modelValue?: ComboboxOption\r\n options?: ComboboxOption[]\r\n placeholder?: string\r\n searchPlaceholder?: string\r\n emptyText?: string\r\n disabled?: boolean\r\n required?: boolean\r\n name?: string\r\n id?: string\r\n multiple?: boolean\r\n class?: string\r\n /** 스타일 프리셋 */\r\n styletype?: StyleType\r\n }>(),\r\n {\r\n options: () => [],\r\n placeholder: '선택해주세요.',\r\n searchPlaceholder: '',\r\n emptyText: '검색 결과가 없습니다.',\r\n disabled: false,\r\n required: false,\r\n multiple: false,\r\n styletype: 'default',\r\n },\r\n)\r\n\r\nconst emit = defineEmits<{\r\n 'update:modelValue': [value: ComboboxOption | undefined]\r\n 'change': [value: ComboboxOption | undefined]\r\n 'focus': [event: FocusEvent]\r\n 'blur': [event: FocusEvent]\r\n}>()\r\n\r\n/**\r\n * styletype -> variant/class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { variant: 'default' | 'outline' | 'destructive' | 'secondary' | 'ghost' | 'link', buttonClass?: string, inputClass?: string }> = {\n default: { \n variant: 'outline',\n buttonClass: 'h-8 text-xs px-2.5',\n },\n error: { \n variant: 'outline',\n buttonClass: 'h-8 text-xs px-2.5 border-destructive text-destructive',\n inputClass: 'border-destructive focus:ring-destructive',\n },\n success: { \n variant: 'outline',\n buttonClass: 'h-8 text-xs px-2.5 border-green-500 text-green-700',\n inputClass: 'border-green-500 focus:ring-green-500',\n },\n warning: { \n variant: 'outline',\n buttonClass: 'h-8 text-xs px-2.5 border-amber-500 text-amber-700',\n inputClass: 'border-amber-500 focus:ring-amber-500',\n },\n sm: { \n variant: 'outline',\n buttonClass: 'h-7 text-[11px] px-2',\n inputClass: 'h-7 text-[11px] px-2 py-1',\n },\n lg: { \n variant: 'outline',\n buttonClass: 'h-10 text-sm px-3',\n inputClass: 'h-10 text-sm px-3 py-2',\n },\n}\n\r\nconst preset = computed(() => {\r\n const styleKey = props.styletype || 'default'\r\n return STYLE_PRESETS[styleKey] ?? STYLE_PRESETS.default\r\n})\r\n\r\nconst buttonClass = computed(() => {\r\n return cn('justify-between', preset.value?.buttonClass, props.class)\r\n})\r\n\r\nconst inputClass = computed(() => {\n return cn('pl-8 pr-2 py-1.5 focus-visible:ring-0 border-0 border-b rounded-none h-8 text-xs', preset.value?.inputClass)\n})\n\r\nconst handleChange = (value: ComboboxOption | undefined) => {\r\n emit('update:modelValue', value)\r\n emit('change', value)\r\n}\r\n</script>\r\n\r\n<template>\r\n <Combobox \r\n :model-value=\"modelValue\" \r\n by=\"label\" \r\n :disabled=\"disabled\"\r\n :required=\"required\"\r\n :name=\"name\"\r\n @update:model-value=\"(value) => handleChange(value as ComboboxOption | undefined)\"\r\n >\r\n <ComboboxAnchor as-child>\r\n <ComboboxTrigger as-child>\r\n <Button \r\n :id=\"id\"\r\n :variant=\"preset.variant\" \r\n :class=\"buttonClass\"\r\n :disabled=\"disabled\"\r\n @focus=\"emit('focus', $event as FocusEvent)\"\r\n @blur=\"emit('blur', $event as FocusEvent)\"\r\n >\n {{ modelValue?.label ?? placeholder }}\n <ChevronsUpDown class=\"ml-2 h-3.5 w-3.5 shrink-0 opacity-50\" />\n </Button>\n </ComboboxTrigger>\r\n </ComboboxAnchor>\r\n\r\n <ComboboxList>\r\n <div class=\"relative w-full max-w-sm items-center\">\n <ComboboxInput :class=\"inputClass\" :placeholder=\"searchPlaceholder\" />\n <span class=\"absolute start-0 inset-y-0 flex items-center justify-center px-2.5\">\n <Search class=\"size-3.5 text-muted-foreground\" />\n </span>\n </div>\n\r\n <ComboboxEmpty>\r\n {{ emptyText }}\r\n </ComboboxEmpty>\r\n\r\n <ComboboxGroup>\r\n <ComboboxItem\r\n v-for=\"option in options\"\r\n :key=\"option.value\"\r\n :value=\"option\"\r\n >\r\n {{ option.label }}\n\n <Check v-if=\"modelValue?.value === option.value\" :class=\"cn('ml-auto h-3.5 w-3.5')\" />\n </ComboboxItem>\r\n </ComboboxGroup>\r\n </ComboboxList>\r\n </Combobox>\r\n</template>\r\n"],"names":["props","__props","emit","__emit","STYLE_PRESETS","preset","computed","styleKey","buttonClass","cn","inputClass","handleChange","value","_createBlock","_unref","Combobox","_cache","_createVNode","ComboboxAnchor","ComboboxTrigger","Button","$event","_createTextVNode","_toDisplayString","ChevronsUpDown","ComboboxList","_createElementVNode","_hoisted_1","ComboboxInput","_hoisted_2","Search","ComboboxEmpty","ComboboxGroup","_createElementBlock","_Fragment","_renderList","option","ComboboxItem","Check"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { defineComponent as $, computed as d, createBlock as m, openBlock as o, unref as t, withCtx as s, createVNode as
|
|
1
|
+
import { defineComponent as $, computed as d, createBlock as m, openBlock as o, unref as t, withCtx as s, createVNode as a, normalizeClass as c, createTextVNode as f, toDisplayString as p, createElementVNode as v, createElementBlock as w, Fragment as k, renderList as B, createCommentVNode as _ } from "vue";
|
|
2
2
|
import { ChevronsUpDown as S, Search as E, Check as T } from "lucide-vue-next";
|
|
3
|
-
import { cn as
|
|
3
|
+
import { cn as b } from "../../lib/utils.js";
|
|
4
4
|
import "../shadcn/index.js";
|
|
5
5
|
import q from "../shadcn/Combobox.vue.js";
|
|
6
6
|
import N from "../shadcn/ComboboxAnchor.vue.js";
|
|
@@ -11,7 +11,7 @@ import D from "../shadcn/ComboboxInput.vue.js";
|
|
|
11
11
|
import F from "../shadcn/ComboboxEmpty.vue.js";
|
|
12
12
|
import L from "../shadcn/ComboboxGroup.vue.js";
|
|
13
13
|
import U from "../shadcn/ComboboxItem.vue.js";
|
|
14
|
-
const J = { class: "relative w-full max-w-sm items-center" }, K = { class: "absolute start-0 inset-y-0 flex items-center justify-center px-
|
|
14
|
+
const J = { class: "relative w-full max-w-sm items-center" }, K = { class: "absolute start-0 inset-y-0 flex items-center justify-center px-2.5" }, te = /* @__PURE__ */ $({
|
|
15
15
|
__name: "JSearchCombo",
|
|
16
16
|
props: {
|
|
17
17
|
modelValue: {},
|
|
@@ -28,40 +28,41 @@ const J = { class: "relative w-full max-w-sm items-center" }, K = { class: "abso
|
|
|
28
28
|
styletype: { default: "default" }
|
|
29
29
|
},
|
|
30
30
|
emits: ["update:modelValue", "change", "focus", "blur"],
|
|
31
|
-
setup(e, { emit:
|
|
32
|
-
const
|
|
31
|
+
setup(e, { emit: C }) {
|
|
32
|
+
const x = e, u = C, h = {
|
|
33
33
|
default: {
|
|
34
|
-
variant: "outline"
|
|
34
|
+
variant: "outline",
|
|
35
|
+
buttonClass: "h-8 text-xs px-2.5"
|
|
35
36
|
},
|
|
36
37
|
error: {
|
|
37
38
|
variant: "outline",
|
|
38
|
-
buttonClass: "border-destructive text-destructive",
|
|
39
|
+
buttonClass: "h-8 text-xs px-2.5 border-destructive text-destructive",
|
|
39
40
|
inputClass: "border-destructive focus:ring-destructive"
|
|
40
41
|
},
|
|
41
42
|
success: {
|
|
42
43
|
variant: "outline",
|
|
43
|
-
buttonClass: "border-green-500 text-green-700",
|
|
44
|
+
buttonClass: "h-8 text-xs px-2.5 border-green-500 text-green-700",
|
|
44
45
|
inputClass: "border-green-500 focus:ring-green-500"
|
|
45
46
|
},
|
|
46
47
|
warning: {
|
|
47
48
|
variant: "outline",
|
|
48
|
-
buttonClass: "border-amber-500 text-amber-700",
|
|
49
|
+
buttonClass: "h-8 text-xs px-2.5 border-amber-500 text-amber-700",
|
|
49
50
|
inputClass: "border-amber-500 focus:ring-amber-500"
|
|
50
51
|
},
|
|
51
52
|
sm: {
|
|
52
53
|
variant: "outline",
|
|
53
|
-
buttonClass: "h-
|
|
54
|
-
inputClass: "h-
|
|
54
|
+
buttonClass: "h-7 text-[11px] px-2",
|
|
55
|
+
inputClass: "h-7 text-[11px] px-2 py-1"
|
|
55
56
|
},
|
|
56
57
|
lg: {
|
|
57
58
|
variant: "outline",
|
|
58
|
-
buttonClass: "h-
|
|
59
|
-
inputClass: "h-
|
|
59
|
+
buttonClass: "h-10 text-sm px-3",
|
|
60
|
+
inputClass: "h-10 text-sm px-3 py-2"
|
|
60
61
|
}
|
|
61
62
|
}, i = d(() => {
|
|
62
|
-
const n =
|
|
63
|
+
const n = x.styletype || "default";
|
|
63
64
|
return h[n] ?? h.default;
|
|
64
|
-
}), y = d(() =>
|
|
65
|
+
}), y = d(() => b("justify-between", i.value?.buttonClass, x.class)), g = d(() => b("pl-8 pr-2 py-1.5 focus-visible:ring-0 border-0 border-b rounded-none h-8 text-xs", i.value?.inputClass)), V = (n) => {
|
|
65
66
|
u("update:modelValue", n), u("change", n);
|
|
66
67
|
};
|
|
67
68
|
return (n, r) => (o(), m(t(q), {
|
|
@@ -70,24 +71,24 @@ const J = { class: "relative w-full max-w-sm items-center" }, K = { class: "abso
|
|
|
70
71
|
disabled: e.disabled,
|
|
71
72
|
required: e.required,
|
|
72
73
|
name: e.name,
|
|
73
|
-
"onUpdate:modelValue": r[2] || (r[2] = (
|
|
74
|
+
"onUpdate:modelValue": r[2] || (r[2] = (l) => V(l))
|
|
74
75
|
}, {
|
|
75
76
|
default: s(() => [
|
|
76
|
-
|
|
77
|
+
a(t(N), { "as-child": "" }, {
|
|
77
78
|
default: s(() => [
|
|
78
|
-
|
|
79
|
+
a(t(P), { "as-child": "" }, {
|
|
79
80
|
default: s(() => [
|
|
80
|
-
|
|
81
|
+
a(t(j), {
|
|
81
82
|
id: e.id,
|
|
82
83
|
variant: i.value.variant,
|
|
83
84
|
class: c(y.value),
|
|
84
85
|
disabled: e.disabled,
|
|
85
|
-
onFocus: r[0] || (r[0] = (
|
|
86
|
-
onBlur: r[1] || (r[1] = (
|
|
86
|
+
onFocus: r[0] || (r[0] = (l) => u("focus", l)),
|
|
87
|
+
onBlur: r[1] || (r[1] = (l) => u("blur", l))
|
|
87
88
|
}, {
|
|
88
89
|
default: s(() => [
|
|
89
|
-
f(
|
|
90
|
-
|
|
90
|
+
f(p(e.modelValue?.label ?? e.placeholder) + " ", 1),
|
|
91
|
+
a(t(S), { class: "ml-2 h-3.5 w-3.5 shrink-0 opacity-50" })
|
|
91
92
|
]),
|
|
92
93
|
_: 1
|
|
93
94
|
}, 8, ["id", "variant", "class", "disabled"])
|
|
@@ -97,34 +98,34 @@ const J = { class: "relative w-full max-w-sm items-center" }, K = { class: "abso
|
|
|
97
98
|
]),
|
|
98
99
|
_: 1
|
|
99
100
|
}),
|
|
100
|
-
|
|
101
|
+
a(t(z), null, {
|
|
101
102
|
default: s(() => [
|
|
102
|
-
|
|
103
|
-
|
|
103
|
+
v("div", J, [
|
|
104
|
+
a(t(D), {
|
|
104
105
|
class: c(g.value),
|
|
105
106
|
placeholder: e.searchPlaceholder
|
|
106
107
|
}, null, 8, ["class", "placeholder"]),
|
|
107
|
-
|
|
108
|
-
|
|
108
|
+
v("span", K, [
|
|
109
|
+
a(t(E), { class: "size-3.5 text-muted-foreground" })
|
|
109
110
|
])
|
|
110
111
|
]),
|
|
111
|
-
|
|
112
|
+
a(t(F), null, {
|
|
112
113
|
default: s(() => [
|
|
113
|
-
f(
|
|
114
|
+
f(p(e.emptyText), 1)
|
|
114
115
|
]),
|
|
115
116
|
_: 1
|
|
116
117
|
}),
|
|
117
|
-
|
|
118
|
+
a(t(L), null, {
|
|
118
119
|
default: s(() => [
|
|
119
|
-
(o(!0), w(k, null, B(e.options, (
|
|
120
|
-
key:
|
|
121
|
-
value:
|
|
120
|
+
(o(!0), w(k, null, B(e.options, (l) => (o(), m(t(U), {
|
|
121
|
+
key: l.value,
|
|
122
|
+
value: l
|
|
122
123
|
}, {
|
|
123
124
|
default: s(() => [
|
|
124
|
-
f(
|
|
125
|
-
e.modelValue?.value ===
|
|
125
|
+
f(p(l.label) + " ", 1),
|
|
126
|
+
e.modelValue?.value === l.value ? (o(), m(t(T), {
|
|
126
127
|
key: 0,
|
|
127
|
-
class: c(t(
|
|
128
|
+
class: c(t(b)("ml-auto h-3.5 w-3.5"))
|
|
128
129
|
}, null, 8, ["class"])) : _("", !0)
|
|
129
130
|
]),
|
|
130
131
|
_: 2
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JSearchCombo.vue.js","sources":["../../../../src/components/atoms/JSearchCombo.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { Check, ChevronsUpDown, Search } from 'lucide-vue-next'\r\nimport { cn } from '@/lib/utils'\r\nimport {\r\n Button,\r\n Combobox,\r\n ComboboxAnchor,\r\n ComboboxEmpty,\r\n ComboboxGroup,\r\n ComboboxInput,\r\n ComboboxItem,\r\n ComboboxList,\r\n ComboboxTrigger,\r\n} from '@/components/shadcn'\r\n\r\nexport interface ComboboxOption {\r\n value: string | number\r\n label: string\r\n}\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'error' // 에러 상태\r\n | 'success' // 성공 상태\r\n | 'warning' // 경고 상태\r\n | 'sm' // 작은 크기\r\n | 'lg' // 큰 크기\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n modelValue?: ComboboxOption\r\n options?: ComboboxOption[]\r\n placeholder?: string\r\n searchPlaceholder?: string\r\n emptyText?: string\r\n disabled?: boolean\r\n required?: boolean\r\n name?: string\r\n id?: string\r\n multiple?: boolean\r\n class?: string\r\n /** 스타일 프리셋 */\r\n styletype?: StyleType\r\n }>(),\r\n {\r\n options: () => [],\r\n placeholder: '선택해주세요.',\r\n searchPlaceholder: '',\r\n emptyText: '검색 결과가 없습니다.',\r\n disabled: false,\r\n required: false,\r\n multiple: false,\r\n styletype: 'default',\r\n },\r\n)\r\n\r\nconst emit = defineEmits<{\r\n 'update:modelValue': [value: ComboboxOption | undefined]\r\n 'change': [value: ComboboxOption | undefined]\r\n 'focus': [event: FocusEvent]\r\n 'blur': [event: FocusEvent]\r\n}>()\r\n\r\n/**\r\n * styletype -> variant/class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { variant: 'default' | 'outline' | 'destructive' | 'secondary' | 'ghost' | 'link', buttonClass?: string, inputClass?: string }> = {\
|
|
1
|
+
{"version":3,"file":"JSearchCombo.vue.js","sources":["../../../../src/components/atoms/JSearchCombo.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { Check, ChevronsUpDown, Search } from 'lucide-vue-next'\r\nimport { cn } from '@/lib/utils'\r\nimport {\r\n Button,\r\n Combobox,\r\n ComboboxAnchor,\r\n ComboboxEmpty,\r\n ComboboxGroup,\r\n ComboboxInput,\r\n ComboboxItem,\r\n ComboboxList,\r\n ComboboxTrigger,\r\n} from '@/components/shadcn'\r\n\r\nexport interface ComboboxOption {\r\n value: string | number\r\n label: string\r\n}\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'error' // 에러 상태\r\n | 'success' // 성공 상태\r\n | 'warning' // 경고 상태\r\n | 'sm' // 작은 크기\r\n | 'lg' // 큰 크기\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n modelValue?: ComboboxOption\r\n options?: ComboboxOption[]\r\n placeholder?: string\r\n searchPlaceholder?: string\r\n emptyText?: string\r\n disabled?: boolean\r\n required?: boolean\r\n name?: string\r\n id?: string\r\n multiple?: boolean\r\n class?: string\r\n /** 스타일 프리셋 */\r\n styletype?: StyleType\r\n }>(),\r\n {\r\n options: () => [],\r\n placeholder: '선택해주세요.',\r\n searchPlaceholder: '',\r\n emptyText: '검색 결과가 없습니다.',\r\n disabled: false,\r\n required: false,\r\n multiple: false,\r\n styletype: 'default',\r\n },\r\n)\r\n\r\nconst emit = defineEmits<{\r\n 'update:modelValue': [value: ComboboxOption | undefined]\r\n 'change': [value: ComboboxOption | undefined]\r\n 'focus': [event: FocusEvent]\r\n 'blur': [event: FocusEvent]\r\n}>()\r\n\r\n/**\r\n * styletype -> variant/class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { variant: 'default' | 'outline' | 'destructive' | 'secondary' | 'ghost' | 'link', buttonClass?: string, inputClass?: string }> = {\n default: { \n variant: 'outline',\n buttonClass: 'h-8 text-xs px-2.5',\n },\n error: { \n variant: 'outline',\n buttonClass: 'h-8 text-xs px-2.5 border-destructive text-destructive',\n inputClass: 'border-destructive focus:ring-destructive',\n },\n success: { \n variant: 'outline',\n buttonClass: 'h-8 text-xs px-2.5 border-green-500 text-green-700',\n inputClass: 'border-green-500 focus:ring-green-500',\n },\n warning: { \n variant: 'outline',\n buttonClass: 'h-8 text-xs px-2.5 border-amber-500 text-amber-700',\n inputClass: 'border-amber-500 focus:ring-amber-500',\n },\n sm: { \n variant: 'outline',\n buttonClass: 'h-7 text-[11px] px-2',\n inputClass: 'h-7 text-[11px] px-2 py-1',\n },\n lg: { \n variant: 'outline',\n buttonClass: 'h-10 text-sm px-3',\n inputClass: 'h-10 text-sm px-3 py-2',\n },\n}\n\r\nconst preset = computed(() => {\r\n const styleKey = props.styletype || 'default'\r\n return STYLE_PRESETS[styleKey] ?? STYLE_PRESETS.default\r\n})\r\n\r\nconst buttonClass = computed(() => {\r\n return cn('justify-between', preset.value?.buttonClass, props.class)\r\n})\r\n\r\nconst inputClass = computed(() => {\n return cn('pl-8 pr-2 py-1.5 focus-visible:ring-0 border-0 border-b rounded-none h-8 text-xs', preset.value?.inputClass)\n})\n\r\nconst handleChange = (value: ComboboxOption | undefined) => {\r\n emit('update:modelValue', value)\r\n emit('change', value)\r\n}\r\n</script>\r\n\r\n<template>\r\n <Combobox \r\n :model-value=\"modelValue\" \r\n by=\"label\" \r\n :disabled=\"disabled\"\r\n :required=\"required\"\r\n :name=\"name\"\r\n @update:model-value=\"(value) => handleChange(value as ComboboxOption | undefined)\"\r\n >\r\n <ComboboxAnchor as-child>\r\n <ComboboxTrigger as-child>\r\n <Button \r\n :id=\"id\"\r\n :variant=\"preset.variant\" \r\n :class=\"buttonClass\"\r\n :disabled=\"disabled\"\r\n @focus=\"emit('focus', $event as FocusEvent)\"\r\n @blur=\"emit('blur', $event as FocusEvent)\"\r\n >\n {{ modelValue?.label ?? placeholder }}\n <ChevronsUpDown class=\"ml-2 h-3.5 w-3.5 shrink-0 opacity-50\" />\n </Button>\n </ComboboxTrigger>\r\n </ComboboxAnchor>\r\n\r\n <ComboboxList>\r\n <div class=\"relative w-full max-w-sm items-center\">\n <ComboboxInput :class=\"inputClass\" :placeholder=\"searchPlaceholder\" />\n <span class=\"absolute start-0 inset-y-0 flex items-center justify-center px-2.5\">\n <Search class=\"size-3.5 text-muted-foreground\" />\n </span>\n </div>\n\r\n <ComboboxEmpty>\r\n {{ emptyText }}\r\n </ComboboxEmpty>\r\n\r\n <ComboboxGroup>\r\n <ComboboxItem\r\n v-for=\"option in options\"\r\n :key=\"option.value\"\r\n :value=\"option\"\r\n >\r\n {{ option.label }}\n\n <Check v-if=\"modelValue?.value === option.value\" :class=\"cn('ml-auto h-3.5 w-3.5')\" />\n </ComboboxItem>\r\n </ComboboxGroup>\r\n </ComboboxList>\r\n </Combobox>\r\n</template>\r\n"],"names":["props","__props","emit","__emit","STYLE_PRESETS","preset","computed","styleKey","buttonClass","cn","inputClass","handleChange","value","_createBlock","_unref","Combobox","_cache","_createVNode","ComboboxAnchor","ComboboxTrigger","Button","$event","_createTextVNode","_toDisplayString","ChevronsUpDown","ComboboxList","_createElementVNode","_hoisted_1","ComboboxInput","_hoisted_2","Search","ComboboxEmpty","ComboboxGroup","_createElementBlock","_Fragment","_renderList","option","ComboboxItem","Check"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),d=require("lucide-vue-next"),n=require("../../lib/utils.cjs"),m={key:0,class:"text-sm"},f=e.defineComponent({__name:"JSpinner",props:{size:{default:"
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),d=require("lucide-vue-next"),n=require("../../lib/utils.cjs"),m={key:0,class:"text-sm"},f=e.defineComponent({__name:"JSpinner",props:{size:{default:"sm"},class:{},styletype:{default:"default"},thickness:{default:2},label:{default:""},labelPosition:{default:"right"}},setup(a){const s=a,r={xs:"size-2.5",sm:"size-3",md:"size-4",lg:"size-5"},o={right:"flex-row items-center gap-2",left:"flex-row-reverse items-center gap-2",top:"flex-col items-center gap-2",bottom:"flex-col-reverse items-center gap-2"},c={default:{class:""},primary:{class:"text-blue-500"},success:{class:"text-green-500"},warning:{class:"text-amber-500"},danger:{class:"text-red-500"}},i=e.computed(()=>{const t=c[s.styletype],l=s.size||"md",p=r[l];return{class:n.cn("animate-spin",p,t.class,s.class),style:{strokeWidth:s.thickness},"aria-label":"처리 중"}}),u=e.computed(()=>{const t=s.labelPosition||"right";return n.cn("inline-flex",o[t])});return(t,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(u.value)},[e.createVNode(e.unref(d.Loader2Icon),e.mergeProps({role:"status"},i.value),null,16),s.label?(e.openBlock(),e.createElementBlock("span",m,e.toDisplayString(s.label),1)):e.createCommentVNode("",!0)],2))}});exports.default=f;
|
|
2
2
|
//# sourceMappingURL=JSpinner.vue.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JSpinner.vue.cjs","sources":["../../../../src/components/atoms/JSpinner.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { Loader2Icon } from 'lucide-vue-next'\r\nimport { cn } from '@/lib/utils'\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'primary' // 강조 스타일 (파랑)\r\n | 'success' // 성공 스타일 (초록)\r\n | 'warning' // 경고 스타일 (주황)\r\n | 'danger' // 위험 스타일 (빨강)\r\n\r\ntype LabelPosition =\r\n | 'right' // 오른쪽 (기본)\r\n | 'left' // 왼쪽\r\n | 'top' // 위쪽\r\n | 'bottom' // 아래쪽\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n size?: 'sm' | 'md' | 'lg'\
|
|
1
|
+
{"version":3,"file":"JSpinner.vue.cjs","sources":["../../../../src/components/atoms/JSpinner.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { Loader2Icon } from 'lucide-vue-next'\r\nimport { cn } from '@/lib/utils'\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'primary' // 강조 스타일 (파랑)\r\n | 'success' // 성공 스타일 (초록)\r\n | 'warning' // 경고 스타일 (주황)\r\n | 'danger' // 위험 스타일 (빨강)\r\n\r\ntype LabelPosition =\r\n | 'right' // 오른쪽 (기본)\r\n | 'left' // 왼쪽\r\n | 'top' // 위쪽\r\n | 'bottom' // 아래쪽\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n size?: 'xs' | 'sm' | 'md' | 'lg'\n class?: string\r\n /** 스타일 프리셋 */\r\n styletype?: StyleType\r\n /** 스피너 원의 테두리 두께 */\r\n thickness?: number\r\n /** 스피너 옆에 표시될 텍스트 */\r\n label?: string\r\n /** 라벨 위치 */\r\n labelPosition?: LabelPosition\r\n }>(),\r\n {\n size: 'sm',\n styletype: 'default',\n thickness: 2,\n label: '',\r\n labelPosition: 'right',\r\n },\r\n)\r\n\r\n/**\r\n * 크기별 클래스 매핑\r\n */\r\nconst SIZE_CLASSES = {\n xs: 'size-2.5',\n sm: 'size-3',\n md: 'size-4', \n lg: 'size-5',\n}\n\r\n/**\r\n * 라벨 위치별 레이아웃 클래스 매핑\r\n */\r\nconst LABEL_POSITION_CLASSES = {\r\n right: 'flex-row items-center gap-2',\r\n left: 'flex-row-reverse items-center gap-2',\r\n top: 'flex-col items-center gap-2',\r\n bottom: 'flex-col-reverse items-center gap-2',\r\n}\r\n\r\n/**\r\n * styletype -> class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { class: string }> = {\r\n default: { class: '' },\r\n primary: { \r\n class: 'text-blue-500',\r\n },\r\n success: { \r\n class: 'text-green-500',\r\n },\r\n warning: { \r\n class: 'text-amber-500',\r\n },\r\n danger: { \r\n class: 'text-red-500',\r\n },\r\n}\r\n\r\n/** 최종 바인딩: 직접 넘긴 props가 있으면 styletype 기본값과 병합 */\r\nconst spinnerProps = computed(() => {\r\n const preset = STYLE_PRESETS[props.styletype!]\r\n const finalSize = props.size || 'md'\r\n const sizeClass = SIZE_CLASSES[finalSize as keyof typeof SIZE_CLASSES]\r\n const finalClass = cn('animate-spin', sizeClass, preset.class, props.class)\r\n \r\n return {\r\n class: finalClass,\r\n style: {\r\n strokeWidth: props.thickness,\r\n },\r\n 'aria-label': '처리 중',\r\n }\r\n})\r\n\r\n/** 컨테이너 레이아웃 클래스 */\r\nconst containerClass = computed(() => {\r\n const position = props.labelPosition || 'right'\r\n return cn('inline-flex', LABEL_POSITION_CLASSES[position as keyof typeof LABEL_POSITION_CLASSES])\r\n})\r\n</script>\r\n\r\n<template>\r\n <div :class=\"containerClass\">\r\n <Loader2Icon\r\n role=\"status\"\r\n v-bind=\"spinnerProps\"\r\n />\r\n <span v-if=\"props.label\" class=\"text-sm\">{{ props.label }}</span>\r\n </div>\r\n</template>\r\n"],"names":["props","__props","SIZE_CLASSES","LABEL_POSITION_CLASSES","STYLE_PRESETS","spinnerProps","computed","preset","finalSize","sizeClass","cn","containerClass","position","_createElementBlock","_createVNode","_unref","_mergeProps","_openBlock","_hoisted_1","_toDisplayString"],"mappings":"uZAkBA,MAAMA,EAAQC,EAyBRC,EAAe,CACnB,GAAI,WACJ,GAAI,SACJ,GAAI,SACJ,GAAI,QAAA,EAMAC,EAAyB,CAC7B,MAAO,8BACP,KAAM,sCACN,IAAK,8BACL,OAAQ,qCAAA,EAMJC,EAAsD,CAC1D,QAAS,CAAE,MAAO,EAAA,EAClB,QAAS,CACP,MAAO,eAAA,EAET,QAAS,CACP,MAAO,gBAAA,EAET,QAAS,CACP,MAAO,gBAAA,EAET,OAAQ,CACN,MAAO,cAAA,CACT,EAIIC,EAAeC,EAAAA,SAAS,IAAM,CAClC,MAAMC,EAASH,EAAcJ,EAAM,SAAU,EACvCQ,EAAYR,EAAM,MAAQ,KAC1BS,EAAYP,EAAaM,CAAsC,EAGrE,MAAO,CACL,MAHiBE,EAAAA,GAAG,eAAgBD,EAAWF,EAAO,MAAOP,EAAM,KAAK,EAIxE,MAAO,CACL,YAAaA,EAAM,SAAA,EAErB,aAAc,MAAA,CAElB,CAAC,EAGKW,EAAiBL,EAAAA,SAAS,IAAM,CACpC,MAAMM,EAAWZ,EAAM,eAAiB,QACxC,OAAOU,KAAG,cAAeP,EAAuBS,CAA+C,CAAC,CAClG,CAAC,8BAICC,EAAAA,mBAMM,MAAA,CANA,uBAAOF,EAAA,KAAc,CAAA,GACzBG,EAAAA,YAGEC,EAAAA,qBAHFC,EAAAA,WAGE,CAFA,KAAK,QAAA,EACGX,EAAA,KAAY,EAAA,KAAA,EAAA,EAEVL,EAAM,OAAlBiB,EAAAA,UAAA,EAAAJ,EAAAA,mBAAiE,OAAjEK,EAAiEC,EAAAA,gBAArBnB,EAAM,KAAK,EAAA,CAAA"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { defineComponent as d, computed as l, createElementBlock as a, openBlock as n, normalizeClass as S, createVNode as g, createCommentVNode as x, unref as _, mergeProps as b, toDisplayString as
|
|
2
|
-
import { Loader2Icon as
|
|
1
|
+
import { defineComponent as d, computed as l, createElementBlock as a, openBlock as n, normalizeClass as S, createVNode as g, createCommentVNode as x, unref as _, mergeProps as b, toDisplayString as z } from "vue";
|
|
2
|
+
import { Loader2Icon as C } from "lucide-vue-next";
|
|
3
3
|
import { cn as r } from "../../lib/utils.js";
|
|
4
|
-
const
|
|
4
|
+
const h = {
|
|
5
5
|
key: 0,
|
|
6
6
|
class: "text-sm"
|
|
7
7
|
}, P = /* @__PURE__ */ d({
|
|
8
8
|
__name: "JSpinner",
|
|
9
9
|
props: {
|
|
10
|
-
size: { default: "
|
|
10
|
+
size: { default: "sm" },
|
|
11
11
|
class: {},
|
|
12
12
|
styletype: { default: "default" },
|
|
13
13
|
thickness: { default: 2 },
|
|
@@ -16,9 +16,10 @@ const y = {
|
|
|
16
16
|
},
|
|
17
17
|
setup(o) {
|
|
18
18
|
const e = o, c = {
|
|
19
|
+
xs: "size-2.5",
|
|
19
20
|
sm: "size-3",
|
|
20
21
|
md: "size-4",
|
|
21
|
-
lg: "size-
|
|
22
|
+
lg: "size-5"
|
|
22
23
|
}, i = {
|
|
23
24
|
right: "flex-row items-center gap-2",
|
|
24
25
|
left: "flex-row-reverse items-center gap-2",
|
|
@@ -54,8 +55,8 @@ const y = {
|
|
|
54
55
|
return (s, t) => (n(), a("div", {
|
|
55
56
|
class: S(f.value)
|
|
56
57
|
}, [
|
|
57
|
-
g(_(
|
|
58
|
-
e.label ? (n(), a("span",
|
|
58
|
+
g(_(C), b({ role: "status" }, m.value), null, 16),
|
|
59
|
+
e.label ? (n(), a("span", h, z(e.label), 1)) : x("", !0)
|
|
59
60
|
], 2));
|
|
60
61
|
}
|
|
61
62
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JSpinner.vue.js","sources":["../../../../src/components/atoms/JSpinner.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { Loader2Icon } from 'lucide-vue-next'\r\nimport { cn } from '@/lib/utils'\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'primary' // 강조 스타일 (파랑)\r\n | 'success' // 성공 스타일 (초록)\r\n | 'warning' // 경고 스타일 (주황)\r\n | 'danger' // 위험 스타일 (빨강)\r\n\r\ntype LabelPosition =\r\n | 'right' // 오른쪽 (기본)\r\n | 'left' // 왼쪽\r\n | 'top' // 위쪽\r\n | 'bottom' // 아래쪽\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n size?: 'sm' | 'md' | 'lg'\
|
|
1
|
+
{"version":3,"file":"JSpinner.vue.js","sources":["../../../../src/components/atoms/JSpinner.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from 'vue'\r\nimport { Loader2Icon } from 'lucide-vue-next'\r\nimport { cn } from '@/lib/utils'\r\n\r\ntype StyleType =\r\n | 'default' // 기본 스타일\r\n | 'primary' // 강조 스타일 (파랑)\r\n | 'success' // 성공 스타일 (초록)\r\n | 'warning' // 경고 스타일 (주황)\r\n | 'danger' // 위험 스타일 (빨강)\r\n\r\ntype LabelPosition =\r\n | 'right' // 오른쪽 (기본)\r\n | 'left' // 왼쪽\r\n | 'top' // 위쪽\r\n | 'bottom' // 아래쪽\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n size?: 'xs' | 'sm' | 'md' | 'lg'\n class?: string\r\n /** 스타일 프리셋 */\r\n styletype?: StyleType\r\n /** 스피너 원의 테두리 두께 */\r\n thickness?: number\r\n /** 스피너 옆에 표시될 텍스트 */\r\n label?: string\r\n /** 라벨 위치 */\r\n labelPosition?: LabelPosition\r\n }>(),\r\n {\n size: 'sm',\n styletype: 'default',\n thickness: 2,\n label: '',\r\n labelPosition: 'right',\r\n },\r\n)\r\n\r\n/**\r\n * 크기별 클래스 매핑\r\n */\r\nconst SIZE_CLASSES = {\n xs: 'size-2.5',\n sm: 'size-3',\n md: 'size-4', \n lg: 'size-5',\n}\n\r\n/**\r\n * 라벨 위치별 레이아웃 클래스 매핑\r\n */\r\nconst LABEL_POSITION_CLASSES = {\r\n right: 'flex-row items-center gap-2',\r\n left: 'flex-row-reverse items-center gap-2',\r\n top: 'flex-col items-center gap-2',\r\n bottom: 'flex-col-reverse items-center gap-2',\r\n}\r\n\r\n/**\r\n * styletype -> class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { class: string }> = {\r\n default: { class: '' },\r\n primary: { \r\n class: 'text-blue-500',\r\n },\r\n success: { \r\n class: 'text-green-500',\r\n },\r\n warning: { \r\n class: 'text-amber-500',\r\n },\r\n danger: { \r\n class: 'text-red-500',\r\n },\r\n}\r\n\r\n/** 최종 바인딩: 직접 넘긴 props가 있으면 styletype 기본값과 병합 */\r\nconst spinnerProps = computed(() => {\r\n const preset = STYLE_PRESETS[props.styletype!]\r\n const finalSize = props.size || 'md'\r\n const sizeClass = SIZE_CLASSES[finalSize as keyof typeof SIZE_CLASSES]\r\n const finalClass = cn('animate-spin', sizeClass, preset.class, props.class)\r\n \r\n return {\r\n class: finalClass,\r\n style: {\r\n strokeWidth: props.thickness,\r\n },\r\n 'aria-label': '처리 중',\r\n }\r\n})\r\n\r\n/** 컨테이너 레이아웃 클래스 */\r\nconst containerClass = computed(() => {\r\n const position = props.labelPosition || 'right'\r\n return cn('inline-flex', LABEL_POSITION_CLASSES[position as keyof typeof LABEL_POSITION_CLASSES])\r\n})\r\n</script>\r\n\r\n<template>\r\n <div :class=\"containerClass\">\r\n <Loader2Icon\r\n role=\"status\"\r\n v-bind=\"spinnerProps\"\r\n />\r\n <span v-if=\"props.label\" class=\"text-sm\">{{ props.label }}</span>\r\n </div>\r\n</template>\r\n"],"names":["props","__props","SIZE_CLASSES","LABEL_POSITION_CLASSES","STYLE_PRESETS","spinnerProps","computed","preset","finalSize","sizeClass","cn","containerClass","position","_createElementBlock","_createVNode","_unref","_mergeProps","_openBlock","_hoisted_1","_toDisplayString"],"mappings":";;;;;;;;;;;;;;;;;AAkBA,UAAMA,IAAQC,GAyBRC,IAAe;AAAA,MACnB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAAA,GAMAC,IAAyB;AAAA,MAC7B,OAAO;AAAA,MACP,MAAM;AAAA,MACN,KAAK;AAAA,MACL,QAAQ;AAAA,IAAA,GAMJC,IAAsD;AAAA,MAC1D,SAAS,EAAE,OAAO,GAAA;AAAA,MAClB,SAAS;AAAA,QACP,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,OAAO;AAAA,MAAA;AAAA,MAET,QAAQ;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,IACT,GAIIC,IAAeC,EAAS,MAAM;AAClC,YAAMC,IAASH,EAAcJ,EAAM,SAAU,GACvCQ,IAAYR,EAAM,QAAQ,MAC1BS,IAAYP,EAAaM,CAAsC;AAGrE,aAAO;AAAA,QACL,OAHiBE,EAAG,gBAAgBD,GAAWF,EAAO,OAAOP,EAAM,KAAK;AAAA,QAIxE,OAAO;AAAA,UACL,aAAaA,EAAM;AAAA,QAAA;AAAA,QAErB,cAAc;AAAA,MAAA;AAAA,IAElB,CAAC,GAGKW,IAAiBL,EAAS,MAAM;AACpC,YAAMM,IAAWZ,EAAM,iBAAiB;AACxC,aAAOU,EAAG,eAAeP,EAAuBS,CAA+C,CAAC;AAAA,IAClG,CAAC;2BAICC,EAMM,OAAA;AAAA,MANA,SAAOF,EAAA,KAAc;AAAA,IAAA;MACzBG,EAGEC,MAHFC,EAGE,EAFA,MAAK,SAAA,GACGX,EAAA,KAAY,GAAA,MAAA,EAAA;AAAA,MAEVL,EAAM,SAAlBiB,EAAA,GAAAJ,EAAiE,QAAjEK,GAAiEC,EAArBnB,EAAM,KAAK,GAAA,CAAA;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),s=require("../shadcn/resizable/ResizableHandle.vue.cjs"),r=require("../shadcn/resizable/ResizablePanelGroup.vue.cjs"),l=require("reka-ui"),u=e.defineComponent({__name:"JSplitter",props:{direction:{default:"horizontal"},defaultSize:{default:
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),s=require("../shadcn/resizable/ResizableHandle.vue.cjs"),r=require("../shadcn/resizable/ResizablePanelGroup.vue.cjs"),l=require("reka-ui"),u=e.defineComponent({__name:"JSplitter",props:{direction:{default:"horizontal"},defaultSize:{default:40},minSize:{default:20},maxSize:{},secondMinSize:{},secondMaxSize:{},withHandle:{type:Boolean,default:!0},gap:{default:2},class:{}},setup(t){const i=t,n=e.computed(()=>100-i.defaultSize);return(a,d)=>(e.openBlock(),e.createBlock(e.unref(r.default),{direction:t.direction,class:e.normalizeClass(t.class)},{default:e.withCtx(()=>[e.createVNode(e.unref(l.SplitterPanel),{"default-size":t.defaultSize,"min-size":t.minSize,"max-size":t.maxSize,class:e.normalizeClass(t.gap>0?t.direction==="horizontal"?"pr-[calc(var(--gap)/2)]":"pb-[calc(var(--gap)/2)]":""),style:e.normalizeStyle(t.gap>0?{"--gap":`${t.gap}px`}:{})},{default:e.withCtx(()=>[e.renderSlot(a.$slots,"first"),e.renderSlot(a.$slots,"left"),e.renderSlot(a.$slots,"top")]),_:3},8,["default-size","min-size","max-size","class","style"]),e.createVNode(e.unref(s.default),{"with-handle":t.withHandle},null,8,["with-handle"]),e.createVNode(e.unref(l.SplitterPanel),{"default-size":n.value,"min-size":t.secondMinSize,"max-size":t.secondMaxSize,class:e.normalizeClass(t.gap>0?t.direction==="horizontal"?"pl-[calc(var(--gap)/2)]":"pt-[calc(var(--gap)/2)]":""),style:e.normalizeStyle(t.gap>0?{"--gap":`${t.gap}px`}:{})},{default:e.withCtx(()=>[e.renderSlot(a.$slots,"second"),e.renderSlot(a.$slots,"right"),e.renderSlot(a.$slots,"bottom")]),_:3},8,["default-size","min-size","max-size","class","style"])]),_:3},8,["direction","class"]))}});exports.default=u;
|
|
2
2
|
//# sourceMappingURL=JSplitter.vue.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JSplitter.vue.cjs","sources":["../../../../src/components/atoms/JSplitter.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport {\n ResizablePanelGroup,\n ResizablePanel,\n ResizableHandle,\n} from '@/components/shadcn/resizable'\n\ntype Orientation = 'horizontal' | 'vertical'\n\nconst props = withDefaults(\n defineProps<{\n /** 분할 방향 (horizontal: 좌우, vertical: 상하) */\n direction?: Orientation\n /** 첫 번째 패널의 기본 크기 (%) */\n defaultSize?: number\n /** 첫 번째 패널의 최소 크기 (%) */\n minSize?: number\n /** 첫 번째 패널의 최대 크기 (%) */\n maxSize?: number\n /** 두 번째 패널의 최소 크기 (%) */\n secondMinSize?: number\n /** 두 번째 패널의 최대 크기 (%) */\n secondMaxSize?: number\n /** ResizableHandle에 grip 아이콘 표시 여부 */\n withHandle?: boolean\n /** 추가 CSS 클래스 */\n class?: string\n }>(),\n {\n direction: 'horizontal',\n defaultSize:
|
|
1
|
+
{"version":3,"file":"JSplitter.vue.cjs","sources":["../../../../src/components/atoms/JSplitter.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport {\n ResizablePanelGroup,\n ResizablePanel,\n ResizableHandle,\n} from '@/components/shadcn/resizable'\n\ntype Orientation = 'horizontal' | 'vertical'\n\nconst props = withDefaults(\n defineProps<{\n /** 분할 방향 (horizontal: 좌우, vertical: 상하) */\n direction?: Orientation\n /** 첫 번째 패널의 기본 크기 (%) */\n defaultSize?: number\n /** 첫 번째 패널의 최소 크기 (%) */\n minSize?: number\n /** 첫 번째 패널의 최대 크기 (%) */\n maxSize?: number\n /** 두 번째 패널의 최소 크기 (%) */\n secondMinSize?: number\n /** 두 번째 패널의 최대 크기 (%) */\n secondMaxSize?: number\n /** ResizableHandle에 grip 아이콘 표시 여부 */\n withHandle?: boolean\n /** 패널 간 여백 (px) */\n gap?: number\n /** 추가 CSS 클래스 */\n class?: string\n }>(),\n {\n direction: 'horizontal',\n defaultSize: 40,\n minSize: 20,\n withHandle: true,\n gap: 2,\n },\n)\n\n// 두 번째 패널의 기본 크기 계산\nconst secondDefaultSize = computed(() => 100 - props.defaultSize)\n</script>\n\n<template>\n <ResizablePanelGroup :direction=\"direction\" :class=\"class\">\n <!-- 첫 번째 패널 (좌측/상단) -->\n <ResizablePanel \n :default-size=\"defaultSize\" \n :min-size=\"minSize\" \n :max-size=\"maxSize\"\n :class=\"gap > 0 ? (direction === 'horizontal' ? 'pr-[calc(var(--gap)/2)]' : 'pb-[calc(var(--gap)/2)]') : ''\"\n :style=\"gap > 0 ? { '--gap': `${gap}px` } : {}\"\n >\n <slot name=\"first\" />\n <!-- direction=\"horizontal\"일 때 left, vertical일 때 top으로도 사용 가능 -->\n <slot name=\"left\" />\n <slot name=\"top\" />\n </ResizablePanel>\n\n <!-- 크기 조정 핸들 -->\n <ResizableHandle :with-handle=\"withHandle\" />\n\n <!-- 두 번째 패널 (우측/하단) -->\n <ResizablePanel\n :default-size=\"secondDefaultSize\"\n :min-size=\"secondMinSize\"\n :max-size=\"secondMaxSize\"\n :class=\"gap > 0 ? (direction === 'horizontal' ? 'pl-[calc(var(--gap)/2)]' : 'pt-[calc(var(--gap)/2)]') : ''\"\n :style=\"gap > 0 ? { '--gap': `${gap}px` } : {}\"\n >\n <slot name=\"second\" />\n <!-- direction=\"horizontal\"일 때 right, vertical일 때 bottom으로도 사용 가능 -->\n <slot name=\"right\" />\n <slot name=\"bottom\" />\n </ResizablePanel>\n </ResizablePanelGroup>\n</template>\n"],"names":["props","__props","secondDefaultSize","computed","_createBlock","_unref","ResizablePanelGroup","_createVNode","ResizablePanel","_normalizeClass","_normalizeStyle","_renderSlot","_ctx","ResizableHandle"],"mappings":"igBAUA,MAAMA,EAAQC,EA+BRC,EAAoBC,EAAAA,SAAS,IAAM,IAAMH,EAAM,WAAW,8BAI9DI,EAAAA,YA+BsBC,EAAAA,MAAAC,EAAAA,OAAA,EAAA,CA/BA,UAAWL,EAAA,UAAY,uBAAOA,EAAA,KAAK,CAAA,qBAEvD,IAWiB,CAXjBM,cAWiBF,EAAAA,MAAAG,EAAAA,aAAA,EAAA,CAVd,eAAcP,EAAA,YACd,WAAUA,EAAA,QACV,WAAUA,EAAA,QACV,MAAKQ,EAAAA,eAAER,EAAA,IAAG,EAAQA,EAAA,YAAS,aAAA,0BAAA,0BAAA,EAAA,EAC3B,MAAKS,EAAAA,eAAET,EAAA,IAAG,EAAA,CAAA,QAAA,GAAqBA,EAAA,GAAG,IAAA,EAAA,CAAA,CAAA,CAAA,qBAEnC,IAAqB,CAArBU,aAAqBC,EAAA,OAAA,OAAA,EAErBD,aAAoBC,EAAA,OAAA,MAAA,EACpBD,aAAmBC,EAAA,OAAA,KAAA,CAAA,kEAIrBL,EAAAA,YAA6CF,EAAAA,MAAAQ,SAAA,EAAA,CAA3B,cAAaZ,EAAA,UAAA,EAAU,KAAA,EAAA,CAAA,aAAA,CAAA,EAGzCM,cAWiBF,EAAAA,MAAAG,EAAAA,aAAA,EAAA,CAVd,eAAcN,EAAA,MACd,WAAUD,EAAA,cACV,WAAUA,EAAA,cACV,MAAKQ,EAAAA,eAAER,EAAA,IAAG,EAAQA,EAAA,YAAS,aAAA,0BAAA,0BAAA,EAAA,EAC3B,MAAKS,EAAAA,eAAET,EAAA,IAAG,EAAA,CAAA,QAAA,GAAqBA,EAAA,GAAG,IAAA,EAAA,CAAA,CAAA,CAAA,qBAEnC,IAAsB,CAAtBU,aAAsBC,EAAA,OAAA,QAAA,EAEtBD,aAAqBC,EAAA,OAAA,OAAA,EACrBD,aAAsBC,EAAA,OAAA,QAAA,CAAA"}
|
|
@@ -1,57 +1,62 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { SplitterPanel as
|
|
5
|
-
const
|
|
1
|
+
import { defineComponent as z, computed as f, createBlock as r, openBlock as u, unref as i, normalizeClass as l, withCtx as n, createVNode as s, normalizeStyle as o, renderSlot as t } from "vue";
|
|
2
|
+
import S from "../shadcn/resizable/ResizableHandle.vue.js";
|
|
3
|
+
import g from "../shadcn/resizable/ResizablePanelGroup.vue.js";
|
|
4
|
+
import { SplitterPanel as c } from "reka-ui";
|
|
5
|
+
const w = /* @__PURE__ */ z({
|
|
6
6
|
__name: "JSplitter",
|
|
7
7
|
props: {
|
|
8
8
|
direction: { default: "horizontal" },
|
|
9
|
-
defaultSize: { default:
|
|
9
|
+
defaultSize: { default: 40 },
|
|
10
10
|
minSize: { default: 20 },
|
|
11
11
|
maxSize: {},
|
|
12
12
|
secondMinSize: {},
|
|
13
13
|
secondMaxSize: {},
|
|
14
14
|
withHandle: { type: Boolean, default: !0 },
|
|
15
|
+
gap: { default: 2 },
|
|
15
16
|
class: {}
|
|
16
17
|
},
|
|
17
18
|
setup(e) {
|
|
18
|
-
const
|
|
19
|
-
return (
|
|
19
|
+
const d = e, m = f(() => 100 - d.defaultSize);
|
|
20
|
+
return (a, h) => (u(), r(i(g), {
|
|
20
21
|
direction: e.direction,
|
|
21
|
-
class:
|
|
22
|
+
class: l(e.class)
|
|
22
23
|
}, {
|
|
23
|
-
default:
|
|
24
|
-
s(
|
|
24
|
+
default: n(() => [
|
|
25
|
+
s(i(c), {
|
|
25
26
|
"default-size": e.defaultSize,
|
|
26
27
|
"min-size": e.minSize,
|
|
27
|
-
"max-size": e.maxSize
|
|
28
|
+
"max-size": e.maxSize,
|
|
29
|
+
class: l(e.gap > 0 ? e.direction === "horizontal" ? "pr-[calc(var(--gap)/2)]" : "pb-[calc(var(--gap)/2)]" : ""),
|
|
30
|
+
style: o(e.gap > 0 ? { "--gap": `${e.gap}px` } : {})
|
|
28
31
|
}, {
|
|
29
|
-
default:
|
|
30
|
-
t(
|
|
31
|
-
t(
|
|
32
|
-
t(
|
|
32
|
+
default: n(() => [
|
|
33
|
+
t(a.$slots, "first"),
|
|
34
|
+
t(a.$slots, "left"),
|
|
35
|
+
t(a.$slots, "top")
|
|
33
36
|
]),
|
|
34
37
|
_: 3
|
|
35
|
-
}, 8, ["default-size", "min-size", "max-size"]),
|
|
36
|
-
s(
|
|
37
|
-
s(
|
|
38
|
-
"default-size":
|
|
38
|
+
}, 8, ["default-size", "min-size", "max-size", "class", "style"]),
|
|
39
|
+
s(i(S), { "with-handle": e.withHandle }, null, 8, ["with-handle"]),
|
|
40
|
+
s(i(c), {
|
|
41
|
+
"default-size": m.value,
|
|
39
42
|
"min-size": e.secondMinSize,
|
|
40
|
-
"max-size": e.secondMaxSize
|
|
43
|
+
"max-size": e.secondMaxSize,
|
|
44
|
+
class: l(e.gap > 0 ? e.direction === "horizontal" ? "pl-[calc(var(--gap)/2)]" : "pt-[calc(var(--gap)/2)]" : ""),
|
|
45
|
+
style: o(e.gap > 0 ? { "--gap": `${e.gap}px` } : {})
|
|
41
46
|
}, {
|
|
42
|
-
default:
|
|
43
|
-
t(
|
|
44
|
-
t(
|
|
45
|
-
t(
|
|
47
|
+
default: n(() => [
|
|
48
|
+
t(a.$slots, "second"),
|
|
49
|
+
t(a.$slots, "right"),
|
|
50
|
+
t(a.$slots, "bottom")
|
|
46
51
|
]),
|
|
47
52
|
_: 3
|
|
48
|
-
}, 8, ["default-size", "min-size", "max-size"])
|
|
53
|
+
}, 8, ["default-size", "min-size", "max-size", "class", "style"])
|
|
49
54
|
]),
|
|
50
55
|
_: 3
|
|
51
56
|
}, 8, ["direction", "class"]));
|
|
52
57
|
}
|
|
53
58
|
});
|
|
54
59
|
export {
|
|
55
|
-
|
|
60
|
+
w as default
|
|
56
61
|
};
|
|
57
62
|
//# sourceMappingURL=JSplitter.vue.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JSplitter.vue.js","sources":["../../../../src/components/atoms/JSplitter.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport {\n ResizablePanelGroup,\n ResizablePanel,\n ResizableHandle,\n} from '@/components/shadcn/resizable'\n\ntype Orientation = 'horizontal' | 'vertical'\n\nconst props = withDefaults(\n defineProps<{\n /** 분할 방향 (horizontal: 좌우, vertical: 상하) */\n direction?: Orientation\n /** 첫 번째 패널의 기본 크기 (%) */\n defaultSize?: number\n /** 첫 번째 패널의 최소 크기 (%) */\n minSize?: number\n /** 첫 번째 패널의 최대 크기 (%) */\n maxSize?: number\n /** 두 번째 패널의 최소 크기 (%) */\n secondMinSize?: number\n /** 두 번째 패널의 최대 크기 (%) */\n secondMaxSize?: number\n /** ResizableHandle에 grip 아이콘 표시 여부 */\n withHandle?: boolean\n /** 추가 CSS 클래스 */\n class?: string\n }>(),\n {\n direction: 'horizontal',\n defaultSize:
|
|
1
|
+
{"version":3,"file":"JSplitter.vue.js","sources":["../../../../src/components/atoms/JSplitter.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport {\n ResizablePanelGroup,\n ResizablePanel,\n ResizableHandle,\n} from '@/components/shadcn/resizable'\n\ntype Orientation = 'horizontal' | 'vertical'\n\nconst props = withDefaults(\n defineProps<{\n /** 분할 방향 (horizontal: 좌우, vertical: 상하) */\n direction?: Orientation\n /** 첫 번째 패널의 기본 크기 (%) */\n defaultSize?: number\n /** 첫 번째 패널의 최소 크기 (%) */\n minSize?: number\n /** 첫 번째 패널의 최대 크기 (%) */\n maxSize?: number\n /** 두 번째 패널의 최소 크기 (%) */\n secondMinSize?: number\n /** 두 번째 패널의 최대 크기 (%) */\n secondMaxSize?: number\n /** ResizableHandle에 grip 아이콘 표시 여부 */\n withHandle?: boolean\n /** 패널 간 여백 (px) */\n gap?: number\n /** 추가 CSS 클래스 */\n class?: string\n }>(),\n {\n direction: 'horizontal',\n defaultSize: 40,\n minSize: 20,\n withHandle: true,\n gap: 2,\n },\n)\n\n// 두 번째 패널의 기본 크기 계산\nconst secondDefaultSize = computed(() => 100 - props.defaultSize)\n</script>\n\n<template>\n <ResizablePanelGroup :direction=\"direction\" :class=\"class\">\n <!-- 첫 번째 패널 (좌측/상단) -->\n <ResizablePanel \n :default-size=\"defaultSize\" \n :min-size=\"minSize\" \n :max-size=\"maxSize\"\n :class=\"gap > 0 ? (direction === 'horizontal' ? 'pr-[calc(var(--gap)/2)]' : 'pb-[calc(var(--gap)/2)]') : ''\"\n :style=\"gap > 0 ? { '--gap': `${gap}px` } : {}\"\n >\n <slot name=\"first\" />\n <!-- direction=\"horizontal\"일 때 left, vertical일 때 top으로도 사용 가능 -->\n <slot name=\"left\" />\n <slot name=\"top\" />\n </ResizablePanel>\n\n <!-- 크기 조정 핸들 -->\n <ResizableHandle :with-handle=\"withHandle\" />\n\n <!-- 두 번째 패널 (우측/하단) -->\n <ResizablePanel\n :default-size=\"secondDefaultSize\"\n :min-size=\"secondMinSize\"\n :max-size=\"secondMaxSize\"\n :class=\"gap > 0 ? (direction === 'horizontal' ? 'pl-[calc(var(--gap)/2)]' : 'pt-[calc(var(--gap)/2)]') : ''\"\n :style=\"gap > 0 ? { '--gap': `${gap}px` } : {}\"\n >\n <slot name=\"second\" />\n <!-- direction=\"horizontal\"일 때 right, vertical일 때 bottom으로도 사용 가능 -->\n <slot name=\"right\" />\n <slot name=\"bottom\" />\n </ResizablePanel>\n </ResizablePanelGroup>\n</template>\n"],"names":["props","__props","secondDefaultSize","computed","_createBlock","_unref","ResizablePanelGroup","_createVNode","ResizablePanel","_normalizeClass","_normalizeStyle","_renderSlot","_ctx","ResizableHandle"],"mappings":";;;;;;;;;;;;;;;;;;AAUA,UAAMA,IAAQC,GA+BRC,IAAoBC,EAAS,MAAM,MAAMH,EAAM,WAAW;2BAI9DI,EA+BsBC,EAAAC,CAAA,GAAA;AAAA,MA/BA,WAAWL,EAAA;AAAA,MAAY,SAAOA,EAAA,KAAK;AAAA,IAAA;iBAEvD,MAWiB;AAAA,QAXjBM,EAWiBF,EAAAG,CAAA,GAAA;AAAA,UAVd,gBAAcP,EAAA;AAAA,UACd,YAAUA,EAAA;AAAA,UACV,YAAUA,EAAA;AAAA,UACV,OAAKQ,EAAER,EAAA,MAAG,IAAQA,EAAA,cAAS,eAAA,4BAAA,4BAAA,EAAA;AAAA,UAC3B,OAAKS,EAAET,EAAA,MAAG,IAAA,EAAA,SAAA,GAAqBA,EAAA,GAAG,KAAA,IAAA,CAAA,CAAA;AAAA,QAAA;qBAEnC,MAAqB;AAAA,YAArBU,EAAqBC,EAAA,QAAA,OAAA;AAAA,YAErBD,EAAoBC,EAAA,QAAA,MAAA;AAAA,YACpBD,EAAmBC,EAAA,QAAA,KAAA;AAAA,UAAA;;;QAIrBL,EAA6CF,EAAAQ,CAAA,GAAA,EAA3B,eAAaZ,EAAA,WAAA,GAAU,MAAA,GAAA,CAAA,aAAA,CAAA;AAAA,QAGzCM,EAWiBF,EAAAG,CAAA,GAAA;AAAA,UAVd,gBAAcN,EAAA;AAAA,UACd,YAAUD,EAAA;AAAA,UACV,YAAUA,EAAA;AAAA,UACV,OAAKQ,EAAER,EAAA,MAAG,IAAQA,EAAA,cAAS,eAAA,4BAAA,4BAAA,EAAA;AAAA,UAC3B,OAAKS,EAAET,EAAA,MAAG,IAAA,EAAA,SAAA,GAAqBA,EAAA,GAAG,KAAA,IAAA,CAAA,CAAA;AAAA,QAAA;qBAEnC,MAAsB;AAAA,YAAtBU,EAAsBC,EAAA,QAAA,QAAA;AAAA,YAEtBD,EAAqBC,EAAA,QAAA,OAAA;AAAA,YACrBD,EAAsBC,EAAA,QAAA,QAAA;AAAA,UAAA;;;;;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),y=require("../shadcn/Tooltip.vue.cjs"),T=require("../shadcn/TooltipContent.vue.cjs"),b=require("../shadcn/TooltipProvider.vue.cjs"),w=require("../shadcn/TooltipTrigger.vue.cjs"),C=t.defineComponent({__name:"JTooltip",props:{content:{},side:{default:"top"},align:{default:"center"},class:{},styletype:{default:"default"},size:{default:"
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),y=require("../shadcn/Tooltip.vue.cjs"),T=require("../shadcn/TooltipContent.vue.cjs"),b=require("../shadcn/TooltipProvider.vue.cjs"),w=require("../shadcn/TooltipTrigger.vue.cjs"),C=t.defineComponent({__name:"JTooltip",props:{content:{},side:{default:"top"},align:{default:"center"},class:{},styletype:{default:"default"},size:{default:"sm"},disabled:{type:Boolean,default:!1},delay:{default:200},maxWidth:{default:"200px"},trigger:{default:"hover"}},setup(n,{expose:u}){const e=n,c={default:{class:""},primary:{class:"bg-blue-500 text-white border-blue-600"},success:{class:"bg-green-500 text-white border-green-600"},warning:{class:"bg-amber-500 text-white border-amber-600"},danger:{class:"bg-red-500 text-white border-red-600"}},d={xs:{class:"text-[10px] px-1.5 py-0.5 max-w-40"},sm:{class:"text-xs px-2 py-1 max-w-48"},md:{class:"text-xs px-2.5 py-1 max-w-56"},lg:{class:"text-sm px-3 py-1.5 max-w-64"}},o=t.ref(!1),g=l=>{console.log("Click handler called, trigger:",e.trigger),e.trigger==="click"?(console.log("Toggling tooltip, current state:",o.value),o.value=!o.value,console.log("New state:",o.value)):e.trigger==="focus"&&(l.preventDefault(),l.stopPropagation())};let r=null;const p=()=>{e.trigger==="hover"&&(r&&clearTimeout(r),r=setTimeout(()=>{o.value=!0},e.delay))},f=()=>{e.trigger==="hover"&&(r&&(clearTimeout(r),r=null),o.value=!1)},v=()=>{e.trigger==="focus"&&(o.value=!0)},_=()=>{e.trigger==="focus"&&(o.value=!1)},m=t.computed(()=>{const l={disabled:e.disabled};return l.open=o.value,l}),i=l=>{if(e.trigger==="hover"&&o.value){const a=l.target,s=document.querySelector("[data-tooltip-trigger]");s&&!s.contains(a)&&(o.value=!1)}};u({showTooltip:()=>{e.trigger==="manual"&&(o.value=!0)},hideTooltip:()=>{e.trigger==="manual"&&(o.value=!1)}}),t.onMounted(()=>{e.trigger==="hover"&&document.addEventListener("click",i)}),t.onUnmounted(()=>{e.trigger==="hover"&&document.removeEventListener("click",i),r&&clearTimeout(r)});const h=t.computed(()=>{const l=c[e.styletype],a=d[e.size],s=[l.class,a.class,e.class].filter(Boolean).join(" "),x=typeof e.maxWidth=="number"?`${e.maxWidth}px`:e.maxWidth;return{side:e.side,align:e.align,class:s,style:{maxWidth:x}}});return(l,a)=>(t.openBlock(),t.createBlock(b.default,{delayDuration:e.delay},{default:t.withCtx(()=>[t.createVNode(y.default,t.normalizeProps(t.guardReactiveProps(m.value)),{default:t.withCtx(()=>[t.createVNode(w.default,{"as-child":"","data-tooltip-trigger":!0,onClick:g,onMouseenter:p,onMouseleave:f,onFocus:v,onBlur:_},{default:t.withCtx(()=>[t.renderSlot(l.$slots,"trigger")]),_:3}),t.createVNode(T.default,t.normalizeProps(t.guardReactiveProps(h.value)),{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(e.content),1)]),_:1},16)]),_:3},16)]),_:3},8,["delayDuration"]))}});exports.default=C;
|
|
2
2
|
//# sourceMappingURL=JTooltip.vue.cjs.map
|