@platforma-sdk/ui-vue 1.40.3 → 1.40.5

package/dist/lib/ui/uikit/dist/components/PlElementList/PlElementList.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlElementList.vue2.js","sources":["../../../../../../../../../lib/ui/uikit/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 { isFunction, shallowHash } from '@milaboratories/helpers';\nimport { useSortable } from '@vueuse/integrations/useSortable';\nimport { type SortableEvent } from 'sortablejs';\nimport { moveElements } from './utils.ts';\nimport PlElementListItem from './PlElementListItem.vue';\n\nconst itemsRef = defineModel<T[]>('items', { required: true });\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    isActive?: (item: T, index: number) => boolean;\n\n    disableDragging?: boolean;\n    isDraggable?: (item: T, index: number) => boolean;\n    onDragEnd?: (oldIndex: number, newIndex: number) => void | boolean;\n    onSort?: (oldIndex: number, newIndex: number) => void | boolean;\n\n    disableRemoving?: boolean;\n    isRemovable?: (item: T, index: number) => boolean;\n    onRemove?: (item: T, index: number) => void | boolean;\n\n    disableExpanding?: boolean;\n    isExpandable?: (item: T, index: number) => boolean;\n    isExpanded?: (item: T, index: number) => boolean;\n    onExpand?: (item: T, index: number) => unknown;\n\n    disableToggling?: boolean;\n    isToggable?: (item: T, index: number) => boolean;\n    isToggled?: (item: T, index: number) => boolean;\n    onToggle?: (item: T, index: number) => unknown;\n\n    disablePinning?: boolean;\n    isPinnable?: (item: T, index: number) => boolean;\n    isPinned?: (item: T, index: number) => boolean;\n    onPin?: (item: T, index: number) => void | boolean;\n  }>(), {\n    getItemKey: (item: T) => JSON.stringify(item) as K,\n\n    itemClass: undefined,\n    isActive: undefined,\n\n    disableDragging: undefined,\n    isDraggable: undefined,\n    onDragEnd: undefined,\n    onSort: undefined,\n\n    disableRemoving: undefined,\n    isRemovable: undefined,\n    onRemove: undefined,\n\n    disableExpanding: undefined,\n    isExpandable: undefined,\n    isExpanded: undefined,\n    onExpand: undefined,\n\n    disableToggling: undefined,\n    isToggable: undefined,\n    isToggled: undefined,\n    onToggle: undefined,\n\n    disablePinning: undefined,\n    isPinnable: undefined,\n    isPinned: 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.disableDragging !== true;\n});\n\nconst pinnedItemsRef = computed(() => itemsRef.value.filter(isPinnedItem));\nconst hasPinnedItems = computed(() => pinnedItemsRef.value.length > 0);\n\nconst unpinnedItemsRef = computed(() => itemsRef.value.filter((item, index) => !isPinnedItem(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\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\n// version fix problem with sync between data and rendered values when items have been changed\nconst versionRef = computed<number>((oldVersion) => {\n  const currentKeys = itemsRef.value.map(props.getItemKey);\n\n  if (domProjectionItemsRef.value === undefined) return oldVersion ?? shallowHash(...currentKeys);\n  if (currentKeys.length !== domProjectionItemsRef.value.length) return shallowHash(...currentKeys);\n\n  const domProjectionKeys = domProjectionItemsRef.value.map(props.getItemKey);\n  const domProjectionKeysSet = new Set(domProjectionKeys);\n\n  for (let i = 0; i < currentKeys.length; i++) {\n    const hasInconsistentPosition = domProjectionKeysSet.has(currentKeys[i]) && domProjectionKeys[i] !== currentKeys[i];\n\n    if (hasInconsistentPosition) {\n      return shallowHash(...currentKeys);\n    }\n  }\n\n  return oldVersion ?? shallowHash(...currentKeys);\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([() => props.disableDragging, toggler], ([disabled, on]) => disabled || !on ? sortable.stop() : sortable.start(), {\n    immediate: true,\n  });\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  }\n}\n\nfunction isActiveItem(item: T, index: number): boolean {\n  return props.isActive?.(item, index) ?? false;\n}\n\nfunction isDraggableItem(item: T, index: number): boolean {\n  if (props.disableDragging === true) return false;\n  return (props.isDraggable?.(item, index) ?? true);\n}\n\nfunction isRemovableItem(item: T, index: number): boolean {\n  if (props.disableRemoving === true) return false;\n  return (props.isRemovable?.(item, index) ?? true);\n}\n\nfunction isToggableItem(item: T, index: number): boolean {\n  if (props.disableToggling === true) return false;\n  return (props.isToggable?.(item, index) ?? (isFunction(props.isToggled) || isFunction(props.onToggle)));\n}\n\nfunction isToggledItem(item: T, index: number): boolean {\n  return props.isToggled?.(item, index) ?? false;\n}\n\nfunction isPinnableItem(item: T, index: number): boolean {\n  if (props.disablePinning === true) return false;\n  return (props.isPinnable?.(item, index) ?? (isFunction(props.isPinned) || isFunction(props.onPin)));\n}\n\nfunction isPinnedItem(item: T, index: number): boolean {\n  return props.isPinned?.(item, index) ?? false;\n}\n\nfunction isExpandableItem(item: T, index: number): boolean {\n  if (props.disableExpanding === true) return false;\n  return (props.isExpandable?.(item, index) ?? (isFunction(props.isExpanded) || isFunction(props.onExpand)));\n}\n\nfunction isExpandedItem(item: T, index: number): boolean {\n  return props.isExpanded?.(item, index) ?? false;\n}\n\nfunction handleExpand(item: T, index: number) {\n  props.onExpand?.(item, index);\n}\n\nfunction handleToggle(item: T, index: number) {\n  props.onToggle?.(item, index);\n}\n\nfunction handlePin(item: T, index: number) {\n  if (index === -1) {\n    throw new Error('Pinnable item not found');\n  }\n\n  const alreadyPinned = pinnedItemsRef.value.includes(item);\n\n  if (props.onPin?.(item, index) === false) return;\n\n  moveItems(index, pinnedItemsRef.value.length + (alreadyPinned ? 0 : -1), false);\n}\n\nfunction handleRemove(item: T, index: number) {\n  if (props.onRemove?.(item, index) === false) return;\n  itemsRef.value.splice(index, 1);\n}\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=\"isActiveItem(pinnedItem, pinnedIndex)\"\n        :isDraggable=\"isDraggableItem(pinnedItem, pinnedIndex)\"\n        :isRemovable=\"isRemovableItem(pinnedItem, pinnedIndex)\"\n        :isToggable=\"isToggableItem(pinnedItem, pinnedIndex)\"\n        :isToggled=\"isToggledItem(pinnedItem, pinnedIndex)\"\n        :isPinnable=\"isPinnableItem(pinnedItem, pinnedIndex)\"\n        :isPinned=\"true\"\n        :isExpandable=\"isExpandableItem(pinnedItem, pinnedIndex)\"\n        :isExpanded=\"isExpandedItem(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 + (pinnedItemsRef?.length ?? 0)\"\n        :item=\"unpinnedItem\"\n        :showDragHandle=\"dndSortingEnabled\"\n        :isActive=\"isActiveItem(unpinnedItem, unpinnedIndex)\"\n        :isDraggable=\"isDraggableItem(unpinnedItem, unpinnedIndex)\"\n        :isRemovable=\"isRemovableItem(unpinnedItem, unpinnedIndex)\"\n        :isToggable=\"isToggableItem(unpinnedItem, unpinnedIndex)\"\n        :isToggled=\"isToggledItem(unpinnedItem, unpinnedIndex)\"\n        :isPinnable=\"isPinnableItem(unpinnedItem, unpinnedIndex)\"\n        :isPinned=\"false\"\n        :isExpandable=\"isExpandableItem(unpinnedItem, unpinnedIndex)\"\n        :isExpanded=\"isExpandedItem(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","props","emits","__emit","slots","_useSlots","dndSortingEnabled","computed","pinnedItemsRef","isPinnedItem","hasPinnedItems","unpinnedItemsRef","item","index","hasUnpinnedItems","domProjectionItemsRef","shallowRef","pinnedContainerRef","unpinnedContainerRef","getKey","versionRef","pinnedKeysRef","unpinnedKeysRef","oldVersion","currentKeys","shallowHash","domProjectionKeys","domProjectionKeysSet","i","createSortable","toggler","elRef","getOffset","sortable","useSortable","evt","_a","moveItems","watch","disabled","on","oldIndex","newIndex","afterUpdateDom","moveElements","isActiveItem","isDraggableItem","isRemovableItem","isToggableItem","isFunction","isToggledItem","isPinnableItem","isExpandableItem","isExpandedItem","handleExpand","handleToggle","handlePin","alreadyPinned","handleRemove","getItemClass"],"mappings":"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"}
+{"version":3,"file":"PlElementList.vue2.js","sources":["../../../../../../../../../lib/ui/uikit/src/components/PlElementList/PlElementList.vue"],"sourcesContent":["<script generic=\"T extends unknown = unknown, K extends number | string = number | string\" lang=\"ts\" setup>\nimport { isFunction, shallowHash } from '@milaboratories/helpers';\nimport { useSortable } from '@vueuse/integrations/useSortable';\nimport { type SortableEvent } from 'sortablejs';\nimport type { ShallowRef } from 'vue';\nimport { computed, shallowRef, watch } from 'vue';\nimport PlElementListItem from './PlElementListItem.vue';\nimport { moveElements } from './utils.ts';\n\nconst itemsRef = defineModel<T[]>('items', { required: true });\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    isActive?: (item: T, index: number) => boolean;\n\n    disableDragging?: boolean;\n    isDraggable?: (item: T, index: number) => boolean;\n    onDragEnd?: (oldIndex: number, newIndex: number) => void | boolean;\n    onSort?: (oldIndex: number, newIndex: number) => void | boolean;\n\n    disableRemoving?: boolean;\n    isRemovable?: (item: T, index: number) => boolean;\n    onRemove?: (item: T, index: number) => void | boolean;\n\n    disableExpanding?: boolean;\n    isExpandable?: (item: T, index: number) => boolean;\n    isExpanded?: (item: T, index: number) => boolean;\n    onExpand?: (item: T, index: number) => unknown;\n\n    disableToggling?: boolean;\n    isToggable?: (item: T, index: number) => boolean;\n    isToggled?: (item: T, index: number) => boolean;\n    onToggle?: (item: T, index: number) => unknown;\n\n    disablePinning?: boolean;\n    isPinnable?: (item: T, index: number) => boolean;\n    isPinned?: (item: T, index: number) => boolean;\n    onPin?: (item: T, index: number) => void | boolean;\n  }>(), {\n    getItemKey: (item: T) => JSON.stringify(item) as K,\n\n    itemClass: undefined,\n    isActive: undefined,\n\n    disableDragging: undefined,\n    isDraggable: undefined,\n    onDragEnd: undefined,\n    onSort: undefined,\n\n    disableRemoving: undefined,\n    isRemovable: undefined,\n    onRemove: undefined,\n\n    disableExpanding: undefined,\n    isExpandable: undefined,\n    isExpanded: undefined,\n    onExpand: undefined,\n\n    disableToggling: undefined,\n    isToggable: undefined,\n    isToggled: undefined,\n    onToggle: undefined,\n\n    disablePinning: undefined,\n    isPinnable: undefined,\n    isPinned: 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.disableDragging !== true;\n});\n\nconst pinnedItemsRef = computed(() => itemsRef.value.filter(isPinnedItem));\nconst hasPinnedItems = computed(() => pinnedItemsRef.value.length > 0);\n\nconst unpinnedItemsRef = computed(() => itemsRef.value.filter((item, index) => !isPinnedItem(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\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\n// version fix problem with sync between data and rendered values when items have been changed\nconst versionRef = computed<number>((oldVersion) => {\n  const currentKeys = itemsRef.value.map(props.getItemKey);\n\n  if (domProjectionItemsRef.value === undefined) return oldVersion ?? shallowHash(...currentKeys);\n  if (currentKeys.length !== domProjectionItemsRef.value.length) return shallowHash(...currentKeys);\n\n  const domProjectionKeys = domProjectionItemsRef.value.map(props.getItemKey);\n  const domProjectionKeysSet = new Set(domProjectionKeys);\n\n  for (let i = 0; i < currentKeys.length; i++) {\n    const hasInconsistentPosition = domProjectionKeysSet.has(currentKeys[i]) && domProjectionKeys[i] !== currentKeys[i];\n\n    if (hasInconsistentPosition) {\n      return shallowHash(...currentKeys);\n    }\n  }\n\n  return oldVersion ?? shallowHash(...currentKeys);\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(\n    [elRef, () => props.disableDragging, toggler],\n    ([elRef, disabled, on]) => {\n      if (!elRef || disabled || !on) {\n        sortable.stop();\n      } else {\n        sortable.start();\n      }\n    },\n    { immediate: true },\n  );\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  }\n}\n\nfunction isActiveItem(item: T, index: number): boolean {\n  return props.isActive?.(item, index) ?? false;\n}\n\nfunction isDraggableItem(item: T, index: number): boolean {\n  if (props.disableDragging === true) return false;\n  return (props.isDraggable?.(item, index) ?? true);\n}\n\nfunction isRemovableItem(item: T, index: number): boolean {\n  if (props.disableRemoving === true) return false;\n  return (props.isRemovable?.(item, index) ?? true);\n}\n\nfunction isToggableItem(item: T, index: number): boolean {\n  if (props.disableToggling === true) return false;\n  return (props.isToggable?.(item, index) ?? (isFunction(props.isToggled) || isFunction(props.onToggle)));\n}\n\nfunction isToggledItem(item: T, index: number): boolean {\n  return props.isToggled?.(item, index) ?? false;\n}\n\nfunction isPinnableItem(item: T, index: number): boolean {\n  if (props.disablePinning === true) return false;\n  return (props.isPinnable?.(item, index) ?? (isFunction(props.isPinned) || isFunction(props.onPin)));\n}\n\nfunction isPinnedItem(item: T, index: number): boolean {\n  return props.isPinned?.(item, index) ?? false;\n}\n\nfunction isExpandableItem(item: T, index: number): boolean {\n  if (props.disableExpanding === true) return false;\n  return (props.isExpandable?.(item, index) ?? (isFunction(props.isExpanded) || isFunction(props.onExpand)));\n}\n\nfunction isExpandedItem(item: T, index: number): boolean {\n  return props.isExpanded?.(item, index) ?? false;\n}\n\nfunction handleExpand(item: T, index: number) {\n  props.onExpand?.(item, index);\n}\n\nfunction handleToggle(item: T, index: number) {\n  props.onToggle?.(item, index);\n}\n\nfunction handlePin(item: T, index: number) {\n  if (index === -1) {\n    throw new Error('Pinnable item not found');\n  }\n\n  const alreadyPinned = pinnedItemsRef.value.includes(item);\n\n  if (props.onPin?.(item, index) === false) return;\n\n  moveItems(index, pinnedItemsRef.value.length + (alreadyPinned ? 0 : -1), false);\n}\n\nfunction handleRemove(item: T, index: number) {\n  if (props.onRemove?.(item, index) === false) return;\n  itemsRef.value.splice(index, 1);\n}\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=\"isActiveItem(pinnedItem, pinnedIndex)\"\n        :isDraggable=\"isDraggableItem(pinnedItem, pinnedIndex)\"\n        :isRemovable=\"isRemovableItem(pinnedItem, pinnedIndex)\"\n        :isToggable=\"isToggableItem(pinnedItem, pinnedIndex)\"\n        :isToggled=\"isToggledItem(pinnedItem, pinnedIndex)\"\n        :isPinnable=\"isPinnableItem(pinnedItem, pinnedIndex)\"\n        :isPinned=\"true\"\n        :isExpandable=\"isExpandableItem(pinnedItem, pinnedIndex)\"\n        :isExpanded=\"isExpandedItem(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 + (pinnedItemsRef?.length ?? 0)\"\n        :item=\"unpinnedItem\"\n        :showDragHandle=\"dndSortingEnabled\"\n        :isActive=\"isActiveItem(unpinnedItem, unpinnedIndex)\"\n        :isDraggable=\"isDraggableItem(unpinnedItem, unpinnedIndex)\"\n        :isRemovable=\"isRemovableItem(unpinnedItem, unpinnedIndex)\"\n        :isToggable=\"isToggableItem(unpinnedItem, unpinnedIndex)\"\n        :isToggled=\"isToggledItem(unpinnedItem, unpinnedIndex)\"\n        :isPinnable=\"isPinnableItem(unpinnedItem, unpinnedIndex)\"\n        :isPinned=\"false\"\n        :isExpandable=\"isExpandableItem(unpinnedItem, unpinnedIndex)\"\n        :isExpanded=\"isExpandedItem(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","props","emits","__emit","slots","_useSlots","dndSortingEnabled","computed","pinnedItemsRef","isPinnedItem","hasPinnedItems","unpinnedItemsRef","item","index","hasUnpinnedItems","domProjectionItemsRef","shallowRef","pinnedContainerRef","unpinnedContainerRef","getKey","versionRef","pinnedKeysRef","unpinnedKeysRef","oldVersion","currentKeys","shallowHash","domProjectionKeys","domProjectionKeysSet","i","createSortable","toggler","elRef","getOffset","sortable","useSortable","evt","_a","moveItems","watch","disabled","on","oldIndex","newIndex","afterUpdateDom","moveElements","isActiveItem","isDraggableItem","isRemovableItem","isToggableItem","isFunction","isToggledItem","isPinnableItem","isExpandableItem","isExpandedItem","handleExpand","handleToggle","handlePin","alreadyPinned","handleRemove","getItemClass"],"mappings":"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"}

package/dist/lib/ui/uikit/dist/components/PlElementList/PlElementListItem.vue2.js

@@ -1,5 +1,5 @@
-import { defineComponent as u, useSlots as B, computed as f, createElementBlock as i, openBlock as a, normalizeClass as t, createElementVNode as r, createCommentVNode as o, createBlock as h, createVNode as c, unref as n, renderSlot as $, withModifiers as m } from "vue";
-import p from "../PlIcon16/PlIcon16.vue.js";
+import { defineComponent as u, useSlots as B, computed as f, createElementBlock as i, openBlock as a, normalizeClass as t, createElementVNode as r, createCommentVNode as n, createBlock as h, createVNode as c, unref as o, renderSlot as $, withModifiers as p } from "vue";
+import m from "../PlIcon16/PlIcon16.vue.js";
 import b from "../PlIcon24/PlIcon24.vue.js";
 const E = ["data-draggable"], T = /* @__PURE__ */ u({
   __name: "PlElementListItem",
@@ -24,6 +24,7 @@ const E = ["data-draggable"], T = /* @__PURE__ */ u({
       class: t([e.$style.root, {
         [e.$style.active]: l.isActive,
         [e.$style.pinned]: l.isPinned,
+        [e.$style.opened]: l.isExpanded,
         [e.$style.disabled]: l.isToggled
       }])
     }, [
@@ -38,13 +39,13 @@ const E = ["data-draggable"], T = /* @__PURE__ */ u({
           class: t([e.$style.action, e.$style.draggable, { [e.$style.disable]: !l.isDraggable }]),
           "data-draggable": l.isDraggable
         }, [
-          c(n(p), { name: "drag-dots" })
-        ], 10, E)) : o("", !0),
-        e.isExpandable ? (a(), h(n(p), {
+          c(o(m), { name: "drag-dots" })
+        ], 10, E)) : n("", !0),
+        e.isExpandable ? (a(), h(o(m), {
           key: 1,
           class: t([e.$style.contentChevron, { [e.$style.opened]: l.isExpanded }]),
           name: "chevron-down"
-        }, null, 8, ["class"])) : o("", !0),
+        }, null, 8, ["class"])) : n("", !0),
         r("div", {
           class: t(e.$style.title)
         }, [
@@ -59,33 +60,33 @@ const E = ["data-draggable"], T = /* @__PURE__ */ u({
           l.isToggable ? (a(), i("div", {
             key: 0,
             class: t([e.$style.action, e.$style.clickable, { [e.$style.disable]: !l.isToggable }]),
-            onClick: s[0] || (s[0] = m((y) => d("toggle", l.item, l.index), ["stop"]))
+            onClick: s[0] || (s[0] = p((y) => d("toggle", l.item, l.index), ["stop"]))
           }, [
-            c(n(b), {
+            c(o(b), {
               name: l.isToggled === !0 ? "view-hide" : "view-show",
               size: "16"
             }, null, 8, ["name"])
-          ], 2)) : o("", !0),
+          ], 2)) : n("", !0),
           l.isPinnable ? (a(), i("div", {
             key: 1,
             class: t([e.$style.action, e.$style.clickable, {
               [e.$style.disable]: !l.isPinnable,
               [e.$style.activated]: l.isPinned
             }]),
-            onClick: s[1] || (s[1] = m((y) => d("pin", l.item, l.index), ["stop"]))
+            onClick: s[1] || (s[1] = p((y) => d("pin", l.item, l.index), ["stop"]))
           }, [
-            c(n(b), {
+            c(o(b), {
               name: "pin",
               size: "16"
             })
-          ], 2)) : o("", !0),
+          ], 2)) : n("", !0),
           l.isRemovable ? (a(), i("div", {
             key: 2,
             class: t([e.$style.action, e.$style.clickable]),
-            onClick: s[2] || (s[2] = m((y) => d("remove", l.item, l.index), ["stop"]))
+            onClick: s[2] || (s[2] = p((y) => d("remove", l.item, l.index), ["stop"]))
           }, [
-            c(n(p), { name: "close" })
-          ], 2)) : o("", !0)
+            c(o(m), { name: "close" })
+          ], 2)) : n("", !0)
         ], 2)
       ], 2),
       g.value && l.isExpanded ? (a(), i("div", {
@@ -96,7 +97,7 @@ const E = ["data-draggable"], T = /* @__PURE__ */ u({
           item: l.item,
           index: l.index
         })
-      ], 2)) : o("", !0)
+      ], 2)) : n("", !0)
     ], 2));
   }
 });

