npm - @central-design-system/components - Versions diffs - 4.0.0-alpha.3 → 4.0.0-alpha.5 - Mend

@central-design-system/components 4.0.0-alpha.3 → 4.0.0-alpha.5

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 (1190) hide show

package/dist/es/src/components/CdsVirtualScroll/CdsVirtualScroll.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CdsVirtualScroll.vue_vue_type_script_setup_true_lang.js","sources":["../../../../../src/components/CdsVirtualScroll/CdsVirtualScroll.vue"],"sourcesContent":["<script setup lang=\"tsx\">\nimport './CdsVirtualScroll.scss';\n\nimport { useDimensions } from '@cds/composables/useDimensions';\nimport { useVirtual } from '@cds/composables/useVirtual';\nimport { getCurrentInstance, useDefaults, useToggleScope } from '@cds/core';\nimport { classNames, convertToUnit, getScrollParent, IN_BROWSER } from '@cds/utils';\nimport { onMounted, onScopeDispose, toRef, unref } from 'vue';\n\nimport { CdsVirtualScrollConstants } from './api/CdsVirtualScroll.constants';\nimport { defineCdsVirtualScrollProps } from './api/CdsVirtualScroll.props';\nimport type { CdsVirtualScrollSlots } from './api/CdsVirtualScroll.types';\nimport CdsVirtualScrollItem from './CdsVirtualScrollItem.vue';\n\ndefineOptions({\n name: CdsVirtualScrollConstants.name\n});\n\nconst _props = defineProps({ ...defineCdsVirtualScrollProps() });\nconst props = useDefaults(_props);\nconst slots = defineSlots<CdsVirtualScrollSlots<any, any>>(); // @todo need generic\n\nconst vm = getCurrentInstance(CdsVirtualScrollConstants.name);\nconst { dimensionStyles } = useDimensions(props);\nconst {\n containerRef,\n markerRef,\n computedItems,\n paddingTop,\n paddingBottom,\n calculateVisibleItems,\n scrollToIndex,\n handleScroll,\n handleScrollend,\n handleItemResize\n} = useVirtual(\n props,\n toRef(() => props.items)\n);\n\n// В режиме renderless собственный скролл-контейнер не создаётся — слушаем\n// скролл ближайшего скроллируемого родителя.\nuseToggleScope(\n () => props.renderless,\n () => {\n function handleListeners(add = false) {\n const method = add ? 'addEventListener' : 'removeEventListener';\n\n if (!IN_BROWSER) return;\n\n if (containerRef.value === document.documentElement) {\n document[method]('scroll', handleScroll, { passive: true });\n document[method]('scrollend', handleScrollend);\n } else {\n containerRef.value?.[method]('scroll', handleScroll, { passive: true });\n containerRef.value?.[method]('scrollend', handleScrollend);\n }\n }\n\n onMounted(() => {\n containerRef.value = getScrollParent(vm.vnode.el as HTMLElement, true);\n handleListeners(true);\n });\n onScopeDispose(handleListeners);\n }\n);\n\ndefineRender(() => {\n const { rootClass } = CdsVirtualScrollConstants;\n\n const children = unref(computedItems).map((item) => (\n <CdsVirtualScrollItem\n key={item.key}\n renderless={props.renderless}\n onUpdate:height={(height: number) => handleItemResize(item.index, height)}\n >\n {(slotProps: { itemRef: any }) => slots.default?.({ item: item.raw, index: item.index, ...slotProps })}\n </CdsVirtualScrollItem>\n ));\n\n return props.renderless ? (\n <>\n <div ref={markerRef} class={`${rootClass}__spacer`} style={{ paddingTop: convertToUnit(unref(paddingTop)) }} />\n {children}\n <div class={`${rootClass}__spacer`} style={{ paddingBottom: convertToUnit(unref(paddingBottom)) }} />\n </>\n ) : (\n <div\n ref={containerRef}\n class={classNames(rootClass, props.class)}\n onScroll={handleScroll}\n onScrollend={handleScrollend}\n style={[unref(dimensionStyles), props.style]}\n >\n <div\n ref={markerRef}\n class={`${rootClass}__container`}\n style={{\n paddingTop: convertToUnit(unref(paddingTop)),\n paddingBottom: convertToUnit(unref(paddingBottom))\n }}\n >\n {children}\n </div>\n </div>\n );\n});\n\ndefineExpose({\n calculateVisibleItems,\n scrollToIndex\n});\n</script>\n"],"names":["_props","__props","props","useDefaults","slots","_useSlots","vm","getCurrentInstance","CdsVirtualScrollConstants","name","dimensionStyles","useDimensions","containerRef","markerRef","computedItems","paddingTop","paddingBottom","calculateVisibleItems","scrollToIndex","handleScroll","handleScrollend","handleItemResize","useVirtual","toRef","items","useToggleScope","renderless","handleListeners","add","method","IN_BROWSER","value","document","documentElement","passive","onMounted","getScrollParent","vnode","el","onScopeDispose","__expose","rootClass","children","unref","map","item","_createVNode","CdsVirtualScrollItem","key","height","index","default","slotProps","raw","_Fragment","convertToUnit","classNames","class","style"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAkBA,UAAMA,SAASC;AACf,UAAMC,QAAQC,YAAYH,MAAM;AAChC,UAAMI,QAAQC;AAEd,UAAMC,KAAKC,mBAAmBC,0BAA0BC,IAAI;AAC5D,UAAM;AAAA,MAAEC;AAAAA,IAAgB,IAAIC,cAAcT,KAAK;AAC/C,UAAM;AAAA,MACJU;AAAAA,MACAC;AAAAA,MACAC;AAAAA,MACAC;AAAAA,MACAC;AAAAA,MACAC;AAAAA,MACAC;AAAAA,MACAC;AAAAA,MACAC;AAAAA,MACAC;AAAAA,IACF,IAAIC,WACFpB,OACAqB,MAAM,MAAMrB,MAAMsB,KAAK,CACzB;AAIAC,mBACE,MAAMvB,MAAMwB,YACZ,MAAM;AACJ,eAASC,gBAAgBC,MAAM,OAAO;;AACpC,cAAMC,SAASD,MAAM,qBAAqB;AAE1C,YAAI,CAACE,WAAY;AAEjB,YAAIlB,aAAamB,UAAUC,SAASC,iBAAiB;AACnDD,mBAASH,MAAM,EAAE,UAAUV,cAAc;AAAA,YAAEe,SAAS;AAAA,UAAK,CAAC;AAC1DF,mBAASH,MAAM,EAAE,aAAaT,eAAe;AAAA,QAC/C,OAAO;AACLR,6BAAamB,UAAbnB,mBAAqBiB,QAAQ,UAAUV,cAAc;AAAA,YAAEe,SAAS;AAAA,UAAK;AACrEtB,6BAAamB,UAAbnB,mBAAqBiB,QAAQ,aAAaT;AAAAA,QAC5C;AAAA,MACF;AAEAe,gBAAU,MAAM;AACdvB,qBAAamB,QAAQK,gBAAgB9B,GAAG+B,MAAMC,IAAmB,IAAI;AACrEX,wBAAgB,IAAI;AAAA,MACtB,CAAC;AACDY,qBAAeZ,eAAe;AAAA,IAChC,CACF;AA2CAa,aAAa;AAAA,~~MACXvB~~;AAAAA,~~MACAC~~;AAAAA,IACF,CAAC;~~WA5CY~~,MAAM;AACjB,YAAM;AAAA,QAAEuB;AAAAA,MAAU,IAAIjC;AAEtB,YAAMkC,WAAWC,MAAM7B,aAAa,EAAE8B,IAAKC,UAAIC,YAAAC,aAAA;AAAA,QAAA,OAEtCF,KAAKG;AAAAA,QAAG,cACD9C,MAAMwB;AAAAA,QAAU,mBACVuB,YAAmB5B,iBAAiBwB,KAAKK,OAAOD,MAAM;AAAA,MAAC,GAAA;AAAA,QAAAE,SAEvEC;;AAAgChD,6BAAM+C,YAAN/C,+BAAgB;AAAA,YAAEyC,MAAMA,KAAKQ;AAAAA,YAAKH,OAAOL,KAAKK;AAAAA,YAAO,GAAGE;AAAAA;;MAAY,CAAA,CAEzG;AAED,aAAOlD,MAAMwB,aAAUoB,YAAAQ,iBAAAR,YAAA,OAAA;AAAA,QAAA,OAETjC;AAAAA,QAAS,SAAS,GAAG4B,SAAS;AAAA,QAAU,SAAS;AAAA,UAAE1B,YAAYwC,cAAcZ,MAAM5B,UAAU,CAAC;AAAA,QAAE;AAAA,SAAC,IAAA,GAC1G2B,UAAQI,YAAA,OAAA;AAAA,QAAA,SACG,GAAGL,SAAS;AAAA,QAAU,SAAS;AAAA,UAAEzB,eAAeuC,cAAcZ,MAAM3B,aAAa,CAAC;AAAA,QAAE;AAAA,MAAC,GAAA,IAAA,CAAA,CAAA,IAAA8B,YAAA,OAAA;AAAA,QAAA,OAI5FlC;AAAAA,QAAY,SACV4C,WAAWf,WAAWvC,MAAMuD,KAAK;AAAA,QAAC,YAC/BtC;AAAAA,QAAY,eACTC;AAAAA,QAAe,SACrB,CAACuB,MAAMjC,eAAe,GAAGR,MAAMwD,KAAK;AAAA,MAAC,GAAA,CAAAZ,YAAA,OAAA;AAAA,QAAA,OAGrCjC;AAAAA,QAAS,SACP,GAAG4B,SAAS;AAAA,QAAa,SACzB;AAAA,UACL1B,YAAYwC,cAAcZ,MAAM5B,UAAU,CAAC;AAAA,UAC3CC,eAAeuC,cAAcZ,MAAM3B,aAAa,CAAC;AAAA,QACnD;AAAA,MAAC,GAAA,CAEA0B,QAAQ,CAAA,CAAA,CAAA;AAAA,IAIjB;AAAA;;"}
1	+ {"version":3,"file":"CdsVirtualScroll.vue_vue_type_script_setup_true_lang.js","sources":["../../../../../src/components/CdsVirtualScroll/CdsVirtualScroll.vue"],"sourcesContent":["<script setup lang=\"tsx\">\nimport './CdsVirtualScroll.scss';\n\nimport { useDimensions } from '@cds/composables/useDimensions';\nimport { useVirtual } from '@cds/composables/useVirtual';\nimport { getCurrentInstance, useDefaults, useToggleScope } from '@cds/core';\nimport { classNames, convertToUnit, getScrollParent, IN_BROWSER } from '@cds/utils';\nimport { onMounted, onScopeDispose, toRef, unref } from 'vue';\n\nimport { CdsVirtualScrollConstants } from './api/CdsVirtualScroll.constants';\nimport { defineCdsVirtualScrollProps } from './api/CdsVirtualScroll.props';\nimport type { CdsVirtualScrollSlots } from './api/CdsVirtualScroll.types';\nimport CdsVirtualScrollItem from './CdsVirtualScrollItem.vue';\n\ndefineOptions({\n name: CdsVirtualScrollConstants.name\n});\n\nconst _props = defineProps({ ...defineCdsVirtualScrollProps() });\nconst props = useDefaults(_props);\nconst slots = defineSlots<CdsVirtualScrollSlots<any, any>>(); // @todo need generic\n\nconst vm = getCurrentInstance(CdsVirtualScrollConstants.name);\nconst { dimensionStyles } = useDimensions(props);\nconst {\n containerRef,\n markerRef,\n computedItems,\n paddingTop,\n paddingBottom,\n calculateVisibleItems,\n scrollToIndex,\n handleScroll,\n handleScrollend,\n handleItemResize\n} = useVirtual(\n props,\n toRef(() => props.items)\n);\n\n// В режиме renderless собственный скролл-контейнер не создаётся — слушаем\n// скролл ближайшего скроллируемого родителя.\nuseToggleScope(\n () => props.renderless,\n () => {\n function handleListeners(add = false) {\n const method = add ? 'addEventListener' : 'removeEventListener';\n\n if (!IN_BROWSER) return;\n\n if (containerRef.value === document.documentElement) {\n document[method]('scroll', handleScroll, { passive: true });\n document[method]('scrollend', handleScrollend);\n } else {\n containerRef.value?.[method]('scroll', handleScroll, { passive: true });\n containerRef.value?.[method]('scrollend', handleScrollend);\n }\n }\n\n onMounted(() => {\n containerRef.value = getScrollParent(vm.vnode.el as HTMLElement, true);\n handleListeners(true);\n });\n onScopeDispose(handleListeners);\n }\n);\n\ndefineRender(() => {\n const { rootClass } = CdsVirtualScrollConstants;\n\n const children = unref(computedItems).map((item) => (\n <CdsVirtualScrollItem\n key={item.key}\n renderless={props.renderless}\n onUpdate:height={(height: number) => handleItemResize(item.index, height)}\n >\n {(slotProps: { itemRef: any }) => slots.default?.({ item: item.raw, index: item.index, ...slotProps })}\n </CdsVirtualScrollItem>\n ));\n\n return props.renderless ? (\n <>\n <div ref={markerRef} class={`${rootClass}__spacer`} style={{ paddingTop: convertToUnit(unref(paddingTop)) }} />\n {children}\n <div class={`${rootClass}__spacer`} style={{ paddingBottom: convertToUnit(unref(paddingBottom)) }} />\n </>\n ) : (\n <div\n ref={containerRef}\n class={classNames(rootClass, props.class)}\n onScroll={handleScroll}\n onScrollend={handleScrollend}\n style={[unref(dimensionStyles), props.style]}\n >\n <div\n ref={markerRef}\n class={`${rootClass}__container`}\n style={{\n paddingTop: convertToUnit(unref(paddingTop)),\n paddingBottom: convertToUnit(unref(paddingBottom))\n }}\n >\n {children}\n </div>\n </div>\n );\n});\n\ndefineExpose({\n /*\n Пересчитывает окно видимых элементов — нужно после изменения их высоты вне цикла обновления.\n * @en Recalculates the window of visible items — needed after their height changes outside the update cycle.\n /\n calculateVisibleItems,\n /\n Прокручивает список к элементу с указанным индексом.\n * @en Scrolls the list to the item with the given index.\n */\n scrollToIndex\n});\n</script>\n"],"names":["_props","__props","props","useDefaults","slots","_useSlots","vm","getCurrentInstance","CdsVirtualScrollConstants","name","dimensionStyles","useDimensions","containerRef","markerRef","computedItems","paddingTop","paddingBottom","calculateVisibleItems","scrollToIndex","handleScroll","handleScrollend","handleItemResize","useVirtual","toRef","items","useToggleScope","renderless","handleListeners","add","method","IN_BROWSER","value","document","documentElement","passive","onMounted","getScrollParent","vnode","el","onScopeDispose","__expose","rootClass","children","unref","map","item","_createVNode","CdsVirtualScrollItem","key","height","index","default","slotProps","raw","_Fragment","convertToUnit","classNames","class","style"],"mappings":"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"}

package/dist/es/src/components/CdsVirtualScroll/api/CdsVirtualScroll.props.js CHANGED Viewed

@@ -5,12 +5,18 @@ import { C as CdsVirtualScrollItemConstants, a as CdsVirtualScrollConstants } fr
 import { d as defineDimensionsProps } from "../../../composables/useDimensions/useDimensions.js";
 const defineCdsVirtualScrollProps = propsFactory(
   {
-    /** Массив элементов, которые отрисовываются виртуальным скроллом. */
+    /**
+     * Массив элементов, которые отрисовываются виртуальным скроллом.
+     * @en Array of the items rendered by the virtual scroll.
+     */
     items: {
       type: Array,
       default: () => []
     },
-    /** Безрамочный режим: компонент не создаёт собственный скролл-контейнер, а использует ближайший скроллируемый родитель. */
+    /**
+     * Безрамочный режим: компонент не создаёт собственный скролл-контейнер, а использует ближайший скроллируемый родитель.
+     * @en Renderless mode: the component does not create its own scroll container and uses the nearest scrollable parent instead.
+     */
     renderless: Boolean,
     ...defineVirtualProps(),
     ...defineDimensionsProps(),
@@ -20,7 +26,10 @@ const defineCdsVirtualScrollProps = propsFactory(
 );
 const defineCdsVirtualScrollItemProps = propsFactory(
   {
-    /** Безрамочный режим: элемент рендерит только содержимое слота без обёртки. */
+    /**
+     * Безрамочный режим: элемент рендерит только содержимое слота без обёртки.
+     * @en Renderless mode: the item renders only the slot content, without a wrapper.
+     */
     renderless: Boolean,
     ...defineComponentProps()
   },

package/dist/es/src/components/CdsVirtualScroll/api/CdsVirtualScroll.props.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CdsVirtualScroll.props.js","sources":["../../../../../../src/components/CdsVirtualScroll/api/CdsVirtualScroll.props.ts"],"sourcesContent":["import { defineDimensionsProps } from '@cds/composables/useDimensions';\nimport { defineVirtualProps } from '@cds/composables/useVirtual';\nimport { defineComponentProps, propsFactory } from '@cds/core';\nimport type { PropType } from 'vue';\n\nimport { CdsVirtualScrollConstants, CdsVirtualScrollItemConstants } from './CdsVirtualScroll.constants';\n\nexport const defineCdsVirtualScrollProps = propsFactory(\n {\n /** Массив элементов, которые отрисовываются виртуальным ~~скроллом.~~ /\n items: {\n type: Array as PropType<readonly unknown[]>,\n default: () => []\n },\n /* Безрамочный режим: компонент не создаёт собственный скролл-контейнер, а использует ближайший скроллируемый ~~родитель.~~ /\n renderless: Boolean,\n\n ...defineVirtualProps(),\n ...defineDimensionsProps(),\n ...defineComponentProps()\n },\n CdsVirtualScrollConstants.name\n);\n\nexport const defineCdsVirtualScrollItemProps = propsFactory(\n {\n /* Безрамочный режим: элемент рендерит только содержимое слота без ~~обёртки.~~ */\n renderless: Boolean,\n\n ...defineComponentProps()\n },\n CdsVirtualScrollItemConstants.name\n);\n"],"names":[],"mappings":";;;;;AAOO,MAAM,8BAA8B;AAAA,EACzC;AAAA;AAAA,~~IAEE~~,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS,MAAM,CAAA;AAAA,IAAC;AAAA;AAAA,~~IAGlB~~,YAAY;AAAA,IAEZ,GAAG,mBAAA;AAAA,IACH,GAAG,sBAAA;AAAA,IACH,GAAG,qBAAA;AAAA,EAAqB;AAAA,EAE1B,0BAA0B;AAC5B;AAEO,MAAM,kCAAkC;AAAA,EAC7C;AAAA;AAAA,~~IAEE~~,YAAY;AAAA,IAEZ,GAAG,qBAAA;AAAA,EAAqB;AAAA,EAE1B,8BAA8B;AAChC;"}
1	+ {"version":3,"file":"CdsVirtualScroll.props.js","sources":["../../../../../../src/components/CdsVirtualScroll/api/CdsVirtualScroll.props.ts"],"sourcesContent":["import { defineDimensionsProps } from '@cds/composables/useDimensions';\nimport { defineVirtualProps } from '@cds/composables/useVirtual';\nimport { defineComponentProps, propsFactory } from '@cds/core';\nimport type { PropType } from 'vue';\n\nimport { CdsVirtualScrollConstants, CdsVirtualScrollItemConstants } from './CdsVirtualScroll.constants';\n\nexport const defineCdsVirtualScrollProps = propsFactory(\n {\n /*\n Массив элементов, которые отрисовываются виртуальным скроллом.\n * @en Array of the items rendered by the virtual scroll.\n /\n items: {\n type: Array as PropType<readonly unknown[]>,\n default: () => []\n },\n /\n Безрамочный режим: компонент не создаёт собственный скролл-контейнер, а использует ближайший скроллируемый родитель.\n * @en Renderless mode: the component does not create its own scroll container and uses the nearest scrollable parent instead.\n /\n renderless: Boolean,\n\n ...defineVirtualProps(),\n ...defineDimensionsProps(),\n ...defineComponentProps()\n },\n CdsVirtualScrollConstants.name\n);\n\nexport const defineCdsVirtualScrollItemProps = propsFactory(\n {\n /\n Безрамочный режим: элемент рендерит только содержимое слота без обёртки.\n * @en Renderless mode: the item renders only the slot content, without a wrapper.\n */\n renderless: Boolean,\n\n ...defineComponentProps()\n },\n CdsVirtualScrollItemConstants.name\n);\n"],"names":[],"mappings":";;;;;AAOO,MAAM,8BAA8B;AAAA,EACzC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKE,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS,MAAM,CAAA;AAAA,IAAC;AAAA;AAAA;AAAA;AAAA;AAAA,IAMlB,YAAY;AAAA,IAEZ,GAAG,mBAAA;AAAA,IACH,GAAG,sBAAA;AAAA,IACH,GAAG,qBAAA;AAAA,EAAqB;AAAA,EAE1B,0BAA0B;AAC5B;AAEO,MAAM,kCAAkC;AAAA,EAC7C;AAAA;AAAA;AAAA;AAAA;AAAA,IAKE,YAAY;AAAA,IAEZ,GAAG,qBAAA;AAAA,EAAqB;AAAA,EAE1B,8BAA8B;AAChC;"}

package/dist/es/src/components/index.js CHANGED Viewed

@@ -34,7 +34,7 @@ import { C as CdsInput } from "./CdsInput/index.js";
 import { C as CdsLabel } from "./CdsLabel/index.js";
 import { C as CdsLayout } from "./CdsLayout/index.js";
 import { C as CdsLink } from "./CdsLink/index.js";
-import { C as CdsList, c as CdsListGroup, a as CdsListItem, d as CdsListItemAction, e as CdsListItemDescription, b as CdsListItemDivider, f as CdsListItemImage, g as CdsListItemMedia, h as CdsListItemSubtitle, i as CdsListItemTitle } from "./CdsList/index.js";
+import { C as CdsList, c as CdsListGroup, a as CdsListItem, d as CdsListItemAction, e as CdsListItemDescription, b as CdsListItemDivider, f as CdsListItemImage, g as CdsListItemMedia, h as CdsListItemSubtitle, i as CdsListItemTitle, j as CdsListSubheader } from "./CdsList/index.js";
 import { C as CdsLoader } from "./CdsLoader/index.js";
 import { C as CdsMain } from "./CdsMain/index.js";
 import { C as CdsMenu } from "./CdsMenu/index.js";
@@ -157,6 +157,7 @@ const index = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePropert
   CdsListItemMedia,
   CdsListItemSubtitle,
   CdsListItemTitle,
+  CdsListSubheader,
   CdsLoader,
   CdsMain,
   CdsMenu,

package/dist/es/src/components/index.js.map CHANGED Viewed

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

package/dist/es/src/composables/useAppearance/useAppearance.js CHANGED Viewed

@@ -4,7 +4,10 @@ import { toRef, toValue } from "vue";
 const availableAppearance = ["primary", "secondary", "tertiary", "inverse"];
 const defineAppearanceProps = propsFactory(
   {
-    /** Внешний вид компонента */
+    /**
+     * Внешний вид компонента
+     * @en Visual appearance of the component
+     */
     appearance: {
       type: String,
       default: "primary",

package/dist/es/src/composables/useAppearance/useAppearance.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useAppearance.js","sources":["../../../../../src/composables/useAppearance/useAppearance.ts"],"sourcesContent":["import { getCurrentInstanceName, propsFactory } from '@cds/core';\nimport type { ExtractPublicPropTypes, MaybeRefOrGetter, PropType } from 'vue';\nimport { toRef, toValue } from 'vue';\n\nexport const availableAppearance = ['primary', 'secondary', 'tertiary', 'inverse'] as const;\n\n/*\n A factory function for creating appearance-related props for components.\n \n This function generates a set of props designed to define the appearance of a component.\n * It includes validation to ensure the specified appearance is among the allowed values.\n \n Props:\n * - `appearance`: Specifies the visual style or theme of the component. Accepts only predefined values within the allowed appearance list.\n /\nexport const defineAppearanceProps = propsFactory(\n {\n /* Внешний вид ~~компонента~~ /\n appearance: {\n type: String as PropType<Appearance>,\n default: 'primary',\n validator: (value: Appearance) => availableAppearance.includes(value)\n }\n },\n 'appearance'\n);\n\nexport type Appearance = (typeof availableAppearance)[number];\nexport type AppearanceProps = ExtractPublicPropTypes<ReturnType<typeof defineAppearanceProps>>;\n\n/\n Hook to generate appearance-related classes based on the provided properties.\n \n @param {MaybeRefOrGetter<AppearanceProps>} props - Reactive or getter object containing appearance properties.\n * @param {string} [name=getCurrentInstanceName()] - The name of the current instance, used as a prefix for class generation.\n * @return {Object} An object containing a reactive reference for the generated appearance class string.\n */\nexport function useAppearance(props: MaybeRefOrGetter<AppearanceProps>, name = getCurrentInstanceName()) {\n const appearanceClasses = toRef(() => {\n const { appearance } = toValue(props);\n return `${name}--appearance-${appearance}`;\n });\n\n return { appearanceClasses };\n}\n"],"names":[],"mappings":";;;AAIO,MAAM,sBAAsB,CAAC,WAAW,aAAa,YAAY,SAAS;AAW1E,MAAM,wBAAwB;AAAA,EACnC;AAAA;AAAA,~~IAEE~~,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAsB,oBAAoB,SAAS,KAAK;AAAA,IAAA;AAAA,EACtE;AAAA,EAEF;AACF;AAYO,SAAS,cAAc,OAA0C,OAAO,0BAA0B;AACvG,QAAM,oBAAoB,MAAM,MAAM;AACpC,UAAM,EAAE,WAAA,IAAe,QAAQ,KAAK;AACpC,WAAO,GAAG,IAAI,gBAAgB,UAAU;AAAA,EAC1C,CAAC;AAED,SAAO,EAAE,kBAAA;AACX;"}
1	+ {"version":3,"file":"useAppearance.js","sources":["../../../../../src/composables/useAppearance/useAppearance.ts"],"sourcesContent":["import { getCurrentInstanceName, propsFactory } from '@cds/core';\nimport type { ExtractPublicPropTypes, MaybeRefOrGetter, PropType } from 'vue';\nimport { toRef, toValue } from 'vue';\n\nexport const availableAppearance = ['primary', 'secondary', 'tertiary', 'inverse'] as const;\n\n/*\n A factory function for creating appearance-related props for components.\n \n This function generates a set of props designed to define the appearance of a component.\n * It includes validation to ensure the specified appearance is among the allowed values.\n \n Props:\n * - `appearance`: Specifies the visual style or theme of the component. Accepts only predefined values within the allowed appearance list.\n /\nexport const defineAppearanceProps = propsFactory(\n {\n /\n Внешний вид компонента\n * @en Visual appearance of the component\n /\n appearance: {\n type: String as PropType<Appearance>,\n default: 'primary',\n validator: (value: Appearance) => availableAppearance.includes(value)\n }\n },\n 'appearance'\n);\n\nexport type Appearance = (typeof availableAppearance)[number];\nexport type AppearanceProps = ExtractPublicPropTypes<ReturnType<typeof defineAppearanceProps>>;\n\n/\n Hook to generate appearance-related classes based on the provided properties.\n \n @param {MaybeRefOrGetter<AppearanceProps>} props - Reactive or getter object containing appearance properties.\n * @param {string} [name=getCurrentInstanceName()] - The name of the current instance, used as a prefix for class generation.\n * @return {Object} An object containing a reactive reference for the generated appearance class string.\n */\nexport function useAppearance(props: MaybeRefOrGetter<AppearanceProps>, name = getCurrentInstanceName()) {\n const appearanceClasses = toRef(() => {\n const { appearance } = toValue(props);\n return `${name}--appearance-${appearance}`;\n });\n\n return { appearanceClasses };\n}\n"],"names":[],"mappings":";;;AAIO,MAAM,sBAAsB,CAAC,WAAW,aAAa,YAAY,SAAS;AAW1E,MAAM,wBAAwB;AAAA,EACnC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKE,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAsB,oBAAoB,SAAS,KAAK;AAAA,IAAA;AAAA,EACtE;AAAA,EAEF;AACF;AAYO,SAAS,cAAc,OAA0C,OAAO,0BAA0B;AACvG,QAAM,oBAAoB,MAAM,MAAM;AACpC,UAAM,EAAE,WAAA,IAAe,QAAQ,KAAK;AACpC,WAAO,GAAG,IAAI,gBAAgB,UAAU;AAAA,EAC1C,CAAC;AAED,SAAO,EAAE,kBAAA;AACX;"}

package/dist/es/src/composables/useColor/useColor.js CHANGED Viewed

@@ -5,15 +5,30 @@ import { n as normalizeColors, f as fixedAliasForeground, i as isColorAlias, s a
 import { r as resolveColorPrimitive, i as isCssColor, f as isParsableColor, p as parseColor, h as hasLightForeground } from "../../utils/colorsUtils/utils.js";
 const defineColorProps = propsFactory(
   {
-    /** Цвет компонента */
+    /**
+     * Цвет компонента
+     * @en Component color
+     */
     color: String,
-    /** Цвет неактивного компонента */
+    /**
+     * Цвет неактивного компонента
+     * @en Color of the component in its inactive state
+     */
     baseColor: String,
-    /** Цвет компонента, когда он находится в активном состоянии */
+    /**
+     * Цвет компонента, когда он находится в активном состоянии
+     * @en Color of the component in its active state
+     */
     activeColor: String,
-    /** Цвет фона компонента */
+    /**
+     * Цвет фона компонента
+     * @en Background color of the component
+     */
     bgColor: String,
-    /** Цвет текста компонента */
+    /**
+     * Цвет текста компонента
+     * @en Text color of the component
+     */
     textColor: String
   },
   "color"

package/dist/es/src/composables/useColor/useColor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useColor.js","sources":["../../../../../src/composables/useColor/useColor.ts"],"sourcesContent":["import { propsFactory } from '@cds/core';\nimport {\n destructComputed,\n hasLightForeground,\n isCssColor,\n isParsableColor,\n parseColor,\n resolveColorPrimitive\n} from '@cds/utils';\nimport { type CSSProperties, type MaybeRefOrGetter, toValue } from 'vue';\n\nimport {\n fixedAliasForeground,\n isColorAlias,\n normalizeColors,\n shadowBorderBoxShadow\n} from './internal/useColor.helpers';\nimport type {\n BackgroundColorData,\n ColorAliasType,\n ColorValue,\n ShadowBorderColorData,\n TextColorData\n} from './internal/useColor.types';\n\n/*\n A factory function for defining color-related props in a component.\n \n @typedef {Object} ColorProps\n * @property {string} color - The color of the component.\n \n @param {Object} props - The base properties object to extend.\n * @param {string} namespace - The namespace for property keys to avoid conflicts.\n * @returns {Object} The resulting props object with added color-related properties.\n /\nexport const defineColorProps = propsFactory(\n {\n /* Цвет компонента /\n color: String,\n /* Цвет неактивного компонента /\n baseColor: String,\n /* Цвет компонента, когда он находится в активном состоянии /\n activeColor: String,\n /* Цвет фона компонента /\n bgColor: String,\n /* Цвет текста компонента /\n textColor: String\n },\n 'color'\n);\n\n/\n A composable function that computes color classes and styles based on the provided color configuration\n * and an optional alias path.\n \n @param {MaybeRefOrGetter<{ background?: ColorValue; text?: ColorValue }>} colors - The color configuration\n * object containing `background` and `text` color values, which can be reactive or static.\n * @param {ColorAliasType} [aliasPath='surface'] - An optional alias path to determine how colors\n * are computed and applied.\n * @return {{ colorClasses: string, colorStyles: object }} An object containing the computed color\n * class names and inline styles for applying the colors.\n /\nexport function useColor(\n colors: MaybeRefOrGetter<{ background?: ColorValue; text?: ColorValue; shadowBorder?: ColorValue }>,\n aliasPath: ColorAliasType = 'surface'\n) {\n return destructComputed(() => {\n const { class: colorClasses, style: colorStyles } = computeColor(colors, aliasPath);\n\n return { colorClasses, colorStyles };\n });\n}\n\n/\n A hook that generates text color-related classes and inline styles based on the given color value and alias path.\n \n @param {MaybeRefOrGetter<ColorValue>} color - The primary color value or getter used for text styling.\n * @param {ColorAliasType} [aliasPath='content'] - The alias path used for determining the color mapping.\n * @return {TextColorData} An object containing the generated text color classes and inline styles.\n /\nexport function useTextColor(\n color: MaybeRefOrGetter<ColorValue>,\n aliasPath: ColorAliasType = 'content'\n): TextColorData {\n const { colorClasses: textColorClasses, colorStyles: textColorStyles } = useColor(\n () => ({\n text: toValue(color)\n }),\n aliasPath\n );\n\n return { textColorClasses, textColorStyles };\n}\n\n/\n Generates background color-related classes and styles based on the provided color and alias path.\n \n @param {MaybeRefOrGetter<ColorValue>} color - The primary color value or a function that returns the color.\n * @param {ColorAliasType} [aliasPath='surface'] - The alias path to be used for resolving color schemes.\n * @return {BackgroundColorData} An object containing the background color classes and styles.\n /\nexport function useBackgroundColor(\n color: MaybeRefOrGetter<ColorValue>,\n aliasPath: ColorAliasType = 'surface'\n): BackgroundColorData {\n const { colorClasses: backgroundColorClasses, colorStyles: backgroundColorStyles } = useColor(\n () => ({\n background: toValue(color)\n }),\n aliasPath\n );\n\n return { backgroundColorClasses, backgroundColorStyles };\n}\n\n/\n Generates border-color and box-shadow classes/styles mirroring the SCSS `cds-shadow-border` mixin.\n \n @param {MaybeRefOrGetter<ColorValue>} color - The primary color value or a function that returns the color.\n * @param {ColorAliasType} [aliasPath='line'] - The alias path used to resolve the line/border tier of the alias palette.\n * @return {ShadowBorderColorData} An object containing the shadow-border classes and styles.\n /\nexport function useShadowBorderColor(\n color: MaybeRefOrGetter<ColorValue>,\n aliasPath: ColorAliasType = 'line'\n): ShadowBorderColorData {\n const { colorClasses: shadowBorderColorClasses, colorStyles: shadowBorderColorStyles } = useColor(\n () => ({\n shadowBorder: toValue(color)\n }),\n aliasPath\n );\n\n return { shadowBorderColorClasses, shadowBorderColorStyles };\n}\n\n/\n Computes the color classes and inline styles based on the provided background and text colors.\n \n @param {MaybeRefOrGetter<{ background?: ColorValue; text?: ColorValue }>} colors - An object containing optional background and text color values. It may be a value, a reference, or a getter function.\n * @param {ColorAliasType} aliasPath - The alias path used to resolve color mapping.\n * @return {{ class: string[]; style: CSSProperties }} An object containing the computed CSS classes and inline styles for the specified colors.\n */\nexport function computeColor(\n colors: MaybeRefOrGetter<{ background?: ColorValue; text?: ColorValue; shadowBorder?: ColorValue }>,\n aliasPath: ColorAliasType\n) {\n const rawColors = toValue(colors);\n const _colors = normalizeColors(rawColors, aliasPath);\n\n const classes: string[] = [];\n const styles: CSSProperties = {};\n\n if (_colors.background) {\n const resolvedBg = resolveColorPrimitive(_colors.background) ?? _colors.background;\n\n if (isCssColor(resolvedBg)) {\n styles.backgroundColor = resolvedBg;\n\n if (!_colors.text) {\n const fixedForeground = fixedAliasForeground(rawColors.background, 'bg-');\n\n if (fixedForeground) {\n // Чёрный и белый фон не меняются вместе с темой — парный текст тоже\n // фиксированный, иначе в одной из тем он сольётся с фоном.\n styles.color = fixedForeground;\n styles.caretColor = fixedForeground;\n } else if (aliasPath === 'surface' && isColorAlias(rawColors.background, 'bg-')) {\n // Алиасные surface-цвета переворачиваются вместе с темой (в светлой —\n // насыщенные, в тёмной — светлые), поэтому парный текст берём из\n // content-inverse, а не из «всегда светлого» content-on-dark.\n classes.push('cds-theme-on-inverse');\n } else if (isParsableColor(resolvedBg)) {\n const backgroundColor = parseColor(resolvedBg);\n if (backgroundColor.a == null \|\| backgroundColor.a === 1) {\n classes.push(hasLightForeground(backgroundColor) ? 'cds-theme-on-dark' : 'cds-theme-on-light');\n }\n }\n }\n } else {\n classes.push(`bg-${_colors.background}`);\n if (!_colors.text) {\n classes.push(`on-${_colors.background}`);\n }\n }\n }\n\n if (_colors.text) {\n const resolvedText = resolveColorPrimitive(_colors.text) ?? _colors.text;\n\n if (isCssColor(resolvedText)) {\n styles.color = resolvedText;\n styles.caretColor = resolvedText;\n } else {\n classes.push(`text-${_colors.text}`);\n }\n }\n\n if (_colors.shadowBorder) {\n const resolvedBorder = resolveColorPrimitive(_colors.shadowBorder) ?? _colors.shadowBorder;\n\n if (isCssColor(resolvedBorder)) {\n styles.borderColor = resolvedBorder;\n styles.boxShadow = shadowBorderBoxShadow(resolvedBorder);\n } else {\n classes.push(`border-${_colors.shadowBorder}`);\n }\n }\n\n return { class: classes, style: styles };\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"useColor.js","sources":["../../../../../src/composables/useColor/useColor.ts"],"sourcesContent":["import { propsFactory } from '@cds/core';\nimport {\n destructComputed,\n hasLightForeground,\n isCssColor,\n isParsableColor,\n parseColor,\n resolveColorPrimitive\n} from '@cds/utils';\nimport { type CSSProperties, type MaybeRefOrGetter, toValue } from 'vue';\n\nimport {\n fixedAliasForeground,\n isColorAlias,\n normalizeColors,\n shadowBorderBoxShadow\n} from './internal/useColor.helpers';\nimport type {\n BackgroundColorData,\n ColorAliasType,\n ColorValue,\n ShadowBorderColorData,\n TextColorData\n} from './internal/useColor.types';\n\n/*\n A factory function for defining color-related props in a component.\n \n @typedef {Object} ColorProps\n * @property {string} color - The color of the component.\n \n @param {Object} props - The base properties object to extend.\n * @param {string} namespace - The namespace for property keys to avoid conflicts.\n * @returns {Object} The resulting props object with added color-related properties.\n /\nexport const defineColorProps = propsFactory(\n {\n /\n Цвет компонента\n * @en Component color\n /\n color: String,\n /\n Цвет неактивного компонента\n * @en Color of the component in its inactive state\n /\n baseColor: String,\n /\n Цвет компонента, когда он находится в активном состоянии\n * @en Color of the component in its active state\n /\n activeColor: String,\n /\n Цвет фона компонента\n * @en Background color of the component\n /\n bgColor: String,\n /\n Цвет текста компонента\n * @en Text color of the component\n /\n textColor: String\n },\n 'color'\n);\n\n/\n A composable function that computes color classes and styles based on the provided color configuration\n * and an optional alias path.\n \n @param {MaybeRefOrGetter<{ background?: ColorValue; text?: ColorValue }>} colors - The color configuration\n * object containing `background` and `text` color values, which can be reactive or static.\n * @param {ColorAliasType} [aliasPath='surface'] - An optional alias path to determine how colors\n * are computed and applied.\n * @return {{ colorClasses: string, colorStyles: object }} An object containing the computed color\n * class names and inline styles for applying the colors.\n /\nexport function useColor(\n colors: MaybeRefOrGetter<{ background?: ColorValue; text?: ColorValue; shadowBorder?: ColorValue }>,\n aliasPath: ColorAliasType = 'surface'\n) {\n return destructComputed(() => {\n const { class: colorClasses, style: colorStyles } = computeColor(colors, aliasPath);\n\n return { colorClasses, colorStyles };\n });\n}\n\n/\n A hook that generates text color-related classes and inline styles based on the given color value and alias path.\n \n @param {MaybeRefOrGetter<ColorValue>} color - The primary color value or getter used for text styling.\n * @param {ColorAliasType} [aliasPath='content'] - The alias path used for determining the color mapping.\n * @return {TextColorData} An object containing the generated text color classes and inline styles.\n /\nexport function useTextColor(\n color: MaybeRefOrGetter<ColorValue>,\n aliasPath: ColorAliasType = 'content'\n): TextColorData {\n const { colorClasses: textColorClasses, colorStyles: textColorStyles } = useColor(\n () => ({\n text: toValue(color)\n }),\n aliasPath\n );\n\n return { textColorClasses, textColorStyles };\n}\n\n/\n Generates background color-related classes and styles based on the provided color and alias path.\n \n @param {MaybeRefOrGetter<ColorValue>} color - The primary color value or a function that returns the color.\n * @param {ColorAliasType} [aliasPath='surface'] - The alias path to be used for resolving color schemes.\n * @return {BackgroundColorData} An object containing the background color classes and styles.\n /\nexport function useBackgroundColor(\n color: MaybeRefOrGetter<ColorValue>,\n aliasPath: ColorAliasType = 'surface'\n): BackgroundColorData {\n const { colorClasses: backgroundColorClasses, colorStyles: backgroundColorStyles } = useColor(\n () => ({\n background: toValue(color)\n }),\n aliasPath\n );\n\n return { backgroundColorClasses, backgroundColorStyles };\n}\n\n/\n Generates border-color and box-shadow classes/styles mirroring the SCSS `cds-shadow-border` mixin.\n \n @param {MaybeRefOrGetter<ColorValue>} color - The primary color value or a function that returns the color.\n * @param {ColorAliasType} [aliasPath='line'] - The alias path used to resolve the line/border tier of the alias palette.\n * @return {ShadowBorderColorData} An object containing the shadow-border classes and styles.\n /\nexport function useShadowBorderColor(\n color: MaybeRefOrGetter<ColorValue>,\n aliasPath: ColorAliasType = 'line'\n): ShadowBorderColorData {\n const { colorClasses: shadowBorderColorClasses, colorStyles: shadowBorderColorStyles } = useColor(\n () => ({\n shadowBorder: toValue(color)\n }),\n aliasPath\n );\n\n return { shadowBorderColorClasses, shadowBorderColorStyles };\n}\n\n/\n Computes the color classes and inline styles based on the provided background and text colors.\n \n @param {MaybeRefOrGetter<{ background?: ColorValue; text?: ColorValue }>} colors - An object containing optional background and text color values. It may be a value, a reference, or a getter function.\n * @param {ColorAliasType} aliasPath - The alias path used to resolve color mapping.\n * @return {{ class: string[]; style: CSSProperties }} An object containing the computed CSS classes and inline styles for the specified colors.\n */\nexport function computeColor(\n colors: MaybeRefOrGetter<{ background?: ColorValue; text?: ColorValue; shadowBorder?: ColorValue }>,\n aliasPath: ColorAliasType\n) {\n const rawColors = toValue(colors);\n const _colors = normalizeColors(rawColors, aliasPath);\n\n const classes: string[] = [];\n const styles: CSSProperties = {};\n\n if (_colors.background) {\n const resolvedBg = resolveColorPrimitive(_colors.background) ?? _colors.background;\n\n if (isCssColor(resolvedBg)) {\n styles.backgroundColor = resolvedBg;\n\n if (!_colors.text) {\n const fixedForeground = fixedAliasForeground(rawColors.background, 'bg-');\n\n if (fixedForeground) {\n // Чёрный и белый фон не меняются вместе с темой — парный текст тоже\n // фиксированный, иначе в одной из тем он сольётся с фоном.\n styles.color = fixedForeground;\n styles.caretColor = fixedForeground;\n } else if (aliasPath === 'surface' && isColorAlias(rawColors.background, 'bg-')) {\n // Алиасные surface-цвета переворачиваются вместе с темой (в светлой —\n // насыщенные, в тёмной — светлые), поэтому парный текст берём из\n // content-inverse, а не из «всегда светлого» content-on-dark.\n classes.push('cds-theme-on-inverse');\n } else if (isParsableColor(resolvedBg)) {\n const backgroundColor = parseColor(resolvedBg);\n if (backgroundColor.a == null \|\| backgroundColor.a === 1) {\n classes.push(hasLightForeground(backgroundColor) ? 'cds-theme-on-dark' : 'cds-theme-on-light');\n }\n }\n }\n } else {\n classes.push(`bg-${_colors.background}`);\n if (!_colors.text) {\n classes.push(`on-${_colors.background}`);\n }\n }\n }\n\n if (_colors.text) {\n const resolvedText = resolveColorPrimitive(_colors.text) ?? _colors.text;\n\n if (isCssColor(resolvedText)) {\n styles.color = resolvedText;\n styles.caretColor = resolvedText;\n } else {\n classes.push(`text-${_colors.text}`);\n }\n }\n\n if (_colors.shadowBorder) {\n const resolvedBorder = resolveColorPrimitive(_colors.shadowBorder) ?? _colors.shadowBorder;\n\n if (isCssColor(resolvedBorder)) {\n styles.borderColor = resolvedBorder;\n styles.boxShadow = shadowBorderBoxShadow(resolvedBorder);\n } else {\n classes.push(`border-${_colors.shadowBorder}`);\n }\n }\n\n return { class: classes, style: styles };\n}\n"],"names":[],"mappings":";;;;;AAmCO,MAAM,mBAAmB;AAAA,EAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,IAKE,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKP,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,IAKX,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,IAKb,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA,IAKT,WAAW;AAAA,EAAA;AAAA,EAEb;AACF;AAaO,SAAS,SACd,QACA,YAA4B,WAC5B;AACA,SAAO,iBAAiB,MAAM;AAC5B,UAAM,EAAE,OAAO,cAAc,OAAO,gBAAgB,aAAa,QAAQ,SAAS;AAElF,WAAO,EAAE,cAAc,YAAA;AAAA,EACzB,CAAC;AACH;AASO,SAAS,aACd,OACA,YAA4B,WACb;AACf,QAAM,EAAE,cAAc,kBAAkB,aAAa,oBAAoB;AAAA,IACvE,OAAO;AAAA,MACL,MAAM,QAAQ,KAAK;AAAA,IAAA;AAAA,IAErB;AAAA,EAAA;AAGF,SAAO,EAAE,kBAAkB,gBAAA;AAC7B;AASO,SAAS,mBACd,OACA,YAA4B,WACP;AACrB,QAAM,EAAE,cAAc,wBAAwB,aAAa,0BAA0B;AAAA,IACnF,OAAO;AAAA,MACL,YAAY,QAAQ,KAAK;AAAA,IAAA;AAAA,IAE3B;AAAA,EAAA;AAGF,SAAO,EAAE,wBAAwB,sBAAA;AACnC;AASO,SAAS,qBACd,OACA,YAA4B,QACL;AACvB,QAAM,EAAE,cAAc,0BAA0B,aAAa,4BAA4B;AAAA,IACvF,OAAO;AAAA,MACL,cAAc,QAAQ,KAAK;AAAA,IAAA;AAAA,IAE7B;AAAA,EAAA;AAGF,SAAO,EAAE,0BAA0B,wBAAA;AACrC;AASO,SAAS,aACd,QACA,WACA;AACA,QAAM,YAAY,QAAQ,MAAM;AAChC,QAAM,UAAU,gBAAgB,WAAW,SAAS;AAEpD,QAAM,UAAoB,CAAA;AAC1B,QAAM,SAAwB,CAAA;AAE9B,MAAI,QAAQ,YAAY;AACtB,UAAM,aAAa,sBAAsB,QAAQ,UAAU,KAAK,QAAQ;AAExE,QAAI,WAAW,UAAU,GAAG;AAC1B,aAAO,kBAAkB;AAEzB,UAAI,CAAC,QAAQ,MAAM;AACjB,cAAM,kBAAkB,qBAAqB,UAAU,YAAY,KAAK;AAExE,YAAI,iBAAiB;AAGnB,iBAAO,QAAQ;AACf,iBAAO,aAAa;AAAA,QACtB,WAAW,cAAc,aAAa,aAAa,UAAU,YAAY,KAAK,GAAG;AAI/E,kBAAQ,KAAK,sBAAsB;AAAA,QACrC,WAAW,gBAAgB,UAAU,GAAG;AACtC,gBAAM,kBAAkB,WAAW,UAAU;AAC7C,cAAI,gBAAgB,KAAK,QAAQ,gBAAgB,MAAM,GAAG;AACxD,oBAAQ,KAAK,mBAAmB,eAAe,IAAI,sBAAsB,oBAAoB;AAAA,UAC/F;AAAA,QACF;AAAA,MACF;AAAA,IACF,OAAO;AACL,cAAQ,KAAK,MAAM,QAAQ,UAAU,EAAE;AACvC,UAAI,CAAC,QAAQ,MAAM;AACjB,gBAAQ,KAAK,MAAM,QAAQ,UAAU,EAAE;AAAA,MACzC;AAAA,IACF;AAAA,EACF;AAEA,MAAI,QAAQ,MAAM;AAChB,UAAM,eAAe,sBAAsB,QAAQ,IAAI,KAAK,QAAQ;AAEpE,QAAI,WAAW,YAAY,GAAG;AAC5B,aAAO,QAAQ;AACf,aAAO,aAAa;AAAA,IACtB,OAAO;AACL,cAAQ,KAAK,QAAQ,QAAQ,IAAI,EAAE;AAAA,IACrC;AAAA,EACF;AAEA,MAAI,QAAQ,cAAc;AACxB,UAAM,iBAAiB,sBAAsB,QAAQ,YAAY,KAAK,QAAQ;AAE9E,QAAI,WAAW,cAAc,GAAG;AAC9B,aAAO,cAAc;AACrB,aAAO,YAAY,sBAAsB,cAAc;AAAA,IACzD,OAAO;AACL,cAAQ,KAAK,UAAU,QAAQ,YAAY,EAAE;AAAA,IAC/C;AAAA,EACF;AAEA,SAAO,EAAE,OAAO,SAAS,OAAO,OAAA;AAClC;"}

package/dist/es/src/composables/useDatetime/useDatetime.js CHANGED Viewed

@@ -8,6 +8,7 @@ const defineDatetimeProps = propsFactory(
   {
     /**
      * Значение модели
+     * @en Value of the model
      */
     modelValue: {
       type: [String, Array, Object],
@@ -15,6 +16,7 @@ const defineDatetimeProps = propsFactory(
     },
     /**
      * Формат даты/времени
+     * @en Date/time format
      */
     mask: {
       type: String,
@@ -23,6 +25,7 @@ const defineDatetimeProps = propsFactory(
     /**
      * Локаль для дат. Имя локали ('ru' | 'en') или объект `TDateLocale`.
      * По умолчанию берётся текущая локаль из `useLocale`, иначе `ru`.
+     * @en Locale for the dates. A locale name ('ru' | 'en') or a `TDateLocale` object. The current locale from `useLocale` is taken by default, otherwise `ru`.
      */
     locale: {
       type: [String, Object],

package/dist/es/src/composables/useDatetime/useDatetime.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDatetime.js","sources":["../../../../../src/composables/useDatetime/useDatetime.ts"],"sourcesContent":["import { useLocale } from '@cds/composables/useLocale';\nimport { propsFactory } from '@cds/core';\nimport { dateLocales, DEFAULT_DATE_LOCALE } from '@cds/locales/date';\nimport type { IRawDate, TDateLocale } from '@cds/utils';\nimport { pad, splitDate } from '@cds/utils';\nimport type { ComputedRef, PropType } from 'vue';\nimport { computed, unref } from 'vue';\n\nexport type TDatetimeValueRange = { from: string \| IRawDate; to: string \| IRawDate; target?: string \| IRawDate };\n\nexport interface DatetimeProps {\n modelValue?: string \| TDatetimeValueRange \| Array<string \| TDatetimeValueRange> \| null;\n mask: string;\n locale?: string \| TDateLocale;\n readonly?: boolean \| null;\n disabled?: boolean \| null;\n}\n\nexport interface UseDatetime {\n editable: ComputedRef<boolean>;\n tabindex: ComputedRef<number>;\n getCurrentDate: (dateOnly?: boolean) => IRawDate;\n getShortDate: (date: IRawDate) => Partial<IRawDate>;\n getLocale: () => TDateLocale;\n getMask: () => string;\n decodeString: (date: string) => IRawDate;\n}\n\n/*\n Фабрика пропсов для работы с датой/временем.\n /\nexport const defineDatetimeProps = propsFactory(\n {\n /\n Значение модели\n /\n modelValue: {\n type: [String, Array, Object] as PropType<string \| TDatetimeValueRange \| Array<string \| TDatetimeValueRange>>,\n default: null\n },\n /\n Формат даты/времени\n /\n mask: {\n type: String as PropType<string>,\n default: 'DD.MM.YYYY'\n },\n /\n Локаль для дат. Имя локали ('ru' \| 'en') или объект `TDateLocale`.\n * По умолчанию берётся текущая локаль из `useLocale`, иначе `ru`.\n /\n locale: {\n type: [String, Object] as PropType<string \| TDateLocale>,\n default: undefined\n }\n },\n 'datetime'\n);\n\n/\n Композабл для работы с датой/временем: парсинг, форматирование и резолв date-локали.\n * @param props\n /\nexport function useDatetime(props: DatetimeProps): UseDatetime {\n const i18n = useLocale();\n\n const editable = computed(() => !props.disabled && !props.readonly);\n const tabindex = computed(() => (editable.value ? 0 : -1));\n\n function getCurrentDate(dateOnly?: boolean): IRawDate {\n const date = new Date();\n const timeFill = dateOnly ? null : 0;\n\n return {\n year: date.getFullYear(),\n month: date.getMonth() + 1,\n day: date.getDate(),\n hour: timeFill as unknown as number,\n minute: timeFill as unknown as number,\n second: timeFill as unknown as number,\n millisecond: timeFill as unknown as number\n };\n }\n\n function getShortDate(date: IRawDate): Partial<IRawDate> {\n return { year: date.year, month: date.month, day: date.day };\n }\n\n function getLocale(): TDateLocale {\n const locale = props.locale;\n\n if (locale && typeof locale === 'object') return locale;\n\n const name = (typeof locale === 'string' && locale) \|\| unref(i18n.current) \|\| DEFAULT_DATE_LOCALE;\n\n return dateLocales[name] ?? dateLocales[DEFAULT_DATE_LOCALE];\n }\n\n function getMask() {\n return props.mask;\n }\n\n function decodeString(date: string): IRawDate {\n return splitDate(date, props.mask, getLocale(), {\n hour: 0,\n minute: 0,\n second: 0,\n millisecond: 0\n });\n }\n\n return {\n editable,\n tabindex,\n getCurrentDate,\n getShortDate,\n getLocale,\n getMask,\n decodeString\n };\n}\n\n/\n Возвращает хэш дня в формате YYYY/MM/DD.\n * @param date\n */\nexport function getDayHash(date: IRawDate): string {\n return date.year + '/' + pad(date.month as number) + '/' + pad(date.day as number);\n}\n"],"names":[],"mappings":";;;;;;AA+BO,MAAM,sBAAsB;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA,~~IAIE~~,YAAY;AAAA,MACV,MAAM,CAAC,QAAQ,OAAO,MAAM;AAAA,MAC5B,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA,~~IAKX~~,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~IAMX~~,QAAQ;AAAA,MACN,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF;AACF;AAMO,SAAS,YAAY,OAAmC;AAC7D,QAAM,OAAO,UAAA;AAEb,QAAM,WAAW,SAAS,MAAM,CAAC,MAAM,YAAY,CAAC,MAAM,QAAQ;AAClE,QAAM,WAAW,SAAS,MAAO,SAAS,QAAQ,IAAI,EAAG;AAEzD,WAAS,eAAe,UAA8B;AACpD,UAAM,2BAAW,KAAA;AACjB,UAAM,WAAW,WAAW,OAAO;AAEnC,WAAO;AAAA,MACL,MAAM,KAAK,YAAA;AAAA,MACX,OAAO,KAAK,SAAA,IAAa;AAAA,MACzB,KAAK,KAAK,QAAA;AAAA,MACV,MAAM;AAAA,MACN,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,aAAa;AAAA,IAAA;AAAA,EAEjB;AAEA,WAAS,aAAa,MAAmC;AACvD,WAAO,EAAE,MAAM,KAAK,MAAM,OAAO,KAAK,OAAO,KAAK,KAAK,IAAA;AAAA,EACzD;AAEA,WAAS,YAAyB;AAChC,UAAM,SAAS,MAAM;AAErB,QAAI,UAAU,OAAO,WAAW,SAAU,QAAO;AAEjD,UAAM,OAAQ,OAAO,WAAW,YAAY,UAAW,MAAM,KAAK,OAAO,KAAK;AAE9E,WAAO,YAAY,IAAI,KAAK,YAAY,mBAAmB;AAAA,EAC7D;AAEA,WAAS,UAAU;AACjB,WAAO,MAAM;AAAA,EACf;AAEA,WAAS,aAAa,MAAwB;AAC5C,WAAO,UAAU,MAAM,MAAM,MAAM,aAAa;AAAA,MAC9C,MAAM;AAAA,MACN,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,aAAa;AAAA,IAAA,CACd;AAAA,EACH;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;AAMO,SAAS,WAAW,MAAwB;AACjD,SAAO,KAAK,OAAO,MAAM,IAAI,KAAK,KAAe,IAAI,MAAM,IAAI,KAAK,GAAa;AACnF;"}
1	+ {"version":3,"file":"useDatetime.js","sources":["../../../../../src/composables/useDatetime/useDatetime.ts"],"sourcesContent":["import { useLocale } from '@cds/composables/useLocale';\nimport { propsFactory } from '@cds/core';\nimport { dateLocales, DEFAULT_DATE_LOCALE } from '@cds/locales/date';\nimport type { IRawDate, TDateLocale } from '@cds/utils';\nimport { pad, splitDate } from '@cds/utils';\nimport type { ComputedRef, PropType } from 'vue';\nimport { computed, unref } from 'vue';\n\nexport type TDatetimeValueRange = { from: string \| IRawDate; to: string \| IRawDate; target?: string \| IRawDate };\n\nexport interface DatetimeProps {\n modelValue?: string \| TDatetimeValueRange \| Array<string \| TDatetimeValueRange> \| null;\n mask: string;\n locale?: string \| TDateLocale;\n readonly?: boolean \| null;\n disabled?: boolean \| null;\n}\n\nexport interface UseDatetime {\n editable: ComputedRef<boolean>;\n tabindex: ComputedRef<number>;\n getCurrentDate: (dateOnly?: boolean) => IRawDate;\n getShortDate: (date: IRawDate) => Partial<IRawDate>;\n getLocale: () => TDateLocale;\n getMask: () => string;\n decodeString: (date: string) => IRawDate;\n}\n\n/*\n Фабрика пропсов для работы с датой/временем.\n /\nexport const defineDatetimeProps = propsFactory(\n {\n /\n Значение модели\n * @en Value of the model\n /\n modelValue: {\n type: [String, Array, Object] as PropType<string \| TDatetimeValueRange \| Array<string \| TDatetimeValueRange>>,\n default: null\n },\n /\n Формат даты/времени\n * @en Date/time format\n /\n mask: {\n type: String as PropType<string>,\n default: 'DD.MM.YYYY'\n },\n /\n Локаль для дат. Имя локали ('ru' \| 'en') или объект `TDateLocale`.\n * По умолчанию берётся текущая локаль из `useLocale`, иначе `ru`.\n * @en Locale for the dates. A locale name ('ru' \| 'en') or a `TDateLocale` object. The current locale from `useLocale` is taken by default, otherwise `ru`.\n /\n locale: {\n type: [String, Object] as PropType<string \| TDateLocale>,\n default: undefined\n }\n },\n 'datetime'\n);\n\n/\n Композабл для работы с датой/временем: парсинг, форматирование и резолв date-локали.\n * @param props\n /\nexport function useDatetime(props: DatetimeProps): UseDatetime {\n const i18n = useLocale();\n\n const editable = computed(() => !props.disabled && !props.readonly);\n const tabindex = computed(() => (editable.value ? 0 : -1));\n\n function getCurrentDate(dateOnly?: boolean): IRawDate {\n const date = new Date();\n const timeFill = dateOnly ? null : 0;\n\n return {\n year: date.getFullYear(),\n month: date.getMonth() + 1,\n day: date.getDate(),\n hour: timeFill as unknown as number,\n minute: timeFill as unknown as number,\n second: timeFill as unknown as number,\n millisecond: timeFill as unknown as number\n };\n }\n\n function getShortDate(date: IRawDate): Partial<IRawDate> {\n return { year: date.year, month: date.month, day: date.day };\n }\n\n function getLocale(): TDateLocale {\n const locale = props.locale;\n\n if (locale && typeof locale === 'object') return locale;\n\n const name = (typeof locale === 'string' && locale) \|\| unref(i18n.current) \|\| DEFAULT_DATE_LOCALE;\n\n return dateLocales[name] ?? dateLocales[DEFAULT_DATE_LOCALE];\n }\n\n function getMask() {\n return props.mask;\n }\n\n function decodeString(date: string): IRawDate {\n return splitDate(date, props.mask, getLocale(), {\n hour: 0,\n minute: 0,\n second: 0,\n millisecond: 0\n });\n }\n\n return {\n editable,\n tabindex,\n getCurrentDate,\n getShortDate,\n getLocale,\n getMask,\n decodeString\n };\n}\n\n/\n Возвращает хэш дня в формате YYYY/MM/DD.\n * @param date\n */\nexport function getDayHash(date: IRawDate): string {\n return date.year + '/' + pad(date.month as number) + '/' + pad(date.day as number);\n}\n"],"names":[],"mappings":";;;;;;AA+BO,MAAM,sBAAsB;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKE,YAAY;AAAA,MACV,MAAM,CAAC,QAAQ,OAAO,MAAM;AAAA,MAC5B,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMX,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOX,QAAQ;AAAA,MACN,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF;AACF;AAMO,SAAS,YAAY,OAAmC;AAC7D,QAAM,OAAO,UAAA;AAEb,QAAM,WAAW,SAAS,MAAM,CAAC,MAAM,YAAY,CAAC,MAAM,QAAQ;AAClE,QAAM,WAAW,SAAS,MAAO,SAAS,QAAQ,IAAI,EAAG;AAEzD,WAAS,eAAe,UAA8B;AACpD,UAAM,2BAAW,KAAA;AACjB,UAAM,WAAW,WAAW,OAAO;AAEnC,WAAO;AAAA,MACL,MAAM,KAAK,YAAA;AAAA,MACX,OAAO,KAAK,SAAA,IAAa;AAAA,MACzB,KAAK,KAAK,QAAA;AAAA,MACV,MAAM;AAAA,MACN,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,aAAa;AAAA,IAAA;AAAA,EAEjB;AAEA,WAAS,aAAa,MAAmC;AACvD,WAAO,EAAE,MAAM,KAAK,MAAM,OAAO,KAAK,OAAO,KAAK,KAAK,IAAA;AAAA,EACzD;AAEA,WAAS,YAAyB;AAChC,UAAM,SAAS,MAAM;AAErB,QAAI,UAAU,OAAO,WAAW,SAAU,QAAO;AAEjD,UAAM,OAAQ,OAAO,WAAW,YAAY,UAAW,MAAM,KAAK,OAAO,KAAK;AAE9E,WAAO,YAAY,IAAI,KAAK,YAAY,mBAAmB;AAAA,EAC7D;AAEA,WAAS,UAAU;AACjB,WAAO,MAAM;AAAA,EACf;AAEA,WAAS,aAAa,MAAwB;AAC5C,WAAO,UAAU,MAAM,MAAM,MAAM,aAAa;AAAA,MAC9C,MAAM;AAAA,MACN,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,aAAa;AAAA,IAAA,CACd;AAAA,EACH;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;AAMO,SAAS,WAAW,MAAwB;AACjD,SAAO,KAAK,OAAO,MAAM,IAAI,KAAK,KAAe,IAAI,MAAM,IAAI,KAAK,GAAa;AACnF;"}

package/dist/es/src/composables/useDelay/useDelay.js CHANGED Viewed

@@ -2,9 +2,15 @@ import { p as propsFactory } from "../../core/propsFactory.js";
 import { y as defer } from "../../utils/helpers.js";
 const defineDelayProps = propsFactory(
   {
-    /** Время ожидания в миллисекундах перед закрытием компонента. Работает только с параметром open-on-hover. */
+    /**
+     * Время ожидания в миллисекундах перед закрытием компонента. Работает только с параметром open-on-hover.
+     * @en Delay in milliseconds before the component closes. Works only together with open-on-hover.
+     */
     closeDelay: [Number, String],
-    /** Время ожидания в миллисекундах перед открытием компонента. Работает только с параметром open-on-hover. */
+    /**
+     * Время ожидания в миллисекундах перед открытием компонента. Работает только с параметром open-on-hover.
+     * @en Delay in milliseconds before the component opens. Works only together with open-on-hover.
+     */
     openDelay: [Number, String]
   },
   "delay"

package/dist/es/src/composables/useDelay/useDelay.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDelay.js","sources":["../../../../../src/composables/useDelay/useDelay.ts"],"sourcesContent":["import { propsFactory } from '@cds/core';\nimport { defer } from '@cds/utils';\nimport type { ExtractPublicPropTypes } from 'vue';\n\n/*\n A variable that defines delay-related properties for a component.\n \n The `defineDelayProps` variable is generated using the `propsFactory` function\n * and is used to specify props that relate to opening and closing delays.\n \n Properties:\n * - `closeDelay`: Specifies the amount of time (in milliseconds or as a string) to delay before closing.\n * Accepts values of type `Number` or `String`.\n * - `openDelay`: Specifies the amount of time (in milliseconds or as a string) to delay before opening.\n * Accepts values of type `Number` or `String`.\n \n These properties can be useful for controlling transition timings or for UI/UX scenarios\n * where timed delays are required for components such as tooltips, modals, or menus.\n /\nexport const defineDelayProps = propsFactory(\n {\n /* Время ожидания в миллисекундах перед закрытием компонента. Работает только с параметром open-on-hover. /\n closeDelay: [Number, String],\n /* Время ожидания в миллисекундах перед открытием компонента. Работает только с параметром open-on-hover. /\n openDelay: [Number, String]\n },\n 'delay'\n);\n\nexport interface DelayProps extends ExtractPublicPropTypes<ReturnType<typeof defineDelayProps>> {}\n\n/\n Manages delays for opening and closing events with optional callbacks.\n \n @param {DelayProps} props - Configurations for delay timings including `openDelay` and `closeDelay`.\n * @param {(value: boolean) => void} [cb] - Optional callback function executed when the delay completes. The callback is invoked with a boolean indicating the event type (`true` for opening, `false` for closing).\n * @return {Object} An object containing the following methods:\n * - `clearDelay`: A function to clear the currently scheduled delay.\n * - `runOpenDelay`: A function to initiate the open delay sequence.\n * - `runCloseDelay`: A function to initiate the close delay sequence with optional minimum delay options.\n */\nexport function useDelay(props: DelayProps, cb?: (value: boolean) => void) {\n let clearDelay: () => void = () => {};\n\n function runDelay(isOpening: boolean, options?: { minDelay: number }) {\n clearDelay?.();\n\n const delay = isOpening ? props.openDelay : props.closeDelay;\n\n const normalizedDelay = Math.max(options?.minDelay ?? 0, Number(delay ?? 0));\n\n return new Promise((resolve) => {\n clearDelay = defer(normalizedDelay, () => {\n cb?.(isOpening);\n resolve(isOpening);\n });\n });\n }\n\n function runOpenDelay() {\n return runDelay(true);\n }\n\n function runCloseDelay(options?: { minDelay: number }) {\n return runDelay(false, options);\n }\n\n return {\n clearDelay,\n runOpenDelay,\n runCloseDelay\n };\n}\n"],"names":[],"mappings":";;AAmBO,MAAM,mBAAmB;AAAA,EAC9B;AAAA;AAAA,~~IAEE~~,YAAY,CAAC,QAAQ,MAAM;AAAA;AAAA,~~IAE3B~~,WAAW,CAAC,QAAQ,MAAM;AAAA,EAAA;AAAA,EAE5B;AACF;AAcO,SAAS,SAAS,OAAmB,IAA+B;AACzE,MAAI,aAAyB,MAAM;AAAA,EAAC;AAEpC,WAAS,SAAS,WAAoB,SAAgC;AACpE;AAEA,UAAM,QAAQ,YAAY,MAAM,YAAY,MAAM;AAElD,UAAM,kBAAkB,KAAK,KAAI,mCAAS,aAAY,GAAG,OAAO,SAAS,CAAC,CAAC;AAE3E,WAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,mBAAa,MAAM,iBAAiB,MAAM;AACxC,iCAAK;AACL,gBAAQ,SAAS;AAAA,MACnB,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AAEA,WAAS,eAAe;AACtB,WAAO,SAAS,IAAI;AAAA,EACtB;AAEA,WAAS,cAAc,SAAgC;AACrD,WAAO,SAAS,OAAO,OAAO;AAAA,EAChC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
1	+ {"version":3,"file":"useDelay.js","sources":["../../../../../src/composables/useDelay/useDelay.ts"],"sourcesContent":["import { propsFactory } from '@cds/core';\nimport { defer } from '@cds/utils';\nimport type { ExtractPublicPropTypes } from 'vue';\n\n/*\n A variable that defines delay-related properties for a component.\n \n The `defineDelayProps` variable is generated using the `propsFactory` function\n * and is used to specify props that relate to opening and closing delays.\n \n Properties:\n * - `closeDelay`: Specifies the amount of time (in milliseconds or as a string) to delay before closing.\n * Accepts values of type `Number` or `String`.\n * - `openDelay`: Specifies the amount of time (in milliseconds or as a string) to delay before opening.\n * Accepts values of type `Number` or `String`.\n \n These properties can be useful for controlling transition timings or for UI/UX scenarios\n * where timed delays are required for components such as tooltips, modals, or menus.\n /\nexport const defineDelayProps = propsFactory(\n {\n /\n Время ожидания в миллисекундах перед закрытием компонента. Работает только с параметром open-on-hover.\n * @en Delay in milliseconds before the component closes. Works only together with open-on-hover.\n /\n closeDelay: [Number, String],\n /\n Время ожидания в миллисекундах перед открытием компонента. Работает только с параметром open-on-hover.\n * @en Delay in milliseconds before the component opens. Works only together with open-on-hover.\n /\n openDelay: [Number, String]\n },\n 'delay'\n);\n\nexport interface DelayProps extends ExtractPublicPropTypes<ReturnType<typeof defineDelayProps>> {}\n\n/\n Manages delays for opening and closing events with optional callbacks.\n \n @param {DelayProps} props - Configurations for delay timings including `openDelay` and `closeDelay`.\n * @param {(value: boolean) => void} [cb] - Optional callback function executed when the delay completes. The callback is invoked with a boolean indicating the event type (`true` for opening, `false` for closing).\n * @return {Object} An object containing the following methods:\n * - `clearDelay`: A function to clear the currently scheduled delay.\n * - `runOpenDelay`: A function to initiate the open delay sequence.\n * - `runCloseDelay`: A function to initiate the close delay sequence with optional minimum delay options.\n */\nexport function useDelay(props: DelayProps, cb?: (value: boolean) => void) {\n let clearDelay: () => void = () => {};\n\n function runDelay(isOpening: boolean, options?: { minDelay: number }) {\n clearDelay?.();\n\n const delay = isOpening ? props.openDelay : props.closeDelay;\n\n const normalizedDelay = Math.max(options?.minDelay ?? 0, Number(delay ?? 0));\n\n return new Promise((resolve) => {\n clearDelay = defer(normalizedDelay, () => {\n cb?.(isOpening);\n resolve(isOpening);\n });\n });\n }\n\n function runOpenDelay() {\n return runDelay(true);\n }\n\n function runCloseDelay(options?: { minDelay: number }) {\n return runDelay(false, options);\n }\n\n return {\n clearDelay,\n runOpenDelay,\n runCloseDelay\n };\n}\n"],"names":[],"mappings":";;AAmBO,MAAM,mBAAmB;AAAA,EAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,IAKE,YAAY,CAAC,QAAQ,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,IAK3B,WAAW,CAAC,QAAQ,MAAM;AAAA,EAAA;AAAA,EAE5B;AACF;AAcO,SAAS,SAAS,OAAmB,IAA+B;AACzE,MAAI,aAAyB,MAAM;AAAA,EAAC;AAEpC,WAAS,SAAS,WAAoB,SAAgC;AACpE;AAEA,UAAM,QAAQ,YAAY,MAAM,YAAY,MAAM;AAElD,UAAM,kBAAkB,KAAK,KAAI,mCAAS,aAAY,GAAG,OAAO,SAAS,CAAC,CAAC;AAE3E,WAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,mBAAa,MAAM,iBAAiB,MAAM;AACxC,iCAAK;AACL,gBAAQ,SAAS;AAAA,MACnB,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AAEA,WAAS,eAAe;AACtB,WAAO,SAAS,IAAI;AAAA,EACtB;AAEA,WAAS,cAAc,SAAgC;AACrD,WAAO,SAAS,OAAO,OAAO;AAAA,EAChC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}

package/dist/es/src/composables/useDimensions/useDimensions.js CHANGED Viewed

@@ -3,32 +3,50 @@ import { u as convertToUnit } from "../../utils/helpers.js";
 import { computed } from "vue";
 const defineDimensionsProps = propsFactory(
   {
-    /** Ширина компонента */
+    /**
+     * Ширина компонента
+     * @en Component width
+     */
     width: {
       type: [Number, String],
       default: void 0
     },
-    /** Высота компонента */
+    /**
+     * Высота компонента
+     * @en Component height
+     */
     height: {
       type: [Number, String],
       default: void 0
     },
-    /** Максимальная ширина компонента */
+    /**
+     * Максимальная ширина компонента
+     * @en Maximum component width
+     */
     maxWidth: {
       type: [Number, String],
       default: void 0
     },
-    /** Максимальная высота компонента */
+    /**
+     * Максимальная высота компонента
+     * @en Maximum component height
+     */
     maxHeight: {
       type: [Number, String],
       default: void 0
     },
-    /** Минимальная ширина компонента */
+    /**
+     * Минимальная ширина компонента
+     * @en Minimum component width
+     */
     minWidth: {
       type: [Number, String],
       default: void 0
     },
-    /** Минимальная высота компонента */
+    /**
+     * Минимальная высота компонента
+     * @en Minimum component height
+     */
     minHeight: {
       type: [Number, String],
       default: void 0

package/dist/es/src/composables/useDimensions/useDimensions.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDimensions.js","sources":["../../../../../src/composables/useDimensions/useDimensions.ts"],"sourcesContent":["import { propsFactory } from '@cds/core';\nimport { convertToUnit } from '@cds/utils';\nimport { computed, type ExtractPublicPropTypes, type PropType } from 'vue';\n\n/*\n Factory function for defining dimension-related properties for components.\n \n The `defineDimensionsProps` variable provides a set of reusable properties\n * to specify the width, height, and constraints (min/max width and height) of a component.\n * These properties support both numerical values and string values (e.g., CSS units like \"px\", \"%\", \"em\").\n \n The following properties are included:\n * - `width`: Represents the width of the component.\n * - `height`: Represents the height of the component.\n * - `maxWidth`: Defines the maximum allowable width for the component.\n * - `maxHeight`: Defines the maximum allowable height for the component.\n * - `minWidth`: Defines the minimum allowable width for the component.\n * - `minHeight`: Defines the minimum allowable height for the component.\n \n All properties accept values of type `number \| string` and default to `undefined`.\n \n This set of properties can be used to control and enforce dimension constraints\n * for UI components dynamically at runtime.\n \n @variable defineDimensionsProps\n /\nexport const defineDimensionsProps = propsFactory(\n {\n /* Ширина ~~компонента~~ /\n width: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /* Высота ~~компонента~~ /\n height: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /* Максимальная ширина ~~компонента~~ /\n maxWidth: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /* Максимальная высота ~~компонента~~ /\n maxHeight: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /* Минимальная ширина ~~компонента~~ /\n minWidth: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /* Минимальная высота ~~компонента~~ /\n minHeight: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n }\n },\n 'dimensions'\n);\n\nexport type DimensionsProps = ExtractPublicPropTypes<ReturnType<typeof defineDimensionsProps>>;\n\n/\n Computes and provides the dimension-related styles based on the provided properties.\n \n @param {DimensionsProps} props - An object containing dimension properties such as\n * width, height, maxWidth, maxHeight, minWidth, and minHeight.\n * These properties can be specified as strings or numbers.\n * @return {Object} An object containing the computed `dimensionStyles`, which includes\n * the CSS styles derived from the provided dimension properties.\n */\nexport function useDimensions(props: DimensionsProps) {\n const dimensionStyles = computed(() => {\n const styles: Record<string, any> = {};\n\n const width = convertToUnit(props.width);\n const height = convertToUnit(props.height);\n const maxWidth = convertToUnit(props.maxWidth);\n const maxHeight = convertToUnit(props.maxHeight);\n const minWidth = convertToUnit(props.minWidth);\n const minHeight = convertToUnit(props.minHeight);\n\n if (width != null) styles.width = width;\n if (height != null) styles.height = height;\n if (maxWidth != null) styles.maxWidth = maxWidth;\n if (maxHeight != null) styles.maxHeight = maxHeight;\n if (minWidth != null) styles.minWidth = minWidth;\n if (minHeight != null) styles.minHeight = minHeight;\n\n return styles;\n });\n\n return { dimensionStyles };\n}\n"],"names":[],"mappings":";;;AA0BO,MAAM,wBAAwB;AAAA,EACnC;AAAA;AAAA,~~IAEE~~,OAAO;AAAA,MACL,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA,~~IAGX~~,QAAQ;AAAA,MACN,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA,~~IAGX~~,UAAU;AAAA,MACR,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA,~~IAGX~~,WAAW;AAAA,MACT,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA,~~IAGX~~,UAAU;AAAA,MACR,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA,~~IAGX~~,WAAW;AAAA,MACT,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF;AACF;AAaO,SAAS,cAAc,OAAwB;AACpD,QAAM,kBAAkB,SAAS,MAAM;AACrC,UAAM,SAA8B,CAAA;AAEpC,UAAM,QAAQ,cAAc,MAAM,KAAK;AACvC,UAAM,SAAS,cAAc,MAAM,MAAM;AACzC,UAAM,WAAW,cAAc,MAAM,QAAQ;AAC7C,UAAM,YAAY,cAAc,MAAM,SAAS;AAC/C,UAAM,WAAW,cAAc,MAAM,QAAQ;AAC7C,UAAM,YAAY,cAAc,MAAM,SAAS;AAE/C,QAAI,SAAS,KAAM,QAAO,QAAQ;AAClC,QAAI,UAAU,KAAM,QAAO,SAAS;AACpC,QAAI,YAAY,KAAM,QAAO,WAAW;AACxC,QAAI,aAAa,KAAM,QAAO,YAAY;AAC1C,QAAI,YAAY,KAAM,QAAO,WAAW;AACxC,QAAI,aAAa,KAAM,QAAO,YAAY;AAE1C,WAAO;AAAA,EACT,CAAC;AAED,SAAO,EAAE,gBAAA;AACX;"}
1	+ {"version":3,"file":"useDimensions.js","sources":["../../../../../src/composables/useDimensions/useDimensions.ts"],"sourcesContent":["import { propsFactory } from '@cds/core';\nimport { convertToUnit } from '@cds/utils';\nimport { computed, type ExtractPublicPropTypes, type PropType } from 'vue';\n\n/*\n Factory function for defining dimension-related properties for components.\n \n The `defineDimensionsProps` variable provides a set of reusable properties\n * to specify the width, height, and constraints (min/max width and height) of a component.\n * These properties support both numerical values and string values (e.g., CSS units like \"px\", \"%\", \"em\").\n \n The following properties are included:\n * - `width`: Represents the width of the component.\n * - `height`: Represents the height of the component.\n * - `maxWidth`: Defines the maximum allowable width for the component.\n * - `maxHeight`: Defines the maximum allowable height for the component.\n * - `minWidth`: Defines the minimum allowable width for the component.\n * - `minHeight`: Defines the minimum allowable height for the component.\n \n All properties accept values of type `number \| string` and default to `undefined`.\n \n This set of properties can be used to control and enforce dimension constraints\n * for UI components dynamically at runtime.\n \n @variable defineDimensionsProps\n /\nexport const defineDimensionsProps = propsFactory(\n {\n /\n Ширина компонента\n * @en Component width\n /\n width: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /\n Высота компонента\n * @en Component height\n /\n height: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /\n Максимальная ширина компонента\n * @en Maximum component width\n /\n maxWidth: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /\n Максимальная высота компонента\n * @en Maximum component height\n /\n maxHeight: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /\n Минимальная ширина компонента\n * @en Minimum component width\n /\n minWidth: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n },\n /\n Минимальная высота компонента\n * @en Minimum component height\n /\n minHeight: {\n type: [Number, String] as PropType<string \| number>,\n default: undefined\n }\n },\n 'dimensions'\n);\n\nexport type DimensionsProps = ExtractPublicPropTypes<ReturnType<typeof defineDimensionsProps>>;\n\n/\n Computes and provides the dimension-related styles based on the provided properties.\n \n @param {DimensionsProps} props - An object containing dimension properties such as\n * width, height, maxWidth, maxHeight, minWidth, and minHeight.\n * These properties can be specified as strings or numbers.\n * @return {Object} An object containing the computed `dimensionStyles`, which includes\n * the CSS styles derived from the provided dimension properties.\n */\nexport function useDimensions(props: DimensionsProps) {\n const dimensionStyles = computed(() => {\n const styles: Record<string, any> = {};\n\n const width = convertToUnit(props.width);\n const height = convertToUnit(props.height);\n const maxWidth = convertToUnit(props.maxWidth);\n const maxHeight = convertToUnit(props.maxHeight);\n const minWidth = convertToUnit(props.minWidth);\n const minHeight = convertToUnit(props.minHeight);\n\n if (width != null) styles.width = width;\n if (height != null) styles.height = height;\n if (maxWidth != null) styles.maxWidth = maxWidth;\n if (maxHeight != null) styles.maxHeight = maxHeight;\n if (minWidth != null) styles.minWidth = minWidth;\n if (minHeight != null) styles.minHeight = minHeight;\n\n return styles;\n });\n\n return { dimensionStyles };\n}\n"],"names":[],"mappings":";;;AA0BO,MAAM,wBAAwB;AAAA,EACnC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKE,OAAO;AAAA,MACL,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMX,QAAQ;AAAA,MACN,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMX,UAAU;AAAA,MACR,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMX,WAAW;AAAA,MACT,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMX,UAAU;AAAA,MACR,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMX,WAAW;AAAA,MACT,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF;AACF;AAaO,SAAS,cAAc,OAAwB;AACpD,QAAM,kBAAkB,SAAS,MAAM;AACrC,UAAM,SAA8B,CAAA;AAEpC,UAAM,QAAQ,cAAc,MAAM,KAAK;AACvC,UAAM,SAAS,cAAc,MAAM,MAAM;AACzC,UAAM,WAAW,cAAc,MAAM,QAAQ;AAC7C,UAAM,YAAY,cAAc,MAAM,SAAS;AAC/C,UAAM,WAAW,cAAc,MAAM,QAAQ;AAC7C,UAAM,YAAY,cAAc,MAAM,SAAS;AAE/C,QAAI,SAAS,KAAM,QAAO,QAAQ;AAClC,QAAI,UAAU,KAAM,QAAO,SAAS;AACpC,QAAI,YAAY,KAAM,QAAO,WAAW;AACxC,QAAI,aAAa,KAAM,QAAO,YAAY;AAC1C,QAAI,YAAY,KAAM,QAAO,WAAW;AACxC,QAAI,aAAa,KAAM,QAAO,YAAY;AAE1C,WAAO;AAAA,EACT,CAAC;AAED,SAAO,EAAE,gBAAA;AACX;"}

package/dist/es/src/composables/useDirection/useDirection.js CHANGED Viewed

@@ -3,7 +3,10 @@ import { p as propsFactory } from "../../core/propsFactory.js";
 import { computed, toRef, toValue } from "vue";
 const defineDirectionProps = propsFactory(
   {
-    /** Переключение между горизонтальным или вертикальным отображением. */
+    /**
+     * Переключение между горизонтальным или вертикальным отображением.
+     * @en Switches the component between horizontal and vertical layout.
+     */
     direction: {
       type: String,
       default: "horizontal",

package/dist/es/src/composables/useDirection/useDirection.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDirection.js","sources":["../../../../../src/composables/useDirection/useDirection.ts"],"sourcesContent":["import { getCurrentInstanceName, propsFactory } from '@cds/core';\nimport { computed, type ExtractPublicPropTypes, type PropType, toRef, toValue } from 'vue';\n\n/*\n Factory function to define properties for directional components.\n \n @const {object} defineDirectionProps\n \n @property {string} direction\n * Specifies the orientation of the component. Accepts either 'horizontal' or 'vertical'.\n * Defaults to 'horizontal'. Validates against the allowed values 'horizontal' and 'vertical'.\n /\nexport const defineDirectionProps = propsFactory(\n {\n /* Переключение между горизонтальным или вертикальным ~~отображением.~~ /\n direction: {\n type: String as PropType<'horizontal' \| 'vertical'>,\n default: 'horizontal',\n validator: (value: any) => ['horizontal', 'vertical'].includes(value)\n }\n },\n 'direction'\n);\n\nexport interface DirectionProps extends ExtractPublicPropTypes<ReturnType<typeof defineDirectionProps>> {}\n\n/\n Computes and provides direction-related properties based on the given props.\n \n @param {DirectionProps} props - The properties containing the current direction configuration.\n * @param {string} [name=getCurrentInstanceName()] - The name of the current instance, defaulting to the current instance name.\n * @return {Object} An object containing the computed direction states and corresponding CSS classes:\n * - `isHorizontal` (`ComputedRef<boolean>`): Indicates if the direction is horizontal.\n * - `isVertical` (`ComputedRef<boolean>`): Indicates if the direction is vertical.\n * - `directionClasses` (`Ref<Object>`): A reference to an object containing CSS class mappings for the direction.\n */\nexport function useDirection(props: DirectionProps, name = getCurrentInstanceName()) {\n const isHorizontal = computed(() => props.direction === 'horizontal');\n const isVertical = computed(() => props.direction === 'vertical');\n\n const directionClasses = toRef(() => ({\n [`${name}--${props.direction}`]: toValue(props).direction\n }));\n\n return {\n isHorizontal,\n isVertical,\n directionClasses\n };\n}\n"],"names":[],"mappings":";;;AAYO,MAAM,uBAAuB;AAAA,EAClC;AAAA;AAAA,~~IAEE~~,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAe,CAAC,cAAc,UAAU,EAAE,SAAS,KAAK;AAAA,IAAA;AAAA,EACtE;AAAA,EAEF;AACF;AAcO,SAAS,aAAa,OAAuB,OAAO,0BAA0B;AACnF,QAAM,eAAe,SAAS,MAAM,MAAM,cAAc,YAAY;AACpE,QAAM,aAAa,SAAS,MAAM,MAAM,cAAc,UAAU;AAEhE,QAAM,mBAAmB,MAAM,OAAO;AAAA,IACpC,CAAC,GAAG,IAAI,KAAK,MAAM,SAAS,EAAE,GAAG,QAAQ,KAAK,EAAE;AAAA,EAAA,EAChD;AAEF,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
1	+ {"version":3,"file":"useDirection.js","sources":["../../../../../src/composables/useDirection/useDirection.ts"],"sourcesContent":["import { getCurrentInstanceName, propsFactory } from '@cds/core';\nimport { computed, type ExtractPublicPropTypes, type PropType, toRef, toValue } from 'vue';\n\n/*\n Factory function to define properties for directional components.\n \n @const {object} defineDirectionProps\n \n @property {string} direction\n * Specifies the orientation of the component. Accepts either 'horizontal' or 'vertical'.\n * Defaults to 'horizontal'. Validates against the allowed values 'horizontal' and 'vertical'.\n /\nexport const defineDirectionProps = propsFactory(\n {\n /\n Переключение между горизонтальным или вертикальным отображением.\n * @en Switches the component between horizontal and vertical layout.\n /\n direction: {\n type: String as PropType<'horizontal' \| 'vertical'>,\n default: 'horizontal',\n validator: (value: any) => ['horizontal', 'vertical'].includes(value)\n }\n },\n 'direction'\n);\n\nexport interface DirectionProps extends ExtractPublicPropTypes<ReturnType<typeof defineDirectionProps>> {}\n\n/\n Computes and provides direction-related properties based on the given props.\n \n @param {DirectionProps} props - The properties containing the current direction configuration.\n * @param {string} [name=getCurrentInstanceName()] - The name of the current instance, defaulting to the current instance name.\n * @return {Object} An object containing the computed direction states and corresponding CSS classes:\n * - `isHorizontal` (`ComputedRef<boolean>`): Indicates if the direction is horizontal.\n * - `isVertical` (`ComputedRef<boolean>`): Indicates if the direction is vertical.\n * - `directionClasses` (`Ref<Object>`): A reference to an object containing CSS class mappings for the direction.\n */\nexport function useDirection(props: DirectionProps, name = getCurrentInstanceName()) {\n const isHorizontal = computed(() => props.direction === 'horizontal');\n const isVertical = computed(() => props.direction === 'vertical');\n\n const directionClasses = toRef(() => ({\n [`${name}--${props.direction}`]: toValue(props).direction\n }));\n\n return {\n isHorizontal,\n isVertical,\n directionClasses\n };\n}\n"],"names":[],"mappings":";;;AAYO,MAAM,uBAAuB;AAAA,EAClC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKE,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAe,CAAC,cAAc,UAAU,EAAE,SAAS,KAAK;AAAA,IAAA;AAAA,EACtE;AAAA,EAEF;AACF;AAcO,SAAS,aAAa,OAAuB,OAAO,0BAA0B;AACnF,QAAM,eAAe,SAAS,MAAM,MAAM,cAAc,YAAY;AACpE,QAAM,aAAa,SAAS,MAAM,MAAM,cAAc,UAAU;AAEhE,QAAM,mBAAmB,MAAM,OAAO;AAAA,IACpC,CAAC,GAAG,IAAI,KAAK,MAAM,SAAS,EAAE,GAAG,QAAQ,KAAK,EAAE;AAAA,EAAA,EAChD;AAEF,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}

package/dist/es/src/composables/useDisabled/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
+import "vue";
 //# sourceMappingURL=index.js.map

package/dist/es/src/composables/useDisabled/index.js.map CHANGED Viewed

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

package/dist/es/src/composables/useDisabled/useDisabled.js CHANGED Viewed

@@ -3,7 +3,10 @@ import { p as propsFactory } from "../../core/propsFactory.js";
 import { toRef, toValue } from "vue";
 const defineDisabledProps = propsFactory(
   {
-    /** Заблокированное состояние */
+    /**
+     * Заблокированное состояние
+     * @en Disabled state
+     */
     disabled: {
       type: Boolean,
       default: null

package/dist/es/src/composables/useDisabled/useDisabled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDisabled.js","sources":["../../../../../src/composables/useDisabled/useDisabled.ts"],"sourcesContent":["import { getCurrentInstanceName, propsFactory } from '@cds/core';\nimport { type ExtractPublicPropTypes, type PropType, toRef, toValue } from 'vue';\n\n/*\n Factory function for defining properties related to the disabled state.\n \n The `defineDisabledProps` object generates a set of props allowing components\n * to handle a disabled state. These props can be used within Vue components\n * to standardize how `disabled` functionality is implemented and applied.\n \n @constant {Object} defineDisabledProps - The generated props object for handling the `disabled` state.\n * @property {boolean} disabled - Determines whether the component is in a disabled state. Defaults to `null`.\n /\nexport const defineDisabledProps = propsFactory(\n {\n /* Заблокированное ~~состояние~~ /\n disabled: {\n type: Boolean as PropType<boolean \| null>,\n default: null\n }\n },\n 'disabled'\n);\n\nexport type DisabledProps = ExtractPublicPropTypes<ReturnType<typeof defineDisabledProps>>;\n\n/\n A composable function that generates a reactive class mapping for a disabled state.\n \n @param {DisabledProps} props - An object containing properties related to the disabled state.\n * @param {string} [name=getCurrentInstanceName()] - The name of the current instance, used to prefix the class name.\n * @return {{ disabledClasses: Object }} An object containing a reactive class mapping for the disabled state.\n */\nexport function useDisabled(props: DisabledProps, name = getCurrentInstanceName()) {\n const disabledClasses = toRef(() => ({\n [`${name}--disabled`]: toValue(props).disabled\n }));\n\n return { disabledClasses };\n}\n"],"names":[],"mappings":";;;AAaO,MAAM,sBAAsB;AAAA,EACjC;AAAA;AAAA,~~IAEE~~,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF;AACF;AAWO,SAAS,YAAY,OAAsB,OAAO,0BAA0B;AACjF,QAAM,kBAAkB,MAAM,OAAO;AAAA,IACnC,CAAC,GAAG,IAAI,YAAY,GAAG,QAAQ,KAAK,EAAE;AAAA,EAAA,EACtC;AAEF,SAAO,EAAE,gBAAA;AACX;"}
1	+ {"version":3,"file":"useDisabled.js","sources":["../../../../../src/composables/useDisabled/useDisabled.ts"],"sourcesContent":["import { getCurrentInstanceName, propsFactory } from '@cds/core';\nimport { type ExtractPublicPropTypes, type PropType, toRef, toValue } from 'vue';\n\n/*\n Factory function for defining properties related to the disabled state.\n \n The `defineDisabledProps` object generates a set of props allowing components\n * to handle a disabled state. These props can be used within Vue components\n * to standardize how `disabled` functionality is implemented and applied.\n \n @constant {Object} defineDisabledProps - The generated props object for handling the `disabled` state.\n * @property {boolean} disabled - Determines whether the component is in a disabled state. Defaults to `null`.\n /\nexport const defineDisabledProps = propsFactory(\n {\n /\n Заблокированное состояние\n * @en Disabled state\n /\n disabled: {\n type: Boolean as PropType<boolean \| null>,\n default: null\n }\n },\n 'disabled'\n);\n\nexport type DisabledProps = ExtractPublicPropTypes<ReturnType<typeof defineDisabledProps>>;\n\n/\n A composable function that generates a reactive class mapping for a disabled state.\n \n @param {DisabledProps} props - An object containing properties related to the disabled state.\n * @param {string} [name=getCurrentInstanceName()] - The name of the current instance, used to prefix the class name.\n * @return {{ disabledClasses: Object }} An object containing a reactive class mapping for the disabled state.\n */\nexport function useDisabled(props: DisabledProps, name = getCurrentInstanceName()) {\n const disabledClasses = toRef(() => ({\n [`${name}--disabled`]: toValue(props).disabled\n }));\n\n return { disabledClasses };\n}\n"],"names":[],"mappings":";;;AAaO,MAAM,sBAAsB;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKE,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF;AACF;AAWO,SAAS,YAAY,OAAsB,OAAO,0BAA0B;AACjF,QAAM,kBAAkB,MAAM,OAAO;AAAA,IACnC,CAAC,GAAG,IAAI,YAAY,GAAG,QAAQ,KAAK,EAAE;AAAA,EAAA,EACtC;AAEF,SAAO,EAAE,gBAAA;AACX;"}

package/dist/es/src/composables/useDisplay/useDisplay.js CHANGED Viewed

@@ -10,6 +10,7 @@ const defineDisplayProps = propsFactory(
      * Если значение равно true, компонент будет отображаться в режиме для Mobile.
      * Если значение равно false, компонент будет отображаться в режиме для Desktop.
      * Если значение равно null, режим будет зависеть от текущего Breakpoint.
+     * @en Determines the display mode of the component: `true` renders it in mobile mode, `false` in desktop mode, `null` makes the mode depend on the current breakpoint.
      */
     mobile: {
       type: Boolean,
@@ -17,6 +18,7 @@ const defineDisplayProps = propsFactory(
     },
     /** Указывает точку преломления, при которой отображение будет переключаться в мобильный режим.
      * Может быть числом (например, 600) или строкой, соответствующей одному из предопределенных Breakpoint (например, 'xs', 'sm', 'md', 'lg', 'xl').
+     * @en Sets the breakpoint at which the component switches to mobile mode. Accepts a number (for example, 600) or the name of a predefined breakpoint (`xs`, `sm`, `md`, `lg`, `xl`).
      */
     mobileBreakpoint: [Number, String]
   },

package/dist/es/src/composables/useDisplay/useDisplay.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDisplay.js","sources":["../../../../../src/composables/useDisplay/useDisplay.ts"],"sourcesContent":["import { getCurrentInstanceName, propsFactory } from '@cds/core';\nimport { IN_BROWSER } from '@cds/utils';\nimport {\n computed,\n type ExtractPublicPropTypes,\n inject,\n onScopeDispose,\n type PropType,\n reactive,\n shallowRef,\n toRef,\n toRefs,\n unref,\n watchEffect\n} from 'vue';\n\nimport { DisplaySymbol } from './internal/useDisplay.constants';\nimport { getClientHeight, getClientWidth, getPlatform, parseDisplayOptions } from './internal/useDisplay.helpers';\nimport type { Breakpoint, DisplayInstance, DisplayOptions, SSROptions } from './internal/useDisplay.types';\n\n/*\n Factory function for defining display-related properties.\n \n @typedef {Object} DisplayProps\n * @property {boolean \| null} mobile - Determines if the display should adapt to mobile devices. Defaults to `false`.\n * @property {number \| string} [mobileBreakpoint] - Specifies the breakpoint at which the display will switch to mobile view. Accepts a number or a named breakpoint.\n \n @param {string} namespace - The namespace for the property definitions.\n * @returns {DisplayProps} An object containing properties relevant to display configurations.\n /\nexport const defineDisplayProps = propsFactory(\n {\n /* Определяет режим отображения компонента:\n * Если значение равно true, компонент будет отображаться в режиме для Mobile.\n * Если значение равно false, компонент будет отображаться в режиме для Desktop.\n * Если значение равно null, режим будет зависеть от текущего Breakpoint.\n /\n mobile: {\n type: Boolean as PropType<boolean \| null>,\n default: false\n },\n /* Указывает точку преломления, при которой отображение будет переключаться в мобильный режим.\n * Может быть числом (например, 600) или строкой, соответствующей одному из предопределенных Breakpoint (например, 'xs', 'sm', 'md', 'lg', 'xl').\n /\n mobileBreakpoint: [Number, String] as PropType<number \| Breakpoint>\n },\n 'display'\n);\n\nexport interface DisplayProps extends ExtractPublicPropTypes<ReturnType<typeof defineDisplayProps>> {}\n\n/\n Creates a display instance with reactive values for screen dimensions and platform information.\n \n @param {DisplayOptions} [options] Optional settings for display configurations, including thresholds and mobile breakpoints.\n * @param {SSROptions} [ssr] Optional server-side rendering configurations for initial screen dimensions and platform data.\n * @return {DisplayInstance} A reactive display instance containing screen dimension, breakpoint, and platform information.\n /\nexport function createDisplay(options?: DisplayOptions, ssr?: SSROptions): DisplayInstance {\n const { thresholds, mobileBreakpoint } = parseDisplayOptions(options);\n\n const width = shallowRef(getClientWidth(ssr));\n const height = shallowRef(getClientHeight(ssr));\n const platform = shallowRef(getPlatform(ssr));\n\n const screenWidth = shallowRef(IN_BROWSER ? window.innerWidth : 0);\n const screenHeight = shallowRef(IN_BROWSER ? window.innerHeight : 0);\n\n const state = reactive<DisplayInstance>({} as DisplayInstance);\n\n watchEffect(() => {\n const xs = width.value < thresholds.sm;\n const sm = width.value < thresholds.md && !xs;\n const md = width.value < thresholds.lg && !(sm \|\| xs);\n const lg = width.value < thresholds.xl && !(md \|\| sm \|\| xs);\n const xl = width.value >= thresholds.xl;\n\n const name = xs ? 'xs' : sm ? 'sm' : md ? 'md' : lg ? 'lg' : 'xl';\n const breakpointValue = typeof mobileBreakpoint === 'number' ? mobileBreakpoint : thresholds[mobileBreakpoint];\n const mobile = width.value < breakpointValue;\n\n state.xs = xs;\n state.sm = sm;\n state.md = md;\n state.lg = lg;\n state.xl = xl;\n state.smUp = !xs;\n state.mdUp = !(xs \|\| sm);\n state.lgUp = !(xs \|\| sm \|\| md);\n state.xlUp = !(xs \|\| sm \|\| md \|\| lg);\n state.smDown = !(md \|\| lg \|\| xl);\n state.mdDown = !(lg \|\| xl);\n state.lgDown = !xl;\n state.xlDown = true;\n state.name = name;\n state.height = height.value;\n state.width = width.value;\n state.mobile = mobile;\n state.mobileBreakpoint = mobileBreakpoint;\n state.platform = platform.value;\n state.thresholds = thresholds;\n state.screenWidth = screenWidth.value;\n state.screenHeight = screenHeight.value;\n });\n\n if (IN_BROWSER) {\n window.addEventListener('resize', updateSize, { passive: true });\n\n onScopeDispose(() => {\n window.removeEventListener('resize', updateSize);\n }, true);\n }\n\n function updateSize() {\n height.value = getClientHeight();\n width.value = getClientWidth();\n }\n\n function update() {\n updateSize();\n platform.value = getPlatform();\n }\n\n return { ...toRefs(state), update, ssr: !!ssr };\n}\n\n/\n A composable function that manages and provides display-related utilities,\n * including responsiveness and custom mobile breakpoint handling.\n \n @param {DisplayProps} props - The configuration object containing the display properties,\n * such as `mobile` and `mobileBreakpoint`.\n * @param {string} [name=getCurrentInstanceName()] - The name of the current instance. If not provided,\n * it defaults to the result of the `getCurrentInstanceName` function.\n * @return {object} An object containing display-related utilities:\n * - `display`: The injected display object.\n * - `displayClasses`: A reactive reference to display-specific classes, like mobile-specific classes.\n * - `mobile`: A reactive computed property indicating whether the display is in a mobile state\n * based on the provided breakpoints or other criteria in `props`.\n * @throws {Error} If the injection for `cds:display` is not found.\n */\nexport function useDisplay(props: DisplayProps = { mobile: null }, name = getCurrentInstanceName()) {\n const display = inject(DisplaySymbol);\n\n if (!display) {\n throw new Error('[CDS] Could not find `cds:display` injection key. Are you missing the createDisplay function?');\n }\n\n const mobile = computed(() => {\n if (props.mobile) {\n return true;\n } else if (typeof props.mobileBreakpoint === 'number') {\n return display.width.value < props.mobileBreakpoint;\n } else if (props.mobileBreakpoint) {\n return display.width.value < display.thresholds.value[props.mobileBreakpoint];\n } else if (props.mobile === null) {\n return display.mobile.value;\n } else {\n return false;\n }\n });\n\n const displayClasses = toRef(() => {\n if (!name) return {};\n\n return { [`${name}--mobile`]: unref(mobile) };\n });\n\n return { ...display, displayClasses, mobile };\n}\n"],"names":[],"mappings":";;;;;;AA8BO,MAAM,qBAAqB;AAAA,EAChC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~IAME~~,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA,~~IAKX~~,kBAAkB,CAAC,QAAQ,MAAM;AAAA,EAAA;AAAA,EAEnC;AACF;AAWO,SAAS,cAAc,SAA0B,KAAmC;AACzF,QAAM,EAAE,YAAY,qBAAqB,oBAAoB,OAAO;AAEpE,QAAM,QAAQ,WAAW,eAAe,GAAG,CAAC;AAC5C,QAAM,SAAS,WAAW,gBAAgB,GAAG,CAAC;AAC9C,QAAM,WAAW,WAAW,YAAY,GAAG,CAAC;AAE5C,QAAM,cAAc,WAAW,aAAa,OAAO,aAAa,CAAC;AACjE,QAAM,eAAe,WAAW,aAAa,OAAO,cAAc,CAAC;AAEnE,QAAM,QAAQ,SAA0B,EAAqB;AAE7D,cAAY,MAAM;AAChB,UAAM,KAAK,MAAM,QAAQ,WAAW;AACpC,UAAM,KAAK,MAAM,QAAQ,WAAW,MAAM,CAAC;AAC3C,UAAM,KAAK,MAAM,QAAQ,WAAW,MAAM,EAAE,MAAM;AAClD,UAAM,KAAK,MAAM,QAAQ,WAAW,MAAM,EAAE,MAAM,MAAM;AACxD,UAAM,KAAK,MAAM,SAAS,WAAW;AAErC,UAAM,OAAO,KAAK,OAAO,KAAK,OAAO,KAAK,OAAO,KAAK,OAAO;AAC7D,UAAM,kBAAkB,OAAO,qBAAqB,WAAW,mBAAmB,WAAW,gBAAgB;AAC7G,UAAM,SAAS,MAAM,QAAQ;AAE7B,UAAM,KAAK;AACX,UAAM,KAAK;AACX,UAAM,KAAK;AACX,UAAM,KAAK;AACX,UAAM,KAAK;AACX,UAAM,OAAO,CAAC;AACd,UAAM,OAAO,EAAE,MAAM;AACrB,UAAM,OAAO,EAAE,MAAM,MAAM;AAC3B,UAAM,OAAO,EAAE,MAAM,MAAM,MAAM;AACjC,UAAM,SAAS,EAAE,MAAM,MAAM;AAC7B,UAAM,SAAS,EAAE,MAAM;AACvB,UAAM,SAAS,CAAC;AAChB,UAAM,SAAS;AACf,UAAM,OAAO;AACb,UAAM,SAAS,OAAO;AACtB,UAAM,QAAQ,MAAM;AACpB,UAAM,SAAS;AACf,UAAM,mBAAmB;AACzB,UAAM,WAAW,SAAS;AAC1B,UAAM,aAAa;AACnB,UAAM,cAAc,YAAY;AAChC,UAAM,eAAe,aAAa;AAAA,EACpC,CAAC;AAED,MAAI,YAAY;AACd,WAAO,iBAAiB,UAAU,YAAY,EAAE,SAAS,MAAM;AAE/D,mBAAe,MAAM;AACnB,aAAO,oBAAoB,UAAU,UAAU;AAAA,IACjD,GAAG,IAAI;AAAA,EACT;AAEA,WAAS,aAAa;AACpB,WAAO,QAAQ,gBAAA;AACf,UAAM,QAAQ,eAAA;AAAA,EAChB;AAEA,WAAS,SAAS;AAChB,eAAA;AACA,aAAS,QAAQ,YAAA;AAAA,EACnB;AAEA,SAAO,EAAE,GAAG,OAAO,KAAK,GAAG,QAAQ,KAAK,CAAC,CAAC,IAAA;AAC5C;AAiBO,SAAS,WAAW,QAAsB,EAAE,QAAQ,QAAQ,OAAO,0BAA0B;AAClG,QAAM,UAAU,OAAO,aAAa;AAEpC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,+FAA+F;AAAA,EACjH;AAEA,QAAM,SAAS,SAAS,MAAM;AAC5B,QAAI,MAAM,QAAQ;AAChB,aAAO;AAAA,IACT,WAAW,OAAO,MAAM,qBAAqB,UAAU;AACrD,aAAO,QAAQ,MAAM,QAAQ,MAAM;AAAA,IACrC,WAAW,MAAM,kBAAkB;AACjC,aAAO,QAAQ,MAAM,QAAQ,QAAQ,WAAW,MAAM,MAAM,gBAAgB;AAAA,IAC9E,WAAW,MAAM,WAAW,MAAM;AAChC,aAAO,QAAQ,OAAO;AAAA,IACxB,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF,CAAC;AAED,QAAM,iBAAiB,MAAM,MAAM;AACjC,QAAI,CAAC,KAAM,QAAO,CAAA;AAElB,WAAO,EAAE,CAAC,GAAG,IAAI,UAAU,GAAG,MAAM,MAAM,EAAA;AAAA,EAC5C,CAAC;AAED,SAAO,EAAE,GAAG,SAAS,gBAAgB,OAAA;AACvC;"}
1	+ {"version":3,"file":"useDisplay.js","sources":["../../../../../src/composables/useDisplay/useDisplay.ts"],"sourcesContent":["import { getCurrentInstanceName, propsFactory } from '@cds/core';\nimport { IN_BROWSER } from '@cds/utils';\nimport {\n computed,\n type ExtractPublicPropTypes,\n inject,\n onScopeDispose,\n type PropType,\n reactive,\n shallowRef,\n toRef,\n toRefs,\n unref,\n watchEffect\n} from 'vue';\n\nimport { DisplaySymbol } from './internal/useDisplay.constants';\nimport { getClientHeight, getClientWidth, getPlatform, parseDisplayOptions } from './internal/useDisplay.helpers';\nimport type { Breakpoint, DisplayInstance, DisplayOptions, SSROptions } from './internal/useDisplay.types';\n\n/*\n Factory function for defining display-related properties.\n \n @typedef {Object} DisplayProps\n * @property {boolean \| null} mobile - Determines if the display should adapt to mobile devices. Defaults to `false`.\n * @property {number \| string} [mobileBreakpoint] - Specifies the breakpoint at which the display will switch to mobile view. Accepts a number or a named breakpoint.\n \n @param {string} namespace - The namespace for the property definitions.\n * @returns {DisplayProps} An object containing properties relevant to display configurations.\n /\nexport const defineDisplayProps = propsFactory(\n {\n /* Определяет режим отображения компонента:\n * Если значение равно true, компонент будет отображаться в режиме для Mobile.\n * Если значение равно false, компонент будет отображаться в режиме для Desktop.\n * Если значение равно null, режим будет зависеть от текущего Breakpoint.\n * @en Determines the display mode of the component: `true` renders it in mobile mode, `false` in desktop mode, `null` makes the mode depend on the current breakpoint.\n /\n mobile: {\n type: Boolean as PropType<boolean \| null>,\n default: false\n },\n /* Указывает точку преломления, при которой отображение будет переключаться в мобильный режим.\n * Может быть числом (например, 600) или строкой, соответствующей одному из предопределенных Breakpoint (например, 'xs', 'sm', 'md', 'lg', 'xl').\n * @en Sets the breakpoint at which the component switches to mobile mode. Accepts a number (for example, 600) or the name of a predefined breakpoint (`xs`, `sm`, `md`, `lg`, `xl`).\n /\n mobileBreakpoint: [Number, String] as PropType<number \| Breakpoint>\n },\n 'display'\n);\n\nexport interface DisplayProps extends ExtractPublicPropTypes<ReturnType<typeof defineDisplayProps>> {}\n\n/\n Creates a display instance with reactive values for screen dimensions and platform information.\n \n @param {DisplayOptions} [options] Optional settings for display configurations, including thresholds and mobile breakpoints.\n * @param {SSROptions} [ssr] Optional server-side rendering configurations for initial screen dimensions and platform data.\n * @return {DisplayInstance} A reactive display instance containing screen dimension, breakpoint, and platform information.\n /\nexport function createDisplay(options?: DisplayOptions, ssr?: SSROptions): DisplayInstance {\n const { thresholds, mobileBreakpoint } = parseDisplayOptions(options);\n\n const width = shallowRef(getClientWidth(ssr));\n const height = shallowRef(getClientHeight(ssr));\n const platform = shallowRef(getPlatform(ssr));\n\n const screenWidth = shallowRef(IN_BROWSER ? window.innerWidth : 0);\n const screenHeight = shallowRef(IN_BROWSER ? window.innerHeight : 0);\n\n const state = reactive<DisplayInstance>({} as DisplayInstance);\n\n watchEffect(() => {\n const xs = width.value < thresholds.sm;\n const sm = width.value < thresholds.md && !xs;\n const md = width.value < thresholds.lg && !(sm \|\| xs);\n const lg = width.value < thresholds.xl && !(md \|\| sm \|\| xs);\n const xl = width.value >= thresholds.xl;\n\n const name = xs ? 'xs' : sm ? 'sm' : md ? 'md' : lg ? 'lg' : 'xl';\n const breakpointValue = typeof mobileBreakpoint === 'number' ? mobileBreakpoint : thresholds[mobileBreakpoint];\n const mobile = width.value < breakpointValue;\n\n state.xs = xs;\n state.sm = sm;\n state.md = md;\n state.lg = lg;\n state.xl = xl;\n state.smUp = !xs;\n state.mdUp = !(xs \|\| sm);\n state.lgUp = !(xs \|\| sm \|\| md);\n state.xlUp = !(xs \|\| sm \|\| md \|\| lg);\n state.smDown = !(md \|\| lg \|\| xl);\n state.mdDown = !(lg \|\| xl);\n state.lgDown = !xl;\n state.xlDown = true;\n state.name = name;\n state.height = height.value;\n state.width = width.value;\n state.mobile = mobile;\n state.mobileBreakpoint = mobileBreakpoint;\n state.platform = platform.value;\n state.thresholds = thresholds;\n state.screenWidth = screenWidth.value;\n state.screenHeight = screenHeight.value;\n });\n\n if (IN_BROWSER) {\n window.addEventListener('resize', updateSize, { passive: true });\n\n onScopeDispose(() => {\n window.removeEventListener('resize', updateSize);\n }, true);\n }\n\n function updateSize() {\n height.value = getClientHeight();\n width.value = getClientWidth();\n }\n\n function update() {\n updateSize();\n platform.value = getPlatform();\n }\n\n return { ...toRefs(state), update, ssr: !!ssr };\n}\n\n/\n A composable function that manages and provides display-related utilities,\n * including responsiveness and custom mobile breakpoint handling.\n \n @param {DisplayProps} props - The configuration object containing the display properties,\n * such as `mobile` and `mobileBreakpoint`.\n * @param {string} [name=getCurrentInstanceName()] - The name of the current instance. If not provided,\n * it defaults to the result of the `getCurrentInstanceName` function.\n * @return {object} An object containing display-related utilities:\n * - `display`: The injected display object.\n * - `displayClasses`: A reactive reference to display-specific classes, like mobile-specific classes.\n * - `mobile`: A reactive computed property indicating whether the display is in a mobile state\n * based on the provided breakpoints or other criteria in `props`.\n * @throws {Error} If the injection for `cds:display` is not found.\n */\nexport function useDisplay(props: DisplayProps = { mobile: null }, name = getCurrentInstanceName()) {\n const display = inject(DisplaySymbol);\n\n if (!display) {\n throw new Error('[CDS] Could not find `cds:display` injection key. Are you missing the createDisplay function?');\n }\n\n const mobile = computed(() => {\n if (props.mobile) {\n return true;\n } else if (typeof props.mobileBreakpoint === 'number') {\n return display.width.value < props.mobileBreakpoint;\n } else if (props.mobileBreakpoint) {\n return display.width.value < display.thresholds.value[props.mobileBreakpoint];\n } else if (props.mobile === null) {\n return display.mobile.value;\n } else {\n return false;\n }\n });\n\n const displayClasses = toRef(() => {\n if (!name) return {};\n\n return { [`${name}--mobile`]: unref(mobile) };\n });\n\n return { ...display, displayClasses, mobile };\n}\n"],"names":[],"mappings":"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"}

package/dist/es/src/composables/useFilter/useFilter.js CHANGED Viewed

@@ -3,13 +3,33 @@ import { ac as wrapInArray, M as getPropertyFromItem } from "../../utils/helpers
 import { shallowRef, computed, unref, watchEffect } from "vue";
 const defineFilterProps = propsFactory(
   {
+    /**
+     * Своя функция фильтрации значений. Получает значение, поисковый запрос и элемент, возвращает совпадение или `-1`
+     * @en Your own value filtering function. Receives the value, the search query and the item, returns a match or `-1`
+     */
     customFilter: Function,
+    /**
+     * Отдельные функции фильтрации для конкретных ключей элемента — объект вида `{ ключ: функция }`
+     * @en Separate filtering functions for specific item keys — an object of the form `{ key: function }`
+     */
     customKeyFilter: Object,
+    /**
+     * Ключи элемента, по которым идёт поиск. По умолчанию фильтрация идёт по заголовку элемента
+     * @en Item keys the search runs over. By default filtering goes by the item title
+     */
     filterKeys: [Array, String],
+    /**
+     * Как объединяются результаты `customKeyFilter` и общей фильтрации: пересечением, объединением или заменой
+     * @en How the results of `customKeyFilter` and of the general filtering are combined: by intersection, by union or by replacement
+     */
     filterMode: {
       type: String,
       default: "intersection"
     },
+    /**
+     * Отключает встроенную фильтрацию — список показывается как есть, поиск обрабатывается снаружи
+     * @en Turns off the built-in filtering — the list is shown as is, the search is handled outside
+     */
     noFilter: Boolean
   },
   "filter"