yuyeon 0.3.1 → 0.3.2-rc.10

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 (129) hide show
  1. package/dist/yuyeon.js +4861 -4714
  2. package/dist/yuyeon.umd.cjs +3 -3
  3. package/lib/components/dialog/YDialog.js +6 -1
  4. package/lib/components/dialog/YDialog.js.map +1 -1
  5. package/lib/components/divider/YDivider.scss +21 -0
  6. package/lib/components/field-input/YFieldInput.js +4 -1
  7. package/lib/components/field-input/YFieldInput.js.map +1 -1
  8. package/lib/components/input/YInput.js +2 -1
  9. package/lib/components/input/YInput.js.map +1 -1
  10. package/lib/components/select/YSelect.js.map +1 -1
  11. package/lib/components/slider/YSlider.js +1 -0
  12. package/lib/components/slider/YSlider.js.map +1 -1
  13. package/lib/components/slider/YSlider.scss +3 -0
  14. package/lib/components/slider/index.js +1 -1
  15. package/lib/components/slider/index.js.map +1 -1
  16. package/lib/components/slider/slider.js +2 -0
  17. package/lib/components/slider/slider.js.map +1 -0
  18. package/lib/components/table/YDataTable.js +32 -16
  19. package/lib/components/table/YDataTable.js.map +1 -1
  20. package/lib/components/table/YDataTableBody.js +26 -8
  21. package/lib/components/table/YDataTableBody.js.map +1 -1
  22. package/lib/components/table/YDataTableControl.js +1 -1
  23. package/lib/components/table/YDataTableControl.js.map +1 -1
  24. package/lib/components/table/YDataTableHead.js +3 -3
  25. package/lib/components/table/YDataTableHead.js.map +1 -1
  26. package/lib/components/table/YDataTableLayer.js +11 -4
  27. package/lib/components/table/YDataTableLayer.js.map +1 -1
  28. package/lib/components/table/YDataTableLayerRow.vue +146 -0
  29. package/lib/components/table/YDataTableRow.js +14 -6
  30. package/lib/components/table/YDataTableRow.js.map +1 -1
  31. package/lib/components/table/YDataTableServer.js +34 -19
  32. package/lib/components/table/YDataTableServer.js.map +1 -1
  33. package/lib/components/table/YTable.js +8 -3
  34. package/lib/components/table/YTable.js.map +1 -1
  35. package/lib/components/table/composables/expand.js +49 -0
  36. package/lib/components/table/composables/expand.js.map +1 -0
  37. package/lib/components/table/composables/header.js +127 -0
  38. package/lib/components/table/composables/header.js.map +1 -0
  39. package/lib/components/table/composables/items.js +52 -0
  40. package/lib/components/table/composables/items.js.map +1 -0
  41. package/lib/components/table/composables/measure.js +55 -0
  42. package/lib/components/table/composables/measure.js.map +1 -0
  43. package/lib/components/table/composables/options.js +33 -0
  44. package/lib/components/table/composables/options.js.map +1 -0
  45. package/lib/components/table/composables/pagination.js +99 -0
  46. package/lib/components/table/composables/pagination.js.map +1 -0
  47. package/lib/components/table/composables/provides.js +3 -0
  48. package/lib/components/table/composables/provides.js.map +1 -0
  49. package/lib/components/table/composables/selection.js +196 -0
  50. package/lib/components/table/composables/selection.js.map +1 -0
  51. package/lib/components/table/composables/sorted-items.js +50 -0
  52. package/lib/components/table/composables/sorted-items.js.map +1 -0
  53. package/lib/components/table/composables/sorting.js +73 -0
  54. package/lib/components/table/composables/sorting.js.map +1 -0
  55. package/lib/components/table/composibles/measure.js +21 -5
  56. package/lib/components/table/composibles/measure.js.map +1 -1
  57. package/lib/components/table/types/index.js.map +1 -1
  58. package/lib/components/table/types/item.js.map +1 -1
  59. package/lib/components/tree-view/YTreeView.js +8 -4
  60. package/lib/components/tree-view/YTreeView.js.map +1 -1
  61. package/lib/components/tree-view/tree-view.js +34 -4
  62. package/lib/components/tree-view/tree-view.js.map +1 -1
  63. package/lib/components/tree-view/types.js.map +1 -1
  64. package/lib/composables/theme/setting.js +3 -2
  65. package/lib/composables/theme/setting.js.map +1 -1
  66. package/lib/util/color/index.js +1 -1
  67. package/lib/util/color/index.js.map +1 -1
  68. package/package.json +1 -1
  69. package/types/abstract/items.d.ts +4 -4
  70. package/types/components/badge/YBadge.d.ts +4 -4
  71. package/types/components/button/YButton.d.ts +8 -8
  72. package/types/components/chip/YChip.d.ts +1 -1
  73. package/types/components/date-picker/YDateCalendar.d.ts +1 -1
  74. package/types/components/date-picker/YDatePicker.d.ts +12 -12
  75. package/types/components/date-picker/YDatePickerControl.d.ts +10 -10
  76. package/types/components/dialog/YDialog.d.ts +72 -72
  77. package/types/components/dropdown/YDropdown.d.ts +55 -55
  78. package/types/components/field-input/YFieldInput.d.ts +13 -13
  79. package/types/components/hover/YHover.d.ts +3 -3
  80. package/types/components/icon/YIcon.d.ts +2 -2
  81. package/types/components/img/YImg.d.ts +5 -5
  82. package/types/components/input/YInput.d.ts +10 -9
  83. package/types/components/ip-field/YIpv4Field.d.ts +1 -1
  84. package/types/components/layer/YLayer.d.ts +26 -26
  85. package/types/components/layer/content.d.ts +1 -1
  86. package/types/components/layer/scroll-strategies.d.ts +1 -1
  87. package/types/components/list/YListItem.d.ts +1 -1
  88. package/types/components/menu/YMenu.d.ts +9 -9
  89. package/types/components/pagination/YPagination.d.ts +5 -5
  90. package/types/components/select/YSelect.d.ts +101 -101
  91. package/types/components/slider/index.d.ts +1 -0
  92. package/types/components/slider/slider.d.ts +0 -0
  93. package/types/components/snackbar/YSnackbar.d.ts +33 -33
  94. package/types/components/switch/YSwitch.d.ts +10 -10
  95. package/types/components/tab/YTab.d.ts +12 -12
  96. package/types/components/tab/YTabs.d.ts +4 -4
  97. package/types/components/table/YDataTable.d.ts +37 -15
  98. package/types/components/table/YDataTableBody.d.ts +5 -3
  99. package/types/components/table/YDataTableControl.d.ts +2 -2
  100. package/types/components/table/YDataTableHead.d.ts +2 -2
  101. package/types/components/table/YDataTableLayer.d.ts +4 -1
  102. package/types/components/table/YDataTableServer.d.ts +40 -18
  103. package/types/components/table/YTable.d.ts +4 -4
  104. package/types/components/table/composables/expand.d.ts +42 -0
  105. package/types/components/table/composables/header.d.ts +207 -0
  106. package/types/components/table/composables/items.d.ts +55 -0
  107. package/types/components/table/composables/measure.d.ts +8 -0
  108. package/types/components/table/composables/options.d.ts +11 -0
  109. package/types/components/table/composables/pagination.d.ts +81 -0
  110. package/types/components/table/composables/provides.d.ts +15 -0
  111. package/types/components/table/composables/selection.d.ts +82 -0
  112. package/types/components/table/composables/sorted-items.d.ts +7 -0
  113. package/types/components/table/composables/sorting.d.ts +62 -0
  114. package/types/components/table/types/index.d.ts +2 -1
  115. package/types/components/table/types/item.d.ts +2 -1
  116. package/types/components/textarea/YTextarea.d.ts +18 -18
  117. package/types/components/tooltip/YTooltip.d.ts +46 -46
  118. package/types/components/tree-view/YTreeView.d.ts +21 -9
  119. package/types/components/tree-view/YTreeViewNode.d.ts +8 -8
  120. package/types/components/tree-view/tree-view.d.ts +2 -1
  121. package/types/components/tree-view/types.d.ts +8 -6
  122. package/types/composables/choice.d.ts +1 -1
  123. package/types/composables/coordinate/index.d.ts +8 -8
  124. package/types/composables/form.d.ts +2 -2
  125. package/types/composables/icon.d.ts +2 -2
  126. package/types/composables/list-items.d.ts +10 -10
  127. package/types/composables/theme/setting.d.ts +1 -0
  128. package/types/composables/transition.d.ts +1 -1
  129. package/types/composables/validation.d.ts +3 -3