package/dist/lib/ui/uikit/dist/components/PlElementList/PlElementListItem.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlElementListItem.vue2.js","sources":["../../../../../../../../../lib/ui/uikit/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\n      v-if=\"hasContentSlot && props.isExpanded\"\n      :class=\"[$style.body, { [$style.disabled]: props.isToggled }]\"\n    >\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  min-height: 40px;\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  &.disabled {\n    pointer-events: none;\n  }\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,EAIRC,GAAAA,IAAiBC,EAAS,MAAMH,EAAM,YAAe,MAAS,GAE9DI,IAAOC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"PlElementListItem.vue2.js","sources":["../../../../../../../../../lib/ui/uikit/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.opened]: props.isExpanded,\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\n      v-if=\"hasContentSlot && props.isExpanded\"\n      :class=\"[$style.body, { [$style.disabled]: props.isToggled }]\"\n    >\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    --head-background: var(--gradient-light-lime);\n  }\n\n  &.opened {\n    --head-background: var(--gradient-light-lime);\n  }\n\n  &.disabled {\n    --icon-color: var(--ic-02);\n    --border-color: var(--border-color-div-grey);\n    color: var(--txt-03);\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  min-height: 40px;\n  border-radius: var(--border-radius) var(--border-radius) 0 0;\n  background: var(--head-background);\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  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  &.disabled {\n    pointer-events: none;\n  }\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,EAIRC,GAAAA,IAAiBC,EAAS,MAAMH,EAAM,YAAe,MAAS,GAE9DI,IAAOC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/lib/ui/uikit/dist/components/PlElementList/PlElementListItem.vue3.js

