@milaboratories/uikit 2.2.93 → 2.2.95

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 (14) hide show
  1. package/.turbo/turbo-build.log +15 -15
  2. package/.turbo/turbo-type-check.log +1 -1
  3. package/CHANGELOG.md +13 -0
  4. package/dist/components/PlElementList/PlElementList.vue.d.ts +19 -19
  5. package/dist/components/PlElementList/PlElementList.vue.d.ts.map +1 -1
  6. package/dist/components/PlElementList/PlElementList.vue2.js +145 -133
  7. package/dist/components/PlElementList/PlElementList.vue2.js.map +1 -1
  8. package/dist/components/PlElementList/PlElementListItem.vue2.js.map +1 -1
  9. package/dist/components/PlElementList/PlElementListItem.vue3.js +33 -33
  10. package/dist/sdk/model/dist/index.js +1 -1
  11. package/dist/sdk/model/dist/index.js.map +1 -1
  12. package/package.json +4 -4
  13. package/src/components/PlElementList/PlElementList.vue +81 -70
  14. package/src/components/PlElementList/PlElementListItem.vue +2 -2
package/.turbo/turbo-build.log CHANGED
@@ -1,6 +1,6 @@
1
1
   WARN  Issue while reading "/home/runner/_work/platforma/platforma/.npmrc". Failed to replace env in config: ${NPMJS_TOKEN}
2
2
 
3
- > @milaboratories/uikit@2.2.93 build /home/runner/_work/platforma/platforma/lib/ui/uikit
3
+ > @milaboratories/uikit@2.2.95 build /home/runner/_work/platforma/platforma/lib/ui/uikit
4
4
  > vite build
5
5
 
6
6
  vite v6.3.5 building for production...
@@ -14,8 +14,8 @@ computing gzip size...
14
14
  dist/_virtual/stringify2.js  0.09 kB │ gzip: 0.11 kB │ map: 0.10 kB
15
15
  dist/node_modules/.pnpm/d3-scale@4.0.2/node_modules/d3-scale/src/number.js  0.09 kB │ gzip: 0.11 kB │ map: 0.33 kB
16
16
  dist/components/PlTabs/Tab.vue2.js  0.09 kB │ gzip: 0.11 kB │ map: 0.09 kB
17
- dist/node_modules/.pnpm/d3-array@3.2.4/node_modules/d3-array/src/identity.js  0.09 kB │ gzip: 0.11 kB │ map: 0.33 kB
18
17
  dist/node_modules/.pnpm/d3-axis@3.0.0/node_modules/d3-axis/src/identity.js  0.09 kB │ gzip: 0.11 kB │ map: 0.32 kB
18
+ dist/node_modules/.pnpm/d3-array@3.2.4/node_modules/d3-array/src/identity.js  0.09 kB │ gzip: 0.11 kB │ map: 0.33 kB
19
19
  dist/node_modules/.pnpm/d3-format@3.1.0/node_modules/d3-format/src/identity.js  0.09 kB │ gzip: 0.11 kB │ map: 0.32 kB
20
20
  dist/components/PlTooltip/global.js  0.10 kB │ gzip: 0.11 kB │ map: 0.22 kB
21
21
  dist/node_modules/.pnpm/d3-array@3.2.4/node_modules/d3-array/src/array.js  0.10 kB │ gzip: 0.11 kB │ map: 0.36 kB
@@ -46,23 +46,23 @@ computing gzip size...
46
46
  dist/components/PlLogView/PlLogView.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
47
47
  dist/components/Scrollable.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
48
48
  dist/components/PlBtnSplit/PlBtnSplit.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
49
- dist/components/PlTextArea/PlTextArea.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
50
- dist/components/PlDropdown/PlDropdown.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
51
- dist/components/PlBtnGroup/PlBtnGroup.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
52
49
  dist/components/PlBtnGhost/PlBtnGhost.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
50
+ dist/components/PlBtnGroup/PlBtnGroup.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
51
+ dist/components/PlDropdown/PlDropdown.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
52
+ dist/components/PlTextArea/PlTextArea.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
53
53
  dist/components/PlCheckbox/PlCheckbox.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
54
54
  dist/components/InputRange.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
55
55
  dist/utils/DoubleContour.vue2.js  0.11 kB │ gzip: 0.12 kB │ map: 0.43 kB
56
56
  dist/generated/components/svg/images/SvgRequired.vue3.js  0.11 kB │ gzip: 0.11 kB │ map: 1.02 kB
57
57
  dist/components/SliderRange.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
58
- dist/layout/PlBlockPage/PlBlockPage.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
59
58
  dist/layout/PlContainer/PlContainer.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
59
+ dist/layout/PlBlockPage/PlBlockPage.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
60
+ dist/components/PlBtnDanger/PlBtnDanger.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
60
61
  dist/components/PlBtnAccent/PlBtnAccent.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
61
62
  dist/components/PlTextField/PlTextField.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
62
- dist/components/PlBtnDanger/PlBtnDanger.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
63
+ dist/components/PlStatusTag/PlStatusTag.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
63
64
  dist/components/PlFileInput/PlFileInput.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
64
65
  dist/components/PlAccordion/PlAccordion.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
65
- dist/components/PlStatusTag/PlStatusTag.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
66
66
  dist/components/DataTable/ColumnCaret.vue2.js  0.11 kB │ gzip: 0.11 kB │ map: 0.10 kB
67
67
  dist/node_modules/.pnpm/d3-selection@3.0.0/node_modules/d3-selection/src/selection/sparse.js  0.11 kB │ gzip: 0.12 kB │ map: 0.39 kB
68
68
  dist/components/PlBtnPrimary/PlBtnPrimary.vue2.js  0.11 kB │ gzip: 0.12 kB │ map: 0.10 kB
@@ -81,8 +81,8 @@ computing gzip size...
81
81
  dist/components/PlToggleSwitch/PlToggleSwitch.vue2.js  0.12 kB │ gzip: 0.12 kB │ map: 0.10 kB
82
82
  dist/components/PlAutocomplete/PlAutocomplete.vue2.js  0.12 kB │ gzip: 0.12 kB │ map: 0.10 kB
83
83
  dist/components/PlProgressCell/PlProgressCell.vue2.js  0.12 kB │ gzip: 0.12 kB │ map: 0.10 kB
84
- dist/components/PlDropdownLine/ResizableInput.vue2.js  0.12 kB │ gzip: 0.12 kB │ map: 0.10 kB
85
84
  dist/components/PlCheckbox/PlCheckboxBase.vue2.js  0.12 kB │ gzip: 0.12 kB │ map: 0.10 kB
85
+ dist/components/PlDropdownLine/ResizableInput.vue2.js  0.12 kB │ gzip: 0.12 kB │ map: 0.10 kB
86
86
  dist/components/ContextProvider.vue2.js  0.12 kB │ gzip: 0.12 kB │ map: 0.11 kB
87
87
  dist/components/PlErrorBoundary/PlErrorBoundary.vue2.js  0.12 kB │ gzip: 0.12 kB │ map: 0.11 kB
88
88
  dist/components/PlEditableTitle/PlEditableTitle.vue2.js  0.12 kB │ gzip: 0.12 kB │ map: 0.11 kB
@@ -410,8 +410,8 @@ computing gzip size...
410
410
  dist/utils/PlCloseModalBtn.vue.js  0.53 kB │ gzip: 0.36 kB │ map: 0.85 kB
411
411
  dist/assets/icons/icon-assets-min/24_warning.svg.js  0.53 kB │ gzip: 0.37 kB │ map: 0.71 kB
412
412
  dist/components/PlSvg/PlSvg.vue3.js  0.53 kB │ gzip: 0.33 kB │ map: 0.10 kB
413
- dist/assets/icons/icon-assets-min/24_info-outline.svg.js  0.54 kB │ gzip: 0.36 kB │ map: 0.72 kB
414
413
  dist/components/DataTable/composition/useColumn.js  0.54 kB │ gzip: 0.31 kB │ map: 1.45 kB
414
+ dist/assets/icons/icon-assets-min/24_info-outline.svg.js  0.54 kB │ gzip: 0.36 kB │ map: 0.72 kB
415
415
  dist/assets/icons/icon-assets-min/24_align-center.svg.js  0.54 kB │ gzip: 0.31 kB │ map: 0.75 kB
416
416
  dist/assets/icons/icon-assets-min/24_table-alias.svg.js  0.54 kB │ gzip: 0.34 kB │ map: 0.72 kB
417
417
  dist/assets/icons/icon-assets-min/24_box.svg.js  0.54 kB │ gzip: 0.34 kB │ map: 0.71 kB
@@ -703,9 +703,9 @@ computing gzip size...
703
703
  dist/components/DataTable/state.js  3.50 kB │ gzip: 1.28 kB │ map: 9.12 kB
704
704
  dist/components/PlFileDialog/PlFileDialog.vue.js  3.51 kB │ gzip: 1.39 kB │ map: 4.58 kB
705
705
  dist/components/PlBtnPrimary/PlBtnPrimary.vue.js  3.52 kB │ gzip: 1.33 kB │ map: 1.22 kB
706
- dist/components/PlElementList/PlElementListItem.vue3.js  3.66 kB │ gzip: 1.33 kB │ map: 0.12 kB
706
+ dist/components/PlElementList/PlElementListItem.vue3.js  3.64 kB │ gzip: 1.32 kB │ map: 0.12 kB
707
707
  dist/composition/useSortable.js  3.68 kB │ gzip: 1.30 kB │ map: 10.85 kB
708
- dist/components/PlElementList/PlElementListItem.vue2.js  3.72 kB │ gzip: 1.14 kB │ map: 6.31 kB
708
+ dist/components/PlElementList/PlElementListItem.vue2.js  3.72 kB │ gzip: 1.14 kB │ map: 6.30 kB
709
709
  dist/components/PlChip/PlChip.vue.js  4.01 kB │ gzip: 1.61 kB │ map: 1.35 kB
710
710
  dist/components/PlBtnGhost/PlBtnGhost.vue.js  4.35 kB │ gzip: 1.68 kB │ map: 2.34 kB
711
711
  dist/assets/icons/icon-assets-min/24_heatmap.svg.js  4.38 kB │ gzip: 0.99 kB │ map: 4.68 kB
@@ -725,7 +725,7 @@ computing gzip size...
725
725
  dist/components/PlTextField/PlTextField.vue.js  8.67 kB │ gzip: 2.88 kB │ map: 9.01 kB
726
726
  dist/components/PlFileDialog/Remote.vue.js  8.72 kB │ gzip: 2.79 kB │ map: 14.20 kB
727
727
  dist/node_modules/.pnpm/d3-color@3.1.0/node_modules/d3-color/src/color.js  9.19 kB │ gzip: 3.33 kB │ map: 21.96 kB
728
- dist/components/PlElementList/PlElementList.vue2.js  9.65 kB │ gzip: 2.58 kB │ map: 17.46 kB
728
+ dist/components/PlElementList/PlElementList.vue2.js  10.14 kB │ gzip: 2.59 kB │ map: 18.85 kB
729
729
  dist/components/PlNumberField/PlNumberField.vue.js  10.17 kB │ gzip: 3.25 kB │ map: 13.39 kB
730
730
  dist/components/PlFileInput/PlFileInput.vue.js  10.72 kB │ gzip: 3.36 kB │ map: 8.41 kB
731
731
  dist/demo-site-data/all-css-variables.js  11.00 kB │ gzip: 1.76 kB │ map: 18.21 kB
@@ -741,6 +741,6 @@ computing gzip size...
741
741
  dist/index.js 501.00 kB │ gzip: 192.22 kB │ map: 5.50 kB
742
742
  dist/components/PlSlideModal/PlSlideModal.vue.js 601.36 kB │ gzip: 204.35 kB │ map: 3.21 kB
743
743
  dist/components/DataTable/TableComponent.vue.js 602.69 kB │ gzip: 204.95 kB │ map: 4.86 kB
744
- [vite:dts] Declaration files built in 7091ms.
744
+ [vite:dts] Declaration files built in 7022ms.
745
745
 
746
- ✓ built in 12.07s
746
+ ✓ built in 11.91s
package/.turbo/turbo-type-check.log CHANGED
@@ -1,5 +1,5 @@
1
1
   WARN  Issue while reading "/home/runner/_work/platforma/platforma/.npmrc". Failed to replace env in config: ${NPMJS_TOKEN}
2
2
 
3
- > @milaboratories/uikit@2.2.93 type-check /home/runner/_work/platforma/platforma/lib/ui/uikit
3
+ > @milaboratories/uikit@2.2.95 type-check /home/runner/_work/platforma/platforma/lib/ui/uikit
4
4
  > vue-tsc --project ./tsconfig.lib.json
5
5
 
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # @milaboratories/uikit
2
2
 
3
+ ## 2.2.95
4
+
5
+ ### Patch Changes
6
+
7
+ - 70eff11: update plelementlist interface
8
+
9
+ ## 2.2.94
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies [10e5841]
14
+ - @platforma-sdk/model@1.37.11
15
+
3
16
  ## 2.2.93
4
17
 
5
18
  ### Patch Changes
package/dist/components/PlElementList/PlElementList.vue.d.ts CHANGED
@@ -1,30 +1,30 @@
1
1
  declare const _default: <T extends unknown = unknown, K extends number | string = string | number>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
2
2
  props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
3
3
  readonly "onUpdate:items"?: ((value: T[]) => any) | undefined;
4
- readonly "onUpdate:draggableItems"?: ((value: Set<T>) => any) | undefined;
5
- readonly "onUpdate:removableItems"?: ((value: Set<T>) => any) | undefined;
6
- readonly "onUpdate:expandableItems"?: ((value: Set<T>) => any) | undefined;
7
- readonly "onUpdate:expandedItems"?: ((value: Set<T>) => any) | undefined;
8
- readonly "onUpdate:pinnableItems"?: ((value: Set<T>) => any) | undefined;
9
- readonly "onUpdate:pinnedItems"?: ((value: Set<T>) => any) | undefined;
10
- readonly "onUpdate:toggableItems"?: ((value: Set<T>) => any) | undefined;
11
- readonly "onUpdate:toggledItems"?: ((value: Set<T>) => any) | undefined;
4
+ readonly "onUpdate:draggableItems"?: ((value: Set<K>) => any) | undefined;
5
+ readonly "onUpdate:removableItems"?: ((value: Set<K>) => any) | undefined;
6
+ readonly "onUpdate:expandableItems"?: ((value: Set<K>) => any) | undefined;
7
+ readonly "onUpdate:expandedItems"?: ((value: Set<K>) => any) | undefined;
8
+ readonly "onUpdate:pinnableItems"?: ((value: Set<K>) => any) | undefined;
9
+ readonly "onUpdate:pinnedItems"?: ((value: Set<K>) => any) | undefined;
10
+ readonly "onUpdate:toggableItems"?: ((value: Set<K>) => any) | undefined;
11
+ readonly "onUpdate:toggledItems"?: ((value: Set<K>) => any) | undefined;
12
12
  readonly onItemClick?: ((item: T) => any) | undefined;
13
13
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:items" | "onUpdate:draggableItems" | "onUpdate:removableItems" | "onUpdate:expandableItems" | "onUpdate:expandedItems" | "onUpdate:pinnableItems" | "onUpdate:pinnedItems" | "onUpdate:toggableItems" | "onUpdate:toggledItems" | "onItemClick"> & ({
14
14
  items: T[];
15
- draggableItems?: Set<T>;
16
- removableItems?: Set<T>;
17
- expandableItems?: Set<T>;
18
- expandedItems?: Set<T>;
19
- pinnableItems?: Set<T>;
20
- pinnedItems?: Set<T>;
21
- toggableItems?: Set<T>;
22
- toggledItems?: Set<T>;
15
+ draggableItems?: Set<K>;
16
+ removableItems?: Set<K>;
17
+ expandableItems?: Set<K>;
18
+ expandedItems?: Set<K>;
19
+ pinnableItems?: Set<K>;
20
+ pinnedItems?: Set<K>;
21
+ toggableItems?: Set<K>;
22
+ toggledItems?: Set<K>;
23
23
  } & {
24
+ getItemKey: (item: T, index: number) => K;
24
25
  itemClass?: string | string[] | ((item: T, index: number) => string | string[]);
25
- activeItems?: Set<T>;
26
+ activeItems?: Set<K>;
26
27
  enableDragging?: boolean;
27
- getItemKey?: (item: T) => K;
28
28
  onDragEnd?: (oldIndex: number, newIndex: number) => void | boolean;
29
29
  onSort?: (oldIndex: number, newIndex: number) => void | boolean;
30
30
  enableExpanding?: boolean;
@@ -57,7 +57,7 @@ declare const _default: <T extends unknown = unknown, K extends number | string
57
57
  index: number;
58
58
  }) => unknown;
59
59
  };
