@7pmlabs/design-system 0.3.8 → 0.4.1

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 (292) hide show
  1. package/dist/design-system.js +1 -1
  2. package/dist/design-system.mjs +32 -32
  3. package/dist/design-system100.js +1 -1
  4. package/dist/design-system100.js.map +1 -1
  5. package/dist/design-system100.mjs +1 -1
  6. package/dist/design-system100.mjs.map +1 -1
  7. package/dist/design-system101.js +1 -1
  8. package/dist/design-system101.js.map +1 -1
  9. package/dist/design-system101.mjs +63 -2167
  10. package/dist/design-system101.mjs.map +1 -1
  11. package/dist/design-system102.js +1 -1
  12. package/dist/design-system102.js.map +1 -1
  13. package/dist/design-system102.mjs +6 -1103
  14. package/dist/design-system102.mjs.map +1 -1
  15. package/dist/design-system105.js +1 -1
  16. package/dist/design-system105.mjs +2 -2
  17. package/dist/design-system106.js +1 -1
  18. package/dist/design-system106.js.map +1 -1
  19. package/dist/design-system106.mjs +2 -4
  20. package/dist/design-system106.mjs.map +1 -1
  21. package/dist/design-system107.js +1 -1
  22. package/dist/design-system107.js.map +1 -1
  23. package/dist/design-system107.mjs +4 -8
  24. package/dist/design-system107.mjs.map +1 -1
  25. package/dist/design-system108.js +1 -1
  26. package/dist/design-system108.js.map +1 -1
  27. package/dist/design-system108.mjs +7 -6
  28. package/dist/design-system108.mjs.map +1 -1
  29. package/dist/design-system109.js +1 -1
  30. package/dist/design-system109.js.map +1 -1
  31. package/dist/design-system109.mjs +7 -2
  32. package/dist/design-system109.mjs.map +1 -1
  33. package/dist/design-system11.js.map +1 -1
  34. package/dist/design-system11.mjs.map +1 -1
  35. package/dist/design-system110.js +1 -1
  36. package/dist/design-system110.mjs +2 -2
  37. package/dist/design-system12.js +1 -7
  38. package/dist/design-system12.js.map +1 -1
  39. package/dist/design-system12.mjs +17 -297
  40. package/dist/design-system12.mjs.map +1 -1
  41. package/dist/design-system13.js +2 -2
  42. package/dist/design-system13.js.map +1 -1
  43. package/dist/design-system13.mjs +202 -166
  44. package/dist/design-system13.mjs.map +1 -1
  45. package/dist/design-system14.js +7 -1
  46. package/dist/design-system14.js.map +1 -1
  47. package/dist/design-system14.mjs +256 -92
  48. package/dist/design-system14.mjs.map +1 -1
  49. package/dist/design-system141.js +1 -1
  50. package/dist/design-system141.mjs +2 -2
  51. package/dist/design-system15.js +1 -1
  52. package/dist/design-system15.js.map +1 -1
  53. package/dist/design-system15.mjs +100 -14
  54. package/dist/design-system15.mjs.map +1 -1
  55. package/dist/design-system16.js +1 -1
  56. package/dist/design-system16.js.map +1 -1
  57. package/dist/design-system16.mjs +15 -59
  58. package/dist/design-system16.mjs.map +1 -1
  59. package/dist/design-system17.js +1 -1
  60. package/dist/design-system17.js.map +1 -1
  61. package/dist/design-system17.mjs +52 -243
  62. package/dist/design-system17.mjs.map +1 -1
  63. package/dist/design-system18.js +1 -1
  64. package/dist/design-system18.js.map +1 -1
  65. package/dist/design-system18.mjs +238 -107
  66. package/dist/design-system18.mjs.map +1 -1
  67. package/dist/design-system19.js +1 -3
  68. package/dist/design-system19.js.map +1 -1
  69. package/dist/design-system19.mjs +113 -113
  70. package/dist/design-system19.mjs.map +1 -1
  71. package/dist/design-system20.js +3 -1
  72. package/dist/design-system20.js.map +1 -1
  73. package/dist/design-system20.mjs +115 -61
  74. package/dist/design-system20.mjs.map +1 -1
  75. package/dist/design-system21.js +1 -1
  76. package/dist/design-system21.js.map +1 -1
  77. package/dist/design-system21.mjs +54 -187
  78. package/dist/design-system21.mjs.map +1 -1
  79. package/dist/design-system22.js +1 -1
  80. package/dist/design-system22.js.map +1 -1
  81. package/dist/design-system22.mjs +187 -62
  82. package/dist/design-system22.mjs.map +1 -1
  83. package/dist/design-system23.js +1 -1
  84. package/dist/design-system23.js.map +1 -1
  85. package/dist/design-system23.mjs +69 -37
  86. package/dist/design-system23.mjs.map +1 -1
  87. package/dist/design-system24.js +1 -1
  88. package/dist/design-system24.js.map +1 -1
  89. package/dist/design-system24.mjs +37 -144
  90. package/dist/design-system24.mjs.map +1 -1
  91. package/dist/design-system25.js +1 -1
  92. package/dist/design-system25.mjs +2 -2
  93. package/dist/design-system27.js +1 -1
  94. package/dist/design-system27.mjs +2 -2
  95. package/dist/design-system28.js +1 -1
  96. package/dist/design-system28.mjs +10 -6
  97. package/dist/design-system28.mjs.map +1 -1
  98. package/dist/design-system29.js +1 -1
  99. package/dist/design-system29.js.map +1 -1
  100. package/dist/design-system29.mjs +23 -10
  101. package/dist/design-system29.mjs.map +1 -1
  102. package/dist/design-system30.js +1 -1
  103. package/dist/design-system30.js.map +1 -1
  104. package/dist/design-system30.mjs +24 -14
  105. package/dist/design-system30.mjs.map +1 -1
  106. package/dist/design-system31.js +1 -1
  107. package/dist/design-system31.js.map +1 -1
  108. package/dist/design-system31.mjs +5 -29
  109. package/dist/design-system31.mjs.map +1 -1
  110. package/dist/design-system32.js +1 -1
  111. package/dist/design-system32.mjs +3 -3
  112. package/dist/design-system33.js +1 -1
  113. package/dist/design-system33.mjs +10 -5
  114. package/dist/design-system33.mjs.map +1 -1
  115. package/dist/design-system34.js +1 -1
  116. package/dist/design-system34.mjs +7 -7
  117. package/dist/design-system35.js +1 -1
  118. package/dist/design-system35.mjs +6 -6
  119. package/dist/design-system36.js +1 -1
  120. package/dist/design-system36.mjs +8 -8
  121. package/dist/design-system37.js +1 -1
  122. package/dist/design-system37.mjs +9 -8
  123. package/dist/design-system37.mjs.map +1 -1
  124. package/dist/design-system38.js +1 -1
  125. package/dist/design-system38.mjs +4 -10
  126. package/dist/design-system38.mjs.map +1 -1
  127. package/dist/design-system39.js +1 -1
  128. package/dist/design-system39.mjs +4 -4
  129. package/dist/design-system40.js +1 -1
  130. package/dist/design-system40.js.map +1 -1
  131. package/dist/design-system40.mjs +68 -141
  132. package/dist/design-system40.mjs.map +1 -1
  133. package/dist/design-system41.js +1 -1
  134. package/dist/design-system41.js.map +1 -1
  135. package/dist/design-system41.mjs +5 -76
  136. package/dist/design-system41.mjs.map +1 -1
  137. package/dist/design-system42.js +1 -1
  138. package/dist/design-system42.mjs +10 -5
  139. package/dist/design-system42.mjs.map +1 -1
  140. package/dist/design-system43.js +1 -1
  141. package/dist/design-system43.mjs +13 -8
  142. package/dist/design-system43.mjs.map +1 -1
  143. package/dist/design-system44.js +1 -1
  144. package/dist/design-system44.mjs +5 -15
  145. package/dist/design-system44.mjs.map +1 -1
  146. package/dist/design-system45.js +1 -1
  147. package/dist/design-system45.js.map +1 -1
  148. package/dist/design-system45.mjs +59 -5
  149. package/dist/design-system45.mjs.map +1 -1
  150. package/dist/design-system46.js +1 -1
  151. package/dist/design-system46.js.map +1 -1
  152. package/dist/design-system46.mjs +5 -59
  153. package/dist/design-system46.mjs.map +1 -1
  154. package/dist/design-system54.js +1 -1
  155. package/dist/design-system54.js.map +1 -1
  156. package/dist/design-system54.mjs +28 -28
  157. package/dist/design-system54.mjs.map +1 -1
  158. package/dist/design-system59.js +1 -1
  159. package/dist/design-system59.js.map +1 -1
  160. package/dist/design-system59.mjs +1 -1
  161. package/dist/design-system59.mjs.map +1 -1
  162. package/dist/design-system61.js +1 -1
  163. package/dist/design-system61.js.map +1 -1
  164. package/dist/design-system61.mjs +2 -49
  165. package/dist/design-system61.mjs.map +1 -1
  166. package/dist/design-system62.js +1 -1
  167. package/dist/design-system62.mjs +2 -2
  168. package/dist/design-system63.js +1 -1
  169. package/dist/design-system63.mjs +2 -2
  170. package/dist/design-system64.js +1 -1
  171. package/dist/design-system64.mjs +1 -1
  172. package/dist/design-system65.js +1 -1
  173. package/dist/design-system65.mjs +1 -1
  174. package/dist/design-system66.js +1 -1
  175. package/dist/design-system66.mjs +1 -1
  176. package/dist/design-system67.js +1 -1
  177. package/dist/design-system67.mjs +1 -1
  178. package/dist/design-system68.js +1 -1
  179. package/dist/design-system68.js.map +1 -1
  180. package/dist/design-system68.mjs +28 -2
  181. package/dist/design-system68.mjs.map +1 -1
  182. package/dist/design-system69.js +1 -1
  183. package/dist/design-system69.mjs +2 -2
  184. package/dist/design-system70.js +1 -1
  185. package/dist/design-system70.js.map +1 -1
  186. package/dist/design-system70.mjs +51 -21
  187. package/dist/design-system70.mjs.map +1 -1
  188. package/dist/design-system71.js +1 -1
  189. package/dist/design-system71.mjs +2 -2
  190. package/dist/design-system72.js +1 -1
  191. package/dist/design-system72.js.map +1 -1
  192. package/dist/design-system72.mjs +2 -58
  193. package/dist/design-system72.mjs.map +1 -1
  194. package/dist/design-system73.js +1 -1
  195. package/dist/design-system73.mjs +2 -2
  196. package/dist/design-system74.js +1 -1
  197. package/dist/design-system74.mjs +1 -1
  198. package/dist/design-system75.js +1 -1
  199. package/dist/design-system75.mjs +1 -1
  200. package/dist/design-system76.js +1 -1
  201. package/dist/design-system76.mjs +1 -1
  202. package/dist/design-system77.js +1 -1
  203. package/dist/design-system77.mjs +1 -1
  204. package/dist/design-system78.js +1 -1
  205. package/dist/design-system78.mjs +2 -2
  206. package/dist/design-system79.js +1 -1
  207. package/dist/design-system79.js.map +1 -1
  208. package/dist/design-system79.mjs +81 -2
  209. package/dist/design-system79.mjs.map +1 -1
  210. package/dist/design-system80.js +1 -1
  211. package/dist/design-system80.mjs +2 -2
  212. package/dist/design-system81.js +1 -1
  213. package/dist/design-system81.js.map +1 -1
  214. package/dist/design-system81.mjs +2 -81
  215. package/dist/design-system81.mjs.map +1 -1
  216. package/dist/design-system82.js +1 -1
  217. package/dist/design-system82.js.map +1 -1
  218. package/dist/design-system82.mjs +119 -2
  219. package/dist/design-system82.mjs.map +1 -1
  220. package/dist/design-system83.js +1 -1
  221. package/dist/design-system83.mjs +2 -2
  222. package/dist/design-system84.js +1 -1
  223. package/dist/design-system84.mjs +1 -1
  224. package/dist/design-system85.js +1 -1
  225. package/dist/design-system85.mjs +1 -1
  226. package/dist/design-system86.js +1 -1
  227. package/dist/design-system86.js.map +1 -1
  228. package/dist/design-system86.mjs +102 -2
  229. package/dist/design-system86.mjs.map +1 -1
  230. package/dist/design-system87.js +1 -1
  231. package/dist/design-system87.js.map +1 -1
  232. package/dist/design-system87.mjs +2 -102
  233. package/dist/design-system87.mjs.map +1 -1
  234. package/dist/design-system88.js +1 -1
  235. package/dist/design-system88.js.map +1 -1
  236. package/dist/design-system88.mjs +173 -2
  237. package/dist/design-system88.mjs.map +1 -1
  238. package/dist/design-system89.js +1 -1
  239. package/dist/design-system89.js.map +1 -1
  240. package/dist/design-system89.mjs +2 -175
  241. package/dist/design-system89.mjs.map +1 -1
  242. package/dist/design-system90.js +1 -1
  243. package/dist/design-system90.mjs +2 -2
  244. package/dist/design-system91.js +1 -1
  245. package/dist/design-system91.js.map +1 -1
  246. package/dist/design-system91.mjs +131 -2
  247. package/dist/design-system91.mjs.map +1 -1
  248. package/dist/design-system92.js +1 -1
  249. package/dist/design-system92.mjs +2 -2
  250. package/dist/design-system97.js +1 -1
  251. package/dist/design-system97.js.map +1 -1
  252. package/dist/design-system97.mjs +2167 -63
  253. package/dist/design-system97.mjs.map +1 -1
  254. package/dist/design-system98.js +1 -1
  255. package/dist/design-system98.js.map +1 -1
  256. package/dist/design-system98.mjs +1103 -17
  257. package/dist/design-system98.mjs.map +1 -1
  258. package/dist/design-system99.js +1 -1
  259. package/dist/design-system99.js.map +1 -1
  260. package/dist/design-system99.mjs +16 -5
  261. package/dist/design-system99.mjs.map +1 -1
  262. package/dist/style.css +1 -1
  263. package/dist/types/components/BButton.vue.d.ts +6 -3
  264. package/dist/types/components/BCarousel/BCarousel.vue.d.ts +1 -1
  265. package/dist/types/components/BCheckbox.vue.d.ts +1 -4
  266. package/dist/types/components/BCollapse.vue.d.ts +1 -1
  267. package/dist/types/components/BCurrencyField.vue.d.ts +12 -66
  268. package/dist/types/components/BDatePicker.vue.d.ts +1 -4
  269. package/dist/types/components/BDateRangePicker.vue.d.ts +1 -4
  270. package/dist/types/components/BDropdown/BDropdown.vue.d.ts +4 -4
  271. package/dist/types/components/BDropdown/BDropdownItem.vue.d.ts +0 -3
  272. package/dist/types/components/BErrorMessage.vue.d.ts +9 -5
  273. package/dist/types/components/BImagePicker/BImagePicker.vue.d.ts +1 -4
  274. package/dist/types/components/BImagePicker/BImagePreview.vue.d.ts +1 -4
  275. package/dist/types/components/BLabel.vue.d.ts +0 -3
  276. package/dist/types/components/BLoadingBar.vue.d.ts +0 -3
  277. package/dist/types/components/BLoadingOverlay.vue.d.ts +0 -3
  278. package/dist/types/components/BModal/BModal.vue.d.ts +4 -4
  279. package/dist/types/components/BModal/BModalContainer.vue.d.ts +0 -3
  280. package/dist/types/components/BMultiSelect.vue.d.ts +2 -5
  281. package/dist/types/components/BOtpField/BOtpField.vue.d.ts +2 -5
  282. package/dist/types/components/BOtpField/BOtpFieldBox.vue.d.ts +6 -9
  283. package/dist/types/components/BPagination.vue.d.ts +1 -4
  284. package/dist/types/components/BRadio.vue.d.ts +1 -4
  285. package/dist/types/components/BSelect.vue.d.ts +2 -5
  286. package/dist/types/components/BTabs/BTabs.vue.d.ts +1 -4
  287. package/dist/types/components/BTextField.vue.d.ts +8 -61
  288. package/dist/types/components/BTextarea.vue.d.ts +1 -4
  289. package/dist/types/components/BToast/BToast.vue.d.ts +1 -4
  290. package/dist/types/components/BToast/BToastItem.vue.d.ts +0 -3
  291. package/dist/types/components/BTooltip.vue.d.ts +1 -4
  292. package/package.json +10 -10