@@ -2,47 +2,47 @@
   try {
     if (typeof document < "u") {
       var o = document.createElement("style");
-      o.appendChild(document.createTextNode('@use "../../assets/variables.scss" as *;._root_tuoht_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_tuoht_4.sortable-drag,._root_tuoht_4.sortable-chosen{--head-background: var(--gradient-light-lime);--border-color: var(--border-color-focus);--box-shadow: var(--box-shadow-active) }._root_tuoht_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_tuoht_4:hover{--border-color: var(--border-color-focus)}._root_tuoht_4._disabled_tuoht_33{opacity:.6;filter:grayscale(1)}._root_tuoht_4._pinned_tuoht_38{--background: var(--bg-base-light)}._root_tuoht_4._active_tuoht_42{--border-color: var(--border-color-focus);--head-background: var(--btn-accent-positive-500)}._head_tuoht_48{position:relative;display:flex;align-items:center;padding:8px;min-height:40px;border-radius:var(--border-radius) var(--border-radius) 0 0;background:var(--head-background)}._head_tuoht_48:hover,._head_tuoht_48._opened_tuoht_57{--head-background: var(--gradient-light-lime)}._contentChevron_tuoht_62{display:block;width:16px;height:16px;margin-right:4px;transform:rotate(-90deg);transition:transform .15s}._contentChevron_tuoht_62._opened_tuoht_57{transform:rotate(0)}._title_tuoht_75{display:flex;flex-direction:row;flex:1 1 0;gap:8px;overflow:hidden;text-overflow:ellipsis}._body_tuoht_84{display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:0 0 var(--border-radius) var(--border-radius)}._body_tuoht_84._disabled_tuoht_33{pointer-events:none}._actions_tuoht_96{position:absolute;top:8px;right:8px;display:flex;align-items:center;background-color:var(--background);border-radius:var(--border-radius)}._action_tuoht_96{width:24px;height:24px;padding:4px;opacity:.6;border-radius:var(--border-radius);transition:all .15s}._action_tuoht_96 svg{width:16px;height:16px}._action_tuoht_96:hover{opacity:1;background-color:var(--bg-elevated-02)}._action_tuoht_96._activated_tuoht_124{opacity:.8}._action_tuoht_96._disable_tuoht_33{cursor:not-allowed;opacity:.4}._clickable_tuoht_134{cursor:pointer}._draggable_tuoht_138{cursor:grab}._showOnHover_tuoht_142{opacity:0;transition:opacity .15s}._root_tuoht_4:hover ._showOnHover_tuoht_142{opacity:1}')), document.head.appendChild(o);
+      o.appendChild(document.createTextNode('@use "../../assets/variables.scss" as *;._root_102m7_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_102m7_4.sortable-drag,._root_102m7_4.sortable-chosen{--head-background: var(--gradient-light-lime);--border-color: var(--border-color-focus);--box-shadow: var(--box-shadow-active) }._root_102m7_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_102m7_4:hover{--border-color: var(--border-color-focus);--head-background: var(--gradient-light-lime)}._root_102m7_4._opened_102m7_34{--head-background: var(--gradient-light-lime)}._root_102m7_4._disabled_102m7_38{--icon-color: var(--ic-02);--border-color: var(--border-color-div-grey);color:var(--txt-03);filter:grayscale(1)}._root_102m7_4._pinned_102m7_45{--background: var(--bg-base-light)}._root_102m7_4._active_102m7_49{--border-color: var(--border-color-focus);--head-background: var(--btn-accent-positive-500)}._head_102m7_55{position:relative;display:flex;align-items:center;padding:8px;min-height:40px;border-radius:var(--border-radius) var(--border-radius) 0 0;background:var(--head-background)}._contentChevron_102m7_65{display:block;width:16px;height:16px;margin-right:4px;transform:rotate(-90deg);transition:transform .15s}._contentChevron_102m7_65._opened_102m7_34{transform:rotate(0)}._title_102m7_78{display:flex;flex-direction:row;flex:1 1 0;gap:8px;text-overflow:ellipsis}._body_102m7_86{display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:0 0 var(--border-radius) var(--border-radius)}._body_102m7_86._disabled_102m7_38{pointer-events:none}._actions_102m7_98{position:absolute;top:8px;right:8px;display:flex;align-items:center;background-color:var(--background);border-radius:var(--border-radius)}._action_102m7_98{width:24px;height:24px;padding:4px;opacity:.6;border-radius:var(--border-radius);transition:all .15s}._action_102m7_98 svg{width:16px;height:16px}._action_102m7_98:hover{opacity:1;background-color:var(--bg-elevated-02)}._action_102m7_98._activated_102m7_126{opacity:.8}._action_102m7_98._disable_102m7_38{cursor:not-allowed;opacity:.4}._clickable_102m7_136{cursor:pointer}._draggable_102m7_140{cursor:grab}._showOnHover_102m7_144{opacity:0;transition:opacity .15s}._root_102m7_4:hover ._showOnHover_102m7_144{opacity:1}')), document.head.appendChild(o);
     }
-  } catch (t) {
-    console.error("vite-plugin-css-injected-by-js", t);
+  } catch (r) {
+    console.error("vite-plugin-css-injected-by-js", r);
   }
 })();