@@ -0,0 +1,52 @@
1
+ import { computed } from 'vue';
2
+ import { getPropertyFromItem } from "../../../util/common.js";
3
+ import { propsFactory } from "../../../util/component/index.js";
4
+ export const pressDataTableItemsProps = propsFactory({
5
+ items: {
6
+ type: Array,
7
+ default: () => []
8
+ },
9
+ itemKey: {
10
+ type: [String, Array, Function],
11
+ default: 'id'
12
+ },
13
+ itemSelectable: {
14
+ type: [String, Array, Function],
15
+ default: null
16
+ },
17
+ returnItem: Boolean
18
+ }, 'YDataTable--items');
19
+ export function updateItem(props, item, index, columns) {
20
+ const key = getPropertyFromItem(item, props.itemKey);
21
+ const value = props.returnItem ? item : key;
22
+ let selectable;
23
+ if (typeof props.itemSelectable === 'function') {
24
+ selectable = !!props.itemSelectable(item);
25
+ } else {
26
+ selectable = getPropertyFromItem(item, props.itemSelectable, true);
27
+ }
28
+ const itemColumns = columns.reduce((acc, column) => {
29
+ acc[column.key] = getPropertyFromItem(item, column.value ?? column.key);
30
+ return acc;
31
+ }, {});
32
+ return {
33
+ index,
34
+ key,
35
+ value,
36
+ selectable,
37
+ columns: itemColumns,
38
+ raw: item
39
+ };
40
+ }
41
+ export function updateItems(props, items, columns) {
42
+ return items.map((item, index) => updateItem(props, item, index, columns));
43
+ }
44
+ export function useItems(props, columns) {
45
+ const items = computed(() => {
46
+ return updateItems(props, props.items, columns.value);
47
+ });
48
+ return {
49
+ items
50
+ };
51
+ }
52
+ //# sourceMappingURL=items.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"items.js","names":["computed","getPropertyFromItem","propsFactory","pressDataTableItemsProps","items","type","Array","default","itemKey","String","Function","itemSelectable","returnItem","Boolean","updateItem","props","item","index","columns","key","value","selectable","itemColumns","reduce","acc","column","raw","updateItems","map","useItems"],"sources":["../../../../src/components/table/composables/items.ts"],"sourcesContent":["import { type PropType, type Ref, computed } from 'vue';\r\n\r\nimport { getPropertyFromItem } from '@/util/common';\r\nimport { propsFactory } from '@/util/component';\r\n\r\nimport { DataTableItem, InternalDataTableHeader } from '../types';\r\n\r\nexport type DataTableItemsProps = {\r\n items: any[];\r\n itemKey: any;\r\n itemSelectable: any;\r\n returnItem: boolean;\r\n};\r\n\r\nexport const pressDataTableItemsProps = propsFactory(\r\n {\r\n items: {\r\n type: Array as PropType<DataTableItemsProps['items']>,\r\n default: () => [],\r\n },\r\n itemKey: {\r\n type: [String, Array, Function] as PropType<any>,\r\n default: 'id',\r\n },\r\n itemSelectable: {\r\n type: [String, Array, Function] as PropType<any>,\r\n default: null,\r\n },\r\n returnItem: Boolean,\r\n },\r\n 'YDataTable--items',\r\n);\r\n\r\nexport function updateItem(\r\n props: Omit<DataTableItemsProps, 'items'>,\r\n item: any,\r\n index: number,\r\n columns: InternalDataTableHeader[],\r\n): DataTableItem {\r\n const key = getPropertyFromItem(item, props.itemKey);\r\n const value = props.returnItem ? item : key;\r\n let selectable;\r\n if (typeof props.itemSelectable === 'function') {\r\n selectable = !!props.itemSelectable(item);\r\n } else {\r\n selectable = getPropertyFromItem(item, props.itemSelectable, true);\r\n }\r\n\r\n const itemColumns = columns.reduce(\r\n (acc, column) => {\r\n acc[column.key] = getPropertyFromItem(item, column.value ?? column.key);\r\n return acc;\r\n },\r\n {} as Record<string, unknown>,\r\n );\r\n\r\n return {\r\n index,\r\n key,\r\n value,\r\n selectable,\r\n columns: itemColumns,\r\n raw: item,\r\n };\r\n}\r\n\r\nexport function updateItems(\r\n props: Omit<DataTableItemsProps, 'items'>,\r\n items: DataTableItemsProps['items'],\r\n columns: InternalDataTableHeader[],\r\n): DataTableItem[] {\r\n return items.map((item, index) => updateItem(props, item, index, columns));\r\n}\r\n\r\nexport function useItems(\r\n props: DataTableItemsProps,\r\n columns: Ref<InternalDataTableHeader[]>,\r\n) {\r\n const items = computed(() => {\r\n return updateItems(props, props.items, columns.value);\r\n });\r\n return { items };\r\n}\r\n"],"mappings":"AAAA,SAAkCA,QAAQ,QAAQ,KAAK;AAAC,SAE/CC,mBAAmB;AAAA,SACnBC,YAAY;AAWrB,OAAO,MAAMC,wBAAwB,GAAGD,YAAY,CAClD;EACEE,KAAK,EAAE;IACLC,IAAI,EAAEC,KAA+C;IACrDC,OAAO,EAAEA,CAAA,KAAM;EACjB,CAAC;EACDC,OAAO,EAAE;IACPH,IAAI,EAAE,CAACI,MAAM,EAAEH,KAAK,EAAEI,QAAQ,CAAkB;IAChDH,OAAO,EAAE;EACX,CAAC;EACDI,cAAc,EAAE;IACdN,IAAI,EAAE,CAACI,MAAM,EAAEH,KAAK,EAAEI,QAAQ,CAAkB;IAChDH,OAAO,EAAE;EACX,CAAC;EACDK,UAAU,EAAEC;AACd,CAAC,EACD,mBACF,CAAC;AAED,OAAO,SAASC,UAAUA,CACxBC,KAAyC,EACzCC,IAAS,EACTC,KAAa,EACbC,OAAkC,EACnB;EACf,MAAMC,GAAG,GAAGlB,mBAAmB,CAACe,IAAI,EAAED,KAAK,CAACP,OAAO,CAAC;EACpD,MAAMY,KAAK,GAAGL,KAAK,CAACH,UAAU,GAAGI,IAAI,GAAGG,GAAG;EAC3C,IAAIE,UAAU;EACd,IAAI,OAAON,KAAK,CAACJ,cAAc,KAAK,UAAU,EAAE;IAC9CU,UAAU,GAAG,CAAC,CAACN,KAAK,CAACJ,cAAc,CAACK,IAAI,CAAC;EAC3C,CAAC,MAAM;IACLK,UAAU,GAAGpB,mBAAmB,CAACe,IAAI,EAAED,KAAK,CAACJ,cAAc,EAAE,IAAI,CAAC;EACpE;EAEA,MAAMW,WAAW,GAAGJ,OAAO,CAACK,MAAM,CAChC,CAACC,GAAG,EAAEC,MAAM,KAAK;IACfD,GAAG,CAACC,MAAM,CAACN,GAAG,CAAC,GAAGlB,mBAAmB,CAACe,IAAI,EAAES,MAAM,CAACL,KAAK,IAAIK,MAAM,CAACN,GAAG,CAAC;IACvE,OAAOK,GAAG;EACZ,CAAC,EACD,CAAC,CACH,CAAC;EAED,OAAO;IACLP,KAAK;IACLE,GAAG;IACHC,KAAK;IACLC,UAAU;IACVH,OAAO,EAAEI,WAAW;IACpBI,GAAG,EAAEV;EACP,CAAC;AACH;AAEA,OAAO,SAASW,WAAWA,CACzBZ,KAAyC,EACzCX,KAAmC,EACnCc,OAAkC,EACjB;EACjB,OAAOd,KAAK,CAACwB,GAAG,CAAC,CAACZ,IAAI,EAAEC,KAAK,KAAKH,UAAU,CAACC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAEC,OAAO,CAAC,CAAC;AAC5E;AAEA,OAAO,SAASW,QAAQA,CACtBd,KAA0B,EAC1BG,OAAuC,EACvC;EACA,MAAMd,KAAK,GAAGJ,QAAQ,CAAC,MAAM;IAC3B,OAAO2B,WAAW,CAACZ,KAAK,EAAEA,KAAK,CAACX,KAAK,EAAEc,OAAO,CAACE,KAAK,CAAC;EACvD,CAAC,CAAC;EACF,OAAO;IAAEhB;EAAM,CAAC;AAClB"}
@@ -0,0 +1,55 @@
1
+ import { ref, shallowRef, watch } from 'vue';
2
+ import { useResizeObserver } from "../../../composables/resize-observer.js";
3
+ import { debounce } from "../../../util/debounce.js";
4
+ export function useRectMeasure() {
5
+ const tableRef = ref();
6
+ const wrapperRef = ref();
7
+ const containerRect = shallowRef();
8
+ const wrapperRect = shallowRef();
9
+ const tableRect = shallowRef();
10
+ const debounceMeasure = debounce(measure, 100);
11
+ const {
12
+ resizeObservedRef: containerRef
13
+ } = useResizeObserver(entries => {
14
+ debounceMeasure(entries);
15
+ });
16
+ function measure(entries) {
17
+ containerRect.value = entries?.[0]?.contentRect;
18
+ if (wrapperRef.value) {
19
+ const rect = wrapperRef.value.getBoundingClientRect();
20
+ if (rect) {
21
+ const obj = {};
22
+ for (const key in rect) {
23
+ if (typeof rect[key] !== "function") {
24
+ obj[key] = rect[key];
25
+ }
26
+ }
27
+ wrapperRect.value = {
28
+ ...obj,
29
+ clientWidth: wrapperRef.value?.clientWidth ?? 0
30
+ };
31
+ }
32
+ }
33
+ if (tableRef.value) {
34
+ const rect = tableRef.value?.getBoundingClientRect();
35
+ if (rect) {
36
+ tableRect.value = rect;
37
+ }
38
+ }
39
+ }
40
+ watch(tableRef, neo => {
41
+ if (neo) {
42
+ const el = containerRef.value;
43
+ wrapperRef.value = el.querySelector('.y-table__wrapper') || undefined;
44
+ }
45
+ });
46
+ return {
47
+ containerRef,
48
+ wrapperRef,
49
+ tableRef,
50
+ containerRect,
51
+ wrapperRect,
52
+ tableRect
53
+ };
54
+ }
55
+ //# sourceMappingURL=measure.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"measure.js","names":["ref","shallowRef","watch","useResizeObserver","debounce","useRectMeasure","tableRef","wrapperRef","containerRect","wrapperRect","tableRect","debounceMeasure","measure","resizeObservedRef","containerRef","entries","value","contentRect","rect","getBoundingClientRect","obj","key","clientWidth","neo","el","querySelector","undefined"],"sources":["../../../../src/components/table/composables/measure.ts"],"sourcesContent":["import { ref, shallowRef, watch } from 'vue';\n\nimport { useResizeObserver } from '@/composables/resize-observer';\nimport { debounce } from '@/util/debounce';\n\nexport function useRectMeasure() {\n const tableRef = ref<HTMLTableElement>();\n const wrapperRef = ref<HTMLElement>();\n\n const containerRect = shallowRef<DOMRectReadOnly>();\n const wrapperRect = shallowRef<DOMRectReadOnly>();\n const tableRect = shallowRef<DOMRectReadOnly>();\n\n const debounceMeasure = debounce(measure, 100);\n\n const { resizeObservedRef: containerRef } = useResizeObserver((entries) => {\n debounceMeasure(entries);\n });\n\n function measure(entries: any) {\n containerRect.value = entries?.[0]?.contentRect;\n\n if (wrapperRef.value) {\n const rect = wrapperRef.value.getBoundingClientRect();\n\n if (rect) {\n const obj: any = {};\n for (const key in rect) {\n if (typeof rect[key as keyof DOMRect] !== \"function\") {\n obj[key] = rect[key as keyof DOMRect];\n }\n }\n wrapperRect.value = {\n ...obj,\n clientWidth: wrapperRef.value?.clientWidth ?? 0,\n };\n }\n\n }\n\n if (tableRef.value) {\n const rect = tableRef.value?.getBoundingClientRect();\n if (rect) {\n tableRect.value = rect;\n }\n }\n }\n\n watch(tableRef, (neo) => {\n if (neo) {\n const el = containerRef.value!;\n wrapperRef.value = el.querySelector('.y-table__wrapper') as HTMLElement || undefined;\n }\n })\n\n return {\n containerRef,\n wrapperRef,\n tableRef,\n containerRect,\n wrapperRect,\n tableRect,\n };\n}\n"],"mappings":"AAAA,SAASA,GAAG,EAAEC,UAAU,EAAEC,KAAK,QAAQ,KAAK;AAAC,SAEpCC,iBAAiB;AAAA,SACjBC,QAAQ;AAEjB,OAAO,SAASC,cAAcA,CAAA,EAAG;EAC/B,MAAMC,QAAQ,GAAGN,GAAG,CAAmB,CAAC;EACxC,MAAMO,UAAU,GAAGP,GAAG,CAAc,CAAC;EAErC,MAAMQ,aAAa,GAAGP,UAAU,CAAkB,CAAC;EACnD,MAAMQ,WAAW,GAAGR,UAAU,CAAkB,CAAC;EACjD,MAAMS,SAAS,GAAGT,UAAU,CAAkB,CAAC;EAE/C,MAAMU,eAAe,GAAGP,QAAQ,CAACQ,OAAO,EAAE,GAAG,CAAC;EAE9C,MAAM;IAAEC,iBAAiB,EAAEC;EAAa,CAAC,GAAGX,iBAAiB,CAAEY,OAAO,IAAK;IACzEJ,eAAe,CAACI,OAAO,CAAC;EAC1B,CAAC,CAAC;EAEF,SAASH,OAAOA,CAACG,OAAY,EAAE;IAC7BP,aAAa,CAACQ,KAAK,GAAGD,OAAO,GAAG,CAAC,CAAC,EAAEE,WAAW;IAE/C,IAAIV,UAAU,CAACS,KAAK,EAAE;MACpB,MAAME,IAAI,GAAGX,UAAU,CAACS,KAAK,CAACG,qBAAqB,CAAC,CAAC;MAErD,IAAID,IAAI,EAAE;QACR,MAAME,GAAQ,GAAG,CAAC,CAAC;QACnB,KAAK,MAAMC,GAAG,IAAIH,IAAI,EAAE;UACtB,IAAI,OAAOA,IAAI,CAACG,GAAG,CAAkB,KAAK,UAAU,EAAE;YACpDD,GAAG,CAACC,GAAG,CAAC,GAAGH,IAAI,CAACG,GAAG,CAAkB;UACvC;QACF;QACAZ,WAAW,CAACO,KAAK,GAAG;UAClB,GAAGI,GAAG;UACNE,WAAW,EAAEf,UAAU,CAACS,KAAK,EAAEM,WAAW,IAAI;QAChD,CAAC;MACH;IAEF;IAEA,IAAIhB,QAAQ,CAACU,KAAK,EAAE;MAClB,MAAME,IAAI,GAAGZ,QAAQ,CAACU,KAAK,EAAEG,qBAAqB,CAAC,CAAC;MACpD,IAAID,IAAI,EAAE;QACRR,SAAS,CAACM,KAAK,GAAGE,IAAI;MACxB;IACF;EACF;EAEAhB,KAAK,CAACI,QAAQ,EAAGiB,GAAG,IAAK;IACvB,IAAIA,GAAG,EAAE;MACP,MAAMC,EAAE,GAAGV,YAAY,CAACE,KAAM;MAC9BT,UAAU,CAACS,KAAK,GAAGQ,EAAE,CAACC,aAAa,CAAC,mBAAmB,CAAC,IAAmBC,SAAS;IACtF;EACF,CAAC,CAAC;EAEF,OAAO;IACLZ,YAAY;IACZP,UAAU;IACVD,QAAQ;IACRE,aAAa;IACbC,WAAW;IACXC;EACF,CAAC;AACH"}
@@ -0,0 +1,33 @@
1
+ import { computed, watch } from 'vue';
2
+ import { deepEqual } from "../../../util/common.js";
3
+ export function useOptions(_ref, emit) {
4
+ let {
5
+ page,
6
+ pageSize,
7
+ sortBy,
8
+ search
9
+ } = _ref;
10
+ const options = computed(() => {
11
+ return {
12
+ page: page.value,
13
+ pageSize: pageSize.value,
14
+ sortBy: sortBy.value,
15
+ search: search.value
16
+ };
17
+ });
18
+ watch(() => search?.value, () => {
19
+ page.value = 1;
20
+ });
21
+ let optionsCache = null;
22
+ watch(options, () => {
23
+ if (deepEqual(optionsCache, options.value)) {
24
+ return;
25
+ }
26
+ emit('update:options', options.value);
27
+ optionsCache = options.value;
28
+ }, {
29
+ deep: true,
30
+ immediate: true
31
+ });
32
+ }
33
+ //# sourceMappingURL=options.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"options.js","names":["computed","watch","deepEqual","useOptions","_ref","emit","page","pageSize","sortBy","search","options","value","optionsCache","deep","immediate"],"sources":["../../../../src/components/table/composables/options.ts"],"sourcesContent":["import { type Ref, computed, watch } from 'vue';\r\n\r\nimport { deepEqual } from '@/util/common';\r\n\r\nimport { SortOption } from '../types';\r\n\r\ntype DataTableOptionsState = {\r\n page: Ref<number>;\r\n pageSize: Ref<number>;\r\n sortBy: Ref<readonly SortOption[]>;\r\n search: Ref<string | undefined>;\r\n};\r\n\r\nexport function useOptions(\r\n { page, pageSize, sortBy, search }: DataTableOptionsState,\r\n emit: Function,\r\n) {\r\n const options = computed(() => {\r\n return {\r\n page: page.value,\r\n pageSize: pageSize.value,\r\n sortBy: sortBy.value,\r\n search: search.value,\r\n };\r\n });\r\n\r\n watch(\r\n () => search?.value,\r\n () => {\r\n page.value = 1;\r\n },\r\n );\r\n\r\n let optionsCache = null as unknown;\r\n\r\n watch(\r\n options,\r\n () => {\r\n if (deepEqual(optionsCache, options.value)) {\r\n return;\r\n }\r\n emit('update:options', options.value);\r\n optionsCache = options.value;\r\n },\r\n { deep: true, immediate: true },\r\n );\r\n}\r\n"],"mappings":"AAAA,SAAmBA,QAAQ,EAAEC,KAAK,QAAQ,KAAK;AAAC,SAEvCC,SAAS;AAWlB,OAAO,SAASC,UAAUA,CAAAC,IAAA,EAExBC,IAAc,EACd;EAAA,IAFA;IAAEC,IAAI;IAAEC,QAAQ;IAAEC,MAAM;IAAEC;EAA8B,CAAC,GAAAL,IAAA;EAGzD,MAAMM,OAAO,GAAGV,QAAQ,CAAC,MAAM;IAC7B,OAAO;MACLM,IAAI,EAAEA,IAAI,CAACK,KAAK;MAChBJ,QAAQ,EAAEA,QAAQ,CAACI,KAAK;MACxBH,MAAM,EAAEA,MAAM,CAACG,KAAK;MACpBF,MAAM,EAAEA,MAAM,CAACE;IACjB,CAAC;EACH,CAAC,CAAC;EAEFV,KAAK,CACH,MAAMQ,MAAM,EAAEE,KAAK,EACnB,MAAM;IACJL,IAAI,CAACK,KAAK,GAAG,CAAC;EAChB,CACF,CAAC;EAED,IAAIC,YAAY,GAAG,IAAe;EAElCX,KAAK,CACHS,OAAO,EACP,MAAM;IACJ,IAAIR,SAAS,CAACU,YAAY,EAAEF,OAAO,CAACC,KAAK,CAAC,EAAE;MAC1C;IACF;IACAN,IAAI,CAAC,gBAAgB,EAAEK,OAAO,CAACC,KAAK,CAAC;IACrCC,YAAY,GAAGF,OAAO,CAACC,KAAK;EAC9B,CAAC,EACD;IAAEE,IAAI,EAAE,IAAI;IAAEC,SAAS,EAAE;EAAK,CAChC,CAAC;AACH"}
@@ -0,0 +1,99 @@
1
+ import { computed, inject, provide, watch } from 'vue';
2
+ import { useModelDuplex } from "../../../composables/communication.js";
3
+ import { clamp } from "../../../util/common.js";
4
+ import { propsFactory } from "../../../util/component/index.js";
5
+ export const Y_DATA_TABLE_PAGINATION_KEY = Symbol.for('yuyeon.data-table.pagination');
6
+ export const pressDataTablePaginationProps = propsFactory({
7
+ page: {
8
+ type: [Number, String],
9
+ default: 1
10
+ },
11
+ pageSize: {
12
+ type: [Number, String],
13
+ default: 10
14
+ }
15
+ }, 'YDataTable--pagination');
16
+ export function createPagination(props) {
17
+ const page = useModelDuplex(props, 'page', undefined, value => +(value ?? 1));
18
+ const pageSize = useModelDuplex(props, 'pageSize', undefined, value => +(value ?? 10));
19
+ return {
20
+ page,
21
+ pageSize
22
+ };
23
+ }
24
+ export function providePagination(options) {
25
+ const {
26
+ page,
27
+ pageSize,
28
+ total
29
+ } = options;
30
+ const startIndex = computed(() => {
31
+ if (pageSize.value === -1) return 0;
32
+ return pageSize.value * (page.value - 1);
33
+ });
34
+ const endIndex = computed(() => {
35
+ if (pageSize.value === -1) return total.value;
36
+ return Math.min(total.value, startIndex.value + pageSize.value);
37
+ });
38
+ const pageLength = computed(() => {
39
+ if (pageSize.value === -1 || total.value === 0) return 1;
40
+ return Math.ceil(total.value / pageSize.value);
41
+ });
42
+ watch([page, pageLength], () => {
43
+ if (page.value > pageLength.value) {
44
+ page.value = pageLength.value;
45
+ }
46
+ });
47
+ function setPageSize(value, noReset) {
48
+ pageSize.value = value;
49
+ if (!noReset) {
50
+ page.value = 1;
51
+ }
52
+ }
53
+ function nextPage() {
54
+ page.value = clamp(page.value + 1, 1, pageLength.value);
55
+ }
56
+ function prevPage() {
57
+ page.value = clamp(page.value - 1, 1, pageLength.value);
58
+ }
59
+ function setPage(value) {
60
+ page.value = clamp(value, 1, pageLength.value);
61
+ }
62
+ const data = {
63
+ page,
64
+ pageSize,
65
+ startIndex,
66
+ endIndex,
67
+ pageLength,
68
+ total,
69
+ nextPage,
70
+ prevPage,
71
+ setPage,
72
+ setPageSize
73
+ };
74
+ provide(Y_DATA_TABLE_PAGINATION_KEY, data);
75
+ return data;
76
+ }
77
+ export function usePagination() {
78
+ const data = inject(Y_DATA_TABLE_PAGINATION_KEY);
79
+ if (!data) {
80
+ throw new Error(`Not provided: ${Y_DATA_TABLE_PAGINATION_KEY.description}`);
81
+ }
82
+ return data;
83
+ }
84
+ export function usePaginatedItems(options) {
85
+ const {
86
+ items,
87
+ startIndex,
88
+ endIndex,
89
+ pageSize
90
+ } = options;
91
+ const paginatedItems = computed(() => {
92
+ if (pageSize.value <= 0) return items.value;
93
+ return items.value.slice(startIndex.value, endIndex.value);
94
+ });
95
+ return {
96
+ paginatedItems
97
+ };
98
+ }
99
+ //# sourceMappingURL=pagination.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"pagination.js","names":["computed","inject","provide","watch","useModelDuplex","clamp","propsFactory","Y_DATA_TABLE_PAGINATION_KEY","Symbol","for","pressDataTablePaginationProps","page","type","Number","String","default","pageSize","createPagination","props","undefined","value","providePagination","options","total","startIndex","endIndex","Math","min","pageLength","ceil","setPageSize","noReset","nextPage","prevPage","setPage","data","usePagination","Error","description","usePaginatedItems","items","paginatedItems","slice"],"sources":["../../../../src/components/table/composables/pagination.ts"],"sourcesContent":["import type { InjectionKey, PropType, Ref } from 'vue';\r\nimport { computed, inject, provide, watch } from 'vue';\r\n\r\nimport { useModelDuplex } from '@/composables/communication';\r\nimport { clamp } from '@/util/common';\r\nimport { propsFactory } from '@/util/component';\r\n\r\nimport { DataTableProvidePaginationData } from '../types';\r\n\r\nexport const Y_DATA_TABLE_PAGINATION_KEY: InjectionKey<{\r\n page: Ref<number>;\r\n pageSize: Ref<number>;\r\n startIndex: Ref<number>;\r\n endIndex: Ref<number>;\r\n pageLength: Ref<number>;\r\n total: Ref<number>;\r\n prevPage: () => void;\r\n nextPage: () => void;\r\n setPage: (page: number) => void;\r\n setPageSize: (size: number) => void;\r\n}> = Symbol.for('yuyeon.data-table.pagination');\r\n\r\nexport const pressDataTablePaginationProps = propsFactory(\r\n {\r\n page: {\r\n type: [Number, String] as PropType<number | string>,\r\n default: 1,\r\n },\r\n pageSize: {\r\n type: [Number, String] as PropType<number | string>,\r\n default: 10,\r\n },\r\n },\r\n 'YDataTable--pagination',\r\n);\r\n\r\ntype PaginationProps = {\r\n page: number | string;\r\n 'onUpdate:page': ((v: any) => void) | undefined;\r\n pageSize: number | string;\r\n 'onUpdate:pageSize': ((v: any) => void) | undefined;\r\n total?: number | string;\r\n};\r\n\r\nexport function createPagination(props: PaginationProps) {\r\n const page = useModelDuplex(\r\n props,\r\n 'page',\r\n undefined,\r\n (value) => +(value ?? 1),\r\n );\r\n const pageSize = useModelDuplex(\r\n props,\r\n 'pageSize',\r\n undefined,\r\n (value) => +(value ?? 10),\r\n );\r\n return { page, pageSize };\r\n}\r\n\r\nexport function providePagination(options: {\r\n page: Ref<number>;\r\n pageSize: Ref<number>;\r\n total: Ref<number>;\r\n}) {\r\n const { page, pageSize, total } = options;\r\n const startIndex = computed(() => {\r\n if (pageSize.value === -1) return 0;\r\n\r\n return pageSize.value * (page.value - 1);\r\n });\r\n\r\n const endIndex = computed(() => {\r\n if (pageSize.value === -1) return total.value;\r\n\r\n return Math.min(total.value, startIndex.value + pageSize.value);\r\n });\r\n\r\n const pageLength = computed(() => {\r\n if (pageSize.value === -1 || total.value === 0) return 1;\r\n\r\n return Math.ceil(total.value / pageSize.value);\r\n });\r\n\r\n watch([page, pageLength], () => {\r\n if (page.value > pageLength.value) {\r\n page.value = pageLength.value;\r\n }\r\n });\r\n\r\n function setPageSize(value: number, noReset?: boolean) {\r\n pageSize.value = value;\r\n if (!noReset) {\r\n page.value = 1;\r\n }\r\n }\r\n\r\n function nextPage() {\r\n page.value = clamp(page.value + 1, 1, pageLength.value);\r\n }\r\n\r\n function prevPage() {\r\n page.value = clamp(page.value - 1, 1, pageLength.value);\r\n }\r\n\r\n function setPage(value: number) {\r\n page.value = clamp(value, 1, pageLength.value);\r\n }\r\n\r\n const data: DataTableProvidePaginationData = {\r\n page,\r\n pageSize,\r\n startIndex,\r\n endIndex,\r\n pageLength,\r\n total,\r\n nextPage,\r\n prevPage,\r\n setPage,\r\n setPageSize,\r\n };\r\n\r\n provide(Y_DATA_TABLE_PAGINATION_KEY, data);\r\n\r\n return data;\r\n}\r\n\r\nexport function usePagination() {\r\n const data = inject(Y_DATA_TABLE_PAGINATION_KEY);\r\n if (!data) {\r\n throw new Error(`Not provided: ${Y_DATA_TABLE_PAGINATION_KEY.description}`);\r\n }\r\n return data;\r\n}\r\n\r\nexport function usePaginatedItems<T>(options: {\r\n items: Ref<readonly T[]>;\r\n startIndex: Ref<number>;\r\n endIndex: Ref<number>;\r\n pageSize: Ref<number>;\r\n}) {\r\n const { items, startIndex, endIndex, pageSize } = options;\r\n const paginatedItems = computed(() => {\r\n if (pageSize.value <= 0) return items.value;\r\n\r\n return items.value.slice(startIndex.value, endIndex.value);\r\n });\r\n\r\n return { paginatedItems };\r\n}\r\n"],"mappings":"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"}
@@ -0,0 +1,3 @@
1
+ export const YTableInjectionKey = Symbol.for('y-table');
2
+ export const YDataTableInjectionKey = Symbol.for('y-data-table');
3
+ //# sourceMappingURL=provides.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"provides.js","names":["YTableInjectionKey","Symbol","for","YDataTableInjectionKey"],"sources":["../../../../src/components/table/composables/provides.ts"],"sourcesContent":["import { type InjectionKey, Ref, ShallowRef } from 'vue';\nimport type { InternalDataTableHeader } from '@/components/table/types';\nimport { createSorting } from '@/components/table/composables/sorting';\n\nexport const YTableInjectionKey: InjectionKey<{\n tableRef: Ref<HTMLTableElement | undefined>\n containerRect: ShallowRef<DOMRectReadOnly | undefined>\n wrapperRef: Ref<HTMLElement | undefined>\n wrapperRect: ShallowRef<DOMRectReadOnly | undefined>\n}> = Symbol.for('y-table');\n\nexport const YDataTableInjectionKey: InjectionKey<{\n toggleSort: (column: InternalDataTableHeader) => void;\n sortBy: ReturnType<typeof createSorting>['sortBy']\n headRect: Ref<DOMRectReadOnly | undefined>\n}> =\n Symbol.for('y-data-table');\n"],"mappings":"AAIA,OAAO,MAAMA,kBAKX,GAAGC,MAAM,CAACC,GAAG,CAAC,SAAS,CAAC;AAE1B,OAAO,MAAMC,sBAIX,GACAF,MAAM,CAACC,GAAG,CAAC,cAAc,CAAC"}
@@ -0,0 +1,196 @@
1
+ import { computed, inject, provide } from 'vue';
2
+ import { useModelDuplex } from "../../../composables/communication.js";
3
+ import { wrapInArray } from "../../../util/array.js";
4
+ import { deepEqual, getPropertyFromItem } from "../../../util/common.js";
5
+ import { propsFactory } from "../../../util/component/index.js";
6
+ export const pressDataTableSelectionProps = propsFactory({
7
+ enableSelect: Boolean,
8
+ selectStrategy: {
9
+ type: [String, Object],
10
+ default: 'page'
11
+ },
12
+ modelValue: {
13
+ type: Array,
14
+ default: () => []
15
+ },
16
+ itemComparator: {
17
+ type: [Function, String],
18
+ default: () => deepEqual
19
+ }
20
+ }, 'YDataTable--selection');
21
+ const singleSelectStrategy = {
22
+ showSelectAll: false,
23
+ allSelected: () => [],
24
+ select: _ref => {
25
+ let {
26
+ items,
27
+ value
28
+ } = _ref;
29
+ return new Set(value ? [items[0]?.value] : []);
30
+ },
31
+ selectAll: _ref2 => {
32
+ let {
33
+ selected
34
+ } = _ref2;
35
+ return selected;
36
+ }
37
+ };
38
+ const pageSelectStrategy = {
39
+ showSelectAll: true,
40
+ allSelected: _ref3 => {
41
+ let {
42
+ pageItems
43
+ } = _ref3;
44
+ return pageItems;
45
+ },
46
+ select: _ref4 => {
47
+ let {
48
+ items,
49
+ value,
50
+ selected
51
+ } = _ref4;
52
+ for (const item of items) {
53
+ if (value) selected.add(item.value);else selected.delete(item.value);
54
+ }
55
+ return selected;
56
+ },
57
+ selectAll: _ref5 => {
58
+ let {
59
+ value,
60
+ pageItems,
61
+ selected
62
+ } = _ref5;
63
+ return pageSelectStrategy.select({
64
+ items: pageItems,
65
+ value,
66
+ selected
67
+ });
68
+ }
69
+ };
70
+ const allSelectStrategy = {
71
+ showSelectAll: true,
72
+ allSelected: _ref6 => {
73
+ let {
74
+ allItems
75
+ } = _ref6;
76
+ return allItems;
77
+ },
78
+ select: _ref7 => {
79
+ let {
80
+ items,
81
+ value,
82
+ selected
83
+ } = _ref7;
84
+ for (const item of items) {
85
+ if (value) selected.add(item.value);else selected.delete(item.value);
86
+ }
87
+ return selected;
88
+ },
89
+ selectAll: _ref8 => {
90
+ let {
91
+ value,
92
+ allItems,
93
+ selected
94
+ } = _ref8;
95
+ return allSelectStrategy.select({
96
+ items: allItems,
97
+ value,
98
+ selected
99
+ });
100
+ }
101
+ };
102
+ export const Y_DATA_TABLE_SELECTION_KEY = Symbol.for('yuyeon.data-table.selection');
103
+ export function provideSelection(props, _ref9) {
104
+ let {
105
+ allItems,
106
+ pageItems
107
+ } = _ref9;
108
+ const selected = useModelDuplex(props, 'modelValue', props.modelValue, v => {
109
+ return new Set(wrapInArray(v).map(v => {
110
+ return allItems.value.find(item => {
111
+ const {
112
+ itemComparator
113
+ } = props;
114
+ if (typeof itemComparator === 'function') {
115
+ itemComparator(v, item.value);
116
+ }
117
+ return getPropertyFromItem(v, props.itemKey) === item.key;
118
+ })?.value ?? v;
119
+ }));
120
+ }, v => {
121
+ return [...v.values()];
122
+ });
123
+ const allSelectables = computed(() => allItems.value.filter(item => item.selectable));
124
+ const pageSelectables = computed(() => pageItems.value.filter(item => item.selectable));
125
+ const selectStrategy = computed(() => {
126
+ if (typeof props.selectStrategy === 'object') {
127
+ return props.selectStrategy;
128
+ }
129
+ switch (props.selectStrategy) {
130
+ case 'single':
131
+ return singleSelectStrategy;
132
+ case 'all':
133
+ return allSelectStrategy;
134
+ case 'page':
135
+ default:
136
+ return pageSelectStrategy;
137
+ }
138
+ });
139
+ function isSelected(items) {
140
+ return wrapInArray(items).every(item => selected.value.has(item.value));
141
+ }
142
+ function isSomeSelected(items) {
143
+ return wrapInArray(items).some(item => selected.value.has(item.value));
144
+ }
145
+ function select(items, value) {
146
+ selected.value = selectStrategy.value.select({
147
+ items,
148
+ value,
149
+ selected: new Set(selected.value)
150
+ });
151
+ }
152
+ function toggleSelect(item) {
153
+ select([item], !isSelected([item]));
154
+ }
155
+ function selectAll(value) {
156
+ selected.value = selectStrategy.value.selectAll({
157
+ value,
158
+ allItems: allSelectables.value,
159
+ pageItems: pageSelectables.value,
160
+ selected: new Set(selected.value)
161
+ });
162
+ }
163
+ const selectables = computed(() => {
164
+ return selectStrategy.value.allSelected({
165
+ allItems: allSelectables.value,
166
+ pageItems: pageSelectables.value
167
+ });
168
+ });
169
+ const someSelected = computed(() => {
170
+ return isSomeSelected(pageSelectables.value);
171
+ });
172
+ const allSelected = computed(() => {
173
+ return isSelected(selectables.value);
174
+ });
175
+ const data = {
176
+ toggleSelect,
177
+ select,
178
+ selectAll,
179
+ isSelected,
180
+ isSomeSelected,
181
+ someSelected,
182
+ allSelected,
183
+ showSelectAll: selectStrategy.value.showSelectAll,
184
+ selectables
185
+ };
186
+ provide(Y_DATA_TABLE_SELECTION_KEY, data);
187
+ return data;
188
+ }
189
+ export function useSelection() {
190
+ const data = inject(Y_DATA_TABLE_SELECTION_KEY);
191
+ if (!data) {
192
+ throw new Error(`Not provided: ${Y_DATA_TABLE_SELECTION_KEY.description}`);
193
+ }
194
+ return data;
195
+ }
196
+ //# sourceMappingURL=selection.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"selection.js","names":["computed","inject","provide","useModelDuplex","wrapInArray","deepEqual","getPropertyFromItem","propsFactory","pressDataTableSelectionProps","enableSelect","Boolean","selectStrategy","type","String","Object","default","modelValue","Array","itemComparator","Function","singleSelectStrategy","showSelectAll","allSelected","select","_ref","items","value","Set","selectAll","_ref2","selected","pageSelectStrategy","_ref3","pageItems","_ref4","item","add","delete","_ref5","allSelectStrategy","_ref6","allItems","_ref7","_ref8","Y_DATA_TABLE_SELECTION_KEY","Symbol","for","provideSelection","props","_ref9","v","map","find","itemKey","key","values","allSelectables","filter","selectable","pageSelectables","isSelected","every","has","isSomeSelected","some","toggleSelect","selectables","someSelected","data","useSelection","Error","description"],"sources":["../../../../src/components/table/composables/selection.ts"],"sourcesContent":["import {\r\n type InjectionKey,\r\n type PropType,\r\n type Ref,\r\n computed,\r\n inject,\r\n provide,\r\n} from 'vue';\r\n\r\nimport { useModelDuplex } from '@/composables/communication';\r\nimport { wrapInArray } from '@/util/array';\r\nimport { deepEqual, getPropertyFromItem } from '@/util/common';\r\nimport { propsFactory } from '@/util/component';\r\n\r\nimport { DataTableProvideSelectionData } from '../types';\r\nimport { DataTableItemsProps } from './items';\r\n\r\nexport interface SelectableItem {\r\n key: string;\r\n value: any;\r\n selectable: boolean;\r\n}\r\n\r\nexport interface DataTableSelectStrategy {\r\n showSelectAll: boolean;\r\n allSelected: (data: {\r\n allItems: SelectableItem[];\r\n pageItems: SelectableItem[];\r\n }) => SelectableItem[];\r\n select: (data: {\r\n items: SelectableItem[];\r\n value: boolean;\r\n selected: Set<unknown>;\r\n }) => Set<unknown>;\r\n selectAll: (data: {\r\n value: boolean;\r\n allItems: SelectableItem[];\r\n pageItems: SelectableItem[];\r\n selected: Set<unknown>;\r\n }) => Set<unknown>;\r\n}\r\n\r\nexport const pressDataTableSelectionProps = propsFactory(\r\n {\r\n enableSelect: Boolean,\r\n selectStrategy: {\r\n type: [String, Object] as PropType<'single' | 'page' | 'all'>,\r\n default: 'page',\r\n },\r\n modelValue: {\r\n type: Array as PropType<readonly any[]>,\r\n default: () => [],\r\n },\r\n itemComparator: {\r\n type: [Function, String] as PropType<typeof deepEqual | string>,\r\n default: () => deepEqual,\r\n },\r\n },\r\n 'YDataTable--selection',\r\n);\r\n\r\ntype DataTableSelectionProps = Pick<DataTableItemsProps, 'itemKey'> & {\r\n modelValue: readonly any[];\r\n selectStrategy: 'single' | 'page' | 'all';\r\n 'onUpdate:modelValue': ((value: any[]) => void) | undefined;\r\n itemComparator: ((a: any, b: any) => boolean) | string;\r\n};\r\n\r\nconst singleSelectStrategy: DataTableSelectStrategy = {\r\n showSelectAll: false,\r\n allSelected: () => [],\r\n select: ({ items, value }) => {\r\n return new Set(value ? [items[0]?.value] : []);\r\n },\r\n selectAll: ({ selected }) => selected,\r\n};\r\n\r\nconst pageSelectStrategy: DataTableSelectStrategy = {\r\n showSelectAll: true,\r\n allSelected: ({ pageItems }) => pageItems,\r\n select: ({ items, value, selected }) => {\r\n for (const item of items) {\r\n if (value) selected.add(item.value);\r\n else selected.delete(item.value);\r\n }\r\n\r\n return selected;\r\n },\r\n selectAll: ({ value, pageItems, selected }) =>\r\n pageSelectStrategy.select({ items: pageItems, value, selected }),\r\n};\r\n\r\nconst allSelectStrategy: DataTableSelectStrategy = {\r\n showSelectAll: true,\r\n allSelected: ({ allItems }) => allItems,\r\n select: ({ items, value, selected }) => {\r\n for (const item of items) {\r\n if (value) selected.add(item.value);\r\n else selected.delete(item.value);\r\n }\r\n\r\n return selected;\r\n },\r\n selectAll: ({ value, allItems, selected }) =>\r\n allSelectStrategy.select({ items: allItems, value, selected }),\r\n};\r\n\r\nexport const Y_DATA_TABLE_SELECTION_KEY: InjectionKey<\r\n ReturnType<typeof provideSelection>\r\n> = Symbol.for('yuyeon.data-table.selection');\r\n\r\nexport function provideSelection(\r\n props: DataTableSelectionProps,\r\n {\r\n allItems,\r\n pageItems,\r\n }: { allItems: Ref<SelectableItem[]>; pageItems: Ref<SelectableItem[]> },\r\n) {\r\n const selected = useModelDuplex(\r\n props,\r\n 'modelValue',\r\n props.modelValue,\r\n (v) => {\r\n return new Set(\r\n wrapInArray(v).map((v) => {\r\n return (\r\n allItems.value.find((item) => {\r\n const { itemComparator } = props;\r\n if (typeof itemComparator === 'function') {\r\n itemComparator(v, item.value);\r\n }\r\n return getPropertyFromItem(v, props.itemKey) === item.key;\r\n })?.value ?? v\r\n );\r\n }),\r\n );\r\n },\r\n (v) => {\r\n return [...v.values()];\r\n },\r\n );\r\n\r\n const allSelectables = computed(() =>\r\n allItems.value.filter((item) => item.selectable),\r\n );\r\n\r\n const pageSelectables = computed(() =>\r\n pageItems.value.filter((item) => item.selectable),\r\n );\r\n\r\n const selectStrategy = computed(() => {\r\n if (typeof props.selectStrategy === 'object') {\r\n return props.selectStrategy;\r\n }\r\n switch (props.selectStrategy) {\r\n case 'single':\r\n return singleSelectStrategy;\r\n case 'all':\r\n return allSelectStrategy;\r\n case 'page':\r\n default:\r\n return pageSelectStrategy;\r\n }\r\n });\r\n\r\n function isSelected(items: SelectableItem | SelectableItem[]) {\r\n return wrapInArray(items).every((item) => selected.value.has(item.value));\r\n }\r\n\r\n function isSomeSelected(items: SelectableItem | SelectableItem[]) {\r\n return wrapInArray(items).some((item) => selected.value.has(item.value));\r\n }\r\n\r\n function select(items: SelectableItem[], value: boolean) {\r\n selected.value = selectStrategy.value.select({\r\n items,\r\n value,\r\n selected: new Set(selected.value),\r\n });\r\n }\r\n\r\n function toggleSelect(item: SelectableItem) {\r\n select([item], !isSelected([item]));\r\n }\r\n\r\n function selectAll(value: boolean) {\r\n selected.value = selectStrategy.value.selectAll({\r\n value,\r\n allItems: allSelectables.value,\r\n pageItems: pageSelectables.value,\r\n selected: new Set(selected.value),\r\n });\r\n }\r\n\r\n const selectables = computed(() => {\r\n return selectStrategy.value.allSelected({\r\n allItems: allSelectables.value,\r\n pageItems: pageSelectables.value,\r\n });\r\n });\r\n\r\n const someSelected = computed(() => {\r\n return isSomeSelected(pageSelectables.value);\r\n });\r\n\r\n const allSelected = computed(() => {\r\n return isSelected(selectables.value);\r\n });\r\n\r\n const data: DataTableProvideSelectionData = {\r\n toggleSelect,\r\n select,\r\n selectAll,\r\n isSelected,\r\n isSomeSelected,\r\n someSelected,\r\n allSelected,\r\n showSelectAll: selectStrategy.value.showSelectAll,\r\n selectables,\r\n };\r\n\r\n provide(Y_DATA_TABLE_SELECTION_KEY, data);\r\n\r\n return data;\r\n}\r\n\r\nexport function useSelection() {\r\n const data = inject(Y_DATA_TABLE_SELECTION_KEY);\r\n if (!data) {\r\n throw new Error(`Not provided: ${Y_DATA_TABLE_SELECTION_KEY.description}`);\r\n }\r\n\r\n return data;\r\n}\r\n"],"mappings":"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"}
@@ -0,0 +1,50 @@
1
+ import { computed, unref } from 'vue';
2
+ import { useI18n } from "../../../composables/i18n/index.js";
3
+ import { getObjectValueByPath, isEmpty } from "../../../util/common.js";
4
+ export function useSortedItems(props, items, sortBy, options) {
5
+ const {
6
+ locale
7
+ } = useI18n();
8
+ const sortedItems = computed(() => {
9
+ if (sortBy.value.length === 0) return items.value;
10
+ return sortItems(items.value, sortBy.value, locale.value);
11
+ });
12
+ return {
13
+ sortedItems
14
+ };
15
+ }
16
+ export function sortItems(items, sortOptions, locale) {
17
+ const stringCollator = new Intl.Collator(locale, {
18
+ sensitivity: 'accent',
19
+ usage: 'sort'
20
+ });
21
+ const refined = items.map(item => item);
22
+ return refined.sort((a, b) => {
23
+ for (let i = 0; i < sortOptions.length; i++) {
24
+ const sortKey = sortOptions[i].key;
25
+ const sortOrder = sortOptions[i].order ?? 'asc';
26
+ if (sortOrder === false) continue;
27
+ let sortA = getObjectValueByPath(unref(a.columns), sortKey);
28
+ let sortB = getObjectValueByPath(unref(b.columns), sortKey);
29
+ let sortARaw = unref(a.raw);
30
+ let sortBRaw = unref(b.raw);
31
+ if (sortOrder === 'desc') {
32
+ [sortA, sortB] = [sortB, sortA];
33
+ [sortARaw, sortBRaw] = [sortBRaw, sortARaw];
34
+ }
35
+ if (sortA instanceof Date && sortB instanceof Date) {
36
+ return sortA.getTime() - sortB.getTime();
37
+ }
38
+ [sortA, sortB] = [sortA, sortB].map(s => s != null ? s.toString().toLocaleLowerCase() : s);
39
+ if (sortA !== sortB) {
40
+ if (isEmpty(sortA) && isEmpty(sortB)) return 0;
41
+ if (isEmpty(sortA)) return -1;
42
+ if (isEmpty(sortB)) return 1;
43
+ if (!isNaN(sortA) && !isNaN(sortB)) return Number(sortA) - Number(sortB);
44
+ return stringCollator.compare(sortA, sortB);
45
+ }
46
+ }
47
+ return 0;
48
+ }).map(item => item);
49
+ }
50
+ //# sourceMappingURL=sorted-items.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sorted-items.js","names":["computed","unref","useI18n","getObjectValueByPath","isEmpty","useSortedItems","props","items","sortBy","options","locale","sortedItems","value","length","sortItems","sortOptions","stringCollator","Intl","Collator","sensitivity","usage","refined","map","item","sort","a","b","i","sortKey","key","sortOrder","order","sortA","columns","sortB","sortARaw","raw","sortBRaw","Date","getTime","s","toString","toLocaleLowerCase","isNaN","Number","compare"],"sources":["../../../../src/components/table/composables/sorted-items.ts"],"sourcesContent":["import { type Ref, computed, unref } from 'vue';\r\n\r\nimport { useI18n } from '@/composables/i18n';\r\nimport { getObjectValueByPath, isEmpty } from '@/util/common';\r\n\r\nimport type { SortOption } from '../types';\r\n\r\nexport function useSortedItems(\r\n props: any,\r\n items: Ref<any[]>,\r\n sortBy: Ref<readonly SortOption[]>,\r\n options?: {},\r\n) {\r\n const { locale } = useI18n();\r\n const sortedItems = computed(() => {\r\n if (sortBy.value.length === 0) return items.value;\r\n return sortItems(items.value, sortBy.value, locale.value);\r\n });\r\n\r\n return {\r\n sortedItems,\r\n };\r\n}\r\n\r\nexport function sortItems(\r\n items: any[],\r\n sortOptions: readonly SortOption[],\r\n locale: string,\r\n) {\r\n const stringCollator = new Intl.Collator(locale, {\r\n sensitivity: 'accent',\r\n usage: 'sort',\r\n });\r\n const refined = items.map((item) => item);\r\n\r\n return refined\r\n .sort((a, b) => {\r\n for (let i = 0; i < sortOptions.length; i++) {\r\n const sortKey = sortOptions[i].key;\r\n const sortOrder = sortOptions[i].order ?? 'asc';\r\n\r\n if (sortOrder === false) continue;\r\n\r\n let sortA = getObjectValueByPath(unref(a.columns), sortKey);\r\n let sortB = getObjectValueByPath(unref(b.columns), sortKey);\r\n let sortARaw = unref(a.raw);\r\n let sortBRaw = unref(b.raw);\r\n\r\n if (sortOrder === 'desc') {\r\n [sortA, sortB] = [sortB, sortA];\r\n [sortARaw, sortBRaw] = [sortBRaw, sortARaw];\r\n }\r\n\r\n if (sortA instanceof Date && sortB instanceof Date) {\r\n return sortA.getTime() - sortB.getTime();\r\n }\r\n\r\n [sortA, sortB] = [sortA, sortB].map((s) =>\r\n s != null ? s.toString().toLocaleLowerCase() : s,\r\n );\r\n\r\n if (sortA !== sortB) {\r\n if (isEmpty(sortA) && isEmpty(sortB)) return 0;\r\n if (isEmpty(sortA)) return -1;\r\n if (isEmpty(sortB)) return 1;\r\n if (!isNaN(sortA) && !isNaN(sortB))\r\n return Number(sortA) - Number(sortB);\r\n return stringCollator.compare(sortA, sortB);\r\n }\r\n }\r\n\r\n return 0;\r\n })\r\n .map((item) => item);\r\n}\r\n"],"mappings":"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"}
@@ -0,0 +1,73 @@
1
+ import { inject, provide, toRef } from 'vue';
2
+ import { useModelDuplex } from "../../../composables/communication.js";
3
+ import { propsFactory } from "../../../util/component/index.js";
4
+ const Y_DATA_TABLE_SORTING_KEY = Symbol.for('yuyeon.data-table.sorting');
5
+ export const pressDataTableSortProps = propsFactory({
6
+ sortBy: {
7
+ type: Array,
8
+ default: () => []
9
+ },
10
+ multiSort: Boolean
11
+ }, 'YDataTable--sorting');
12
+ export function createSorting(props) {
13
+ const sortBy = useModelDuplex(props, 'sortBy');
14
+ const multiSort = toRef(props, 'multiSort');
15
+ return {
16
+ sortBy,
17
+ multiSort
18
+ };
19
+ }
20
+ export function provideSorting(options) {
21
+ const {
22
+ sortBy,
23
+ multiSort,
24
+ page
25
+ } = options;
26
+ const toggleSort = column => {
27
+ let neo = sortBy.value?.map(v => ({
28
+ ...v
29
+ })) ?? [];
30
+ const target = neo.find(v => v.key === column.key);
31
+ const sortOption = {
32
+ key: column.key,
33
+ order: 'asc'
34
+ };
35
+ if (!target) {
36
+ if (multiSort?.value) {
37
+ neo = [...neo, sortOption];
38
+ } else {
39
+ neo = [sortOption];
40
+ }
41
+ } else if (target.order === 'desc') {
42
+ if (column.mustSort) {
43
+ target.order = 'asc';
44
+ } else {
45
+ neo = neo.filter(v => v.key !== column.key);
46
+ }
47
+ } else {
48
+ target.order = 'desc';
49
+ }
50
+ sortBy.value = neo;
51
+ if (page) {
52
+ page.value = 1;
53
+ }
54
+ };
55
+ function isSorted(column) {
56
+ return !!sortBy.value.find(option => option.key === column.key);
57
+ }
58
+ const data = {
59
+ sortBy,
60
+ toggleSort,
61
+ isSorted
62
+ };
63
+ provide(Y_DATA_TABLE_SORTING_KEY, data);
64
+ return data;
65
+ }
66
+ export function useSorting() {
67
+ const data = inject(Y_DATA_TABLE_SORTING_KEY);
68
+ if (!data) {
69
+ throw new Error(`Not provided: ${Y_DATA_TABLE_SORTING_KEY.description}`);
70
+ }
71
+ return data;
72
+ }
73
+ //# sourceMappingURL=sorting.js.map