60
- emit: ((e: "itemClick", item: T) => void) & (((evt: "update:items", value: T[]) => void) & ((evt: "update:draggableItems", value: Set<T>) => void) & ((evt: "update:removableItems", value: Set<T>) => void) & ((evt: "update:expandableItems", value: Set<T>) => void) & ((evt: "update:expandedItems", value: Set<T>) => void) & ((evt: "update:pinnableItems", value: Set<T>) => void) & ((evt: "update:pinnedItems", value: Set<T>) => void) & ((evt: "update:toggableItems", value: Set<T>) => void) & ((evt: "update:toggledItems", value: Set<T>) => void));
60
+ emit: ((e: "itemClick", item: T) => void) & (((evt: "update:items", value: T[]) => void) & ((evt: "update:draggableItems", value: Set<K>) => void) & ((evt: "update:removableItems", value: Set<K>) => void) & ((evt: "update:expandableItems", value: Set<K>) => void) & ((evt: "update:expandedItems", value: Set<K>) => void) & ((evt: "update:pinnableItems", value: Set<K>) => void) & ((evt: "update:pinnedItems", value: Set<K>) => void) & ((evt: "update:toggableItems", value: Set<K>) => void) & ((evt: "update:toggledItems", value: Set<K>) => void));
61
61
  }>) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
62
62
  [key: string]: any;