@@ -1 +1 @@
1
- {"version":3,"file":"design-system88.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
1
+ {"version":3,"file":"design-system88.js","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-325422c6\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n key: 0,\n class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_7 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"svg\", {\n class: \"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t\",\n viewBox: \"0 0 512 512\",\n xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n /*#__PURE__*/_createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n], -1))\nconst _hoisted_8 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n//#region Props\nexport interface Props {\n inputId?: string;\n modelValue: FileItemRead[];\n label?: string;\n multiple?: boolean;\n maxFileSize?: number;\n hideDetails?: boolean;\n required?: boolean;\n requiredErrorMessage?: string;\n validationRules?: ValidationRule[];\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n __name: 'BImagePicker',\n props: {\n inputId: { default: '' },\n modelValue: {},\n label: { default: '' },\n multiple: { type: Boolean, default: false },\n maxFileSize: { default: 20 },\n hideDetails: { type: Boolean, default: false },\n required: { type: Boolean, default: false },\n requiredErrorMessage: { default: '' },\n validationRules: { default: undefined }\n },\n emits: [\"change\", \"update:modelValue\"],\n setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n// Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\n\n//#endregion\n\n//#region Events\n\n//#endregion\n\n//#region Data\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n get() {\n return props.modelValue;\n },\n set(val) {\n emit('update:modelValue', val);\n },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n visible: false,\n url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n errorMessage: () =>\n props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n validateRule: () => fileTypesValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_types_valid', {\n types: allowedTypes.value,\n }),\n};\nconst validateFileSizeValid: ValidationRule = {\n validateRule: () => fileSizeValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_size_valid', {\n size: props.maxFileSize,\n }),\n};\nconst vRules = computed(() => {\n let result: ValidationRule[] = [];\n\n if (props.required) {\n result.push(validateRequired);\n }\n if (props.validationRules) {\n result = result.concat(props.validationRules);\n }\n result.push(validateFileTypesValid);\n result.push(validateFileSizeValid);\n\n return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n id.value,\n value,\n vRules.value,\n);\n//#endregion\n\n//#region Methods\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n draggedIndex.value = index;\n const target = e.target as HTMLDivElement;\n target.classList.add('dragging');\n e.dataTransfer!.effectAllowed = 'move';\n e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n if (draggedIndex.value !== index) {\n target.classList.add('dropped-target');\n }\n};\nconst handleDragOver = (e: DragEvent) => {\n // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n e.preventDefault();\n e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n // When the draggable p element leaves the droptarget, reset the style\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n e.preventDefault();\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n const draggedImg = value.value[draggedIndex];\n value.value.splice(draggedIndex, 1);\n value.value.splice(index, 0, draggedImg);\n\n emit('change');\n validate();\n};\nconst openFileDialog = () => {\n inputRef.value?.click();\n};\nconst onChangeInput = (e: any) => {\n let fileList: FileList = e.target.files || e.dataTransfer.files;\n if (!fileList.length) {\n return;\n }\n createFileImages(fileList);\n};\nconst createFileImages = (fileList: FileList) => {\n Array.from(fileList).forEach((file) => {\n fileTypesValid.value = FileImageTypes.includes(file.type);\n fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n if (fileTypesValid.value && fileSizeValid.value) {\n let reader: any = new FileReader();\n\n reader.onload = (f: any) => {\n if (props.multiple) {\n value.value.push({\n url: f.target.result,\n file,\n type: file.type,\n });\n } else {\n value.value.splice(0, 1, {\n url: f.target.result,\n file,\n type: file.type,\n });\n }\n\n emit('change');\n validate();\n };\n\n reader.readAsDataURL(file);\n } else {\n validate();\n }\n });\n};\nconst removeFileImage = (e: Event, index: number) => {\n e.stopPropagation();\n value.value.splice(index, 1);\n\n emit('change');\n validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n previewImage.value.url = item.url;\n previewImage.value.visible = true;\n};\n//#endregion\n\n__expose({ validate });\n\nreturn (_ctx: any,_cache: any) => {\n return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n _createVNode(BLabel, {\n label: props.label\n }, null, 8, [\"label\"]),\n _createElementVNode(\"div\", _hoisted_2, [\n (!_unref(isEmpty)(value.value))\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(value.value, (item, index) => {\n return (_openBlock(), _createElementBlock(\"div\", {\n key: index,\n class: \"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n draggable: \"true\",\n onClick: ($event: any) => (preview(item)),\n onDragend: handleDragEnd,\n onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n onDragleave: handleDragLeave,\n onDragover: handleDragOver,\n onDragstart: ($event: any) => (handleDragStart(index, $event)),\n onDrop: ($event: any) => (handleDrop(index, $event))\n }, [\n _createElementVNode(\"img\", {\n src: item.url,\n alt: \"image\",\n class: \"ds-h-full ds-w-full ds-rounded-lg\"\n }, null, 8, _hoisted_5),\n _createVNode(BImagePickerCloseButton, {\n class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n onClick: (e) => removeFileImage(e, index)\n }, null, 8, [\"onClick\"])\n ], 40, _hoisted_4))\n }), 128))\n ]))\n : _createCommentVNode(\"\", true),\n _createElementVNode(\"div\", _hoisted_6, [\n _createVNode(BButton, { onClick: openFileDialog }, {\n default: _withCtx(() => [\n _createTextVNode(_toDisplayString(_ctx.$t('ds.components.base.image_picker.select_image')), 1)\n ]),\n \"append-icon\": _withCtx(() => [\n _hoisted_7\n ]),\n _: 1\n }),\n _createElementVNode(\"input\", {\n ref_key: \"inputRef\",\n ref: inputRef,\n accept: allowedTypes.value,\n multiple: props.multiple,\n class: \"ds-hidden\",\n type: \"file\",\n onChange: onChangeInput\n }, null, 40, _hoisted_8)\n ])\n ]),\n (!props.hideDetails)\n ? (_openBlock(), _createBlock(BErrorMessage, {\n key: 0,\n \"error-message\": _unref(validationResult).errorMessage(),\n class: \"mt-1\"\n }, null, 8, [\"error-message\"]))\n : _createCommentVNode(\"\", true),\n _createVNode(ImagePreview, {\n modelValue: previewImage.value.visible,\n \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((previewImage.value.visible) = $event)),\n url: previewImage.value.url\n }, null, 8, [\"modelValue\", \"url\"])\n ]))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","n","_popScopeId","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_createElementVNode","_hoisted_8","_sfc_main","_defineComponent","__props","__expose","emit","props","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","onChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":"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"}
@@ -1,5 +1,176 @@
1
- const _ = "";
1
+ import { defineComponent as G, ref as c, computed as m, openBlock as p, createElementBlock as v, createVNode as f, createElementVNode as d, unref as b, Fragment as J, renderList as K, createCommentVNode as C, withCtx as I, createTextVNode as Q, toDisplayString as W, createBlock as X, pushScopeId as Y, popScopeId as Z } from "vue";
2
+ import { FileImageTypes as V } from "./design-system4.mjs";
3
+ import { useI18n as ee } from "./design-system48.mjs";
4
+ import te from "./design-system104.mjs";
5
+ import ae from "./design-system45.mjs";
6
+ import { useValidationField as le } from "./design-system3.mjs";
7
+ import se from "./design-system30.mjs";
8
+ import re from "./design-system11.mjs";
9
+ import oe from "./design-system29.mjs";
10
+ import de from "./design-system99.mjs";
11
+ import ne from "./design-system103.mjs";
12
+ const ie = (n) => (Y("data-v-325422c6"), n = n(), Z(), n), ue = { class: "ds-w-full" }, ce = { class: "ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow" }, pe = {
13
+ key: 0,
14
+ class: "ds-flex ds-flex-wrap ds-justify-center ds-gap-1"
15
+ }, ge = ["onClick", "onDragenter", "onDragstart", "onDrop"], me = ["src"], ve = { class: "ds-flex ds-flex-wrap ds-justify-center" }, fe = /* @__PURE__ */ ie(() => /* @__PURE__ */ d("svg", {
16
+ class: "ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t",
17
+ viewBox: "0 0 512 512",
18
+ xmlns: "http://www.w3.org/2000/svg"
19
+ }, [
20
+ /* @__PURE__ */ d("path", { d: "M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z" })
21
+ ], -1)), he = ["accept", "multiple"], Se = /* @__PURE__ */ G({
22
+ __name: "BImagePicker",
23
+ props: {
24
+ inputId: { default: "" },
25
+ modelValue: {},
26
+ label: { default: "" },
27
+ multiple: { type: Boolean, default: !1 },
28
+ maxFileSize: { default: 20 },
29
+ hideDetails: { type: Boolean, default: !1 },
30
+ required: { type: Boolean, default: !1 },
31
+ requiredErrorMessage: { default: "" },
32
+ validationRules: { default: void 0 }
33
+ },
34
+ emits: ["change", "update:modelValue"],
35
+ setup(n, { expose: x, emit: g }) {
36
+ const a = n, { t: h } = ee(), D = c(null), w = c(0), o = m({
37
+ get() {
38
+ return a.modelValue;
39
+ },
40
+ set(e) {
41
+ g("update:modelValue", e);
42
+ }
43
+ }), _ = c(!0), y = c(!0), i = c({
44
+ visible: !1,
45
+ url: ""
46
+ }), k = m(() => V.join(", ")), R = m(() => a.inputId || `id-${de()}`), S = {
47
+ validateRule: (e) => !!e && e.length > 0,
48
+ errorMessage: () => a.requiredErrorMessage || h("ds.global.field_required")
49
+ }, F = {
50
+ validateRule: () => _.value,
51
+ errorMessage: () => h("ds.components.base.image_picker.file_types_valid", {
52
+ types: k.value
53
+ })
54
+ }, z = {
55
+ validateRule: () => y.value,
56
+ errorMessage: () => h("ds.components.base.image_picker.file_size_valid", {
57
+ size: a.maxFileSize
58
+ })
59
+ }, B = m(() => {
60
+ let e = [];
61
+ return a.required && e.push(S), a.validationRules && (e = e.concat(a.validationRules)), e.push(F), e.push(z), e.length ? e : void 0;
62
+ }), { validate: u, validationResult: T } = le(
63
+ R.value,
64
+ o,
65
+ B.value
66
+ ), M = (e, t) => {
67
+ w.value = e, t.target.classList.add("dragging"), t.dataTransfer.effectAllowed = "move", t.dataTransfer.setData("index", e.toString());
68
+ }, E = (e) => {
69
+ e.target.classList.remove("dragging");
70
+ }, L = (e, t) => {
71
+ const l = t.target;
72
+ w.value !== e && l.classList.add("dropped-target");
73
+ }, $ = (e) => {
74
+ e.preventDefault(), e.dataTransfer.dropEffect = "move";
75
+ }, q = (e) => {
76
+ e.target.classList.remove("dropped-target");
77
+ }, N = (e, t) => {
78
+ t.preventDefault(), t.target.classList.remove("dropped-target");
79
+ const s = parseInt(t.dataTransfer.getData("index")), r = o.value[s];
80
+ o.value.splice(s, 1), o.value.splice(e, 0, r), g("change"), u();
81
+ }, j = () => {
82
+ var e;
83
+ (e = D.value) == null || e.click();
84
+ }, A = (e) => {
85
+ let t = e.target.files || e.dataTransfer.files;
86
+ t.length && P(t);
87
+ }, P = (e) => {
88
+ Array.from(e).forEach((t) => {
89
+ if (_.value = V.includes(t.type), y.value = H(t.size) <= a.maxFileSize, _.value && y.value) {
90
+ let l = new FileReader();
91
+ l.onload = (s) => {
92
+ a.multiple ? o.value.push({
93
+ url: s.target.result,
94
+ file: t,
95
+ type: t.type
96
+ }) : o.value.splice(0, 1, {
97
+ url: s.target.result,
98
+ file: t,
99
+ type: t.type
100
+ }), g("change"), u();
101
+ }, l.readAsDataURL(t);
102
+ } else
103
+ u();
104
+ });
105
+ }, U = (e, t) => {
106
+ e.stopPropagation(), o.value.splice(t, 1), g("change"), u();
107
+ }, H = (e) => e / 1024 ** 2, O = (e) => {
108
+ i.value.url = e.url, i.value.visible = !0;
109
+ };
110
+ return x({ validate: u }), (e, t) => (p(), v("div", ue, [
111
+ f(se, {
112
+ label: a.label
113
+ }, null, 8, ["label"]),
114
+ d("div", ce, [
115
+ b(ne)(o.value) ? C("", !0) : (p(), v("div", pe, [
116
+ (p(!0), v(J, null, K(o.value, (l, s) => (p(), v("div", {
117
+ key: s,
118
+ class: "draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t",
119
+ draggable: "true",
120
+ onClick: (r) => O(l),
121
+ onDragend: E,
122
+ onDragenter: (r) => L(s, r),
123
+ onDragleave: q,
124
+ onDragover: $,
125
+ onDragstart: (r) => M(s, r),
126
+ onDrop: (r) => N(s, r)
127
+ }, [
128
+ d("img", {
129
+ src: l.url,
130
+ alt: "image",
131
+ class: "ds-h-full ds-w-full ds-rounded-lg"
132
+ }, null, 8, me),
133
+ f(te, {
134
+ class: "ds-right-1 ds-top-1 ds-h-8 ds-w-8",
135
+ onClick: (r) => U(r, s)
136
+ }, null, 8, ["onClick"])
137
+ ], 40, ge))), 128))
138
+ ])),
139
+ d("div", ve, [
140
+ f(re, { onClick: j }, {
141
+ default: I(() => [
142
+ Q(W(e.$t("ds.components.base.image_picker.select_image")), 1)
143
+ ]),
144
+ "append-icon": I(() => [
145
+ fe
146
+ ]),
147
+ _: 1
148
+ }),
149
+ d("input", {
150
+ ref_key: "inputRef",
151
+ ref: D,
152
+ accept: k.value,
153
+ multiple: a.multiple,
154
+ class: "ds-hidden",
155
+ type: "file",
156
+ onChange: A
157
+ }, null, 40, he)
158
+ ])
159
+ ]),
160
+ a.hideDetails ? C("", !0) : (p(), X(oe, {
161
+ key: 0,
162
+ "error-message": b(T).errorMessage(),
163
+ class: "mt-1"
164
+ }, null, 8, ["error-message"])),
165
+ f(ae, {
166
+ modelValue: i.value.visible,
167
+ "onUpdate:modelValue": t[0] || (t[0] = (l) => i.value.visible = l),
168
+ url: i.value.url
169
+ }, null, 8, ["modelValue", "url"])
170
+ ]));
171
+ }
172
+ });
2
173
  export {
3
- _ as default
174
+ Se as default
4
175
  };
5
176
  //# sourceMappingURL=design-system88.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"design-system88.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
1
+ {"version":3,"file":"design-system88.mjs","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-325422c6\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n key: 0,\n class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_7 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"svg\", {\n class: \"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t\",\n viewBox: \"0 0 512 512\",\n xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n /*#__PURE__*/_createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n], -1))\nconst _hoisted_8 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n//#region Props\nexport interface Props {\n inputId?: string;\n modelValue: FileItemRead[];\n label?: string;\n multiple?: boolean;\n maxFileSize?: number;\n hideDetails?: boolean;\n required?: boolean;\n requiredErrorMessage?: string;\n validationRules?: ValidationRule[];\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n __name: 'BImagePicker',\n props: {\n inputId: { default: '' },\n modelValue: {},\n label: { default: '' },\n multiple: { type: Boolean, default: false },\n maxFileSize: { default: 20 },\n hideDetails: { type: Boolean, default: false },\n required: { type: Boolean, default: false },\n requiredErrorMessage: { default: '' },\n validationRules: { default: undefined }\n },\n emits: [\"change\", \"update:modelValue\"],\n setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n// Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\n\n//#endregion\n\n//#region Events\n\n//#endregion\n\n//#region Data\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n get() {\n return props.modelValue;\n },\n set(val) {\n emit('update:modelValue', val);\n },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n visible: false,\n url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n errorMessage: () =>\n props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n validateRule: () => fileTypesValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_types_valid', {\n types: allowedTypes.value,\n }),\n};\nconst validateFileSizeValid: ValidationRule = {\n validateRule: () => fileSizeValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_size_valid', {\n size: props.maxFileSize,\n }),\n};\nconst vRules = computed(() => {\n let result: ValidationRule[] = [];\n\n if (props.required) {\n result.push(validateRequired);\n }\n if (props.validationRules) {\n result = result.concat(props.validationRules);\n }\n result.push(validateFileTypesValid);\n result.push(validateFileSizeValid);\n\n return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n id.value,\n value,\n vRules.value,\n);\n//#endregion\n\n//#region Methods\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n draggedIndex.value = index;\n const target = e.target as HTMLDivElement;\n target.classList.add('dragging');\n e.dataTransfer!.effectAllowed = 'move';\n e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n if (draggedIndex.value !== index) {\n target.classList.add('dropped-target');\n }\n};\nconst handleDragOver = (e: DragEvent) => {\n // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n e.preventDefault();\n e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n // When the draggable p element leaves the droptarget, reset the style\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n e.preventDefault();\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n const draggedImg = value.value[draggedIndex];\n value.value.splice(draggedIndex, 1);\n value.value.splice(index, 0, draggedImg);\n\n emit('change');\n validate();\n};\nconst openFileDialog = () => {\n inputRef.value?.click();\n};\nconst onChangeInput = (e: any) => {\n let fileList: FileList = e.target.files || e.dataTransfer.files;\n if (!fileList.length) {\n return;\n }\n createFileImages(fileList);\n};\nconst createFileImages = (fileList: FileList) => {\n Array.from(fileList).forEach((file) => {\n fileTypesValid.value = FileImageTypes.includes(file.type);\n fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n if (fileTypesValid.value && fileSizeValid.value) {\n let reader: any = new FileReader();\n\n reader.onload = (f: any) => {\n if (props.multiple) {\n value.value.push({\n url: f.target.result,\n file,\n type: file.type,\n });\n } else {\n value.value.splice(0, 1, {\n url: f.target.result,\n file,\n type: file.type,\n });\n }\n\n emit('change');\n validate();\n };\n\n reader.readAsDataURL(file);\n } else {\n validate();\n }\n });\n};\nconst removeFileImage = (e: Event, index: number) => {\n e.stopPropagation();\n value.value.splice(index, 1);\n\n emit('change');\n validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n previewImage.value.url = item.url;\n previewImage.value.visible = true;\n};\n//#endregion\n\n__expose({ validate });\n\nreturn (_ctx: any,_cache: any) => {\n return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n _createVNode(BLabel, {\n label: props.label\n }, null, 8, [\"label\"]),\n _createElementVNode(\"div\", _hoisted_2, [\n (!_unref(isEmpty)(value.value))\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(value.value, (item, index) => {\n return (_openBlock(), _createElementBlock(\"div\", {\n key: index,\n class: \"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n draggable: \"true\",\n onClick: ($event: any) => (preview(item)),\n onDragend: handleDragEnd,\n onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n onDragleave: handleDragLeave,\n onDragover: handleDragOver,\n onDragstart: ($event: any) => (handleDragStart(index, $event)),\n onDrop: ($event: any) => (handleDrop(index, $event))\n }, [\n _createElementVNode(\"img\", {\n src: item.url,\n alt: \"image\",\n class: \"ds-h-full ds-w-full ds-rounded-lg\"\n }, null, 8, _hoisted_5),\n _createVNode(BImagePickerCloseButton, {\n class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n onClick: (e) => removeFileImage(e, index)\n }, null, 8, [\"onClick\"])\n ], 40, _hoisted_4))\n }), 128))\n ]))\n : _createCommentVNode(\"\", true),\n _createElementVNode(\"div\", _hoisted_6, [\n _createVNode(BButton, { onClick: openFileDialog }, {\n default: _withCtx(() => [\n _createTextVNode(_toDisplayString(_ctx.$t('ds.components.base.image_picker.select_image')), 1)\n ]),\n \"append-icon\": _withCtx(() => [\n _hoisted_7\n ]),\n _: 1\n }),\n _createElementVNode(\"input\", {\n ref_key: \"inputRef\",\n ref: inputRef,\n accept: allowedTypes.value,\n multiple: props.multiple,\n class: \"ds-hidden\",\n type: \"file\",\n onChange: onChangeInput\n }, null, 40, _hoisted_8)\n ])\n ]),\n (!props.hideDetails)\n ? (_openBlock(), _createBlock(BErrorMessage, {\n key: 0,\n \"error-message\": _unref(validationResult).errorMessage(),\n class: \"mt-1\"\n }, null, 8, [\"error-message\"]))\n : _createCommentVNode(\"\", true),\n _createVNode(ImagePreview, {\n modelValue: previewImage.value.visible,\n \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((previewImage.value.visible) = $event)),\n url: previewImage.value.url\n }, null, 8, [\"modelValue\", \"url\"])\n ]))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","_popScopeId","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_createElementVNode","_hoisted_8","_sfc_main","_defineComponent","__props","__expose","emit","props","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","onChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";const t=require("vue"),h=require("./design-system4.js"),L=require("./design-system48.js"),P=require("./design-system104.js"),j=require("./design-system46.js"),A=require("./design-system3.js"),$=require("./design-system31.js"),U=require("./design-system11.js"),H=require("./design-system30.js"),O=require("./design-system98.js"),G=require("./design-system103.js"),J=d=>(t.pushScopeId("data-v-91ede486"),d=d(),t.popScopeId(),d),K={class:"ds-w-full"},Q={class:"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow"},W={key:0,class:"ds-flex ds-flex-wrap ds-justify-center ds-gap-1"},X=["onClick","onDragenter","onDragstart","onDrop"],Y=["src"],Z={class:"ds-flex ds-flex-wrap ds-justify-center"},ee=J(()=>t.createElementVNode("svg",{class:"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t",viewBox:"0 0 512 512",xmlns:"http://www.w3.org/2000/svg"},[t.createElementVNode("path",{d:"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z"})],-1)),te=["accept","multiple"],ae=t.defineComponent({__name:"BImagePicker",props:{inputId:{default:""},modelValue:{},label:{default:""},multiple:{type:Boolean,default:!1},maxFileSize:{default:20},hideDetails:{type:Boolean,default:!1},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},validationRules:{default:void 0}},emits:["change","update:modelValue"],setup(d,{expose:y,emit:c}){const l=d,{t:p}=L.useI18n(),m=t.ref(null),_=t.ref(0),n=t.computed({get(){return l.modelValue},set(e){c("update:modelValue",e)}}),g=t.ref(!0),v=t.ref(!0),i=t.ref({visible:!1,url:""}),f=t.computed(()=>h.FileImageTypes.join(", ")),V=t.computed(()=>l.inputId||`id-${O()}`),k={validateRule:e=>!!e&&e.length>0,errorMessage:()=>l.requiredErrorMessage||p("ds.global.field_required")},B={validateRule:()=>g.value,errorMessage:()=>p("ds.components.base.image_picker.file_types_valid",{types:f.value})},D={validateRule:()=>v.value,errorMessage:()=>p("ds.components.base.image_picker.file_size_valid",{size:l.maxFileSize})},w=t.computed(()=>{let e=[];return l.required&&e.push(k),l.validationRules&&(e=e.concat(l.validationRules)),e.push(B),e.push(D),e.length?e:void 0}),{validate:u,validationResult:C}=A.useValidationField(V.value,n,w.value);y({validate:u});const I=(e,a)=>{_.value=e,a.target.classList.add("dragging"),a.dataTransfer.effectAllowed="move",a.dataTransfer.setData("index",e.toString())},b=e=>{e.target.classList.remove("dragging")},E=(e,a)=>{const s=a.target;_.value!==e&&s.classList.add("dropped-target")},q=e=>{e.preventDefault(),e.dataTransfer.dropEffect="move"},x=e=>{e.target.classList.remove("dropped-target")},F=(e,a)=>{a.preventDefault(),a.target.classList.remove("dropped-target");const r=parseInt(a.dataTransfer.getData("index")),o=n.value[r];n.value.splice(r,1),n.value.splice(e,0,o),c("change"),u()},N=()=>{var e;(e=m.value)==null||e.click()},R=e=>{let a=e.target.files||e.dataTransfer.files;a.length&&S(a)},S=e=>{Array.from(e).forEach(a=>{if(g.value=h.FileImageTypes.includes(a.type),v.value=z(a.size)<=l.maxFileSize,g.value&&v.value){let s=new FileReader;s.onload=r=>{l.multiple?n.value.push({url:r.target.result,file:a,type:a.type}):n.value.splice(0,1,{url:r.target.result,file:a,type:a.type}),c("change"),u()},s.readAsDataURL(a)}else u()})},T=(e,a)=>{e.stopPropagation(),n.value.splice(a,1),c("change"),u()},z=e=>e/1024**2,M=e=>{i.value.url=e.url,i.value.visible=!0};return(e,a)=>(t.openBlock(),t.createElementBlock("div",K,[t.createVNode($,{label:l.label},null,8,["label"]),t.createElementVNode("div",Q,[t.unref(G)(n.value)?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",W,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(n.value,(s,r)=>(t.openBlock(),t.createElementBlock("div",{key:r,class:"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t",draggable:"true",onClick:o=>M(s),onDragend:b,onDragenter:o=>E(r,o),onDragleave:x,onDragover:q,onDragstart:o=>I(r,o),onDrop:o=>F(r,o)},[t.createElementVNode("img",{src:s.url,alt:"image",class:"ds-h-full ds-w-full ds-rounded-lg"},null,8,Y),t.createVNode(P,{class:"ds-right-1 ds-top-1 ds-h-8 ds-w-8",onClick:o=>T(o,r)},null,8,["onClick"])],40,X))),128))])),t.createElementVNode("div",Z,[t.createVNode(U,{onClick:N},{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(e.$t("ds.components.base.image_picker.select_image")),1)]),"append-icon":t.withCtx(()=>[ee]),_:1}),t.createElementVNode("input",{ref_key:"inputRef",ref:m,accept:f.value,multiple:l.multiple,class:"ds-hidden",type:"file",onChange:R},null,40,te)])]),l.hideDetails?t.createCommentVNode("",!0):(t.openBlock(),t.createBlock(H,{key:0,"error-message":t.unref(C).errorMessage(),class:"mt-1"},null,8,["error-message"])),t.createVNode(j,{modelValue:i.value.visible,"onUpdate:modelValue":a[0]||(a[0]=s=>i.value.visible=s),url:i.value.url},null,8,["modelValue","url"])]))}});module.exports=ae;
1
+ "use strict";const e="";module.exports=e;
2
2
  //# sourceMappingURL=design-system89.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"design-system89.js","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-91ede486\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n key: 0,\n class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_7 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"svg\", {\n class: \"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t\",\n viewBox: \"0 0 512 512\",\n xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n /*#__PURE__*/_createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n], -1))\nconst _hoisted_8 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n/**\n * Props\n */\nexport interface Props {\n inputId?: string;\n modelValue: FileItemRead[];\n label?: string;\n multiple?: boolean;\n maxFileSize?: number;\n hideDetails?: boolean;\n required?: boolean;\n requiredErrorMessage?: string;\n validationRules?: ValidationRule[];\n}\n\nexport default /*#__PURE__*/_defineComponent({\n __name: 'BImagePicker',\n props: {\n inputId: { default: '' },\n modelValue: {},\n label: { default: '' },\n multiple: { type: Boolean, default: false },\n maxFileSize: { default: 20 },\n hideDetails: { type: Boolean, default: false },\n required: { type: Boolean, default: false },\n requiredErrorMessage: { default: '' },\n validationRules: { default: undefined }\n },\n emits: [\"change\", \"update:modelValue\"],\n setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n/**\n * Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\n */\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n get() {\n return props.modelValue;\n },\n set(val) {\n emit('update:modelValue', val);\n },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n visible: false,\n url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n errorMessage: () =>\n props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n validateRule: () => fileTypesValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_types_valid', {\n types: allowedTypes.value,\n }),\n};\nconst validateFileSizeValid: ValidationRule = {\n validateRule: () => fileSizeValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_size_valid', {\n size: props.maxFileSize,\n }),\n};\nconst vRules = computed(() => {\n let result: ValidationRule[] = [];\n\n if (props.required) {\n result.push(validateRequired);\n }\n if (props.validationRules) {\n result = result.concat(props.validationRules);\n }\n result.push(validateFileTypesValid);\n result.push(validateFileSizeValid);\n\n return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n id.value,\n value,\n vRules.value,\n);\n__expose({ validate });\n\n/**\n * Methods\n */\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n draggedIndex.value = index;\n const target = e.target as HTMLDivElement;\n target.classList.add('dragging');\n e.dataTransfer!.effectAllowed = 'move';\n e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n if (draggedIndex.value !== index) {\n target.classList.add('dropped-target');\n }\n};\nconst handleDragOver = (e: DragEvent) => {\n // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n e.preventDefault();\n e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n // When the draggable p element leaves the droptarget, reset the style\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n e.preventDefault();\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n const draggedImg = value.value[draggedIndex];\n value.value.splice(draggedIndex, 1);\n value.value.splice(index, 0, draggedImg);\n\n emit('change');\n validate();\n};\nconst openFileDialog = () => {\n inputRef.value?.click();\n};\nconst onChangeInput = (e: any) => {\n let fileList: FileList = e.target.files || e.dataTransfer.files;\n if (!fileList.length) {\n return;\n }\n createFileImages(fileList);\n};\nconst createFileImages = (fileList: FileList) => {\n Array.from(fileList).forEach((file) => {\n fileTypesValid.value = FileImageTypes.includes(file.type);\n fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n if (fileTypesValid.value && fileSizeValid.value) {\n let reader: any = new FileReader();\n\n reader.onload = (f: any) => {\n if (props.multiple) {\n value.value.push({\n url: f.target.result,\n file,\n type: file.type,\n });\n } else {\n value.value.splice(0, 1, {\n url: f.target.result,\n file,\n type: file.type,\n });\n }\n\n emit('change');\n validate();\n };\n\n reader.readAsDataURL(file);\n } else {\n validate();\n }\n });\n};\nconst removeFileImage = (e: Event, index: number) => {\n e.stopPropagation();\n value.value.splice(index, 1);\n\n emit('change');\n validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n previewImage.value.url = item.url;\n previewImage.value.visible = true;\n};\n\nreturn (_ctx: any,_cache: any) => {\n return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n _createVNode(BLabel, {\n label: props.label\n }, null, 8, [\"label\"]),\n _createElementVNode(\"div\", _hoisted_2, [\n (!_unref(isEmpty)(value.value))\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(value.value, (item, index) => {\n return (_openBlock(), _createElementBlock(\"div\", {\n key: index,\n class: \"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n draggable: \"true\",\n onClick: ($event: any) => (preview(item)),\n onDragend: handleDragEnd,\n onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n onDragleave: handleDragLeave,\n onDragover: handleDragOver,\n onDragstart: ($event: any) => (handleDragStart(index, $event)),\n onDrop: ($event: any) => (handleDrop(index, $event))\n }, [\n _createElementVNode(\"img\", {\n src: item.url,\n alt: \"image\",\n class: \"ds-h-full ds-w-full ds-rounded-lg\"\n }, null, 8, _hoisted_5),\n _createVNode(BImagePickerCloseButton, {\n class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n onClick: (e) => removeFileImage(e, index)\n }, null, 8, [\"onClick\"])\n ], 40, _hoisted_4))\n }), 128))\n ]))\n : _createCommentVNode(\"\", true),\n _createElementVNode(\"div\", _hoisted_6, [\n _createVNode(BButton, { onClick: openFileDialog }, {\n default: _withCtx(() => [\n _createTextVNode(_toDisplayString(_ctx.$t('ds.components.base.image_picker.select_image')), 1)\n ]),\n \"append-icon\": _withCtx(() => [\n _hoisted_7\n ]),\n _: 1\n }),\n _createElementVNode(\"input\", {\n ref_key: \"inputRef\",\n ref: inputRef,\n accept: allowedTypes.value,\n multiple: props.multiple,\n class: \"ds-hidden\",\n type: \"file\",\n onChange: onChangeInput\n }, null, 40, _hoisted_8)\n ])\n ]),\n (!props.hideDetails)\n ? (_openBlock(), _createBlock(BErrorMessage, {\n key: 0,\n \"error-message\": _unref(validationResult).errorMessage(),\n class: \"mt-1\"\n }, null, 8, [\"error-message\"]))\n : _createCommentVNode(\"\", true),\n _createVNode(ImagePreview, {\n modelValue: previewImage.value.visible,\n \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((previewImage.value.visible) = $event)),\n url: previewImage.value.url\n }, null, 8, [\"modelValue\", \"url\"])\n ]))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","n","_popScopeId","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_createElementVNode","_hoisted_8","_sfc_main","_defineComponent","__props","__expose","emit","props","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","onChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":"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"}
1
+ {"version":3,"file":"design-system89.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -1,178 +1,5 @@
1
- import { defineComponent as G, ref as c, computed as m, openBlock as p, createElementBlock as v, createVNode as f, createElementVNode as d, unref as b, Fragment as J, renderList as K, createCommentVNode as C, withCtx as I, createTextVNode as Q, toDisplayString as W, createBlock as X, pushScopeId as Y, popScopeId as Z } from "vue";
2
- import { FileImageTypes as V } from "./design-system4.mjs";
3
- import { useI18n as ee } from "./design-system48.mjs";
4
- import te from "./design-system104.mjs";
5
- import ae from "./design-system46.mjs";
6
- import { useValidationField as le } from "./design-system3.mjs";
7
- import se from "./design-system31.mjs";
8
- import re from "./design-system11.mjs";
9
- import oe from "./design-system30.mjs";
10
- import de from "./design-system98.mjs";
11
- import ne from "./design-system103.mjs";
12
- const ie = (n) => (Y("data-v-91ede486"), n = n(), Z(), n), ue = { class: "ds-w-full" }, ce = { class: "ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow" }, pe = {
13
- key: 0,
14
- class: "ds-flex ds-flex-wrap ds-justify-center ds-gap-1"
15
- }, ge = ["onClick", "onDragenter", "onDragstart", "onDrop"], me = ["src"], ve = { class: "ds-flex ds-flex-wrap ds-justify-center" }, fe = /* @__PURE__ */ ie(() => /* @__PURE__ */ d("svg", {
16
- class: "ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t",
17
- viewBox: "0 0 512 512",
18
- xmlns: "http://www.w3.org/2000/svg"
19
- }, [
20
- /* @__PURE__ */ d("path", { d: "M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z" })
21
- ], -1)), he = ["accept", "multiple"], Se = /* @__PURE__ */ G({
22
- __name: "BImagePicker",
23
- props: {
24
- inputId: { default: "" },
25
- modelValue: {},
26
- label: { default: "" },
27
- multiple: { type: Boolean, default: !1 },
28
- maxFileSize: { default: 20 },
29
- hideDetails: { type: Boolean, default: !1 },
30
- required: { type: Boolean, default: !1 },
31
- requiredErrorMessage: { default: "" },
32
- validationRules: { default: void 0 }
33
- },
34
- emits: ["change", "update:modelValue"],
35
- setup(n, { expose: x, emit: g }) {
36
- const a = n, { t: h } = ee(), D = c(null), w = c(0), o = m({
37
- get() {
38
- return a.modelValue;
39
- },
40
- set(e) {
41
- g("update:modelValue", e);
42
- }
43
- }), _ = c(!0), y = c(!0), i = c({
44
- visible: !1,
45
- url: ""
46
- }), k = m(() => V.join(", ")), R = m(() => a.inputId || `id-${de()}`), S = {
47
- validateRule: (e) => !!e && e.length > 0,
48
- errorMessage: () => a.requiredErrorMessage || h("ds.global.field_required")
49
- }, F = {
50
- validateRule: () => _.value,
51
- errorMessage: () => h("ds.components.base.image_picker.file_types_valid", {
52
- types: k.value
53
- })
54
- }, z = {
55
- validateRule: () => y.value,
56
- errorMessage: () => h("ds.components.base.image_picker.file_size_valid", {
57
- size: a.maxFileSize
58
- })
59
- }, B = m(() => {
60
- let e = [];
61
- return a.required && e.push(S), a.validationRules && (e = e.concat(a.validationRules)), e.push(F), e.push(z), e.length ? e : void 0;
62
- }), { validate: u, validationResult: T } = le(
63
- R.value,
64
- o,
65
- B.value
66
- );
67
- x({ validate: u });
68
- const M = (e, t) => {
69
- w.value = e, t.target.classList.add("dragging"), t.dataTransfer.effectAllowed = "move", t.dataTransfer.setData("index", e.toString());
70
- }, E = (e) => {
71
- e.target.classList.remove("dragging");
72
- }, L = (e, t) => {
73
- const l = t.target;
74
- w.value !== e && l.classList.add("dropped-target");
75
- }, $ = (e) => {
76
- e.preventDefault(), e.dataTransfer.dropEffect = "move";
77
- }, q = (e) => {
78
- e.target.classList.remove("dropped-target");
79
- }, N = (e, t) => {
80
- t.preventDefault(), t.target.classList.remove("dropped-target");
81
- const s = parseInt(t.dataTransfer.getData("index")), r = o.value[s];
82
- o.value.splice(s, 1), o.value.splice(e, 0, r), g("change"), u();
83
- }, j = () => {
84
- var e;
85
- (e = D.value) == null || e.click();
86
- }, A = (e) => {
87
- let t = e.target.files || e.dataTransfer.files;
88
- t.length && P(t);
89
- }, P = (e) => {
90
- Array.from(e).forEach((t) => {
91
- if (_.value = V.includes(t.type), y.value = H(t.size) <= a.maxFileSize, _.value && y.value) {
92
- let l = new FileReader();
93
- l.onload = (s) => {
94
- a.multiple ? o.value.push({
95
- url: s.target.result,
96
- file: t,
97
- type: t.type
98
- }) : o.value.splice(0, 1, {
99
- url: s.target.result,
100
- file: t,
101
- type: t.type
102
- }), g("change"), u();
103
- }, l.readAsDataURL(t);
104
- } else
105
- u();
106
- });
107
- }, U = (e, t) => {
108
- e.stopPropagation(), o.value.splice(t, 1), g("change"), u();
109
- }, H = (e) => e / 1024 ** 2, O = (e) => {
110
- i.value.url = e.url, i.value.visible = !0;
111
- };
112
- return (e, t) => (p(), v("div", ue, [
113
- f(se, {
114
- label: a.label
115
- }, null, 8, ["label"]),
116
- d("div", ce, [
117
- b(ne)(o.value) ? C("", !0) : (p(), v("div", pe, [
118
- (p(!0), v(J, null, K(o.value, (l, s) => (p(), v("div", {
119
- key: s,
120
- class: "draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t",
121
- draggable: "true",
122
- onClick: (r) => O(l),
123
- onDragend: E,
124
- onDragenter: (r) => L(s, r),
125
- onDragleave: q,
126
- onDragover: $,
127
- onDragstart: (r) => M(s, r),
128
- onDrop: (r) => N(s, r)
129
- }, [
130
- d("img", {
131
- src: l.url,
132
- alt: "image",
133
- class: "ds-h-full ds-w-full ds-rounded-lg"
134
- }, null, 8, me),
135
- f(te, {
136
- class: "ds-right-1 ds-top-1 ds-h-8 ds-w-8",
137
- onClick: (r) => U(r, s)
138
- }, null, 8, ["onClick"])
139
- ], 40, ge))), 128))
140
- ])),
141
- d("div", ve, [
142
- f(re, { onClick: j }, {
143
- default: I(() => [
144
- Q(W(e.$t("ds.components.base.image_picker.select_image")), 1)
145
- ]),
146
- "append-icon": I(() => [
147
- fe
148
- ]),
149
- _: 1
150
- }),
151
- d("input", {
152
- ref_key: "inputRef",
153
- ref: D,
154
- accept: k.value,
155
- multiple: a.multiple,
156
- class: "ds-hidden",
157
- type: "file",
158
- onChange: A
159
- }, null, 40, he)
160
- ])
161
- ]),
162
- a.hideDetails ? C("", !0) : (p(), X(oe, {
163
- key: 0,
164
- "error-message": b(T).errorMessage(),
165
- class: "mt-1"
166
- }, null, 8, ["error-message"])),
167
- f(ae, {
168
- modelValue: i.value.visible,
169
- "onUpdate:modelValue": t[0] || (t[0] = (l) => i.value.visible = l),
170
- url: i.value.url
171
- }, null, 8, ["modelValue", "url"])
172
- ]));
173
- }
174
- });
1
+ const e = "";
175
2
  export {
176
- Se as default
3
+ e as default
177
4
  };
178
5
  //# sourceMappingURL=design-system89.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"design-system89.mjs","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-91ede486\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n key: 0,\n class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_7 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"svg\", {\n class: \"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t\",\n viewBox: \"0 0 512 512\",\n xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n /*#__PURE__*/_createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n], -1))\nconst _hoisted_8 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n/**\n * Props\n */\nexport interface Props {\n inputId?: string;\n modelValue: FileItemRead[];\n label?: string;\n multiple?: boolean;\n maxFileSize?: number;\n hideDetails?: boolean;\n required?: boolean;\n requiredErrorMessage?: string;\n validationRules?: ValidationRule[];\n}\n\nexport default /*#__PURE__*/_defineComponent({\n __name: 'BImagePicker',\n props: {\n inputId: { default: '' },\n modelValue: {},\n label: { default: '' },\n multiple: { type: Boolean, default: false },\n maxFileSize: { default: 20 },\n hideDetails: { type: Boolean, default: false },\n required: { type: Boolean, default: false },\n requiredErrorMessage: { default: '' },\n validationRules: { default: undefined }\n },\n emits: [\"change\", \"update:modelValue\"],\n setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n/**\n * Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\n */\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n get() {\n return props.modelValue;\n },\n set(val) {\n emit('update:modelValue', val);\n },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n visible: false,\n url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n errorMessage: () =>\n props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n validateRule: () => fileTypesValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_types_valid', {\n types: allowedTypes.value,\n }),\n};\nconst validateFileSizeValid: ValidationRule = {\n validateRule: () => fileSizeValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_size_valid', {\n size: props.maxFileSize,\n }),\n};\nconst vRules = computed(() => {\n let result: ValidationRule[] = [];\n\n if (props.required) {\n result.push(validateRequired);\n }\n if (props.validationRules) {\n result = result.concat(props.validationRules);\n }\n result.push(validateFileTypesValid);\n result.push(validateFileSizeValid);\n\n return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n id.value,\n value,\n vRules.value,\n);\n__expose({ validate });\n\n/**\n * Methods\n */\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n draggedIndex.value = index;\n const target = e.target as HTMLDivElement;\n target.classList.add('dragging');\n e.dataTransfer!.effectAllowed = 'move';\n e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n if (draggedIndex.value !== index) {\n target.classList.add('dropped-target');\n }\n};\nconst handleDragOver = (e: DragEvent) => {\n // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n e.preventDefault();\n e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n // When the draggable p element leaves the droptarget, reset the style\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n e.preventDefault();\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n const draggedImg = value.value[draggedIndex];\n value.value.splice(draggedIndex, 1);\n value.value.splice(index, 0, draggedImg);\n\n emit('change');\n validate();\n};\nconst openFileDialog = () => {\n inputRef.value?.click();\n};\nconst onChangeInput = (e: any) => {\n let fileList: FileList = e.target.files || e.dataTransfer.files;\n if (!fileList.length) {\n return;\n }\n createFileImages(fileList);\n};\nconst createFileImages = (fileList: FileList) => {\n Array.from(fileList).forEach((file) => {\n fileTypesValid.value = FileImageTypes.includes(file.type);\n fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n if (fileTypesValid.value && fileSizeValid.value) {\n let reader: any = new FileReader();\n\n reader.onload = (f: any) => {\n if (props.multiple) {\n value.value.push({\n url: f.target.result,\n file,\n type: file.type,\n });\n } else {\n value.value.splice(0, 1, {\n url: f.target.result,\n file,\n type: file.type,\n });\n }\n\n emit('change');\n validate();\n };\n\n reader.readAsDataURL(file);\n } else {\n validate();\n }\n });\n};\nconst removeFileImage = (e: Event, index: number) => {\n e.stopPropagation();\n value.value.splice(index, 1);\n\n emit('change');\n validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n previewImage.value.url = item.url;\n previewImage.value.visible = true;\n};\n\nreturn (_ctx: any,_cache: any) => {\n return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n _createVNode(BLabel, {\n label: props.label\n }, null, 8, [\"label\"]),\n _createElementVNode(\"div\", _hoisted_2, [\n (!_unref(isEmpty)(value.value))\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(value.value, (item, index) => {\n return (_openBlock(), _createElementBlock(\"div\", {\n key: index,\n class: \"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n draggable: \"true\",\n onClick: ($event: any) => (preview(item)),\n onDragend: handleDragEnd,\n onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n onDragleave: handleDragLeave,\n onDragover: handleDragOver,\n onDragstart: ($event: any) => (handleDragStart(index, $event)),\n onDrop: ($event: any) => (handleDrop(index, $event))\n }, [\n _createElementVNode(\"img\", {\n src: item.url,\n alt: \"image\",\n class: \"ds-h-full ds-w-full ds-rounded-lg\"\n }, null, 8, _hoisted_5),\n _createVNode(BImagePickerCloseButton, {\n class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n onClick: (e) => removeFileImage(e, index)\n }, null, 8, [\"onClick\"])\n ], 40, _hoisted_4))\n }), 128))\n ]))\n : _createCommentVNode(\"\", true),\n _createElementVNode(\"div\", _hoisted_6, [\n _createVNode(BButton, { onClick: openFileDialog }, {\n default: _withCtx(() => [\n _createTextVNode(_toDisplayString(_ctx.$t('ds.components.base.image_picker.select_image')), 1)\n ]),\n \"append-icon\": _withCtx(() => [\n _hoisted_7\n ]),\n _: 1\n }),\n _createElementVNode(\"input\", {\n ref_key: \"inputRef\",\n ref: inputRef,\n accept: allowedTypes.value,\n multiple: props.multiple,\n class: \"ds-hidden\",\n type: \"file\",\n onChange: onChangeInput\n }, null, 40, _hoisted_8)\n ])\n ]),\n (!props.hideDetails)\n ? (_openBlock(), _createBlock(BErrorMessage, {\n key: 0,\n \"error-message\": _unref(validationResult).errorMessage(),\n class: \"mt-1\"\n }, null, 8, [\"error-message\"]))\n : _createCommentVNode(\"\", true),\n _createVNode(ImagePreview, {\n modelValue: previewImage.value.visible,\n \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((previewImage.value.visible) = $event)),\n url: previewImage.value.url\n }, null, 8, [\"modelValue\", \"url\"])\n ]))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","_popScopeId","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_createElementVNode","_hoisted_8","_sfc_main","_defineComponent","__props","__expose","emit","props","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","onChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":"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"}
1
+ {"version":3,"file":"design-system89.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,2 +1,2 @@
1
- "use strict";const e="";module.exports=e;
1
+ "use strict";const e=require("./design-system45.js");module.exports=e;
2
2
  //# sourceMappingURL=design-system90.js.map
@@ -1,5 +1,5 @@
1
- const e = "";
1
+ import f from "./design-system45.mjs";
2
2
  export {
3
- e as default
3
+ f as default
4
4
  };
5
5
  //# sourceMappingURL=design-system90.mjs.map
@@ -1,2 +1,2 @@
1
- "use strict";const e=require("./design-system46.js");module.exports=e;
1
+ "use strict";const e=require("vue"),g=require("./design-system30.js"),q=require("./design-system3.js"),B=require("./design-system29.js"),V=require("./design-system48.js"),C=require("./design-system97.js"),E=require("./design-system99.js"),N={class:"b-currency-field"},R={class:"ds-relative"},I={key:0,class:"b-currency-field__prepend-icon ds-absolute ds-left-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},M=["id","autocomplete","disabled","placeholder","readonly","onKeyup"],$={key:1,class:"b-currency-field__append-icon ds-absolute ds-right-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},w=e.defineComponent({__name:"BCurrencyField",props:{inputId:{default:""},inputCssClass:{default:""},modelValue:{},label:{default:""},validationRules:{default:void 0},placeholder:{default:""},autocomplete:{type:Boolean,default:!1},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},disabled:{type:Boolean,default:!1},hideDetails:{type:Boolean,default:!1}},emits:["press:enter","update:modelValue"],setup(c,{emit:d}){const t=c;let o;const{t:p,locale:a}=V.useI18n(),n=e.ref(null),m={validateRule:s=>!!(s&&(s!=null&&s.trim())),errorMessage:()=>t.requiredErrorMessage||p("ds.global.field_required")},r=e.computed(()=>t.inputId||`id-${E()}`),u=e.computed({get(){return t.modelValue},set(s){d("update:modelValue",s)}}),f=e.computed(()=>[{"ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4]":t.disabled,"ds-text-black/[0.85]":!t.disabled,"ds-border-error focus:ds-ring-1 focus:ds-ring-error":!l.value.valid,"ds-border-black/[0.1] focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus":l.value.valid},t.inputCssClass]),v=e.computed(()=>{let s=[];return t.required&&s.push(m),t.validationRules&&(s=s.concat(t.validationRules)),s.length?s:void 0}),_=e.computed(()=>a.value==="en-US"?{mask:"$num",blocks:{num:{mask:Number,thousandsSeparator:" "}}}:[{mask:""},{mask:"num VND",lazy:!1,blocks:{num:{mask:Number,thousandsSeparator:" "}}}]),{validate:b,validationResult:l}=q.useValidationField(r.value,u,v.value);e.watch(a,()=>{i()});const k=()=>{b()},h=()=>{d("press:enter")},y=()=>{u.value=+o.unmaskedValue},i=()=>{o&&o.destroy(),o=C(n.value,_.value),o.on("accept",y)};return e.onMounted(()=>{i()}),(s,K)=>(e.openBlock(),e.createElementBlock("div",N,[e.createVNode(g,{id:r.value,label:s.label,required:s.required},null,8,["id","label","required"]),e.createElementVNode("div",R,[s.$slots.prependIcon?(e.openBlock(),e.createElementBlock("div",I,[e.renderSlot(s.$slots,"prependIcon",{},void 0,!0)])):e.createCommentVNode("",!0),e.createElementVNode("input",{id:r.value,ref_key:"inputRef",ref:n,autocomplete:t.autocomplete?"on":"off",class:e.normalizeClass([f.value,"ds-block ds-h-[40px] ds-w-full ds-rounded-lg ds-border ds-px-3 ds-text-sm ds-drop-shadow-light"]),disabled:t.disabled,placeholder:t.placeholder,readonly:t.readonly,onKeyup:[k,e.withKeys(h,["enter"])]},null,42,M),s.$slots.appendIcon?(e.openBlock(),e.createElementBlock("div",$,[e.renderSlot(s.$slots,"appendIcon",{},void 0,!0)])):e.createCommentVNode("",!0)]),s.hideDetails?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(B,{key:0,"error-message":e.unref(l).errorMessage(),class:"ds-mt-1"},null,8,["error-message"]))]))}});module.exports=w;
2
2
  //# sourceMappingURL=design-system91.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"design-system91.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
1
+ {"version":3,"file":"design-system91.js","sources":["../src/components/BCurrencyField.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, renderSlot as _renderSlot, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, withKeys as _withKeys, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, unref as _unref, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-764d3bd1\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"b-currency-field\" }\nconst _hoisted_2 = { class: \"ds-relative\" }\nconst _hoisted_3 = {\n key: 0,\n class: \"b-currency-field__prepend-icon ds-absolute ds-left-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t\"\n}\nconst _hoisted_4 = [\"id\", \"autocomplete\", \"disabled\", \"placeholder\", \"readonly\", \"onKeyup\"]\nconst _hoisted_5 = {\n key: 1,\n class: \"b-currency-field__append-icon ds-absolute ds-right-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t\"\n}\n\nimport BLabel from '@/components/BLabel.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport { computed, onMounted, ref, watch } from 'vue';\nimport { v4 as uuid } from 'uuid';\nimport BErrorMessage from '@/components/BErrorMessage.vue';\nimport { useI18n } from 'vue-i18n';\nimport IMask from '@/vendor/imask-7.1.3.js';\n\n//#region Props\nexport interface BCurrencyFieldProps {\n inputId?: string;\n inputCssClass?: string;\n modelValue: number;\n label?: string;\n validationRules?: ValidationRule[];\n placeholder?: string;\n autocomplete?: boolean;\n /**\n * Validate if the field is left empty.\n */\n required?: boolean;\n requiredErrorMessage?: string;\n disabled?: boolean;\n /**\n * Hide the validation error message.\n */\n hideDetails?: boolean;\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n __name: 'BCurrencyField',\n props: {\n inputId: { default: '' },\n inputCssClass: { default: '' },\n modelValue: {},\n label: { default: '' },\n validationRules: { default: undefined },\n placeholder: { default: '' },\n autocomplete: { type: Boolean, default: false },\n required: { type: Boolean, default: false },\n requiredErrorMessage: { default: '' },\n disabled: { type: Boolean, default: false },\n hideDetails: { type: Boolean, default: false }\n },\n emits: [\"press:enter\", \"update:modelValue\"],\n setup(__props: any, { emit }) {\n\nconst props = __props;\n\n\n//#endregion\n\n//#region Events\n\n//#endregion\n\n//#region Data\nlet mask: any;\nconst { t, locale } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst validateRequired: ValidationRule = {\n validateRule: (val: string) => !!(val && val?.trim()),\n errorMessage: () =>\n props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst value = computed({\n get() {\n return props.modelValue;\n },\n set(val) {\n emit('update:modelValue', val);\n },\n});\nconst inputCssClassValue = computed(() => [\n {\n 'ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4]': props.disabled,\n 'ds-text-black/[0.85]': !props.disabled,\n 'ds-border-error focus:ds-ring-1 focus:ds-ring-error':\n !validationResult.value.valid,\n 'ds-border-black/[0.1] focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus':\n validationResult.value.valid,\n },\n props.inputCssClass,\n]);\nconst vRules = computed(() => {\n let result: ValidationRule[] = [];\n\n if (props.required) {\n result.push(validateRequired);\n }\n if (props.validationRules) {\n result = result.concat(props.validationRules);\n }\n\n return result.length ? result : undefined;\n});\nconst maskOptions = computed(() =>\n locale.value === 'en-US'\n ? {\n mask: '$num',\n blocks: {\n num: {\n mask: Number,\n thousandsSeparator: ' ',\n },\n },\n }\n : [\n { mask: '' },\n {\n mask: 'num VND',\n lazy: false,\n blocks: {\n num: {\n mask: Number,\n thousandsSeparator: ' ',\n },\n },\n },\n ],\n);\n\nconst { validate, validationResult } = useValidationField(\n id.value,\n value,\n vRules.value,\n);\n//#endregion\n\n//#region Watchers\nwatch(locale, () => {\n initMask();\n});\n//#endregion\n\n//#region Methods\nconst onKeyUp = () => {\n validate();\n};\nconst onKeyUpEnter = () => {\n emit('press:enter');\n};\nconst onAccept = () => {\n value.value = +mask.unmaskedValue;\n};\nconst initMask = () => {\n if (mask) {\n mask.destroy();\n }\n mask = IMask(inputRef.value!, maskOptions.value);\n mask.on('accept', onAccept);\n};\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n initMask();\n});\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n _createVNode(BLabel, {\n id: id.value,\n label: _ctx.label,\n required: _ctx.required\n }, null, 8, [\"id\", \"label\", \"required\"]),\n _createElementVNode(\"div\", _hoisted_2, [\n (_ctx.$slots.prependIcon)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n _renderSlot(_ctx.$slots, \"prependIcon\", {}, undefined, true)\n ]))\n : _createCommentVNode(\"\", true),\n _createElementVNode(\"input\", {\n id: id.value,\n ref_key: \"inputRef\",\n ref: inputRef,\n autocomplete: props.autocomplete ? 'on' : 'off',\n class: _normalizeClass([inputCssClassValue.value, \"ds-block ds-h-[40px] ds-w-full ds-rounded-lg ds-border ds-px-3 ds-text-sm ds-drop-shadow-light\"]),\n disabled: props.disabled,\n placeholder: props.placeholder,\n readonly: props.readonly,\n onKeyup: [\n onKeyUp,\n _withKeys(onKeyUpEnter, [\"enter\"])\n ]\n }, null, 42, _hoisted_4),\n (_ctx.$slots.appendIcon)\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_5, [\n _renderSlot(_ctx.$slots, \"appendIcon\", {}, undefined, true)\n ]))\n : _createCommentVNode(\"\", true)\n ]),\n (!_ctx.hideDetails)\n ? (_openBlock(), _createBlock(BErrorMessage, {\n key: 0,\n \"error-message\": _unref(validationResult).errorMessage(),\n class: \"ds-mt-1\"\n }, null, 8, [\"error-message\"]))\n : _createCommentVNode(\"\", true)\n ]))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_sfc_main","_defineComponent","__props","emit","props","mask","t","locale","useI18n","inputRef","ref","validateRequired","val","id","computed","uuid","value","inputCssClassValue","validationResult","vRules","result","maskOptions","validate","useValidationField","watch","initMask","onKeyUp","onKeyUpEnter","onAccept","IMask","onMounted","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_createElementVNode","_renderSlot","_createCommentVNode","_normalizeClass","_withKeys","_createBlock","BErrorMessage","_unref"],"mappings":"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"}