-const r = "_root_tuoht_4", a = "_disabled_tuoht_33", e = "_pinned_tuoht_38", _ = "_active_tuoht_42", d = "_head_tuoht_48", i = "_opened_tuoht_57", n = "_contentChevron_tuoht_62", s = "_title_tuoht_75", h = "_body_tuoht_84", c = "_actions_tuoht_96", u = "_action_tuoht_96", l = "_activated_tuoht_124", b = "_disable_tuoht_33", p = "_clickable_tuoht_134", v = "_draggable_tuoht_138", g = "_showOnHover_tuoht_142", x = {
-  root: r,
-  disabled: a,
-  pinned: e,
-  active: _,
-  head: d,
-  opened: i,
+const a = "_root_102m7_4", e = "_opened_102m7_34", _ = "_disabled_102m7_38", t = "_pinned_102m7_45", d = "_active_102m7_49", i = "_head_102m7_55", n = "_contentChevron_102m7_65", s = "_title_102m7_78", c = "_body_102m7_86", l = "_actions_102m7_98", b = "_action_102m7_98", m = "_activated_102m7_126", v = "_disable_102m7_38", p = "_clickable_102m7_136", g = "_draggable_102m7_140", h = "_showOnHover_102m7_144", u = {
+  root: a,
+  opened: e,
+  disabled: _,
+  pinned: t,
+  active: d,
+  head: i,
   contentChevron: n,
   title: s,
-  body: h,
-  actions: c,
-  action: u,
-  activated: l,
-  disable: b,
+  body: c,
+  actions: l,
+  action: b,
+  activated: m,
+  disable: v,
   clickable: p,
-  draggable: v,
-  showOnHover: g
+  draggable: g,
+  showOnHover: h
 };
 export {
-  u as action,
-  c as actions,
-  l as activated,
-  _ as active,
-  h as body,
+  b as action,
+  l as actions,
+  m as activated,
+  d as active,
+  c as body,
   p as clickable,
   n as contentChevron,
-  x as default,
-  b as disable,
-  a as disabled,
-  v as draggable,
-  d as head,
-  i as opened,
-  e as pinned,
-  r as root,
-  g as showOnHover,
+  u as default,
+  v as disable,
+  _ as disabled,
+  g as draggable,
+  i as head,
+  e as opened,
+  t as pinned,
+  a as root,
+  h as showOnHover,
   s as title
 };
 //# sourceMappingURL=PlElementListItem.vue3.js.map

package/dist/lib/ui/uikit/dist/components/PlElementList/utils.js

@@ -1,9 +1,10 @@
-const l = (s, e, t) => {
-  if (t >= 0 && t < s.length) {
-    const c = s.splice(e, 1)[0];
-    s.splice(t, 0, c);
-  }
-  return s;
+const l = (o, t, e) => {
+  if (e >= 0 && e < o.length) {
+    const n = o.splice(t, 1)[0];
+    o.splice(e, 0, n);
+  } else
+    console.warn(`Invalid move operation: from ${t} to ${e} in array of length ${o.length}`);
+  return o;
 };
 export {
   l as moveElements

package/dist/lib/ui/uikit/dist/components/PlElementList/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../../../../../../lib/ui/uikit/src/components/PlElementList/utils.ts"],"sourcesContent":["export const moveElements = <T>(array: T[], from: number, to: number): T[] => {\n  if (to >= 0 && to < array.length) {\n    const element = array.splice(from, 1)[0];\n    array.splice(to, 0, element);\n  }\n\n  return array;\n};\n"],"names":["moveElements","array","from","to","element"],"mappings":"AAAO,MAAMA,IAAe,CAAIC,GAAYC,GAAcC,MAAoB;AAC5E,MAAIA,KAAM,KAAKA,IAAKF,EAAM,QAAQ;AAChC,UAAMG,IAAUH,EAAM,OAAOC,GAAM,CAAC,EAAE,CAAC;AACjCD,IAAAA,EAAA,OAAOE,GAAI,GAAGC,CAAO;AAAA,EAAA;AAGtBH,SAAAA;AACT;"}
+{"version":3,"file":"utils.js","sources":["../../../../../../../../../lib/ui/uikit/src/components/PlElementList/utils.ts"],"sourcesContent":["export const moveElements = <T>(array: T[], from: number, to: number): T[] => {\n  if (to >= 0 && to < array.length) {\n    const element = array.splice(from, 1)[0];\n    array.splice(to, 0, element);\n  } else {\n    console.warn(`Invalid move operation: from ${from} to ${to} in array of length ${array.length}`);\n  }\n\n  return array;\n};\n"],"names":["moveElements","array","from","to","element"],"mappings":"AAAO,MAAMA,IAAe,CAAIC,GAAYC,GAAcC,MAAoB;AAC5E,MAAIA,KAAM,KAAKA,IAAKF,EAAM,QAAQ;AAChC,UAAMG,IAAUH,EAAM,OAAOC,GAAM,CAAC,EAAE,CAAC;AACjCD,IAAAA,EAAA,OAAOE,GAAI,GAAGC,CAAO;AAAA,EAAA;AAEnB,YAAA,KAAK,gCAAgCF,CAAI,OAAOC,CAAE,uBAAuBF,EAAM,MAAM,EAAE;AAG1FA,SAAAA;AACT;"}

package/dist/lib/ui/uikit/dist/components/PlFileDialog/PlFileDialog.vue.js

@@ -1,13 +1,13 @@
-import { defineComponent as h, ref as B, computed as S, useTemplateRef as b, createBlock as s, openBlock as p, unref as t, withModifiers as d, normalizeClass as R, createSlots as w, withCtx as a, createElementVNode as F, createCommentVNode as v, createVNode as n, mergeProps as y, createTextVNode as c, toDisplayString as I } from "vue";
-import N from "./pl-file-dialog.module.scss.js";
-import { notEmpty as O } from "../../lib/util/helpers/dist/index.js";
-import $ from "../PlDialogModal/PlDialogModal.vue.js";
+import { defineComponent as h, ref as B, computed as S, useTemplateRef as b, createBlock as s, openBlock as p, unref as t, withModifiers as d, normalizeClass as R, createSlots as $, withCtx as a, createElementVNode as w, createCommentVNode as v, createVNode as n, mergeProps as y, createTextVNode as c, toDisplayString as F } from "vue";
+import I from "./pl-file-dialog.module.scss.js";
+import { notEmpty as N } from "../../lib/util/helpers/dist/index.js";
+import O from "../PlDialogModal/PlDialogModal.vue.js";
 import z from "../PlBtnPrimary/PlBtnPrimary.vue.js";
-import D from "../PlBtnGhost/PlBtnGhost.vue.js";
-import T from "../PlBtnGroup/PlBtnGroup.vue.js";
-import j from "./Remote.vue.js";
-import E from "./Local.vue.js";
-const M = { style: { margin: "0 24px" } }, K = /* @__PURE__ */ h({
+import T from "../PlBtnGhost/PlBtnGhost.vue.js";
+import j from "../PlBtnGroup/PlBtnGroup.vue.js";
+import A from "./Remote.vue.js";
+import D from "./Local.vue.js";
+const E = { style: { margin: "0 24px" } }, K = /* @__PURE__ */ h({
   __name: "PlFileDialog",
   props: {
     modelValue: { type: Boolean },
@@ -30,37 +30,37 @@ const M = { style: { margin: "0 24px" } }, K = /* @__PURE__ */ h({
       }
     ], i = () => m("update:modelValue", !1), u = b("remote"), f = () => {
       var l, e;
-      (l = u.value) != null && l.isReady && (m("import:files", O((e = u.value) == null ? void 0 : e.getFilesToImport())), i());
+      (l = u.value) != null && l.isReady && (m("import:files", N((e = u.value) == null ? void 0 : e.getFilesToImport())), i());
     }, _ = (l) => {
       m("import:files", l), i();
     };
-    return (l, e) => (p(), s(t($), {
+    return (l, e) => (p(), s(t(O), {
       "no-content-gutters": !0,
       "close-on-outside-click": l.closeOnOutsideClick,
-      class: R(["pl-dialog-modal", t(N).component]),
+      class: R(["pl-dialog-modal", t(I).component]),
       "model-value": l.modelValue,
       width: "688px",
       height: "720px",
       "onUpdate:modelValue": i,
       onClick: e[1] || (e[1] = d(() => {
       }, ["stop"]))
-    }, w({
+    }, $({
       title: a(() => [
-        c(I(l.title ?? g.value), 1)
+        c(F(l.title ?? g.value), 1)
       ]),
       default: a(() => [
-        F("div", M, [
-          n(t(T), {
+        w("div", E, [
+          n(t(j), {
             modelValue: o.value,
             "onUpdate:modelValue": e[0] || (e[0] = (r) => o.value = r),
             options: x
           }, null, 8, ["modelValue"])
         ]),
-        o.value === "remote" ? (p(), s(j, y({
+        o.value === "remote" ? (p(), s(A, y({
           key: 0,
           ref: "remote"
         }, l.$props, { submit: f }), null, 16)) : v("", !0),
-        o.value === "local" ? (p(), s(E, y({
+        o.value === "local" ? (p(), s(D, y({
           key: 1,
           "import-files": _
         }, l.$props), null, 16)) : v("", !0)
@@ -82,7 +82,7 @@ const M = { style: { margin: "0 24px" } }, K = /* @__PURE__ */ h({
               ])),
               _: 1
             }, 8, ["disabled"]),
-            n(t(D), {
+            n(t(T), {
               "justify-center": !1,
               onClick: d(i, ["stop"])
             }, {

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarGroup.vue.js

@@ -0,0 +1,10 @@
+import o from "./PlSidebarGroup.vue2.js";
+import t from "./PlSidebarGroup.vue3.js";
+import r from "../../_virtual/_plugin-vue_export-helper.js";
+const s = {
+  $style: t
+}, p = /* @__PURE__ */ r(o, [["__cssModules", s]]);
+export {
+  p as default
+};
+//# sourceMappingURL=PlSidebarGroup.vue.js.map

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarGroup.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlSidebarGroup.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarGroup.vue2.js

@@ -0,0 +1,21 @@
+import { defineComponent as n, useSlots as a, createElementBlock as t, openBlock as s, normalizeClass as o, Fragment as m, renderList as c, renderSlot as i } from "vue";
+const k = /* @__PURE__ */ n({
+  __name: "PlSidebarGroup",
+  setup(d) {
+    const r = a();
+    return (e, p) => (s(), t("div", {
+      class: o(e.$style.root)
+    }, [
+      (s(!0), t(m, null, c(Object.keys(r), (l) => (s(), t("div", {
+        key: l,
+        class: o(e.$style.item)
+      }, [
+        i(e.$slots, l)
+      ], 2))), 128))
+    ], 2));
+  }
+});
+export {
+  k as default
+};
+//# sourceMappingURL=PlSidebarGroup.vue2.js.map

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarGroup.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlSidebarGroup.vue2.js","sources":["../../../../../../../../../lib/ui/uikit/src/components/PlSidebar/PlSidebarGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nconst slots = defineSlots<{\n  [K in `item-${number}`]: () => unknown;\n}>();\n</script>\n\n<template>\n  <div :class=\"$style.root\">\n    <template v-for=\"name in Object.keys(slots) as `item-${number}`[]\" :key=\"name\" >\n      <div :class=\"$style.item\">\n        <slot :name=\"name\" />\n      </div>\n    </template>\n  </div>\n</template>\n\n<style lang=\"scss\" module>\n@use '../../assets/variables.scss';\n\n.root {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n}\n\n.item {\n  width: 1000%;\n  height: 100%;\n  border-right: 1px solid var(--border-color-div-grey);\n\n  &:last-child {\n    border-right: none;\n  }\n}\n</style>\n"],"names":["slots","_useSlots"],"mappings":";;;;AACA,UAAMA,IAAQC,EAEV;;;;;;;;;;;;;"}

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarGroup.vue3.js

@@ -0,0 +1,20 @@
+(function() {
+  try {
+    if (typeof document < "u") {
+      var e = document.createElement("style");
+      e.appendChild(document.createTextNode(":root{--txt-00: #ffffff;--txt-01: light-dark(#110529, #ffffff);--txt-02: #231842;--txt-03: #9d9eae;--txt-mask: #cfd1db;--txt-focus: #07ad3e;--txt-error: #f1222f;--txt-link: #5f31cc;--ic-00: #ffffff;--ic-01: #110529;--ic-02: #cfd1db;--ic-accent: #07ad3e;--border-color-default: #110529;--border-color-hover: #231842;--border-color-focus: #49cc49;--border-color-error: #ff5c5c;--border-color-div-grey: #e1e3eb;--border-color-div-bw: #ffffff;--btn-accent-default: #845cff;--btn-accent-hover: #9470ff;--btn-accent-press: #6f4dd6;--btn-primary-default: #110529;--btn-primary-hover: #231842;--btn-primary-press: #080214;--btn-sec-hover-white: rgba(255, 255, 255, .5);--btn-sec-hover-grey: light-dark(rgba(155, 171, 204, .16), rgba(131, 131, 163, .16));--btn-sec-press-grey: rgba(155, 171, 204, .24);--btn-active-select: rgba(99, 224, 36, .24);--btn-switcher: linear-gradient(180deg, #a1e59c 0%, #d0f5b0 100%);--btn-accent-positive-500: #ECFBE5;--dis-00: #ffffff;--dis-01: light-dark(#cfd1db, #3d3d42);--bg-base-dark: #110529;--bg-base-light: #f7f8fa;--bg-elevated-01: #ffffff;--bg-elevated-02: #e1e3eb;--bg-error: #FFF5F5;--filled-V-BG: #d0f0c0;--filled-D-BG: #ffcecc;--filled-N-BG: #faf5aa;--filled-J-BG: #dedbff;--notification-neutral: linear-gradient(90deg, #d6d9ff 0%, #fff 100%);--notification-success: linear-gradient(90deg, #c9f0b6 0%, #fff 100%);--notification-warning: linear-gradient(90deg, #fee0a3 0%, #fff 100%);--notification-error: linear-gradient(90deg, #ffb8b8 0%, #fff 100%);--gradient-blue-green: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-green-lime: linear-gradient(180deg, #a1e59c 0%, #d0f5b0 100%);--gradient-blue-violet: linear-gradient(180deg, #adb8ff 0%, #d6e9ff 100%);--gradient-blue-clear: linear-gradient(180deg, #85beff 0%, #cef 100%);--gradient-orange: linear-gradient(180deg, #ffb766 0%, #ffeaa3 100%);--gradient-mint: linear-gradient(180deg, #7dd1d1 0%, #c8fae9 100%);--gradient-lime: linear-gradient(180deg, #bfe062 0%, #e4ffad 100%);--gradient-rose: linear-gradient(0deg, #ffddd6 0%, #ff99c9 100%);--gradient-red: linear-gradient(0deg, #ffd5cc 0%, #ff9494 100%);--gradient-violet: linear-gradient(180deg, #bca3ff 0%, #e5e5ff 100%);--TT-gradient-violet: linear-gradient(180deg, #bca3ff 0%, #e5e5ff 100%);--gradient-light-lime: linear-gradient(180deg, #EBFFEB 0%, transparent 100%);--shadow-l: 0px 8px 16px -4px rgba(15, 36, 77, .16), 0px 12px 32px -4px rgba(15, 36, 77, .16);--main-spacing: 24px;--gap-v: 24px;--gap-h: 12px;--border-radius: 6px;--z-splash: 50;--z-slide-shadow: 80;--z-slide-dialog: 81;--z-dialog: 100;--z-dropdown-options: 110;--z-tooltip: 120;--z-context-menu: 1001;--scrollbar-width: 6px}[data-theme=dark]{--txt-00: #ffffff;--txt-01: #FFFFFF;--txt-02: #adaeb8;--txt-03: #60616b;--txt-mask: #3D3D42;--txt-focus: #87e087;--txt-error: #ff5c5c;--txt-link: #9470ff;--ic-00: #ffffff;--ic-01: #FFFFFF;--ic-02: #60616b;--ic-accent: #87e087;--border-color-default: #60616b;--border-color-hover: #adaeb8;--border-color-focus: #49cc49;--border-color-error: #ff5c5c;--border-color-div-grey: #232329;--border-color-div-bw: #000000;--btn-accent-default: #5f31cc;--btn-accent-hover: #5f31cc;--btn-accent-press: #5f31cc;--btn-primary-default: #5f31cc;--btn-primary-hover: #6d3ddb;--btn-primary-press: #5328b8;--btn-sec-hover-white: rgba(131, 131, 163, .16);--btn-sec-hover-grey: rgba(131, 131, 163, .16);--btn-sec-press-grey: rgba(131, 131, 163, .24);--btn-active-select: rgba(99, 224, 36, .24);--btn-switcher: #5e5e70;--dis-00: #65656b;--dis-01: #3D3D42;--bg-base-dark: #0d0d0f;--bg-base-light: #0d0d0f;--bg-elevated-01: #1b1b1f;--bg-elevated-02: #2d2d33;--bg-error: #FFF5F5;--filled-V-BG: rgba(66, 184, 66, .4);--filled-D-BG: rgba(229, 83, 229, .4);--filled-N-BG: rgba(83, 82, 102, .4);--filled-J-BG: rgba(132, 92, 255, .4);--notification-neutral: linear-gradient(90deg, #4d4d8f 0%, #292933 100%);--notification-success: linear-gradient(90deg, #305c3e 0%, #292933 100%);--notification-warning: linear-gradient(90deg, #754f2d 0%, #292933 100%);--notification-error: linear-gradient(90deg, #8f3343 0%, #292933 100%);--gradient-blue-green: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-green-lime: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-blue-violet: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-blue-clear: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-orange: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-mint: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-lime: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-rose: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-red: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-violet: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%)}._root_adhhl_131{position:relative;display:flex;flex-direction:row}._item_adhhl_137{width:1000%;height:100%;border-right:1px solid var(--border-color-div-grey)}._item_adhhl_137:last-child{border-right:none}")), document.head.appendChild(e);
+    }
+  } catch (r) {
+    console.error("vite-plugin-css-injected-by-js", r);
+  }
+})();
+const d = "_root_adhhl_131", t = "_item_adhhl_137", a = {
+  root: d,
+  item: t
+};
+export {
+  a as default,
+  t as item,
+  d as root
+};
+//# sourceMappingURL=PlSidebarGroup.vue3.js.map

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarGroup.vue3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlSidebarGroup.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarItem.vue.js

@@ -0,0 +1,10 @@
+import o from "./PlSidebarItem.vue2.js";
+import s from "./PlSidebarItem.vue3.js";
+import r from "../../_virtual/_plugin-vue_export-helper.js";
+const t = {
+  $style: s
+}, p = /* @__PURE__ */ r(o, [["__cssModules", t]]);
+export {
+  p as default
+};
+//# sourceMappingURL=PlSidebarItem.vue.js.map

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarItem.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlSidebarItem.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarItem.vue2.js

@@ -0,0 +1,39 @@
+import { defineComponent as c, useSlots as d, createElementBlock as o, openBlock as s, normalizeClass as n, renderSlot as e, createCommentVNode as l } from "vue";
+const m = /* @__PURE__ */ c({
+  __name: "PlSidebarItem",
+  setup(a) {
+    const r = d();
+    return (t, y) => (s(), o("div", {
+      class: n(t.$style.root)
+    }, [
+      e(t.$slots, "header", {}, () => [
+        r["header-content"] ? (s(), o("div", {
+          key: 0,
+          class: n(t.$style.header)
+        }, [
+          e(t.$slots, "header-content")
+        ], 2)) : l("", !0)
+      ]),
+      e(t.$slots, "body", {}, () => [
+        r["body-content"] ? (s(), o("div", {
+          key: 0,
+          class: n(t.$style.body)
+        }, [
+          e(t.$slots, "body-content")
+        ], 2)) : l("", !0)
+      ]),
+      e(t.$slots, "footer", {}, () => [
+        r["footer-content"] ? (s(), o("div", {
+          key: 0,
+          class: n(t.$style.footer)
+        }, [
+          e(t.$slots, "footer-content")
+        ], 2)) : l("", !0)
+      ])
+    ], 2));
+  }
+});
+export {
+  m as default
+};
+//# sourceMappingURL=PlSidebarItem.vue2.js.map

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarItem.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlSidebarItem.vue2.js","sources":["../../../../../../../../../lib/ui/uikit/src/components/PlSidebar/PlSidebarItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nconst slots = defineSlots<{\n  'header'?: () => unknown;\n  'header-content'?: () => unknown;\n  'body'?: () => unknown;\n  'body-content'?: () => unknown;\n  'footer'?: () => unknown;\n  'footer-content'?: () => unknown;\n}>();\n</script>\n\n<template>\n  <div :class=\"$style.root\">\n    <slot name=\"header\">\n      <div v-if=\"slots['header-content']\" :class=\"$style.header\">\n        <slot name=\"header-content\" />\n      </div>\n    </slot>\n    <slot name=\"body\">\n      <div v-if=\"slots['body-content']\" :class=\"$style.body\">\n        <slot name=\"body-content\" />\n      </div>\n    </slot>\n    <slot name=\"footer\">\n      <div v-if=\"slots['footer-content']\" :class=\"$style.footer\">\n        <slot name=\"footer-content\" />\n      </div>\n    </slot>\n  </div>\n</template>\n\n<style lang=\"scss\" module>\n@use '../../assets/variables.scss';\n\n.root {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n}\n.close {\n  cursor: pointer;\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  padding: 8px;\n}\n.header {\n  padding: 24px;\n}\n.body {\n  flex-grow: 1;\n  padding: 24px;\n  overflow-y: auto;\n}\n.footer {\n  padding: 24px;\n  border-top: 1px solid var(--border-color-div-grey);\n}\n</style>\n"],"names":["slots","_useSlots"],"mappings":";;;;AACA,UAAMA,IAAQC,EAOV;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarItem.vue3.js

@@ -0,0 +1,26 @@
+(function() {
+  try {
+    if (typeof document < "u") {
+      var e = document.createElement("style");
+      e.appendChild(document.createTextNode(":root{--txt-00: #ffffff;--txt-01: light-dark(#110529, #ffffff);--txt-02: #231842;--txt-03: #9d9eae;--txt-mask: #cfd1db;--txt-focus: #07ad3e;--txt-error: #f1222f;--txt-link: #5f31cc;--ic-00: #ffffff;--ic-01: #110529;--ic-02: #cfd1db;--ic-accent: #07ad3e;--border-color-default: #110529;--border-color-hover: #231842;--border-color-focus: #49cc49;--border-color-error: #ff5c5c;--border-color-div-grey: #e1e3eb;--border-color-div-bw: #ffffff;--btn-accent-default: #845cff;--btn-accent-hover: #9470ff;--btn-accent-press: #6f4dd6;--btn-primary-default: #110529;--btn-primary-hover: #231842;--btn-primary-press: #080214;--btn-sec-hover-white: rgba(255, 255, 255, .5);--btn-sec-hover-grey: light-dark(rgba(155, 171, 204, .16), rgba(131, 131, 163, .16));--btn-sec-press-grey: rgba(155, 171, 204, .24);--btn-active-select: rgba(99, 224, 36, .24);--btn-switcher: linear-gradient(180deg, #a1e59c 0%, #d0f5b0 100%);--btn-accent-positive-500: #ECFBE5;--dis-00: #ffffff;--dis-01: light-dark(#cfd1db, #3d3d42);--bg-base-dark: #110529;--bg-base-light: #f7f8fa;--bg-elevated-01: #ffffff;--bg-elevated-02: #e1e3eb;--bg-error: #FFF5F5;--filled-V-BG: #d0f0c0;--filled-D-BG: #ffcecc;--filled-N-BG: #faf5aa;--filled-J-BG: #dedbff;--notification-neutral: linear-gradient(90deg, #d6d9ff 0%, #fff 100%);--notification-success: linear-gradient(90deg, #c9f0b6 0%, #fff 100%);--notification-warning: linear-gradient(90deg, #fee0a3 0%, #fff 100%);--notification-error: linear-gradient(90deg, #ffb8b8 0%, #fff 100%);--gradient-blue-green: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-green-lime: linear-gradient(180deg, #a1e59c 0%, #d0f5b0 100%);--gradient-blue-violet: linear-gradient(180deg, #adb8ff 0%, #d6e9ff 100%);--gradient-blue-clear: linear-gradient(180deg, #85beff 0%, #cef 100%);--gradient-orange: linear-gradient(180deg, #ffb766 0%, #ffeaa3 100%);--gradient-mint: linear-gradient(180deg, #7dd1d1 0%, #c8fae9 100%);--gradient-lime: linear-gradient(180deg, #bfe062 0%, #e4ffad 100%);--gradient-rose: linear-gradient(0deg, #ffddd6 0%, #ff99c9 100%);--gradient-red: linear-gradient(0deg, #ffd5cc 0%, #ff9494 100%);--gradient-violet: linear-gradient(180deg, #bca3ff 0%, #e5e5ff 100%);--TT-gradient-violet: linear-gradient(180deg, #bca3ff 0%, #e5e5ff 100%);--gradient-light-lime: linear-gradient(180deg, #EBFFEB 0%, transparent 100%);--shadow-l: 0px 8px 16px -4px rgba(15, 36, 77, .16), 0px 12px 32px -4px rgba(15, 36, 77, .16);--main-spacing: 24px;--gap-v: 24px;--gap-h: 12px;--border-radius: 6px;--z-splash: 50;--z-slide-shadow: 80;--z-slide-dialog: 81;--z-dialog: 100;--z-dropdown-options: 110;--z-tooltip: 120;--z-context-menu: 1001;--scrollbar-width: 6px}[data-theme=dark]{--txt-00: #ffffff;--txt-01: #FFFFFF;--txt-02: #adaeb8;--txt-03: #60616b;--txt-mask: #3D3D42;--txt-focus: #87e087;--txt-error: #ff5c5c;--txt-link: #9470ff;--ic-00: #ffffff;--ic-01: #FFFFFF;--ic-02: #60616b;--ic-accent: #87e087;--border-color-default: #60616b;--border-color-hover: #adaeb8;--border-color-focus: #49cc49;--border-color-error: #ff5c5c;--border-color-div-grey: #232329;--border-color-div-bw: #000000;--btn-accent-default: #5f31cc;--btn-accent-hover: #5f31cc;--btn-accent-press: #5f31cc;--btn-primary-default: #5f31cc;--btn-primary-hover: #6d3ddb;--btn-primary-press: #5328b8;--btn-sec-hover-white: rgba(131, 131, 163, .16);--btn-sec-hover-grey: rgba(131, 131, 163, .16);--btn-sec-press-grey: rgba(131, 131, 163, .24);--btn-active-select: rgba(99, 224, 36, .24);--btn-switcher: #5e5e70;--dis-00: #65656b;--dis-01: #3D3D42;--bg-base-dark: #0d0d0f;--bg-base-light: #0d0d0f;--bg-elevated-01: #1b1b1f;--bg-elevated-02: #2d2d33;--bg-error: #FFF5F5;--filled-V-BG: rgba(66, 184, 66, .4);--filled-D-BG: rgba(229, 83, 229, .4);--filled-N-BG: rgba(83, 82, 102, .4);--filled-J-BG: rgba(132, 92, 255, .4);--notification-neutral: linear-gradient(90deg, #4d4d8f 0%, #292933 100%);--notification-success: linear-gradient(90deg, #305c3e 0%, #292933 100%);--notification-warning: linear-gradient(90deg, #754f2d 0%, #292933 100%);--notification-error: linear-gradient(90deg, #8f3343 0%, #292933 100%);--gradient-blue-green: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-green-lime: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-blue-violet: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-blue-clear: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-orange: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-mint: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-lime: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-rose: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-red: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-violet: linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%)}._root_32dd1_131{position:relative;display:flex;flex-direction:column}._close_32dd1_137{cursor:pointer;position:absolute;top:8px;right:8px;padding:8px}._header_32dd1_145{padding:24px}._body_32dd1_149{flex-grow:1;padding:24px;overflow-y:auto}._footer_32dd1_155{padding:24px;border-top:1px solid var(--border-color-div-grey)}")), document.head.appendChild(e);
+    }
+  } catch (r) {
+    console.error("vite-plugin-css-injected-by-js", r);
+  }
+})();
+const d = "_root_32dd1_131", a = "_close_32dd1_137", t = "_header_32dd1_145", i = "_body_32dd1_149", n = "_footer_32dd1_155", f = {
+  root: d,
+  close: a,
+  header: t,
+  body: i,
+  footer: n
+};
+export {
+  i as body,
+  a as close,
+  f as default,
+  n as footer,
+  t as header,
+  d as root
+};
+//# sourceMappingURL=PlSidebarItem.vue3.js.map

package/dist/lib/ui/uikit/dist/components/PlSidebar/PlSidebarItem.vue3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlSidebarItem.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}