63
63
  }> & {
package/dist/components/PlElementList/PlElementList.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PlElementList.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlElementList/PlElementList.vue"],"names":[],"mappings":"yBA0ViB,CAAC,SAAS,OAAO,YAAY,CAAC,SAAS,MAAM,GAAG,MAAM,iCACzD,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WA+hB1D,mBAAmB,CAAC;;;;;;;;;;;;eAlRnB,CAAC,EAAE;yBACO,GAAG,CAAC,CAAC,CAAC;yBACN,GAAG,CAAC,CAAC,CAAC;0BACL,GAAG,CAAC,CAAC,CAAC;wBACR,GAAG,CAAC,CAAC,CAAC;wBACN,GAAG,CAAC,CAAC,CAAC;sBACR,GAAG,CAAC,CAAC,CAAC;wBACJ,GAAG,CAAC,CAAC,CAAC;uBACP,GAAG,CAAC,CAAC,CAAC;;oBArQP,MAAM,GAAG,MAAM,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,EAAE,CAAC;sBACjE,GAAG,CAAC,CAAC,CAAC;yBAEH,OAAO;qBACX,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC;oBACf,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;iBACzD,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;0BAE7C,OAAO;mBACd,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;yBAEpC,OAAO;mBACb,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;yBAEpC,OAAO;mBACb,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;wBAErC,OAAO;gBACf,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;oBA6fwC,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;sBAleO,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,CAAC,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;yBAC3C,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,CAAC,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;;sBADjD,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,CAAC,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;yBAC3C,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,CAAC,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;;UAme5D,KAzeD,WAAW,QAAQ,CAAC,KAAG,IAAI,0fAyeW;;;;YAGA,OAAO,CAAC,OAAO,WAAW,CAAC;;AAziBvE,wBAyiB4E;AAS5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
1
+ {"version":3,"file":"PlElementList.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlElementList/PlElementList.vue"],"names":[],"mappings":"yBAqWiB,CAAC,SAAS,OAAO,YAAY,CAAC,SAAS,MAAM,GAAG,MAAM,iCACzD,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WAyiB1D,mBAAmB,CAAC;;;;;;;;;;;;eAlRnB,CAAC,EAAE;yBACO,GAAG,CAAC,CAAC,CAAC;yBACN,GAAG,CAAC,CAAC,CAAC;0BACL,GAAG,CAAC,CAAC,CAAC;wBACR,GAAG,CAAC,CAAC,CAAC;wBACN,GAAG,CAAC,CAAC,CAAC;sBACR,GAAG,CAAC,CAAC,CAAC;wBACJ,GAAG,CAAC,CAAC,CAAC;uBACP,GAAG,CAAC,CAAC,CAAC;;oBA/QP,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC;oBAE7B,MAAM,GAAG,MAAM,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,EAAE,CAAC;sBACjE,GAAG,CAAC,CAAC,CAAC;yBAEH,OAAO;oBACZ,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;iBACzD,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;0BAE7C,OAAO;mBACd,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;yBAEpC,OAAO;mBACb,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;yBAEpC,OAAO;mBACb,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;wBAErC,OAAO;gBACf,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO;oBAsgBwC,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;sBA5eO,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,CAAC,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;yBAC3C,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,CAAC,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;;sBADjD,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,CAAC,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;yBAC3C,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,CAAC,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;;UA6e5D,KAnfD,WAAW,QAAQ,CAAC,KAAG,IAAI,0fAmfW;;;;YAGA,OAAO,CAAC,OAAO,WAAW,CAAC;;AAnjBvE,wBAmjB4E;AAS5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
package/dist/components/PlElementList/PlElementList.vue2.js CHANGED
@@ -1,15 +1,15 @@
1
- import { defineComponent as ce, mergeModels as X, useModel as u, useSlots as ve, computed as g, shallowRef as C, watch as me, createElementBlock as P, openBlock as b, normalizeClass as R, createElementVNode as be, createCommentVNode as ye, Fragment as Y, renderList as Z, createBlock as _, createSlots as ee, withCtx as S, renderSlot as k } from "vue";
2
- import { isNil as c, shallowHash as te } from "../../lib/util/helpers/dist/index.js";
1
+ import { defineComponent as me, mergeModels as X, useModel as u, useSlots as de, computed as c, shallowRef as T, watch as ve, createElementBlock as P, openBlock as v, normalizeClass as R, createElementVNode as be, createCommentVNode as ye, Fragment as Y, renderList as Z, createBlock as x, createSlots as _, withCtx as S, renderSlot as C } from "vue";
2
+ import { shallowHash as ee, isNil as b } from "../../lib/util/helpers/dist/index.js";
3
3
  import { useSortable as he } from "../../node_modules/.pnpm/@vueuse_integrations@13.3.0_axios@1.8.1_focus-trap@7.6.0_sortablejs@1.15.6_vue@3.5.13_typescript@5.6.3_/node_modules/@vueuse/integrations/useSortable.js";
4
- import { optionalUpdateRef as v, moveElements as ae } from "./utils.js";
5
- import ne from "./PlElementListItem.vue.js";
6
- const ke = /* @__PURE__ */ ce({
4
+ import { optionalUpdateRef as m, moveElements as te } from "./utils.js";
5
+ import ae from "./PlElementListItem.vue.js";
6
+ const Ce = /* @__PURE__ */ me({
7
7
  __name: "PlElementList",
8
8
  props: /* @__PURE__ */ X({
9
+ getItemKey: {},
9
10
  itemClass: { type: [String, Array, Function], default: void 0 },
10
11
  activeItems: { default: void 0 },
11
12
  enableDragging: { type: Boolean, default: void 0 },
12
- getItemKey: { type: Function, default: void 0 },
13
13
  onDragEnd: { type: Function, default: void 0 },
14
14
  onSort: { type: Function, default: void 0 },
15
15
  enableExpanding: { type: Boolean, default: void 0 },
@@ -41,189 +41,201 @@ const ke = /* @__PURE__ */ ce({
41
41
  toggledItemsModifiers: {}
42
42
  }),
43
43
  emits: /* @__PURE__ */ X(["itemClick"], ["update:items", "update:draggableItems", "update:removableItems", "update:expandableItems", "update:expandedItems", "update:pinnableItems", "update:pinnedItems", "update:toggableItems", "update:toggledItems"]),
44
- setup(o, { emit: le }) {
45
- const d = u(o, "items"), se = u(o, "draggableItems"), ie = u(o, "removableItems"), oe = u(o, "expandableItems"), y = u(o, "expandedItems"), re = u(o, "pinnableItems"), r = u(o, "pinnedItems"), ue = u(o, "toggableItems"), f = u(o, "toggledItems"), n = o, I = le, T = ve(), D = g(() => n.enableDragging !== !1 && !c(n.getItemKey)), h = g(() => d.value.filter(E)), de = g(() => h.value.length > 0), p = g(() => d.value.filter((e) => !E(e))), $ = g(() => p.value.length > 0), x = C(), w = C(), F = C(), M = g((e) => {
46
- const t = te(...d.value);
47
- if (x.value === void 0) return e ?? t;
48
- const a = te(...x.value);
49
- return t === a ? e ?? t : e !== t ? t : a;
44
+ setup(i, { emit: le }) {
45
+ const f = u(i, "items"), se = u(i, "draggableItems"), oe = u(i, "removableItems"), ne = u(i, "expandableItems"), y = u(i, "expandedItems"), ie = u(i, "pinnableItems"), r = u(i, "pinnedItems"), re = u(i, "toggableItems"), g = u(i, "toggledItems"), s = i, D = le, I = de(), $ = c(() => s.enableDragging !== !1), h = c(() => f.value.filter(E)), ue = c(() => h.value.length > 0), k = c(() => f.value.filter((a, l) => !E(a, l))), w = c(() => k.value.length > 0), K = T(), M = T(), p = T(), fe = c((a) => {
46
+ const l = ee(...f.value.map(s.getItemKey));
47
+ if (K.value === void 0) return a ?? l;
48
+ const t = ee(...K.value.map(s.getItemKey));
49
+ return l === t ? a ?? l : a !== l ? l : t;
50
50
  });
51
- B(de, w, h, () => 0), B($, F, p, () => h.value.length);
52
- function B(e, t, a, l) {
53
- const s = he(t, a, {
51
+ F(ue, M, h, () => 0), F(w, p, k, () => h.value.length);
52
+ function F(a, l, t, e) {
53
+ const o = he(l, t, {
54
54
  handle: '[data-draggable="true"]',
55
55
  animation: 150,
56
56
  forceFallback: !0,
57
57
  fallbackOnBody: !0,
58
58
  scrollSensitivity: 80,
59
59
  forceAutoScrollFallback: !0,
60
- onUpdate: (i) => {
61
- var m;
62
- if (i.oldIndex == null || i.newIndex == null)
60
+ onUpdate: (n) => {
61
+ var d;
62
+ if (n.oldIndex == null || n.newIndex == null)
63
63
  throw new Error("Sortable event has no index");
64
- ((m = n.onDragEnd) == null ? void 0 : m.call(n, i.oldIndex, i.newIndex)) !== !1 && A(l() + i.oldIndex, l() + i.newIndex, !0);
64
+ ((d = s.onDragEnd) == null ? void 0 : d.call(s, n.oldIndex, n.newIndex)) !== !1 && B(e() + n.oldIndex, e() + n.newIndex, !0);
65
65
  }
66
66
  });
67
- return me(e, (i) => i ? s.start() : s.stop()), s;
67
+ return ve(a, (n) => n ? o.start() : o.stop()), o;
68
68
  }
69
- function A(e, t, a) {
70
- var s;
71
- if (e === t) return;
72
- a && (x.value = ae(d.value.slice(), e, t)), ((s = n.onSort) == null ? void 0 : s.call(n, e, t)) === !1 || (ae(d.value, e, t), v(d));
69
+ function B(a, l, t) {
70
+ var o;
71
+ if (a === l) return;
72
+ t && (K.value = te(f.value.slice(), a, l)), ((o = s.onSort) == null ? void 0 : o.call(s, a, l)) === !1 || (te(f.value, a, l), m(f));
73
73
  }
74
- function K(e) {
75
- var t;
76
- return ((t = n.activeItems) == null ? void 0 : t.has(e)) ?? !1;
74
+ function A(a, l) {
75
+ var e;
76
+ const t = s.getItemKey(a, l);
77
+ return ((e = s.activeItems) == null ? void 0 : e.has(t)) ?? !1;
77
78
  }
78
- function H(e) {
79
- var t;
80
- return n.enableDragging === !1 ? !1 : ((t = se.value) == null ? void 0 : t.has(e)) ?? !0;
79
+ function H(a, l) {
80
+ var e;
81
+ const t = s.getItemKey(a, l);
82
+ return s.enableDragging === !1 ? !1 : ((e = se.value) == null ? void 0 : e.has(t)) ?? !0;
81
83
  }
82
- function z(e) {
83
- var t;
84
- return n.enableToggling === !1 ? !1 : !c(f.value) && (((t = ue.value) == null ? void 0 : t.has(e)) ?? !0);
84
+ function z(a, l) {
85
+ var e;
86
+ const t = s.getItemKey(a, l);
87
+ return s.enableToggling === !1 ? !1 : !b(g.value) && (((e = re.value) == null ? void 0 : e.has(t)) ?? !0);
85
88
  }
86
- function L(e) {
87
- var t;
88
- return ((t = f.value) == null ? void 0 : t.has(e)) ?? !1;
89
+ function L(a, l) {
90
+ var e;
91
+ const t = s.getItemKey(a, l);
92
+ return ((e = g.value) == null ? void 0 : e.has(t)) ?? !1;
89
93
  }
90
- function N(e) {
91
- var t;
92
- return n.enablePinning === !1 ? !1 : !c(r.value) && (((t = re.value) == null ? void 0 : t.has(e)) ?? !0);
94
+ function N(a, l) {
95
+ var e;
96
+ const t = s.getItemKey(a, l);
97
+ return s.enablePinning === !1 ? !1 : !b(r.value) && (((e = ie.value) == null ? void 0 : e.has(t)) ?? !0);
93
98
  }
94
- function E(e) {
95
- var t;
96
- return ((t = r.value) == null ? void 0 : t.has(e)) ?? !1;
99
+ function E(a, l) {
100
+ var e;
101
+ const t = s.getItemKey(a, l);
102
+ return ((e = r.value) == null ? void 0 : e.has(t)) ?? !1;
97
103
  }
98
- function U(e) {
99
- var t;
100
- return n.enableExpanding === !1 ? !1 : !c(y.value) && (((t = oe.value) == null ? void 0 : t.has(e)) ?? !0);
104
+ function U(a, l) {
105
+ var e;
106
+ const t = s.getItemKey(a, l);
107
+ return s.enableExpanding === !1 ? !1 : !b(y.value) && (((e = ne.value) == null ? void 0 : e.has(t)) ?? !0);
101
108
  }
102
- function V(e) {
103
- var t;
104
- return ((t = y.value) == null ? void 0 : t.has(e)) ?? !1;
109
+ function V(a, l) {
110
+ var e;
111
+ const t = s.getItemKey(a, l);
112
+ return ((e = y.value) == null ? void 0 : e.has(t)) ?? !1;
105
113
  }
106
- function j(e) {
107
- var t;
108
- return n.enableRemoving === !1 || ((t = ie.value) == null ? void 0 : t.has(e)) === !1 ? !1 : n.enableRemoving === !0 || typeof n.onRemove == "function";
114
+ function j(a, l) {
115
+ var e;
116
+ const t = s.getItemKey(a, l);
117
+ return s.enableRemoving === !1 || ((e = oe.value) == null ? void 0 : e.has(t)) === !1 ? !1 : s.enableRemoving === !0 || typeof s.onRemove == "function";
109
118
  }
110
- function q(e, t) {
111
- var l;
112
- if (((l = n.onExpand) == null ? void 0 : l.call(n, e, t)) === !1 || c(y.value)) return;
113
- const a = y.value;
114
- a.has(e) ? a.delete(e) : a.add(e), v(y);
119
+ function q(a, l) {
120
+ var o;
121
+ if (((o = s.onExpand) == null ? void 0 : o.call(s, a, l)) === !1 || b(y.value)) return;
122
+ const t = s.getItemKey(a, l), e = y.value;
123
+ e.has(t) ? e.delete(t) : e.add(t), m(y);
115
124
  }
116
- function G(e, t) {
117
- var l;
118
- if (((l = n.onToggle) == null ? void 0 : l.call(n, e, t)) === !1 || c(f.value)) return;
119
- const a = f.value;
120
- a.has(e) ? a.delete(e) : a.add(e), v(f);
125
+ function G(a, l) {
126
+ var o;
127
+ if (((o = s.onToggle) == null ? void 0 : o.call(s, a, l)) === !1 || b(g.value)) return;
128
+ const t = s.getItemKey(a, l), e = g.value;
129
+ e.has(t) ? e.delete(t) : e.add(t), m(g);
121
130
  }
122
- function J(e, t) {
123
- var s;
124
- if (t === -1)
131
+ function J(a, l) {
132
+ var n;
133
+ if (l === -1)
125
134
  throw new Error("Pinnable item not found");
126
- if (((s = n.onPin) == null ? void 0 : s.call(n, e, t)) === !1 || c(r.value)) return;
127
- const a = r.value, l = a.has(e);
128
- l ? a.delete(e) : a.add(e), v(r), A(t, a.size + (l ? 0 : -1), !1);
135
+ if (((n = s.onPin) == null ? void 0 : n.call(s, a, l)) === !1 || b(r.value)) return;
136
+ const t = s.getItemKey(a, l), e = r.value, o = e.has(t);
137
+ o ? e.delete(t) : e.add(t), m(r), B(l, e.size + (o ? 0 : -1), !1);
129
138
  }
130
- function O(e, t) {
131
- var a, l, s;
132
- ((a = n.onRemove) == null ? void 0 : a.call(n, e, t)) !== !1 && (d.value.splice(t, 1), v(d), (l = r.value) != null && l.has(e) && (r.value.delete(e), v(r)), (s = f.value) != null && s.has(e) && (f.value.delete(e), v(f)));
139
+ function O(a, l) {
140
+ var t, e, o;
141
+ if (((t = s.onRemove) == null ? void 0 : t.call(s, a, l)) !== !1) {
142
+ const n = s.getItemKey(a, l);
143
+ f.value.splice(l, 1), m(f), (e = r.value) != null && e.has(n) && (r.value.delete(n), m(r)), (o = g.value) != null && o.has(n) && (g.value.delete(n), m(g));
144
+ }
133
145
  }
134
- const Q = (e, t) => c(n.getItemKey) ? `${M.value}-${t}` : `${M.value}-${n.getItemKey(e)}`, fe = g(() => h.value.map(Q)), ge = g(() => p.value.map(Q)), W = (e, t) => typeof n.itemClass == "function" ? n.itemClass(e, t) : n.itemClass ?? null;
135
- return (e, t) => (b(), P("div", {
136
- class: R(e.$style.root)
146
+ const Q = (a, l) => `${fe.value}-${s.getItemKey(a, l)}`, ge = c(() => h.value.map(Q)), ce = c(() => k.value.map(Q)), W = (a, l) => typeof s.itemClass == "function" ? s.itemClass(a, l) : s.itemClass ?? null;
147
+ return (a, l) => (v(), P("div", {
148
+ class: R(a.$style.root)
137
149
  }, [
138
150
  be("div", {
139
151
  ref_key: "pinnedContainerRef",
140
- ref: w,
141
- class: R(e.$style.list)
152
+ ref: M,
153
+ class: R(a.$style.list)
142
154
  }, [
143
- (b(!0), P(Y, null, Z(h.value, (a, l) => (b(), _(ne, {
144
- key: fe.value[l],
145
- class: R([e.$style.item, W(a, l)]),
146
- index: l,
147
- item: a,
148
- showDragHandle: D.value,
149
- isActive: K(a),
150
- isDraggable: H(a),
151
- isRemovable: j(a),
152
- isToggable: z(a),
153
- isToggled: L(a),
154
- isPinnable: N(a),
155
- isPinned: E(a),
156
- isExpandable: U(a),
157
- isExpanded: V(a),
158
- onClick: (s) => I("itemClick", a),
155
+ (v(!0), P(Y, null, Z(h.value, (t, e) => (v(), x(ae, {
156
+ key: ge.value[e],
157
+ class: R([a.$style.item, W(t, e)]),
158
+ index: e,
159
+ item: t,
160
+ showDragHandle: $.value,
161
+ isActive: A(t, e),
162
+ isDraggable: H(t, e),
163
+ isRemovable: j(t, e),
164
+ isToggable: z(t, e),
165
+ isToggled: L(t, e),
166
+ isPinnable: N(t, e),
167
+ isPinned: E(t, e),
168
+ isExpandable: U(t, e),
169
+ isExpanded: V(t, e),
170
+ onClick: (o) => D("itemClick", t),
159
171
  onRemove: O,
160
172
  onToggle: G,
161
173
  onPin: J,
162
174
  onExpand: q
163
- }, ee({
164
- title: S(({ item: s, index: i }) => [
165
- k(e.$slots, "item-title", {
166
- index: i,
167
- item: s
175
+ }, _({
176
+ title: S(({ item: o, index: n }) => [
177
+ C(a.$slots, "item-title", {
178
+ index: n,
179
+ item: o
168
180
  })
169
181
  ]),
170
182
  _: 2
171
183
  }, [
172
- T["item-content"] ? {
184
+ I["item-content"] ? {
173
185
  name: "content",
174
- fn: S(({ item: s, index: i }) => [
175
- k(e.$slots, "item-content", {
176
- index: i,
177
- item: s
186
+ fn: S(({ item: o, index: n }) => [
187
+ C(a.$slots, "item-content", {
188
+ index: n,
189
+ item: o
178
190
  })
179
191
  ]),
180
192
  key: "0"
181
193
  } : void 0
182
194
  ]), 1032, ["class", "index", "item", "showDragHandle", "isActive", "isDraggable", "isRemovable", "isToggable", "isToggled", "isPinnable", "isPinned", "isExpandable", "isExpanded", "onClick"]))), 128))
183
195
  ], 2),
184
- $.value ? (b(), P("div", {
196
+ w.value ? (v(), P("div", {
185
197
  key: 0,
186
198
  ref_key: "unpinnedContainerRef",
187
- ref: F,
188
- class: R(e.$style.list)
199
+ ref: p,
200
+ class: R(a.$style.list)
189
201
  }, [
190
- (b(!0), P(Y, null, Z(p.value, (a, l) => {
191
- var s;
192
- return b(), _(ne, {
193
- key: ge.value[l],
194
- class: R([e.$style.item, W(a, l)]),
195
- index: l + (((s = r.value) == null ? void 0 : s.size) ?? 0),
196
- item: a,
197
- showDragHandle: D.value,
198
- isActive: K(a),
199
- isDraggable: H(a),
200
- isRemovable: j(a),
201
- isToggable: z(a),
202
- isToggled: L(a),
203
- isPinnable: N(a),
204
- isPinned: E(a),
205
- isExpandable: U(a),
206
- isExpanded: V(a),
207
- onClick: (i) => I("itemClick", a),
202
+ (v(!0), P(Y, null, Z(k.value, (t, e) => {
203
+ var o;
204
+ return v(), x(ae, {
205
+ key: ce.value[e],
206
+ class: R([a.$style.item, W(t, e)]),
207
+ index: e + (((o = r.value) == null ? void 0 : o.size) ?? 0),
208
+ item: t,
209
+ showDragHandle: $.value,
210
+ isActive: A(t, e),
211
+ isDraggable: H(t, e),
212
+ isRemovable: j(t, e),
213
+ isToggable: z(t, e),
214
+ isToggled: L(t, e),
215
+ isPinnable: N(t, e),
216
+ isPinned: E(t, e),
217
+ isExpandable: U(t, e),
218
+ isExpanded: V(t, e),
219
+ onClick: (n) => D("itemClick", t),
208
220
  onRemove: O,
209
221
  onToggle: G,
210
222
  onPin: J,
211
223
  onExpand: q
212
- }, ee({
213
- title: S(({ item: i, index: m }) => [
214
- k(e.$slots, "item-title", {
215
- index: m,
216
- item: i
224
+ }, _({
225
+ title: S(({ item: n, index: d }) => [
226
+ C(a.$slots, "item-title", {
227
+ index: d,
228
+ item: n
217
229
  })
218
230
  ]),
219
231
  _: 2
220
232
  }, [
221
- T["item-content"] ? {
233
+ I["item-content"] ? {
222
234
  name: "content",
223
- fn: S(({ item: i, index: m }) => [
224
- k(e.$slots, "item-content", {
225
- index: m,
226
- item: i
235
+ fn: S(({ item: n, index: d }) => [
236
+ C(a.$slots, "item-content", {
237
+ index: d,
238
+ item: n
227
239
  })
228
240
  ]),
229
241
  key: "0"
@@ -235,6 +247,6 @@ const ke = /* @__PURE__ */ ce({
235
247
  }
236
248
  });
237
249
  export {
238
- ke as default
250
+ Ce as default
239
251
  };
240
252
  //# sourceMappingURL=PlElementList.vue2.js.map
package/dist/components/PlElementList/PlElementList.vue2.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PlElementList.vue2.js","sources":["../../../src/components/PlElementList/PlElementList.vue"],"sourcesContent":["<script generic=\"T extends unknown = unknown, K extends number | string = number | string\" lang=\"ts\" setup>\nimport type { ShallowRef } from 'vue';\nimport { computed, shallowRef, watch } from 'vue';\nimport { isNil, shallowHash } from '@milaboratories/helpers';\nimport { useSortable } from '@vueuse/integrations/useSortable';\nimport { type SortableEvent } from 'sortablejs';\nimport { moveElements, optionalUpdateRef } from './utils.ts';\nimport PlElementListItem from './PlElementListItem.vue';\n\nconst itemsRef = defineModel<T[]>('items', { required: true });\nconst draggableSetRef = defineModel<Set<T>>('draggableItems');\nconst removableSetRef = defineModel<Set<T>>('removableItems');\n\nconst expandableSetRef = defineModel<Set<T>>('expandableItems');\nconst expandedSetRef = defineModel<Set<T>>('expandedItems');\n\nconst pinnableSetRef = defineModel<Set<T>>('pinnableItems');\nconst pinnedSetRef = defineModel<Set<T>>('pinnedItems');\n\nconst toggableSetRef = defineModel<Set<T>>('toggableItems');\nconst toggledSetRef = defineModel<Set<T>>('toggledItems');\n\nconst props = withDefaults(\n defineProps<{\n itemClass?: string | string[] | ((item: T, index: number) => string | string[]);\n activeItems?: Set<T>;\n\n enableDragging?: boolean;\n getItemKey?: (item: T) => K;\n onDragEnd?: (oldIndex: number, newIndex: number) => void | boolean;\n onSort?: (oldIndex: number, newIndex: number) => void | boolean;\n\n enableExpanding?: boolean;\n onExpand?: (item: T, index: number) => void | boolean;\n\n enableRemoving?: boolean;\n onRemove?: (item: T, index: number) => void | boolean;\n\n enableToggling?: boolean;\n onToggle?: (item: T, index: number) => void | boolean;\n\n enablePinning?: boolean;\n onPin?: (item: T, index: number) => void | boolean;\n }>(), {\n itemClass: undefined,\n activeItems: undefined,\n\n enableDragging: undefined,\n enableRemoving: undefined,\n enableExpanding: undefined,\n enableToggling: undefined,\n enablePinning: undefined,\n\n getItemKey: undefined,\n onDragEnd: undefined,\n onSort: undefined,\n onRemove: undefined,\n onExpand: undefined,\n onToggle: undefined,\n onPin: undefined,\n },\n);\n\nconst emits = defineEmits<{\n (e: 'itemClick', item: T): void;\n}>();\n\nconst slots = defineSlots<{\n ['item-title']: (props: { item: T; index: number }) => unknown;\n ['item-content']?: (props: { item: T; index: number }) => unknown;\n}>();\n\nconst dndSortingEnabled = computed((): boolean => {\n return props.enableDragging !== false && !isNil(props.getItemKey);\n});\n\nconst pinnedItemsRef = computed(() => itemsRef.value.filter(isPinned));\nconst hasPinnedItems = computed(() => pinnedItemsRef.value.length > 0);\n\nconst unpinnedItemsRef = computed(() => itemsRef.value.filter((item) => !isPinned(item)));\nconst hasUnpinnedItems = computed(() => unpinnedItemsRef.value.length > 0);\n\nconst domProjectionItemsRef = shallowRef<undefined | T[]>();\nconst pinnedContainerRef = shallowRef<HTMLElement>();\nconst unpinnedContainerRef = shallowRef<HTMLElement>();\n\n// version fix problem with sync between data and rendered values when items have been changed\nconst versionRef = computed<number>((oldVersion) => {\n const currentVersion = shallowHash(...itemsRef.value);\n\n if (domProjectionItemsRef.value === undefined) return oldVersion ?? currentVersion;\n\n const lastSortedVersion = shallowHash(...domProjectionItemsRef.value);\n\n if (currentVersion === lastSortedVersion) return oldVersion ?? currentVersion;\n\n return oldVersion !== currentVersion ? currentVersion : lastSortedVersion;\n});\n\ncreateSortable(hasPinnedItems, pinnedContainerRef, pinnedItemsRef, () => 0);\ncreateSortable(hasUnpinnedItems, unpinnedContainerRef, unpinnedItemsRef, () => pinnedItemsRef.value.length);\n\nfunction createSortable(toggler: ShallowRef<boolean>, elRef: ShallowRef<undefined | HTMLElement>, itemsRef: ShallowRef<T[]>, getOffset: () => number) {\n const sortable = useSortable(elRef, itemsRef, {\n handle: `[data-draggable=\"true\"]`,\n animation: 150,\n forceFallback: true,\n fallbackOnBody: true,\n scrollSensitivity: 80,\n forceAutoScrollFallback: true,\n onUpdate: (evt: SortableEvent) => {\n if (evt.oldIndex == null || evt.newIndex == null) {\n throw new Error('Sortable event has no index');\n }\n if (props.onDragEnd?.(evt.oldIndex, evt.newIndex) !== false) {\n moveItems(getOffset() + evt.oldIndex, getOffset() + evt.newIndex, true);\n }\n },\n });\n watch(toggler, (on) => on ? sortable.start() : sortable.stop());\n\n return sortable;\n}\n\nfunction moveItems(oldIndex: number, newIndex: number, afterUpdateDom: boolean) {\n if (oldIndex === newIndex) return;\n\n if (afterUpdateDom) {\n domProjectionItemsRef.value = moveElements(itemsRef.value.slice(), oldIndex, newIndex);\n }\n\n const preventDefault = props.onSort?.(oldIndex, newIndex) === false;\n\n if (!preventDefault) {\n moveElements(itemsRef.value, oldIndex, newIndex);\n optionalUpdateRef(itemsRef);\n }\n}\n\nfunction isActive(item: T): boolean {\n return props.activeItems?.has(item) ?? false;\n}\n\nfunction isDraggable(item: T): boolean {\n if (props.enableDragging === false) return false;\n return (draggableSetRef.value?.has(item) ?? true);\n}\n\nfunction isToggable(item: T): boolean {\n if (props.enableToggling === false) return false;\n return !isNil(toggledSetRef.value) && (toggableSetRef.value?.has(item) ?? true);\n}\n\nfunction isToggled(item: T): boolean {\n return toggledSetRef.value?.has(item) ?? false;\n}\n\nfunction isPinnable(item: T): boolean {\n if (props.enablePinning === false) return false;\n return !isNil(pinnedSetRef.value) && (pinnableSetRef.value?.has(item) ?? true);\n}\n\nfunction isPinned(item: T): boolean {\n return pinnedSetRef.value?.has(item) ?? false;\n}\n\nfunction isExpandable(item: T): boolean {\n if (props.enableExpanding === false) return false;\n return !isNil(expandedSetRef.value) && (expandableSetRef.value?.has(item) ?? true);\n}\n\nfunction isExpanded(item: T): boolean {\n return expandedSetRef.value?.has(item) ?? false;\n}\n\nfunction isRemovable(item: T): boolean {\n if (props.enableRemoving === false) return false;\n if (removableSetRef.value?.has(item) === false) return false;\n return props.enableRemoving === true || typeof props.onRemove === 'function';\n}\n\nfunction handleExpand(item: T, index: number) {\n if (props.onExpand?.(item, index) === false || isNil(expandedSetRef.value)) return;\n\n const expanded = expandedSetRef.value;\n if (expanded.has(item)) expanded.delete(item);\n else expanded.add(item);\n optionalUpdateRef(expandedSetRef);\n}\n\nfunction handleToggle(item: T, index: number) {\n if (props.onToggle?.(item, index) === false || isNil(toggledSetRef.value)) return;\n\n const toggled = toggledSetRef.value;\n if (toggled.has(item)) toggled.delete(item);\n else toggled.add(item);\n optionalUpdateRef(toggledSetRef);\n}\n\nfunction handlePin(item: T, oldIndex: number) {\n if (oldIndex === -1) {\n throw new Error('Pinnable item not found');\n }\n\n if (props.onPin?.(item, oldIndex) === false || isNil(pinnedSetRef.value)) return;\n\n const pinned = pinnedSetRef.value;\n const alreadyPinned = pinned.has(item);\n if (alreadyPinned) pinned.delete(item);\n else pinned.add(item);\n optionalUpdateRef(pinnedSetRef);\n moveItems(oldIndex, pinned.size + (alreadyPinned ? 0 : -1), false);\n}\n\nfunction handleRemove(item: T, index: number) {\n if (props.onRemove?.(item, index) !== false) {\n itemsRef.value.splice(index, 1);\n optionalUpdateRef(itemsRef);\n\n if (pinnedSetRef.value?.has(item)) {\n pinnedSetRef.value.delete(item);\n optionalUpdateRef(pinnedSetRef);\n }\n\n if (toggledSetRef.value?.has(item)) {\n toggledSetRef.value.delete(item);\n optionalUpdateRef(toggledSetRef);\n }\n }\n}\n\n// version fix problem with sync between data and rendered values\nconst getKey = (item: T, index: number) => {\n if (isNil(props.getItemKey)) return `${versionRef.value}-${index}`;\n return `${versionRef.value}-${props.getItemKey(item)}`;\n};\nconst pinnedKeysRef = computed(() => pinnedItemsRef.value.map(getKey));\nconst unpinnedKeysRef = computed(() => unpinnedItemsRef.value.map(getKey));\n\nconst getItemClass = (item: T, index: number): null | string | string[] => {\n if (typeof props.itemClass === 'function') {\n return props.itemClass(item, index);\n }\n return props.itemClass ?? null;\n};\n\n</script>\n\n<template>\n <div :class=\"$style.root\">\n <div ref=\"pinnedContainerRef\" :class=\"$style.list\">\n <PlElementListItem\n v-for=\"(pinnedItem, pinnedIndex) in pinnedItemsRef\" :key=\"pinnedKeysRef[pinnedIndex]\"\n :class=\"[$style.item, getItemClass(pinnedItem, pinnedIndex)]\"\n\n :index=\"pinnedIndex\"\n :item=\"pinnedItem\"\n :showDragHandle=\"dndSortingEnabled\"\n :isActive=\"isActive(pinnedItem)\"\n :isDraggable=\"isDraggable(pinnedItem)\"\n :isRemovable=\"isRemovable(pinnedItem)\"\n :isToggable=\"isToggable(pinnedItem)\"\n :isToggled=\"isToggled(pinnedItem)\"\n :isPinnable=\"isPinnable(pinnedItem)\"\n :isPinned=\"isPinned(pinnedItem)\"\n :isExpandable=\"isExpandable(pinnedItem)\"\n :isExpanded=\"isExpanded(pinnedItem)\"\n\n @click=\"emits('itemClick', pinnedItem)\"\n @remove=\"handleRemove\"\n @toggle=\"handleToggle\"\n @pin=\"handlePin\"\n @expand=\"handleExpand\"\n >\n <template #title=\"{ item, index }\">\n <slot :index=\"index\" :item=\"item\" name=\"item-title\" />\n </template>\n <template v-if=\"slots['item-content']\" #content=\"{ item, index }\">\n <slot :index=\"index\" :item=\"item\" name=\"item-content\" />\n </template>\n </PlElementListItem>\n </div>\n <div v-if=\"hasUnpinnedItems\" ref=\"unpinnedContainerRef\" :class=\"$style.list\">\n <PlElementListItem\n v-for=\"(unpinnedItem, unpinnedIndex) in unpinnedItemsRef\" :key=\"unpinnedKeysRef[unpinnedIndex]\"\n :class=\"[$style.item, getItemClass(unpinnedItem, unpinnedIndex)]\"\n\n :index=\"unpinnedIndex + (pinnedSetRef?.size ?? 0)\"\n :item=\"unpinnedItem\"\n :showDragHandle=\"dndSortingEnabled\"\n :isActive=\"isActive(unpinnedItem)\"\n :isDraggable=\"isDraggable(unpinnedItem)\"\n :isRemovable=\"isRemovable(unpinnedItem)\"\n :isToggable=\"isToggable(unpinnedItem)\"\n :isToggled=\"isToggled(unpinnedItem)\"\n :isPinnable=\"isPinnable(unpinnedItem)\"\n :isPinned=\"isPinned(unpinnedItem)\"\n :isExpandable=\"isExpandable(unpinnedItem)\"\n :isExpanded=\"isExpanded(unpinnedItem)\"\n\n @click=\"emits('itemClick', unpinnedItem)\"\n @remove=\"handleRemove\"\n @toggle=\"handleToggle\"\n @pin=\"handlePin\"\n @expand=\"handleExpand\"\n >\n <template #title=\"{ item, index }\">\n <slot :index=\"index\" :item=\"item\" name=\"item-title\" />\n </template>\n <template v-if=\"slots['item-content']\" #content=\"{ item, index }\">\n <slot :index=\"index\" :item=\"item\" name=\"item-content\" />\n </template>\n </PlElementListItem>\n </div>\n </div>\n</template>\n\n<style module>\n.root, .list {\n display: flex;\n flex-direction: column;\n gap: 8px;\n min-width: 180px;\n}\n\n.item {\n width: 100%;\n}\n\n:global(.sortable-ghost) {\n visibility: hidden;\n}\n:global(.sortable-drag) {\n opacity: 1;\n}\n</style>\n"],"names":["itemsRef","_useModel","__props","draggableSetRef","removableSetRef","expandableSetRef","expandedSetRef","pinnableSetRef","pinnedSetRef","toggableSetRef","toggledSetRef","props","emits","__emit","slots","_useSlots","dndSortingEnabled","computed","isNil","pinnedItemsRef","isPinned","hasPinnedItems","unpinnedItemsRef","item","hasUnpinnedItems","domProjectionItemsRef","shallowRef","pinnedContainerRef","unpinnedContainerRef","versionRef","oldVersion","currentVersion","shallowHash","lastSortedVersion","createSortable","toggler","elRef","getOffset","sortable","useSortable","evt","_a","moveItems","watch","on","oldIndex","newIndex","afterUpdateDom","moveElements","optionalUpdateRef","isActive","isDraggable","isToggable","isToggled","isPinnable","isExpandable","isExpanded","isRemovable","handleExpand","index","expanded","handleToggle","toggled","handlePin","pinned","alreadyPinned","handleRemove","_b","_c","getKey","pinnedKeysRef","unpinnedKeysRef","getItemClass"],"mappings":"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"}
1
+ {"version":3,"file":"PlElementList.vue2.js","sources":["../../../src/components/PlElementList/PlElementList.vue"],"sourcesContent":["<script generic=\"T extends unknown = unknown, K extends number | string = number | string\" lang=\"ts\" setup>\nimport type { ShallowRef } from 'vue';\nimport { computed, shallowRef, watch } from 'vue';\nimport { isNil, shallowHash } from '@milaboratories/helpers';\nimport { useSortable } from '@vueuse/integrations/useSortable';\nimport { type SortableEvent } from 'sortablejs';\nimport { moveElements, optionalUpdateRef } from './utils.ts';\nimport PlElementListItem from './PlElementListItem.vue';\n\nconst itemsRef = defineModel<T[]>('items', { required: true });\nconst draggableSetRef = defineModel<Set<K>>('draggableItems');\nconst removableSetRef = defineModel<Set<K>>('removableItems');\n\nconst expandableSetRef = defineModel<Set<K>>('expandableItems');\nconst expandedSetRef = defineModel<Set<K>>('expandedItems');\n\nconst pinnableSetRef = defineModel<Set<K>>('pinnableItems');\nconst pinnedSetRef = defineModel<Set<K>>('pinnedItems');\n\nconst toggableSetRef = defineModel<Set<K>>('toggableItems');\nconst toggledSetRef = defineModel<Set<K>>('toggledItems');\n\nconst props = withDefaults(\n defineProps<{\n getItemKey: (item: T, index: number) => K;\n\n itemClass?: string | string[] | ((item: T, index: number) => string | string[]);\n activeItems?: Set<K>;\n\n enableDragging?: boolean;\n onDragEnd?: (oldIndex: number, newIndex: number) => void | boolean;\n onSort?: (oldIndex: number, newIndex: number) => void | boolean;\n\n enableExpanding?: boolean;\n onExpand?: (item: T, index: number) => void | boolean;\n\n enableRemoving?: boolean;\n onRemove?: (item: T, index: number) => void | boolean;\n\n enableToggling?: boolean;\n onToggle?: (item: T, index: number) => void | boolean;\n\n enablePinning?: boolean;\n onPin?: (item: T, index: number) => void | boolean;\n }>(), {\n itemClass: undefined,\n activeItems: undefined,\n\n enableDragging: undefined,\n enableRemoving: undefined,\n enableExpanding: undefined,\n enableToggling: undefined,\n enablePinning: undefined,\n\n onDragEnd: undefined,\n onSort: undefined,\n onRemove: undefined,\n onExpand: undefined,\n onToggle: undefined,\n onPin: undefined,\n },\n);\n\nconst emits = defineEmits<{\n (e: 'itemClick', item: T): void;\n}>();\n\nconst slots = defineSlots<{\n ['item-title']: (props: { item: T; index: number }) => unknown;\n ['item-content']?: (props: { item: T; index: number }) => unknown;\n}>();\n\nconst dndSortingEnabled = computed((): boolean => {\n return props.enableDragging !== false;\n});\n\nconst pinnedItemsRef = computed(() => itemsRef.value.filter(isPinned));\nconst hasPinnedItems = computed(() => pinnedItemsRef.value.length > 0);\n\nconst unpinnedItemsRef = computed(() => itemsRef.value.filter((item, index) => !isPinned(item, index)));\nconst hasUnpinnedItems = computed(() => unpinnedItemsRef.value.length > 0);\n\nconst domProjectionItemsRef = shallowRef<undefined | T[]>();\nconst pinnedContainerRef = shallowRef<HTMLElement>();\nconst unpinnedContainerRef = shallowRef<HTMLElement>();\n\n// version fix problem with sync between data and rendered values when items have been changed\nconst versionRef = computed<number>((oldVersion) => {\n const currentVersion = shallowHash(...itemsRef.value.map(props.getItemKey));\n\n if (domProjectionItemsRef.value === undefined) return oldVersion ?? currentVersion;\n\n const lastSortedVersion = shallowHash(...domProjectionItemsRef.value.map(props.getItemKey));\n\n if (currentVersion === lastSortedVersion) return oldVersion ?? currentVersion;\n\n return oldVersion !== currentVersion ? currentVersion : lastSortedVersion;\n});\n\ncreateSortable(hasPinnedItems, pinnedContainerRef, pinnedItemsRef, () => 0);\ncreateSortable(hasUnpinnedItems, unpinnedContainerRef, unpinnedItemsRef, () => pinnedItemsRef.value.length);\n\nfunction createSortable(toggler: ShallowRef<boolean>, elRef: ShallowRef<undefined | HTMLElement>, itemsRef: ShallowRef<T[]>, getOffset: () => number) {\n const sortable = useSortable(elRef, itemsRef, {\n handle: `[data-draggable=\"true\"]`,\n animation: 150,\n forceFallback: true,\n fallbackOnBody: true,\n scrollSensitivity: 80,\n forceAutoScrollFallback: true,\n onUpdate: (evt: SortableEvent) => {\n if (evt.oldIndex == null || evt.newIndex == null) {\n throw new Error('Sortable event has no index');\n }\n if (props.onDragEnd?.(evt.oldIndex, evt.newIndex) !== false) {\n moveItems(getOffset() + evt.oldIndex, getOffset() + evt.newIndex, true);\n }\n },\n });\n watch(toggler, (on) => on ? sortable.start() : sortable.stop());\n\n return sortable;\n}\n\nfunction moveItems(oldIndex: number, newIndex: number, afterUpdateDom: boolean) {\n if (oldIndex === newIndex) return;\n\n if (afterUpdateDom) {\n domProjectionItemsRef.value = moveElements(itemsRef.value.slice(), oldIndex, newIndex);\n }\n\n const preventDefault = props.onSort?.(oldIndex, newIndex) === false;\n\n if (!preventDefault) {\n moveElements(itemsRef.value, oldIndex, newIndex);\n optionalUpdateRef(itemsRef);\n }\n}\n\nfunction isActive(item: T, index: number): boolean {\n const k = props.getItemKey(item, index);\n return props.activeItems?.has(k) ?? false;\n}\n\nfunction isDraggable(item: T, index: number): boolean {\n const k = props.getItemKey(item, index);\n if (props.enableDragging === false) return false;\n return (draggableSetRef.value?.has(k) ?? true);\n}\n\nfunction isToggable(item: T, index: number): boolean {\n const k = props.getItemKey(item, index);\n if (props.enableToggling === false) return false;\n return !isNil(toggledSetRef.value) && (toggableSetRef.value?.has(k) ?? true);\n}\n\nfunction isToggled(item: T, index: number): boolean {\n const k = props.getItemKey(item, index);\n return toggledSetRef.value?.has(k) ?? false;\n}\n\nfunction isPinnable(item: T, index: number): boolean {\n const k = props.getItemKey(item, index);\n if (props.enablePinning === false) return false;\n return !isNil(pinnedSetRef.value) && (pinnableSetRef.value?.has(k) ?? true);\n}\n\nfunction isPinned(item: T, index: number): boolean {\n const k = props.getItemKey(item, index);\n return pinnedSetRef.value?.has(k) ?? false;\n}\n\nfunction isExpandable(item: T, index: number): boolean {\n const k = props.getItemKey(item, index);\n if (props.enableExpanding === false) return false;\n return !isNil(expandedSetRef.value) && (expandableSetRef.value?.has(k) ?? true);\n}\n\nfunction isExpanded(item: T, index: number): boolean {\n const k = props.getItemKey(item, index);\n return expandedSetRef.value?.has(k) ?? false;\n}\n\nfunction isRemovable(item: T, index: number): boolean {\n const k = props.getItemKey(item, index);\n if (props.enableRemoving === false) return false;\n if (removableSetRef.value?.has(k) === false) return false;\n return props.enableRemoving === true || typeof props.onRemove === 'function';\n}\n\nfunction handleExpand(item: T, index: number) {\n if (props.onExpand?.(item, index) === false || isNil(expandedSetRef.value)) return;\n const k = props.getItemKey(item, index);\n const expanded = expandedSetRef.value;\n if (expanded.has(k)) expanded.delete(k);\n else expanded.add(k);\n optionalUpdateRef(expandedSetRef);\n}\n\nfunction handleToggle(item: T, index: number) {\n if (props.onToggle?.(item, index) === false || isNil(toggledSetRef.value)) return;\n const k = props.getItemKey(item, index);\n const toggled = toggledSetRef.value;\n if (toggled.has(k)) toggled.delete(k);\n else toggled.add(k);\n optionalUpdateRef(toggledSetRef);\n}\n\nfunction handlePin(item: T, index: number) {\n if (index === -1) {\n throw new Error('Pinnable item not found');\n }\n\n if (props.onPin?.(item, index) === false || isNil(pinnedSetRef.value)) return;\n\n const k = props.getItemKey(item, index);\n const pinned = pinnedSetRef.value;\n const alreadyPinned = pinned.has(k);\n if (alreadyPinned) pinned.delete(k);\n else pinned.add(k);\n optionalUpdateRef(pinnedSetRef);\n moveItems(index, pinned.size + (alreadyPinned ? 0 : -1), false);\n}\n\nfunction handleRemove(item: T, index: number) {\n if (props.onRemove?.(item, index) !== false) {\n const k = props.getItemKey(item, index);\n\n itemsRef.value.splice(index, 1);\n optionalUpdateRef(itemsRef);\n\n if (pinnedSetRef.value?.has(k)) {\n pinnedSetRef.value.delete(k);\n optionalUpdateRef(pinnedSetRef);\n }\n\n if (toggledSetRef.value?.has(k)) {\n toggledSetRef.value.delete(k);\n optionalUpdateRef(toggledSetRef);\n }\n }\n}\n\n// version fix problem with sync between data and rendered values\nconst getKey = (item: T, index: number) => {\n return `${versionRef.value}-${props.getItemKey(item, index)}`;\n};\nconst pinnedKeysRef = computed(() => pinnedItemsRef.value.map(getKey));\nconst unpinnedKeysRef = computed(() => unpinnedItemsRef.value.map(getKey));\n\nconst getItemClass = (item: T, index: number): null | string | string[] => {\n if (typeof props.itemClass === 'function') {\n return props.itemClass(item, index);\n }\n return props.itemClass ?? null;\n};\n\n</script>\n\n<template>\n <div :class=\"$style.root\">\n <div ref=\"pinnedContainerRef\" :class=\"$style.list\">\n <PlElementListItem\n v-for=\"(pinnedItem, pinnedIndex) in pinnedItemsRef\" :key=\"pinnedKeysRef[pinnedIndex]\"\n :class=\"[$style.item, getItemClass(pinnedItem, pinnedIndex)]\"\n\n :index=\"pinnedIndex\"\n :item=\"pinnedItem\"\n :showDragHandle=\"dndSortingEnabled\"\n :isActive=\"isActive(pinnedItem, pinnedIndex)\"\n :isDraggable=\"isDraggable(pinnedItem, pinnedIndex)\"\n :isRemovable=\"isRemovable(pinnedItem, pinnedIndex)\"\n :isToggable=\"isToggable(pinnedItem, pinnedIndex)\"\n :isToggled=\"isToggled(pinnedItem, pinnedIndex)\"\n :isPinnable=\"isPinnable(pinnedItem, pinnedIndex)\"\n :isPinned=\"isPinned(pinnedItem, pinnedIndex)\"\n :isExpandable=\"isExpandable(pinnedItem, pinnedIndex)\"\n :isExpanded=\"isExpanded(pinnedItem, pinnedIndex)\"\n\n @click=\"emits('itemClick', pinnedItem)\"\n @remove=\"handleRemove\"\n @toggle=\"handleToggle\"\n @pin=\"handlePin\"\n @expand=\"handleExpand\"\n >\n <template #title=\"{ item, index }\">\n <slot :index=\"index\" :item=\"item\" name=\"item-title\" />\n </template>\n <template v-if=\"slots['item-content']\" #content=\"{ item, index }\">\n <slot :index=\"index\" :item=\"item\" name=\"item-content\" />\n </template>\n </PlElementListItem>\n </div>\n <div v-if=\"hasUnpinnedItems\" ref=\"unpinnedContainerRef\" :class=\"$style.list\">\n <PlElementListItem\n v-for=\"(unpinnedItem, unpinnedIndex) in unpinnedItemsRef\" :key=\"unpinnedKeysRef[unpinnedIndex]\"\n :class=\"[$style.item, getItemClass(unpinnedItem, unpinnedIndex)]\"\n\n :index=\"unpinnedIndex + (pinnedSetRef?.size ?? 0)\"\n :item=\"unpinnedItem\"\n :showDragHandle=\"dndSortingEnabled\"\n :isActive=\"isActive(unpinnedItem, unpinnedIndex)\"\n :isDraggable=\"isDraggable(unpinnedItem, unpinnedIndex)\"\n :isRemovable=\"isRemovable(unpinnedItem, unpinnedIndex)\"\n :isToggable=\"isToggable(unpinnedItem, unpinnedIndex)\"\n :isToggled=\"isToggled(unpinnedItem, unpinnedIndex)\"\n :isPinnable=\"isPinnable(unpinnedItem, unpinnedIndex)\"\n :isPinned=\"isPinned(unpinnedItem, unpinnedIndex)\"\n :isExpandable=\"isExpandable(unpinnedItem, unpinnedIndex)\"\n :isExpanded=\"isExpanded(unpinnedItem, unpinnedIndex)\"\n\n @click=\"emits('itemClick', unpinnedItem)\"\n @remove=\"handleRemove\"\n @toggle=\"handleToggle\"\n @pin=\"handlePin\"\n @expand=\"handleExpand\"\n >\n <template #title=\"{ item, index }\">\n <slot :index=\"index\" :item=\"item\" name=\"item-title\" />\n </template>\n <template v-if=\"slots['item-content']\" #content=\"{ item, index }\">\n <slot :index=\"index\" :item=\"item\" name=\"item-content\" />\n </template>\n </PlElementListItem>\n </div>\n </div>\n</template>\n\n<style module>\n.root, .list {\n display: flex;\n flex-direction: column;\n gap: 8px;\n min-width: 180px;\n}\n\n.item {\n width: 100%;\n}\n\n:global(.sortable-ghost) {\n visibility: hidden;\n}\n:global(.sortable-drag) {\n opacity: 1;\n}\n</style>\n"],"names":["itemsRef","_useModel","__props","draggableSetRef","removableSetRef","expandableSetRef","expandedSetRef","pinnableSetRef","pinnedSetRef","toggableSetRef","toggledSetRef","props","emits","__emit","slots","_useSlots","dndSortingEnabled","computed","pinnedItemsRef","isPinned","hasPinnedItems","unpinnedItemsRef","item","index","hasUnpinnedItems","domProjectionItemsRef","shallowRef","pinnedContainerRef","unpinnedContainerRef","versionRef","oldVersion","currentVersion","shallowHash","lastSortedVersion","createSortable","toggler","elRef","getOffset","sortable","useSortable","evt","_a","moveItems","watch","on","oldIndex","newIndex","afterUpdateDom","moveElements","optionalUpdateRef","isActive","k","isDraggable","isToggable","isNil","isToggled","isPinnable","isExpandable","isExpanded","isRemovable","handleExpand","expanded","handleToggle","toggled","handlePin","pinned","alreadyPinned","handleRemove","_b","_c","getKey","pinnedKeysRef","unpinnedKeysRef","getItemClass"],"mappings":"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"}
package/dist/components/PlElementList/PlElementListItem.vue2.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PlElementListItem.vue2.js","sources":["../../../src/components/PlElementList/PlElementListItem.vue"],"sourcesContent":["<script generic=\"T extends unknown = unknown\" lang=\"ts\" setup>\nimport { computed } from 'vue';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlIcon24 } from '../PlIcon24';\n\nconst props = defineProps<{\n item: T;\n index: number;\n showDragHandle: boolean;\n isActive: boolean;\n isDraggable: boolean;\n isRemovable: boolean;\n isExpandable: boolean;\n isExpanded: boolean;\n isToggable: boolean;\n isToggled: boolean;\n isPinnable: boolean;\n isPinned: boolean;\n}>();\n\nconst slots = defineSlots<{\n title: (props: { item: T; index: number }) => unknown;\n content?: (props: { item: T; index: number }) => unknown;\n}>();\nconst hasContentSlot = computed(() => slots['content'] !== undefined);\n\nconst emit = defineEmits<{\n (e: 'expand', item: T, index: number): void;\n (e: 'toggle', item: T, index: number): void;\n (e: 'pin', item: T, index: number): void;\n (e: 'remove', item: T, index: number): void;\n}>();\n</script>\n\n<template>\n <div\n :class=\"[$style.root, {\n [$style.active]: props.isActive,\n [$style.pinned]: props.isPinned,\n [$style.disabled]: props.isToggled,\n }]\"\n >\n <div\n :class=\"[$style.head, {\n [$style.clickable]: hasContentSlot,\n }]\"\n @click=\"isExpandable && emit('expand', props.item, props.index)\"\n >\n <div\n v-if=\"props.showDragHandle\"\n :class=\"[$style.action, $style.draggable, { [$style.disable]: !props.isDraggable } ]\"\n :data-draggable=\"props.isDraggable\"\n >\n <PlIcon16 name=\"drag-dots\" />\n </div>\n <PlIcon16 v-if=\"isExpandable\" :class=\"[$style.contentChevron, { [$style.opened]: props.isExpanded }]\" name=\"chevron-down\" />\n\n <div :class=\"$style.title\">\n <slot name=\"title\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n\n <div :class=\"[$style.actions, $style.showOnHover]\">\n <div\n v-if=\"props.isToggable\"\n :class=\"[$style.action, $style.clickable, { [$style.disable]: !props.isToggable }]\"\n @click.stop=\"emit('toggle', props.item, props.index)\"\n >\n <PlIcon24 :name=\"props.isToggled === true ? 'view-hide' : 'view-show'\" size=\"16\" />\n </div>\n <div\n v-if=\"props.isPinnable\"\n :class=\"[$style.action, $style.clickable, {\n [$style.disable]: !props.isPinnable,\n [$style.activated]: props.isPinned,\n }]\"\n @click.stop=\"emit('pin', props.item, props.index)\"\n >\n <PlIcon24 name=\"pin\" size=\"16\" />\n </div>\n <div\n v-if=\"props.isRemovable\"\n :class=\"[$style.action, $style.clickable]\"\n @click.stop=\"emit('remove', props.item, props.index)\"\n >\n <PlIcon16 name=\"close\" />\n </div>\n </div>\n </div>\n <div v-if=\"hasContentSlot && props.isExpanded\" :class=\"$style.body\">\n <slot name=\"content\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n </div>\n</template>\n\n<style module>\n@use '../../assets/variables.scss' as *;\n\n.root {\n --background: rgba(255, 255, 255, 0.8);\n --border-color: var(--color-div-grey);\n --head-background: unset;\n --box-shadow: none;\n --box-shadow-active: 0 0 0 4px color-mix(in srgb, var(--border-color-focus) 50%, transparent);\n\n &:global(.sortable-drag),\n &:global(.sortable-chosen) {\n --head-background: var(--gradient-light-lime);\n --border-color: var(--border-color-focus);\n --box-shadow: var(--box-shadow-active)\n }\n}\n.root {\n display: flex;\n flex-direction: column;\n justify-content: center;\n border-radius: var(--border-radius);\n border: 1px solid var(--border-color);\n background-color: var(--background);\n transition: box-shadow 0.15s;\n box-shadow: var(--box-shadow);;\n overflow: hidden;\n\n &:hover {\n --border-color: var(--border-color-focus);\n }\n\n &.disabled {\n opacity: 0.6;\n filter: grayscale(1);\n }\n\n &.pinned {\n --background: var(--bg-base-light);\n }\n\n &.active {\n --border-color: var(--border-color-focus);\n --head-background: var(--btn-accent-positive-500);\n }\n}\n\n.head {\n position: relative;\n display: flex;\n align-items: center;\n padding: 8px;\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n background: var(--head-background);\n\n &:hover, &.opened {\n --head-background: var(--gradient-light-lime);\n }\n}\n\n.contentChevron {\n display: block;\n width: 16px;\n height: 16px;\n margin-right: 4px;\n transform: rotate(-90deg);\n transition: transform 0.15s;\n\n &.opened {\n transform: rotate(0deg);\n }\n}\n\n.title {\n display: flex;\n flex-direction: row;\n gap: 8px;\n max-width: calc(100% - 50px);\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 24px;\n border-radius: 0 0 var(--border-radius) var(--border-radius);\n}\n\n.actions {\n position: absolute;\n top: 8px;\n right: 8px;\n display: flex;\n align-items: center;\n background-color: var(--background);\n border-radius: var(--border-radius);\n}\n\n.action {\n width: 24px;\n height: 24px;\n padding: 4px; /* use padding instead of gap on parent, for better accessibility */\n opacity: 0.6;\n border-radius: var(--border-radius);\n transition: all 0.15s;\n\n svg {\n width: 16px;\n height: 16px;\n }\n\n &:hover {\n opacity: 1;\n background-color: var(--bg-elevated-02);\n }\n\n &.activated {\n opacity: 0.8;\n }\n\n &.disable {\n cursor: not-allowed;\n opacity: 0.4;\n }\n}\n\n.clickable {\n cursor: pointer;\n}\n\n.draggable {\n cursor: grab;\n}\n\n.showOnHover {\n opacity: 0;\n transition: opacity 0.15s;\n}\n\n.root:hover .showOnHover {\n opacity: 1;\n}\n</style>\n"],"names":["props","__props","slots","_useSlots","hasContentSlot","computed","emit","__emit"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAKA,UAAMA,IAAQC,GAeRC,IAAQC,EAGV,GACEC,IAAiBC,EAAS,MAAMH,EAAM,YAAe,MAAS,GAE9DI,IAAOC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"PlElementListItem.vue2.js","sources":["../../../src/components/PlElementList/PlElementListItem.vue"],"sourcesContent":["<script generic=\"T extends unknown = unknown\" lang=\"ts\" setup>\nimport { computed } from 'vue';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlIcon24 } from '../PlIcon24';\n\nconst props = defineProps<{\n item: T;\n index: number;\n showDragHandle: boolean;\n isActive: boolean;\n isDraggable: boolean;\n isRemovable: boolean;\n isExpandable: boolean;\n isExpanded: boolean;\n isToggable: boolean;\n isToggled: boolean;\n isPinnable: boolean;\n isPinned: boolean;\n}>();\n\nconst slots = defineSlots<{\n title: (props: { item: T; index: number }) => unknown;\n content?: (props: { item: T; index: number }) => unknown;\n}>();\nconst hasContentSlot = computed(() => slots['content'] !== undefined);\n\nconst emit = defineEmits<{\n (e: 'expand', item: T, index: number): void;\n (e: 'toggle', item: T, index: number): void;\n (e: 'pin', item: T, index: number): void;\n (e: 'remove', item: T, index: number): void;\n}>();\n</script>\n\n<template>\n <div\n :class=\"[$style.root, {\n [$style.active]: props.isActive,\n [$style.pinned]: props.isPinned,\n [$style.disabled]: props.isToggled,\n }]\"\n >\n <div\n :class=\"[$style.head, {\n [$style.clickable]: hasContentSlot,\n }]\"\n @click=\"isExpandable && emit('expand', props.item, props.index)\"\n >\n <div\n v-if=\"props.showDragHandle\"\n :class=\"[$style.action, $style.draggable, { [$style.disable]: !props.isDraggable } ]\"\n :data-draggable=\"props.isDraggable\"\n >\n <PlIcon16 name=\"drag-dots\" />\n </div>\n <PlIcon16 v-if=\"isExpandable\" :class=\"[$style.contentChevron, { [$style.opened]: props.isExpanded }]\" name=\"chevron-down\" />\n\n <div :class=\"$style.title\">\n <slot name=\"title\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n\n <div :class=\"[$style.actions, $style.showOnHover]\">\n <div\n v-if=\"props.isToggable\"\n :class=\"[$style.action, $style.clickable, { [$style.disable]: !props.isToggable }]\"\n @click.stop=\"emit('toggle', props.item, props.index)\"\n >\n <PlIcon24 :name=\"props.isToggled === true ? 'view-hide' : 'view-show'\" size=\"16\" />\n </div>\n <div\n v-if=\"props.isPinnable\"\n :class=\"[$style.action, $style.clickable, {\n [$style.disable]: !props.isPinnable,\n [$style.activated]: props.isPinned,\n }]\"\n @click.stop=\"emit('pin', props.item, props.index)\"\n >\n <PlIcon24 name=\"pin\" size=\"16\" />\n </div>\n <div\n v-if=\"props.isRemovable\"\n :class=\"[$style.action, $style.clickable]\"\n @click.stop=\"emit('remove', props.item, props.index)\"\n >\n <PlIcon16 name=\"close\" />\n </div>\n </div>\n </div>\n <div v-if=\"hasContentSlot && props.isExpanded\" :class=\"$style.body\">\n <slot name=\"content\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n </div>\n</template>\n\n<style module>\n@use '../../assets/variables.scss' as *;\n\n.root {\n --background: rgba(255, 255, 255, 0.8);\n --border-color: var(--color-div-grey);\n --head-background: unset;\n --box-shadow: none;\n --box-shadow-active: 0 0 0 4px color-mix(in srgb, var(--border-color-focus) 50%, transparent);\n\n &:global(.sortable-drag),\n &:global(.sortable-chosen) {\n --head-background: var(--gradient-light-lime);\n --border-color: var(--border-color-focus);\n --box-shadow: var(--box-shadow-active)\n }\n}\n.root {\n display: flex;\n flex-direction: column;\n justify-content: center;\n border-radius: var(--border-radius);\n border: 1px solid var(--border-color);\n background-color: var(--background);\n transition: box-shadow 0.15s;\n box-shadow: var(--box-shadow);;\n overflow: hidden;\n\n &:hover {\n --border-color: var(--border-color-focus);\n }\n\n &.disabled {\n opacity: 0.6;\n filter: grayscale(1);\n }\n\n &.pinned {\n --background: var(--bg-base-light);\n }\n\n &.active {\n --border-color: var(--border-color-focus);\n --head-background: var(--btn-accent-positive-500);\n }\n}\n\n.head {\n position: relative;\n display: flex;\n align-items: center;\n padding: 8px;\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n background: var(--head-background);\n\n &:hover, &.opened {\n --head-background: var(--gradient-light-lime);\n }\n}\n\n.contentChevron {\n display: block;\n width: 16px;\n height: 16px;\n margin-right: 4px;\n transform: rotate(-90deg);\n transition: transform 0.15s;\n\n &.opened {\n transform: rotate(0deg);\n }\n}\n\n.title {\n display: flex;\n flex-direction: row;\n flex: 1 1 0;\n gap: 8px;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: 12px;\n padding: 24px;\n border-radius: 0 0 var(--border-radius) var(--border-radius);\n}\n\n.actions {\n position: absolute;\n top: 8px;\n right: 8px;\n display: flex;\n align-items: center;\n background-color: var(--background);\n border-radius: var(--border-radius);\n}\n\n.action {\n width: 24px;\n height: 24px;\n padding: 4px; /* use padding instead of gap on parent, for better accessibility */\n opacity: 0.6;\n border-radius: var(--border-radius);\n transition: all 0.15s;\n\n svg {\n width: 16px;\n height: 16px;\n }\n\n &:hover {\n opacity: 1;\n background-color: var(--bg-elevated-02);\n }\n\n &.activated {\n opacity: 0.8;\n }\n\n &.disable {\n cursor: not-allowed;\n opacity: 0.4;\n }\n}\n\n.clickable {\n cursor: pointer;\n}\n\n.draggable {\n cursor: grab;\n}\n\n.showOnHover {\n opacity: 0;\n transition: opacity 0.15s;\n}\n\n.root:hover .showOnHover {\n opacity: 1;\n}\n</style>\n"],"names":["props","__props","slots","_useSlots","hasContentSlot","computed","emit","__emit"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAKA,UAAMA,IAAQC,GAeRC,IAAQC,EAGV,GACEC,IAAiBC,EAAS,MAAMH,EAAM,YAAe,MAAS,GAE9DI,IAAOC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/components/PlElementList/PlElementListItem.vue3.js CHANGED
@@ -1,39 +1,39 @@
1
- (function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode('@use "../../assets/variables.scss" as *;._root_lt147_4{--background: rgba(255, 255, 255, .8);--border-color: var(--color-div-grey);--head-background: unset;--box-shadow: none;--box-shadow-active: 0 0 0 4px color-mix(in srgb, var(--border-color-focus) 50%, transparent)}._root_lt147_4.sortable-drag,._root_lt147_4.sortable-chosen{--head-background: var(--gradient-light-lime);--border-color: var(--border-color-focus);--box-shadow: var(--box-shadow-active) }._root_lt147_4{display:flex;flex-direction:column;justify-content:center;border-radius:var(--border-radius);border:1px solid var(--border-color);background-color:var(--background);transition:box-shadow .15s;box-shadow:var(--box-shadow);overflow:hidden}._root_lt147_4:hover{--border-color: var(--border-color-focus)}._root_lt147_4._disabled_lt147_33{opacity:.6;filter:grayscale(1)}._root_lt147_4._pinned_lt147_38{--background: var(--bg-base-light)}._root_lt147_4._active_lt147_42{--border-color: var(--border-color-focus);--head-background: var(--btn-accent-positive-500)}._head_lt147_48{position:relative;display:flex;align-items:center;padding:8px;border-radius:var(--border-radius) var(--border-radius) 0 0;background:var(--head-background)}._head_lt147_48:hover,._head_lt147_48._opened_lt147_56{--head-background: var(--gradient-light-lime)}._contentChevron_lt147_61{display:block;width:16px;height:16px;margin-right:4px;transform:rotate(-90deg);transition:transform .15s}._contentChevron_lt147_61._opened_lt147_56{transform:rotate(0)}._title_lt147_74{display:flex;flex-direction:row;gap:8px;max-width:calc(100% - 50px);overflow:hidden;text-overflow:ellipsis}._body_lt147_83{display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:0 0 var(--border-radius) var(--border-radius)}._actions_lt147_91{position:absolute;top:8px;right:8px;display:flex;align-items:center;background-color:var(--background);border-radius:var(--border-radius)}._action_lt147_91{width:24px;height:24px;padding:4px;opacity:.6;border-radius:var(--border-radius);transition:all .15s}._action_lt147_91 svg{width:16px;height:16px}._action_lt147_91:hover{opacity:1;background-color:var(--bg-elevated-02)}._action_lt147_91._activated_lt147_119{opacity:.8}._action_lt147_91._disable_lt147_33{cursor:not-allowed;opacity:.4}._clickable_lt147_129{cursor:pointer}._draggable_lt147_133{cursor:grab}._showOnHover_lt147_137{opacity:0;transition:opacity .15s}._root_lt147_4:hover ._showOnHover_lt147_137{opacity:1}')),document.head.appendChild(o)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
2
- const t = "_root_lt147_4", o = "_disabled_lt147_33", _ = "_pinned_lt147_38", e = "_active_lt147_42", n = "_head_lt147_48", c = "_opened_lt147_56", l = "_contentChevron_lt147_61", a = "_title_lt147_74", s = "_body_lt147_83", d = "_actions_lt147_91", i = "_action_lt147_91", b = "_activated_lt147_119", r = "_disable_lt147_33", v = "_clickable_lt147_129", h = "_draggable_lt147_133", p = "_showOnHover_lt147_137", g = {
3
- root: t,
4
- disabled: o,
5
- pinned: _,
6
- active: e,
7
- head: n,
1
+ (function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode('@use "../../assets/variables.scss" as *;._root_1n01w_4{--background: rgba(255, 255, 255, .8);--border-color: var(--color-div-grey);--head-background: unset;--box-shadow: none;--box-shadow-active: 0 0 0 4px color-mix(in srgb, var(--border-color-focus) 50%, transparent)}._root_1n01w_4.sortable-drag,._root_1n01w_4.sortable-chosen{--head-background: var(--gradient-light-lime);--border-color: var(--border-color-focus);--box-shadow: var(--box-shadow-active) }._root_1n01w_4{display:flex;flex-direction:column;justify-content:center;border-radius:var(--border-radius);border:1px solid var(--border-color);background-color:var(--background);transition:box-shadow .15s;box-shadow:var(--box-shadow);overflow:hidden}._root_1n01w_4:hover{--border-color: var(--border-color-focus)}._root_1n01w_4._disabled_1n01w_33{opacity:.6;filter:grayscale(1)}._root_1n01w_4._pinned_1n01w_38{--background: var(--bg-base-light)}._root_1n01w_4._active_1n01w_42{--border-color: var(--border-color-focus);--head-background: var(--btn-accent-positive-500)}._head_1n01w_48{position:relative;display:flex;align-items:center;padding:8px;border-radius:var(--border-radius) var(--border-radius) 0 0;background:var(--head-background)}._head_1n01w_48:hover,._head_1n01w_48._opened_1n01w_56{--head-background: var(--gradient-light-lime)}._contentChevron_1n01w_61{display:block;width:16px;height:16px;margin-right:4px;transform:rotate(-90deg);transition:transform .15s}._contentChevron_1n01w_61._opened_1n01w_56{transform:rotate(0)}._title_1n01w_74{display:flex;flex-direction:row;flex:1 1 0;gap:8px;overflow:hidden;text-overflow:ellipsis}._body_1n01w_83{display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:0 0 var(--border-radius) var(--border-radius)}._actions_1n01w_91{position:absolute;top:8px;right:8px;display:flex;align-items:center;background-color:var(--background);border-radius:var(--border-radius)}._action_1n01w_91{width:24px;height:24px;padding:4px;opacity:.6;border-radius:var(--border-radius);transition:all .15s}._action_1n01w_91 svg{width:16px;height:16px}._action_1n01w_91:hover{opacity:1;background-color:var(--bg-elevated-02)}._action_1n01w_91._activated_1n01w_119{opacity:.8}._action_1n01w_91._disable_1n01w_33{cursor:not-allowed;opacity:.4}._clickable_1n01w_129{cursor:pointer}._draggable_1n01w_133{cursor:grab}._showOnHover_1n01w_137{opacity:0;transition:opacity .15s}._root_1n01w_4:hover ._showOnHover_1n01w_137{opacity:1}')),document.head.appendChild(o)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
2
+ const n = "_root_1n01w_4", t = "_disabled_1n01w_33", o = "_pinned_1n01w_38", _ = "_active_1n01w_42", e = "_head_1n01w_48", c = "_opened_1n01w_56", a = "_contentChevron_1n01w_61", s = "_title_1n01w_74", d = "_body_1n01w_83", i = "_actions_1n01w_91", l = "_action_1n01w_91", w = "_activated_1n01w_119", b = "_disable_1n01w_33", r = "_clickable_1n01w_129", v = "_draggable_1n01w_133", h = "_showOnHover_1n01w_137", p = {
3
+ root: n,
4
+ disabled: t,
5
+ pinned: o,
6
+ active: _,
7
+ head: e,
8
8
  opened: c,
9
- contentChevron: l,
10
- title: a,
11
- body: s,
12
- actions: d,
13
- action: i,
14
- activated: b,
15
- disable: r,
16
- clickable: v,
17
- draggable: h,
18
- showOnHover: p
9
+ contentChevron: a,
10
+ title: s,
11
+ body: d,
12
+ actions: i,
13
+ action: l,
14
+ activated: w,
15
+ disable: b,
16
+ clickable: r,
17
+ draggable: v,
18
+ showOnHover: h
19
19
  };
20
20
  export {
21
- i as action,
22
- d as actions,
23
- b as activated,
24
- e as active,
25
- s as body,
26
- v as clickable,
27
- l as contentChevron,
28
- g as default,
29
- r as disable,
30
- o as disabled,
31
- h as draggable,
32
- n as head,
21
+ l as action,
22
+ i as actions,
23
+ w as activated,
24
+ _ as active,
25
+ d as body,
26
+ r as clickable,
27
+ a as contentChevron,
28
+ p as default,
29
+ b as disable,
30
+ t as disabled,
31
+ v as draggable,
32
+ e as head,
33
33
  c as opened,
34
- _ as pinned,
35
- t as root,
36
- p as showOnHover,
37
- a as title
34
+ o as pinned,
35
+ n as root,
36
+ h as showOnHover,
37
+ s as title
38
38
  };
39
39
  //# sourceMappingURL=PlElementListItem.vue3.js.map
package/dist/sdk/model/dist/index.js CHANGED
@@ -14,7 +14,7 @@ const e = r.object({
14
14
  label: r.string()
15
15
  });
16
16
  r.array(e);
17
- const a = "1.37.2";
17
+ const a = "1.37.11";
18
18
  function l() {
19
19
  return o({ sdkVersion: a });
20
20
  }
package/dist/sdk/model/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../../../sdk/model/src/internal.ts","../../../../../../../sdk/model/src/render/util/label.ts","../../../../../../../sdk/model/src/version.ts","../../../../../../../sdk/model/src/raw_globals.ts"],"sourcesContent":["import type { ValueOrErrors } from '@milaboratories/pl-model-common';\nimport {} from './global';\nimport type { Platforma } from './platforma';\nimport type { FutureHandle, GlobalCfgRenderCtx } from './render/internal';\n\n/** Utility code helping to identify whether the code is running in actual UI environment */\nexport function isInUI() {\n return (\n typeof globalThis.getPlatforma !== 'undefined' || typeof globalThis.platforma !== 'undefined'\n );\n}\n\n/** Utility code helping to retrieve a platforma instance form the environment */\nexport function getPlatformaInstance<\n Args = unknown,\n Outputs extends Record<string, ValueOrErrors<unknown>> = Record<string, ValueOrErrors<unknown>>,\n UiState = unknown,\n Href extends `/${string}` = `/${string}`,\n>(config?: { sdkVersion: string }): Platforma<Args, Outputs, UiState, Href> {\n if (config && typeof globalThis.getPlatforma === 'function')\n return globalThis.getPlatforma(config);\n else if (typeof globalThis.platforma !== 'undefined') return globalThis.platforma;\n else throw new Error('Can\\'t get platforma instance.');\n}\n\nexport function tryGetCfgRenderCtx(): GlobalCfgRenderCtx | undefined {\n if (typeof globalThis.cfgRenderCtx !== 'undefined') return globalThis.cfgRenderCtx;\n else return undefined;\n}\n\nexport function getCfgRenderCtx(): GlobalCfgRenderCtx {\n if (typeof globalThis.cfgRenderCtx !== 'undefined') return globalThis.cfgRenderCtx;\n else throw new Error('Not in config rendering context');\n}\n\nexport function tryRegisterCallback(key: string, callback: (...args: any[]) => any): boolean {\n const ctx = tryGetCfgRenderCtx();\n if (ctx === undefined) return false;\n if (key in ctx.callbackRegistry) throw new Error(`Callback with key ${key} already registered.`);\n ctx.callbackRegistry[key] = callback;\n return true;\n}\n\nconst futureResolves = new Map<string, ((value: unknown) => void)[]>();\n\nexport function registerFutureAwait(handle: FutureHandle, onResolve: (value: unknown) => void) {\n if (!(handle in getCfgRenderCtx().callbackRegistry)) {\n getCfgRenderCtx().callbackRegistry[handle] = (value: unknown) => {\n for (const res of futureResolves.get(handle)!) {\n res(value);\n }\n };\n futureResolves.set(handle, []);\n }\n futureResolves.get(handle)!.push(onResolve);\n}\n","import type { PObjectSpec } from '@milaboratories/pl-model-common';\nimport { z } from 'zod';\n\nexport const PAnnotationLabel = 'pl7.app/label';\nexport const PAnnotationTrace = 'pl7.app/trace';\n\nexport type RecordsWithLabel<T> = {\n value: T;\n label: string;\n};\n\nexport type LabelDerivationOps = {\n /** Force inclusion of native column label */\n includeNativeLabel?: boolean;\n /** Separator to use between label parts (\" / \" by default) */\n separator?: string;\n /** If true, label will be added as suffix (at the end of the generated label). By default label added as a prefix. */\n addLabelAsSuffix?: boolean;\n /** Trace elements list that will be forced to be included in the label. */\n forceTraceElements?: string[];\n};\n\nexport const TraceEntry = z.object({\n type: z.string(),\n importance: z.number().optional(),\n id: z.string().optional(),\n label: z.string(),\n});\nexport type TraceEntry = z.infer<typeof TraceEntry>;\ntype FullTraceEntry = TraceEntry & { fullType: string; occurrenceIndex: number };\n\nexport const Trace = z.array(TraceEntry);\nexport type Trace = z.infer<typeof Trace>;\ntype FullTrace = FullTraceEntry[];\n\n// Define the possible return types for the specExtractor function\ntype SpecExtractorResult = PObjectSpec | {\n spec: PObjectSpec;\n prefixTrace?: TraceEntry[];\n suffixTrace?: TraceEntry[];\n};\n\nconst DistancePenalty = 0.001;\n\nconst LabelType = '__LABEL__';\nconst LabelTypeFull = '__LABEL__@1';\n\nexport function deriveLabels<T>(\n values: T[],\n specExtractor: (obj: T) => SpecExtractorResult,\n ops: LabelDerivationOps = {},\n): RecordsWithLabel<T>[] {\n const importances = new Map<string, number>();\n\n const forceTraceElements = (ops.forceTraceElements !== undefined && ops.forceTraceElements.length > 0)\n ? new Set(ops.forceTraceElements)\n : undefined;\n\n // number of times certain type occurred among all of the\n const numberOfRecordsWithType = new Map<string, number>();\n\n const enrichedRecords = values.map((value) => {\n const extractorResult = specExtractor(value);\n let spec: PObjectSpec;\n let prefixTrace: TraceEntry[] | undefined;\n let suffixTrace: TraceEntry[] | undefined;\n\n // Check if the result is the new structure or just PObjectSpec\n if ('spec' in extractorResult && typeof extractorResult.spec === 'object') {\n // It's the new structure { spec, prefixTrace?, suffixTrace? }\n spec = extractorResult.spec;\n prefixTrace = extractorResult.prefixTrace;\n suffixTrace = extractorResult.suffixTrace;\n } else {\n // It's just PObjectSpec\n spec = extractorResult as PObjectSpec;\n }\n\n const label = spec.annotations?.[PAnnotationLabel];\n const traceStr = spec.annotations?.[PAnnotationTrace];\n const baseTrace = (traceStr ? Trace.safeParse(JSON.parse(traceStr)).data : undefined) ?? [];\n\n const trace = [\n ...(prefixTrace ?? []),\n ...baseTrace,\n ...(suffixTrace ?? []),\n ];\n\n if (label !== undefined) {\n const labelEntry = { label, type: LabelType, importance: -2 };\n if (ops.addLabelAsSuffix) trace.push(labelEntry);\n else trace.splice(0, 0, labelEntry);\n }\n\n const fullTrace: FullTrace = [];\n\n const occurrences = new Map<string, number>();\n for (let i = trace.length - 1; i >= 0; --i) {\n const { type: typeName } = trace[i];\n const importance = trace[i].importance ?? 0;\n const occurrenceIndex = (occurrences.get(typeName) ?? 0) + 1;\n occurrences.set(typeName, occurrenceIndex);\n const fullType = `${typeName}@${occurrenceIndex}`;\n numberOfRecordsWithType.set(fullType, (numberOfRecordsWithType.get(fullType) ?? 0) + 1);\n importances.set(\n fullType,\n Math.max(\n importances.get(fullType) ?? Number.NEGATIVE_INFINITY,\n importance - (trace.length - i) * DistancePenalty,\n ),\n );\n fullTrace.push({ ...trace[i], fullType, occurrenceIndex: occurrenceIndex });\n }\n fullTrace.reverse();\n return {\n value,\n spec,\n label,\n fullTrace,\n };\n });\n\n // excluding repeated types (i.e. ..@2, ..@3, etc.) not found in some records\n const mainTypes: string[] = [];\n // repeated types (i.e. ..@2, ..@3, etc.) not found in some records\n const secondaryTypes: string[] = [];\n\n const allTypeRecords = [...importances];\n // sorting: most important types go first\n allTypeRecords.sort(([, i1], [, i2]) => i2 - i1);\n\n for (const [typeName] of allTypeRecords) {\n if (typeName.endsWith('@1') || numberOfRecordsWithType.get(typeName) === values.length)\n mainTypes.push(typeName);\n else secondaryTypes.push(typeName);\n }\n\n const calculate = (includedTypes: Set<string>, force: boolean = false) => {\n const result: RecordsWithLabel<T>[] = [];\n for (let i = 0; i < enrichedRecords.length; i++) {\n const r = enrichedRecords[i];\n const includedTrace = r.fullTrace\n .filter((fm) => includedTypes.has(fm.fullType)\n || (forceTraceElements && forceTraceElements.has(fm.type)));\n if (includedTrace.length === 0) {\n if (force)\n result.push({\n label: 'Unlabeled',\n value: r.value,\n } satisfies RecordsWithLabel<T>);\n else return undefined;\n }\n const labelSet = includedTrace\n .map((fm) => fm.label);\n const sep = ops.separator ?? ' / ';\n result.push({\n label: labelSet.join(sep),\n value: r.value,\n } satisfies RecordsWithLabel<T>);\n }\n return result;\n };\n\n if (mainTypes.length === 0) {\n if (secondaryTypes.length !== 0) throw new Error('Non-empty secondary types list while main types list is empty.');\n return calculate(new Set(LabelTypeFull), true)!;\n }\n\n //\n // includedTypes = 2\n // * *\n // T0 T1 T2 T3 T4 T5\n // *\n // additionalType = 3\n //\n // Resulting set: T0, T1, T3\n //\n let includedTypes = 0;\n let additionalType = -1;\n while (includedTypes < mainTypes.length) {\n const currentSet = new Set<string>();\n if (ops.includeNativeLabel) currentSet.add(LabelTypeFull);\n for (let i = 0; i < includedTypes; ++i) currentSet.add(mainTypes[i]);\n if (additionalType >= 0)\n currentSet.add(mainTypes[additionalType]);\n\n const candidateResult = calculate(currentSet);\n\n // checking if labels uniquely separate our records\n if (candidateResult !== undefined && new Set(candidateResult.map((c) => c.label)).size === values.length) return candidateResult;\n\n additionalType++;\n if (additionalType >= mainTypes.length) {\n includedTypes++;\n additionalType = includedTypes;\n }\n }\n\n return calculate(new Set([...mainTypes, ...secondaryTypes]), true)!;\n}\n","export const PlatformaSDKVersion = '1.37.2';\n","import type { ValueOrErrors } from '@milaboratories/pl-model-common';\nimport {} from './global';\nimport { getPlatformaInstance } from './internal';\nimport type { Platforma } from './platforma';\nimport { PlatformaSDKVersion } from './version';\n\nexport function getRawPlatformaInstance<\n Args = unknown,\n Outputs extends Record<string, ValueOrErrors<unknown>> = Record<string, ValueOrErrors<unknown>>,\n UiState = unknown,\n Href extends `/${string}` = `/${string}`,\n>(): Platforma<Args, Outputs, UiState, Href> {\n return getPlatformaInstance<Args, Outputs, UiState, Href>({ sdkVersion: PlatformaSDKVersion });\n}\n\n/** Returns a global platforma instance or a provided fallback if it's not available. */\nexport function getPlatformaOrDefault<\n Args = unknown,\n Outputs extends Record<string, ValueOrErrors<unknown>> = Record<string, ValueOrErrors<unknown>>,\n UiState = unknown,\n Href extends `/${string}` = `/${string}`,\n>(platforma: Platforma<Args, Outputs, UiState, Href>): Platforma<Args, Outputs, UiState, Href> {\n try {\n return getRawPlatformaInstance<Args, Outputs, UiState, Href>();\n } catch {\n return platforma;\n }\n}\n"],"names":["getPlatformaInstance","config","TraceEntry","z","PlatformaSDKVersion","getRawPlatformaInstance"],"mappings":";;;AAaO,SAASA,EAKdC,GAA0E;AACtEA,MAAAA,KAAU,OAAO,WAAW,gBAAiB;AACxC,WAAA,WAAW,aAAaA,CAAM;AAAA,MAC9B,OAAO,WAAW,YAAc,IAAA,QAAoB,WAAW;AAC7D,QAAA,IAAI,MAAM,+BAAgC;AACvD;MCDaC,IAAaC,EAAE,OAAO;AAAA,EACjC,MAAMA,EAAE,OAAO;AAAA,EACf,YAAYA,EAAE,OAAO,EAAE,SAAS;AAAA,EAChC,IAAIA,EAAE,OAAO,EAAE,SAAS;AAAA,EACxB,OAAOA,EAAE,OAAO;AAClB,CAAC;AAIoBA,EAAE,MAAMD,CAAU;AC/BhC,MAAME,IAAsB;ACM5B,SAASC,IAK6B;AACpCL,SAAAA,EAAmD,EAAE,YAAYI,GAAqB;AAC/F;"}
1
+ {"version":3,"file":"index.js","sources":["../../../../../../../sdk/model/src/internal.ts","../../../../../../../sdk/model/src/render/util/label.ts","../../../../../../../sdk/model/src/version.ts","../../../../../../../sdk/model/src/raw_globals.ts"],"sourcesContent":["import type { ValueOrErrors } from '@milaboratories/pl-model-common';\nimport {} from './global';\nimport type { Platforma } from './platforma';\nimport type { FutureHandle, GlobalCfgRenderCtx } from './render/internal';\n\n/** Utility code helping to identify whether the code is running in actual UI environment */\nexport function isInUI() {\n return (\n typeof globalThis.getPlatforma !== 'undefined' || typeof globalThis.platforma !== 'undefined'\n );\n}\n\n/** Utility code helping to retrieve a platforma instance form the environment */\nexport function getPlatformaInstance<\n Args = unknown,\n Outputs extends Record<string, ValueOrErrors<unknown>> = Record<string, ValueOrErrors<unknown>>,\n UiState = unknown,\n Href extends `/${string}` = `/${string}`,\n>(config?: { sdkVersion: string }): Platforma<Args, Outputs, UiState, Href> {\n if (config && typeof globalThis.getPlatforma === 'function')\n return globalThis.getPlatforma(config);\n else if (typeof globalThis.platforma !== 'undefined') return globalThis.platforma;\n else throw new Error('Can\\'t get platforma instance.');\n}\n\nexport function tryGetCfgRenderCtx(): GlobalCfgRenderCtx | undefined {\n if (typeof globalThis.cfgRenderCtx !== 'undefined') return globalThis.cfgRenderCtx;\n else return undefined;\n}\n\nexport function getCfgRenderCtx(): GlobalCfgRenderCtx {\n if (typeof globalThis.cfgRenderCtx !== 'undefined') return globalThis.cfgRenderCtx;\n else throw new Error('Not in config rendering context');\n}\n\nexport function tryRegisterCallback(key: string, callback: (...args: any[]) => any): boolean {\n const ctx = tryGetCfgRenderCtx();\n if (ctx === undefined) return false;\n if (key in ctx.callbackRegistry) throw new Error(`Callback with key ${key} already registered.`);\n ctx.callbackRegistry[key] = callback;\n return true;\n}\n\nconst futureResolves = new Map<string, ((value: unknown) => void)[]>();\n\nexport function registerFutureAwait(handle: FutureHandle, onResolve: (value: unknown) => void) {\n if (!(handle in getCfgRenderCtx().callbackRegistry)) {\n getCfgRenderCtx().callbackRegistry[handle] = (value: unknown) => {\n for (const res of futureResolves.get(handle)!) {\n res(value);\n }\n };\n futureResolves.set(handle, []);\n }\n futureResolves.get(handle)!.push(onResolve);\n}\n","import type { PObjectSpec } from '@milaboratories/pl-model-common';\nimport { z } from 'zod';\n\nexport const PAnnotationLabel = 'pl7.app/label';\nexport const PAnnotationTrace = 'pl7.app/trace';\n\nexport type RecordsWithLabel<T> = {\n value: T;\n label: string;\n};\n\nexport type LabelDerivationOps = {\n /** Force inclusion of native column label */\n includeNativeLabel?: boolean;\n /** Separator to use between label parts (\" / \" by default) */\n separator?: string;\n /** If true, label will be added as suffix (at the end of the generated label). By default label added as a prefix. */\n addLabelAsSuffix?: boolean;\n /** Trace elements list that will be forced to be included in the label. */\n forceTraceElements?: string[];\n};\n\nexport const TraceEntry = z.object({\n type: z.string(),\n importance: z.number().optional(),\n id: z.string().optional(),\n label: z.string(),\n});\nexport type TraceEntry = z.infer<typeof TraceEntry>;\ntype FullTraceEntry = TraceEntry & { fullType: string; occurrenceIndex: number };\n\nexport const Trace = z.array(TraceEntry);\nexport type Trace = z.infer<typeof Trace>;\ntype FullTrace = FullTraceEntry[];\n\n// Define the possible return types for the specExtractor function\ntype SpecExtractorResult = PObjectSpec | {\n spec: PObjectSpec;\n prefixTrace?: TraceEntry[];\n suffixTrace?: TraceEntry[];\n};\n\nconst DistancePenalty = 0.001;\n\nconst LabelType = '__LABEL__';\nconst LabelTypeFull = '__LABEL__@1';\n\nexport function deriveLabels<T>(\n values: T[],\n specExtractor: (obj: T) => SpecExtractorResult,\n ops: LabelDerivationOps = {},\n): RecordsWithLabel<T>[] {\n const importances = new Map<string, number>();\n\n const forceTraceElements = (ops.forceTraceElements !== undefined && ops.forceTraceElements.length > 0)\n ? new Set(ops.forceTraceElements)\n : undefined;\n\n // number of times certain type occurred among all of the\n const numberOfRecordsWithType = new Map<string, number>();\n\n const enrichedRecords = values.map((value) => {\n const extractorResult = specExtractor(value);\n let spec: PObjectSpec;\n let prefixTrace: TraceEntry[] | undefined;\n let suffixTrace: TraceEntry[] | undefined;\n\n // Check if the result is the new structure or just PObjectSpec\n if ('spec' in extractorResult && typeof extractorResult.spec === 'object') {\n // It's the new structure { spec, prefixTrace?, suffixTrace? }\n spec = extractorResult.spec;\n prefixTrace = extractorResult.prefixTrace;\n suffixTrace = extractorResult.suffixTrace;\n } else {\n // It's just PObjectSpec\n spec = extractorResult as PObjectSpec;\n }\n\n const label = spec.annotations?.[PAnnotationLabel];\n const traceStr = spec.annotations?.[PAnnotationTrace];\n const baseTrace = (traceStr ? Trace.safeParse(JSON.parse(traceStr)).data : undefined) ?? [];\n\n const trace = [\n ...(prefixTrace ?? []),\n ...baseTrace,\n ...(suffixTrace ?? []),\n ];\n\n if (label !== undefined) {\n const labelEntry = { label, type: LabelType, importance: -2 };\n if (ops.addLabelAsSuffix) trace.push(labelEntry);\n else trace.splice(0, 0, labelEntry);\n }\n\n const fullTrace: FullTrace = [];\n\n const occurrences = new Map<string, number>();\n for (let i = trace.length - 1; i >= 0; --i) {\n const { type: typeName } = trace[i];\n const importance = trace[i].importance ?? 0;\n const occurrenceIndex = (occurrences.get(typeName) ?? 0) + 1;\n occurrences.set(typeName, occurrenceIndex);\n const fullType = `${typeName}@${occurrenceIndex}`;\n numberOfRecordsWithType.set(fullType, (numberOfRecordsWithType.get(fullType) ?? 0) + 1);\n importances.set(\n fullType,\n Math.max(\n importances.get(fullType) ?? Number.NEGATIVE_INFINITY,\n importance - (trace.length - i) * DistancePenalty,\n ),\n );\n fullTrace.push({ ...trace[i], fullType, occurrenceIndex: occurrenceIndex });\n }\n fullTrace.reverse();\n return {\n value,\n spec,\n label,\n fullTrace,\n };\n });\n\n // excluding repeated types (i.e. ..@2, ..@3, etc.) not found in some records\n const mainTypes: string[] = [];\n // repeated types (i.e. ..@2, ..@3, etc.) not found in some records\n const secondaryTypes: string[] = [];\n\n const allTypeRecords = [...importances];\n // sorting: most important types go first\n allTypeRecords.sort(([, i1], [, i2]) => i2 - i1);\n\n for (const [typeName] of allTypeRecords) {\n if (typeName.endsWith('@1') || numberOfRecordsWithType.get(typeName) === values.length)\n mainTypes.push(typeName);\n else secondaryTypes.push(typeName);\n }\n\n const calculate = (includedTypes: Set<string>, force: boolean = false) => {\n const result: RecordsWithLabel<T>[] = [];\n for (let i = 0; i < enrichedRecords.length; i++) {\n const r = enrichedRecords[i];\n const includedTrace = r.fullTrace\n .filter((fm) => includedTypes.has(fm.fullType)\n || (forceTraceElements && forceTraceElements.has(fm.type)));\n if (includedTrace.length === 0) {\n if (force)\n result.push({\n label: 'Unlabeled',\n value: r.value,\n } satisfies RecordsWithLabel<T>);\n else return undefined;\n }\n const labelSet = includedTrace\n .map((fm) => fm.label);\n const sep = ops.separator ?? ' / ';\n result.push({\n label: labelSet.join(sep),\n value: r.value,\n } satisfies RecordsWithLabel<T>);\n }\n return result;\n };\n\n if (mainTypes.length === 0) {\n if (secondaryTypes.length !== 0) throw new Error('Non-empty secondary types list while main types list is empty.');\n return calculate(new Set(LabelTypeFull), true)!;\n }\n\n //\n // includedTypes = 2\n // * *\n // T0 T1 T2 T3 T4 T5\n // *\n // additionalType = 3\n //\n // Resulting set: T0, T1, T3\n //\n let includedTypes = 0;\n let additionalType = -1;\n while (includedTypes < mainTypes.length) {\n const currentSet = new Set<string>();\n if (ops.includeNativeLabel) currentSet.add(LabelTypeFull);\n for (let i = 0; i < includedTypes; ++i) currentSet.add(mainTypes[i]);\n if (additionalType >= 0)\n currentSet.add(mainTypes[additionalType]);\n\n const candidateResult = calculate(currentSet);\n\n // checking if labels uniquely separate our records\n if (candidateResult !== undefined && new Set(candidateResult.map((c) => c.label)).size === values.length) return candidateResult;\n\n additionalType++;\n if (additionalType >= mainTypes.length) {\n includedTypes++;\n additionalType = includedTypes;\n }\n }\n\n return calculate(new Set([...mainTypes, ...secondaryTypes]), true)!;\n}\n","export const PlatformaSDKVersion = '1.37.11';\n","import type { ValueOrErrors } from '@milaboratories/pl-model-common';\nimport {} from './global';\nimport { getPlatformaInstance } from './internal';\nimport type { Platforma } from './platforma';\nimport { PlatformaSDKVersion } from './version';\n\nexport function getRawPlatformaInstance<\n Args = unknown,\n Outputs extends Record<string, ValueOrErrors<unknown>> = Record<string, ValueOrErrors<unknown>>,\n UiState = unknown,\n Href extends `/${string}` = `/${string}`,\n>(): Platforma<Args, Outputs, UiState, Href> {\n return getPlatformaInstance<Args, Outputs, UiState, Href>({ sdkVersion: PlatformaSDKVersion });\n}\n\n/** Returns a global platforma instance or a provided fallback if it's not available. */\nexport function getPlatformaOrDefault<\n Args = unknown,\n Outputs extends Record<string, ValueOrErrors<unknown>> = Record<string, ValueOrErrors<unknown>>,\n UiState = unknown,\n Href extends `/${string}` = `/${string}`,\n>(platforma: Platforma<Args, Outputs, UiState, Href>): Platforma<Args, Outputs, UiState, Href> {\n try {\n return getRawPlatformaInstance<Args, Outputs, UiState, Href>();\n } catch {\n return platforma;\n }\n}\n"],"names":["getPlatformaInstance","config","TraceEntry","z","PlatformaSDKVersion","getRawPlatformaInstance"],"mappings":";;;AAaO,SAASA,EAKdC,GAA0E;AACtEA,MAAAA,KAAU,OAAO,WAAW,gBAAiB;AACxC,WAAA,WAAW,aAAaA,CAAM;AAAA,MAC9B,OAAO,WAAW,YAAc,IAAA,QAAoB,WAAW;AAC7D,QAAA,IAAI,MAAM,+BAAgC;AACvD;MCDaC,IAAaC,EAAE,OAAO;AAAA,EACjC,MAAMA,EAAE,OAAO;AAAA,EACf,YAAYA,EAAE,OAAO,EAAE,SAAS;AAAA,EAChC,IAAIA,EAAE,OAAO,EAAE,SAAS;AAAA,EACxB,OAAOA,EAAE,OAAO;AAClB,CAAC;AAIoBA,EAAE,MAAMD,CAAU;AC/BhC,MAAME,IAAsB;ACM5B,SAASC,IAK6B;AACpCL,SAAAA,EAAmD,EAAE,YAAYI,GAAqB;AAC/F;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@milaboratories/uikit",
3
- "version": "2.2.93",
3
+ "version": "2.2.95",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "exports": {
@@ -19,8 +19,8 @@
19
19
  "sortablejs": "^1.15.6",
20
20
  "vue": "^3.5.13",
21
21
  "d3": "^7.9.0",
22
- "@platforma-sdk/model": "^1.37.2",
23
- "@milaboratories/helpers": "^1.6.15"
22
+ "@milaboratories/helpers": "^1.6.15",
23
+ "@platforma-sdk/model": "^1.37.11"
24
24
  },
25
25
  "devDependencies": {
26
26
  "@types/d3": "^7.4.3",
@@ -34,8 +34,8 @@
34
34
  "vue-tsc": "^2.1.10",
35
35
  "yarpm": "^1.2.0",
36
36
  "svgo": "^3.3.2",
37
- "@milaboratories/build-configs": "1.0.4",
38
37
  "@milaboratories/ts-configs": "1.0.4",
38
+ "@milaboratories/build-configs": "1.0.4",
39
39
  "@milaboratories/eslint-config": "^1.0.4"
40
40
  },
41
41
  "scripts": {
package/src/components/PlElementList/PlElementList.vue CHANGED
@@ -8,25 +8,26 @@ import { moveElements, optionalUpdateRef } from './utils.ts';
8
8
  import PlElementListItem from './PlElementListItem.vue';
9
9
 
10
10
  const itemsRef = defineModel<T[]>('items', { required: true });
11
- const draggableSetRef = defineModel<Set<T>>('draggableItems');
12
- const removableSetRef = defineModel<Set<T>>('removableItems');
11
+ const draggableSetRef = defineModel<Set<K>>('draggableItems');
12
+ const removableSetRef = defineModel<Set<K>>('removableItems');
13
13
 
14
- const expandableSetRef = defineModel<Set<T>>('expandableItems');
15
- const expandedSetRef = defineModel<Set<T>>('expandedItems');
14
+ const expandableSetRef = defineModel<Set<K>>('expandableItems');
15
+ const expandedSetRef = defineModel<Set<K>>('expandedItems');
16
16
 
17
- const pinnableSetRef = defineModel<Set<T>>('pinnableItems');
18
- const pinnedSetRef = defineModel<Set<T>>('pinnedItems');
17
+ const pinnableSetRef = defineModel<Set<K>>('pinnableItems');
18
+ const pinnedSetRef = defineModel<Set<K>>('pinnedItems');
19
19
 
20
- const toggableSetRef = defineModel<Set<T>>('toggableItems');
21
- const toggledSetRef = defineModel<Set<T>>('toggledItems');
20
+ const toggableSetRef = defineModel<Set<K>>('toggableItems');
21
+ const toggledSetRef = defineModel<Set<K>>('toggledItems');
22
22
 
23
23
  const props = withDefaults(
24
24
  defineProps<{
25
+ getItemKey: (item: T, index: number) => K;
26
+
25
27
  itemClass?: string | string[] | ((item: T, index: number) => string | string[]);
26
- activeItems?: Set<T>;
28
+ activeItems?: Set<K>;
27
29
 
28
30
  enableDragging?: boolean;
29
- getItemKey?: (item: T) => K;
30
31
  onDragEnd?: (oldIndex: number, newIndex: number) => void | boolean;
31
32
  onSort?: (oldIndex: number, newIndex: number) => void | boolean;
32
33
 
@@ -51,7 +52,6 @@ const props = withDefaults(
51
52
  enableToggling: undefined,
52
53
  enablePinning: undefined,
53
54
 
54
- getItemKey: undefined,
55
55
  onDragEnd: undefined,
56
56
  onSort: undefined,
57
57
  onRemove: undefined,
@@ -71,13 +71,13 @@ const slots = defineSlots<{
71
71
  }>();
72
72
 
73
73
  const dndSortingEnabled = computed((): boolean => {
74
- return props.enableDragging !== false && !isNil(props.getItemKey);
74
+ return props.enableDragging !== false;
75
75
  });
76
76
 
77
77
  const pinnedItemsRef = computed(() => itemsRef.value.filter(isPinned));
78
78
  const hasPinnedItems = computed(() => pinnedItemsRef.value.length > 0);
79
79
 
80
- const unpinnedItemsRef = computed(() => itemsRef.value.filter((item) => !isPinned(item)));
80
+ const unpinnedItemsRef = computed(() => itemsRef.value.filter((item, index) => !isPinned(item, index)));
81
81
  const hasUnpinnedItems = computed(() => unpinnedItemsRef.value.length > 0);
82
82
 
83
83
  const domProjectionItemsRef = shallowRef<undefined | T[]>();
@@ -86,11 +86,11 @@ const unpinnedContainerRef = shallowRef<HTMLElement>();
86
86
 
87
87
  // version fix problem with sync between data and rendered values when items have been changed
88
88
  const versionRef = computed<number>((oldVersion) => {
89
- const currentVersion = shallowHash(...itemsRef.value);
89
+ const currentVersion = shallowHash(...itemsRef.value.map(props.getItemKey));
90
90
 
91
91
  if (domProjectionItemsRef.value === undefined) return oldVersion ?? currentVersion;
92
92
 
93
- const lastSortedVersion = shallowHash(...domProjectionItemsRef.value);
93
+ const lastSortedVersion = shallowHash(...domProjectionItemsRef.value.map(props.getItemKey));
94
94
 
95
95
  if (currentVersion === lastSortedVersion) return oldVersion ?? currentVersion;
96
96
 
@@ -137,93 +137,105 @@ function moveItems(oldIndex: number, newIndex: number, afterUpdateDom: boolean)
137
137
  }
138
138
  }
139
139
 
140
- function isActive(item: T): boolean {
141
- return props.activeItems?.has(item) ?? false;
140
+ function isActive(item: T, index: number): boolean {
141
+ const k = props.getItemKey(item, index);
142
+ return props.activeItems?.has(k) ?? false;
142
143
  }
143
144
 
144
- function isDraggable(item: T): boolean {
145
+ function isDraggable(item: T, index: number): boolean {
146
+ const k = props.getItemKey(item, index);
145
147
  if (props.enableDragging === false) return false;
146
- return (draggableSetRef.value?.has(item) ?? true);
148
+ return (draggableSetRef.value?.has(k) ?? true);
147
149
  }
148
150
 
149
- function isToggable(item: T): boolean {
151
+ function isToggable(item: T, index: number): boolean {
152
+ const k = props.getItemKey(item, index);
150
153
  if (props.enableToggling === false) return false;
151
- return !isNil(toggledSetRef.value) && (toggableSetRef.value?.has(item) ?? true);
154
+ return !isNil(toggledSetRef.value) && (toggableSetRef.value?.has(k) ?? true);
152
155
  }
153
156
 
154
- function isToggled(item: T): boolean {
155
- return toggledSetRef.value?.has(item) ?? false;
157
+ function isToggled(item: T, index: number): boolean {
158
+ const k = props.getItemKey(item, index);
159
+ return toggledSetRef.value?.has(k) ?? false;
156
160
  }
157
161
 
158
- function isPinnable(item: T): boolean {
162
+ function isPinnable(item: T, index: number): boolean {
163
+ const k = props.getItemKey(item, index);
159
164
  if (props.enablePinning === false) return false;
160
- return !isNil(pinnedSetRef.value) && (pinnableSetRef.value?.has(item) ?? true);
165
+ return !isNil(pinnedSetRef.value) && (pinnableSetRef.value?.has(k) ?? true);
161
166
  }
162
167
 
163
- function isPinned(item: T): boolean {
164
- return pinnedSetRef.value?.has(item) ?? false;
168
+ function isPinned(item: T, index: number): boolean {
169
+ const k = props.getItemKey(item, index);
170
+ return pinnedSetRef.value?.has(k) ?? false;
165
171
  }
166
172
 
167
- function isExpandable(item: T): boolean {
173
+ function isExpandable(item: T, index: number): boolean {
174
+ const k = props.getItemKey(item, index);
168
175
  if (props.enableExpanding === false) return false;
169
- return !isNil(expandedSetRef.value) && (expandableSetRef.value?.has(item) ?? true);
176
+ return !isNil(expandedSetRef.value) && (expandableSetRef.value?.has(k) ?? true);
170
177
  }
171
178
 
172
- function isExpanded(item: T): boolean {
173
- return expandedSetRef.value?.has(item) ?? false;
179
+ function isExpanded(item: T, index: number): boolean {
180
+ const k = props.getItemKey(item, index);
181
+ return expandedSetRef.value?.has(k) ?? false;
174
182
  }
175
183
 
176
- function isRemovable(item: T): boolean {
184
+ function isRemovable(item: T, index: number): boolean {
185
+ const k = props.getItemKey(item, index);
177
186
  if (props.enableRemoving === false) return false;
178
- if (removableSetRef.value?.has(item) === false) return false;
187
+ if (removableSetRef.value?.has(k) === false) return false;
179
188
  return props.enableRemoving === true || typeof props.onRemove === 'function';
180
189
  }
181
190
 
182
191
  function handleExpand(item: T, index: number) {
183
192
  if (props.onExpand?.(item, index) === false || isNil(expandedSetRef.value)) return;
184
-
193
+ const k = props.getItemKey(item, index);
185
194
  const expanded = expandedSetRef.value;
186
- if (expanded.has(item)) expanded.delete(item);
187
- else expanded.add(item);
195
+ if (expanded.has(k)) expanded.delete(k);
196
+ else expanded.add(k);
188
197
  optionalUpdateRef(expandedSetRef);
189
198
  }
190
199
 
191
200
  function handleToggle(item: T, index: number) {
192
201
  if (props.onToggle?.(item, index) === false || isNil(toggledSetRef.value)) return;
193
-
202
+ const k = props.getItemKey(item, index);
194
203
  const toggled = toggledSetRef.value;
195
- if (toggled.has(item)) toggled.delete(item);
196
- else toggled.add(item);
204
+ if (toggled.has(k)) toggled.delete(k);
205
+ else toggled.add(k);
197
206
  optionalUpdateRef(toggledSetRef);
198
207
  }
199
208
 
200
- function handlePin(item: T, oldIndex: number) {
201
- if (oldIndex === -1) {
209
+ function handlePin(item: T, index: number) {
210
+ if (index === -1) {
202
211
  throw new Error('Pinnable item not found');
203
212
  }
204
213
 
205
- if (props.onPin?.(item, oldIndex) === false || isNil(pinnedSetRef.value)) return;
214
+ if (props.onPin?.(item, index) === false || isNil(pinnedSetRef.value)) return;
206
215
 
216
+ const k = props.getItemKey(item, index);
207
217
  const pinned = pinnedSetRef.value;
208
- const alreadyPinned = pinned.has(item);
209
- if (alreadyPinned) pinned.delete(item);
210
- else pinned.add(item);
218
+ const alreadyPinned = pinned.has(k);
219
+ if (alreadyPinned) pinned.delete(k);
220
+ else pinned.add(k);
211
221
  optionalUpdateRef(pinnedSetRef);
212
- moveItems(oldIndex, pinned.size + (alreadyPinned ? 0 : -1), false);
222
+ moveItems(index, pinned.size + (alreadyPinned ? 0 : -1), false);
213
223
  }
214
224
 
215
225
  function handleRemove(item: T, index: number) {
216
226
  if (props.onRemove?.(item, index) !== false) {
227
+ const k = props.getItemKey(item, index);
228
+
217
229
  itemsRef.value.splice(index, 1);
218
230
  optionalUpdateRef(itemsRef);
219
231
 
220
- if (pinnedSetRef.value?.has(item)) {
221
- pinnedSetRef.value.delete(item);
232
+ if (pinnedSetRef.value?.has(k)) {
233
+ pinnedSetRef.value.delete(k);
222
234
  optionalUpdateRef(pinnedSetRef);
223
235
  }
224
236
 
225
- if (toggledSetRef.value?.has(item)) {
226
- toggledSetRef.value.delete(item);
237
+ if (toggledSetRef.value?.has(k)) {
238
+ toggledSetRef.value.delete(k);
227
239
  optionalUpdateRef(toggledSetRef);
228
240
  }
229
241
  }
@@ -231,8 +243,7 @@ function handleRemove(item: T, index: number) {
231
243
 
232
244
  // version fix problem with sync between data and rendered values
233
245
  const getKey = (item: T, index: number) => {
234
- if (isNil(props.getItemKey)) return `${versionRef.value}-${index}`;
235
- return `${versionRef.value}-${props.getItemKey(item)}`;
246
+ return `${versionRef.value}-${props.getItemKey(item, index)}`;
236
247
  };
237
248
  const pinnedKeysRef = computed(() => pinnedItemsRef.value.map(getKey));
238
249
  const unpinnedKeysRef = computed(() => unpinnedItemsRef.value.map(getKey));
@@ -256,15 +267,15 @@ const getItemClass = (item: T, index: number): null | string | string[] => {
256
267
  :index="pinnedIndex"
257
268
  :item="pinnedItem"
258
269
  :showDragHandle="dndSortingEnabled"
259
- :isActive="isActive(pinnedItem)"
260
- :isDraggable="isDraggable(pinnedItem)"
261
- :isRemovable="isRemovable(pinnedItem)"
262
- :isToggable="isToggable(pinnedItem)"
263
- :isToggled="isToggled(pinnedItem)"
264
- :isPinnable="isPinnable(pinnedItem)"
265
- :isPinned="isPinned(pinnedItem)"
266
- :isExpandable="isExpandable(pinnedItem)"
267
- :isExpanded="isExpanded(pinnedItem)"
270
+ :isActive="isActive(pinnedItem, pinnedIndex)"
271
+ :isDraggable="isDraggable(pinnedItem, pinnedIndex)"
272
+ :isRemovable="isRemovable(pinnedItem, pinnedIndex)"
273
+ :isToggable="isToggable(pinnedItem, pinnedIndex)"
274
+ :isToggled="isToggled(pinnedItem, pinnedIndex)"
275
+ :isPinnable="isPinnable(pinnedItem, pinnedIndex)"
276
+ :isPinned="isPinned(pinnedItem, pinnedIndex)"
277
+ :isExpandable="isExpandable(pinnedItem, pinnedIndex)"
278
+ :isExpanded="isExpanded(pinnedItem, pinnedIndex)"
268
279
 
269
280
  @click="emits('itemClick', pinnedItem)"
270
281
  @remove="handleRemove"
@@ -288,15 +299,15 @@ const getItemClass = (item: T, index: number): null | string | string[] => {
288
299
  :index="unpinnedIndex + (pinnedSetRef?.size ?? 0)"
289
300
  :item="unpinnedItem"
290
301
  :showDragHandle="dndSortingEnabled"
291
- :isActive="isActive(unpinnedItem)"
292
- :isDraggable="isDraggable(unpinnedItem)"
293
- :isRemovable="isRemovable(unpinnedItem)"
294
- :isToggable="isToggable(unpinnedItem)"
295
- :isToggled="isToggled(unpinnedItem)"
296
- :isPinnable="isPinnable(unpinnedItem)"
297
- :isPinned="isPinned(unpinnedItem)"
298
- :isExpandable="isExpandable(unpinnedItem)"
299
- :isExpanded="isExpanded(unpinnedItem)"
302
+ :isActive="isActive(unpinnedItem, unpinnedIndex)"
303
+ :isDraggable="isDraggable(unpinnedItem, unpinnedIndex)"
304
+ :isRemovable="isRemovable(unpinnedItem, unpinnedIndex)"
305
+ :isToggable="isToggable(unpinnedItem, unpinnedIndex)"
306
+ :isToggled="isToggled(unpinnedItem, unpinnedIndex)"
307
+ :isPinnable="isPinnable(unpinnedItem, unpinnedIndex)"
308
+ :isPinned="isPinned(unpinnedItem, unpinnedIndex)"
309
+ :isExpandable="isExpandable(unpinnedItem, unpinnedIndex)"
310
+ :isExpanded="isExpanded(unpinnedItem, unpinnedIndex)"
300
311
 
301
312
  @click="emits('itemClick', unpinnedItem)"
302
313
  @remove="handleRemove"
package/src/components/PlElementList/PlElementListItem.vue CHANGED
@@ -168,8 +168,8 @@ const emit = defineEmits<{
168
168
  .title {
169
169
  display: flex;
170
170
  flex-direction: row;
171
+ flex: 1 1 0;
171
172
  gap: 8px;
172
- max-width: calc(100% - 50px);
173
173
  overflow: hidden;
174
174
  text-overflow: ellipsis;
175
175
  }
@@ -177,7 +177,7 @@ const emit = defineEmits<{
177
177
  .body {
178
178
  display: flex;
179
179
  flex-direction: column;
180
- gap: 8px;
180
+ gap: 12px;
181
181
  padding: 24px;
182
182
  border-radius: 0 0 var(--border-radius) var(--border-radius);
183
183
  }