@shtabapp/ui-kit 1.50.0 → 1.51.0
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.
- package/CHANGELOG.md +20 -0
- package/dist/{SAvatarGroup-CaqcKGIq.cjs → SAvatarGroup-CTC_esUv.cjs} +1 -1
- package/dist/{SAvatarGroup-MuTqzfYS.js → SAvatarGroup-F5w88NGf.js} +1 -1
- package/dist/{SCard-CrU67ok0.js → SCard-BkmIQd2s.js} +4 -4
- package/dist/SCard-BzIQoACi.cjs +1 -0
- package/dist/SCheckbox-BXV4bPOv.js +76 -0
- package/dist/SCheckbox-D_YLWg6a.cjs +1 -0
- package/dist/SChip-DRz5BA4Z.cjs +1 -0
- package/dist/{SChip-TxpPE0VS.js → SChip-DvPazz7Y.js} +0 -1
- package/dist/{SColorPicker-CeKB3QS1.cjs → SColorPicker-CuuiFxI0.cjs} +1 -1
- package/dist/{SColorPicker-BqsD-5xA.js → SColorPicker-Dl5H4iwH.js} +1 -1
- package/dist/SInput-DJL9QOIG.cjs +1 -0
- package/dist/{SInput-CkanJfLx.js → SInput-ug89CYt3.js} +45 -45
- package/dist/{SList-DAzztC-7.js → SList-BESqVnlh.js} +1 -1
- package/dist/{SList-S18K8mlH.cjs → SList-qQ7B5u8o.cjs} +1 -1
- package/dist/SListItem-DBGDVeoJ.cjs +1 -0
- package/dist/{SListItem-BRXZEePg.js → SListItem-DJ8uSadf.js} +46 -45
- package/dist/SOverflowGroup-CyksOav7.js +79 -0
- package/dist/{SOverflowGroup-DyVUzkNu.cjs → SOverflowGroup-rmU10_7L.cjs} +1 -1
- package/dist/SRadio-BZKPhGwO.js +58 -0
- package/dist/SRadio-CcmuHaKk.cjs +1 -0
- package/dist/SSelect-CMR4dxSn.cjs +1 -0
- package/dist/SSelect-pXiw_NyB.js +680 -0
- package/dist/{STagGroup-BMIwBk-O.cjs → STagGroup-CF2TFkb3.cjs} +1 -1
- package/dist/{STagGroup-wSpc3guU.js → STagGroup-GzZhto7-.js} +1 -1
- package/dist/SToggle-B5EdI-rG.cjs +1 -0
- package/dist/SToggle-BgCgar2U.js +59 -0
- package/dist/components/SCard/SCard.vue.d.ts.map +1 -1
- package/dist/components/SCheckbox/SCheckbox.vue.d.ts.map +1 -1
- package/dist/components/SChip/SChip.vue.d.ts.map +1 -1
- package/dist/components/SList/utils/resolveListItemFields.d.ts +1 -1
- package/dist/components/SList/utils/resolveListItemFields.d.ts.map +1 -1
- package/dist/components/SListItem/SListItem.types.d.ts +2 -1
- package/dist/components/SListItem/SListItem.types.d.ts.map +1 -1
- package/dist/components/SListItem/SListItem.vue.d.ts.map +1 -1
- package/dist/components/SOverflowGroup/SOverflowGroup.vue.d.ts.map +1 -1
- package/dist/components/SRadio/SRadio.vue.d.ts.map +1 -1
- package/dist/components/SSelect/SSelect.types.d.ts +5 -0
- package/dist/components/SSelect/SSelect.types.d.ts.map +1 -1
- package/dist/components/SSelect/SSelect.vue.d.ts.map +1 -1
- package/dist/components/SToggle/SToggle.types.d.ts +6 -0
- package/dist/components/SToggle/SToggle.types.d.ts.map +1 -1
- package/dist/components/SToggle/SToggle.vue.d.ts +11 -1
- package/dist/components/SToggle/SToggle.vue.d.ts.map +1 -1
- package/dist/components/SToggle/index.d.ts +1 -1
- package/dist/components/SToggle/index.d.ts.map +1 -1
- package/dist/entries/avatar-group.cjs +1 -1
- package/dist/entries/avatar-group.js +1 -1
- package/dist/entries/card.cjs +1 -1
- package/dist/entries/card.js +1 -1
- package/dist/entries/checkbox.cjs +1 -1
- package/dist/entries/checkbox.js +1 -1
- package/dist/entries/chip.cjs +1 -1
- package/dist/entries/chip.js +1 -1
- package/dist/entries/color-picker.cjs +1 -1
- package/dist/entries/color-picker.js +1 -1
- package/dist/entries/input.cjs +1 -1
- package/dist/entries/input.js +1 -1
- package/dist/entries/list-item.cjs +1 -1
- package/dist/entries/list-item.js +1 -1
- package/dist/entries/list.cjs +1 -1
- package/dist/entries/list.js +1 -1
- package/dist/entries/radio.cjs +1 -1
- package/dist/entries/radio.js +1 -1
- package/dist/entries/select.cjs +1 -1
- package/dist/entries/select.js +1 -1
- package/dist/entries/tag-group.cjs +1 -1
- package/dist/entries/tag-group.js +1 -1
- package/dist/entries/toggle.cjs +1 -1
- package/dist/entries/toggle.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +12 -12
- package/dist/uikit-components.css +1 -1
- package/package.json +2 -2
- package/dist/SCard-BR2R5VQd.cjs +0 -1
- package/dist/SCheckbox-BMKYFfrB.js +0 -76
- package/dist/SCheckbox-CYy7tfoS.cjs +0 -1
- package/dist/SChip-DoFL5c6-.cjs +0 -1
- package/dist/SInput-C07kFnj_.cjs +0 -1
- package/dist/SListItem-CdveotJe.cjs +0 -1
- package/dist/SOverflowGroup-CVSon6Eg.js +0 -80
- package/dist/SRadio-Ca-1D4q6.cjs +0 -1
- package/dist/SRadio-Db_YLcne.js +0 -57
- package/dist/SSelect-Bntb-dgY.js +0 -661
- package/dist/SSelect-DcTEwHx6.cjs +0 -1
- package/dist/SToggle-DxSm1RNz.cjs +0 -1
- package/dist/SToggle-T7FKzMSo.js +0 -44
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,23 @@
|
|
|
1
|
+
## [@shtabapp/ui-kit-v1.51.0](https://gitlab.com/mstikharev/shtab-ui-kit/compare/@shtabapp/ui-kit@1.50.0...@shtabapp/ui-kit@1.51.0) (2026-07-28)
|
|
2
|
+
|
|
3
|
+
### Features
|
|
4
|
+
|
|
5
|
+
- dropdown menu horizontal padding 4px instead of 8px ([0f3642f](https://gitlab.com/mstikharev/shtab-ui-kit/commit/0f3642f80e7034c689a5f3ec71933bb6780fd15b))
|
|
6
|
+
- sdropdown panel border, bigger radius & no shadow in dark theme ([1d3d06d](https://gitlab.com/mstikharev/shtab-ui-kit/commit/1d3d06d1547409c26d950cb6e05abc0f1256121d))
|
|
7
|
+
- slistitem billing variant ([5699aa1](https://gitlab.com/mstikharev/shtab-ui-kit/commit/5699aa1be6c5b6857690e30dc20f247a4d6e0678))
|
|
8
|
+
- sselect multiple options grouped by selection with divider ([a55b314](https://gitlab.com/mstikharev/shtab-ui-kit/commit/a55b31463749e34232f3f4f46089c9c5b4d7845e))
|
|
9
|
+
- sselect option-icon slot & media story with avatars, emoji and icons ([8296c92](https://gitlab.com/mstikharev/shtab-ui-kit/commit/8296c92d08a0c2049bdcea1343763ec4174eb614))
|
|
10
|
+
- stoggle label & description slots with labelPlacement prop ([27be1ec](https://gitlab.com/mstikharev/shtab-ui-kit/commit/27be1ec6aa280d6a471c965ee8c84a72d8518037))
|
|
11
|
+
|
|
12
|
+
### Bug Fixes
|
|
13
|
+
|
|
14
|
+
- remove redundant inheritAttrs so attrs land on component root ([bd31525](https://gitlab.com/mstikharev/shtab-ui-kit/commit/bd31525279a5ce504e90a41ac21a7d14edcca8e7))
|
|
15
|
+
- sinput clear button respects hasValue prop ([4d48c5f](https://gitlab.com/mstikharev/shtab-ui-kit/commit/4d48c5fd543ce10825442c5ca4c680cf9b577347))
|
|
16
|
+
- slistitem expand chevron container per design spec ([5fb9cd5](https://gitlab.com/mstikharev/shtab-ui-kit/commit/5fb9cd551f6ef230b8c584142e234e8612161486))
|
|
17
|
+
- slistitem level column box-sizing on nested depths ([7096a87](https://gitlab.com/mstikharev/shtab-ui-kit/commit/7096a87c112670288833763ccb4aeb253ac45d7e))
|
|
18
|
+
- slistitem stories trailing label typography per design ([1d81968](https://gitlab.com/mstikharev/shtab-ui-kit/commit/1d8196880fe56b5fbf2fec08a942026689238ce7))
|
|
19
|
+
- sphotoedit remove button overlapping avatar on x-small circle ([32e819c](https://gitlab.com/mstikharev/shtab-ui-kit/commit/32e819c8439c6f43c3cb562d2a8dc6b99981c447))
|
|
20
|
+
|
|
1
21
|
## [@shtabapp/ui-kit-v1.50.0](https://gitlab.com/mstikharev/shtab-ui-kit/compare/@shtabapp/ui-kit@1.49.0...@shtabapp/ui-kit@1.50.0) (2026-07-24)
|
|
2
22
|
|
|
3
23
|
### Features
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require("./SAvatar-DTG0odWX.cjs"),t=require("./SOverflowGroup-
|
|
1
|
+
const e=require("./SAvatar-DTG0odWX.cjs"),t=require("./SOverflowGroup-rmU10_7L.cjs");let n=require("vue");var r=function(e){return e.EXTRA_SMALL=`extra-small`,e.SMALL=`small`,e.MEDIUM=`medium`,e}({}),i={class:`s-ui-avatar-group__overflow`},a=(0,n.defineComponent)({__name:`SAvatarGroup`,props:{disabled:{type:Boolean,default:!1},maxVisible:{},size:{default:()=>r.SMALL}},setup(a){let o=(0,n.computed)(()=>[`s-ui-avatar-group--size-${a.size}`,{"s-ui-avatar-group--disabled":a.disabled}]),s={[r.EXTRA_SMALL]:e.o.SIZE_16,[r.SMALL]:e.o.SIZE_20,[r.MEDIUM]:e.o.SIZE_24},c=(0,n.computed)(()=>s[a.size]),l=(e,t)=>({"--s-ui-avatar-group-item-z-index":e-t}),u=(t,r)=>t.type===e.t?(0,n.cloneVNode)(t,{...a.disabled?{disabled:!0}:{},showName:!1,size:c.value,style:l(r.visibleCount,r.visibleIndex)}):t;return(e,r)=>((0,n.openBlock)(),(0,n.createBlock)(t.t,{class:(0,n.normalizeClass)([`s-ui-avatar-group`,o.value]),role:`group`,"aria-disabled":a.disabled||void 0,"cluster-class":`s-ui-avatar-group__cluster`,"max-visible":a.maxVisible,"map-vnode":u},{overflow:(0,n.withCtx)(({overflowLabel:e})=>[(0,n.createElementVNode)(`span`,i,(0,n.toDisplayString)(e),1)]),default:(0,n.withCtx)(()=>[(0,n.renderSlot)(e.$slots,`default`)]),_:3},8,[`class`,`aria-disabled`,`max-visible`]))}});Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return a}});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { o as e, t } from "./SAvatar-BK8cEzGY.js";
|
|
2
|
-
import { t as n } from "./SOverflowGroup-
|
|
2
|
+
import { t as n } from "./SOverflowGroup-CyksOav7.js";
|
|
3
3
|
import { cloneVNode as r, computed as i, createBlock as a, createElementVNode as o, defineComponent as s, normalizeClass as c, openBlock as l, renderSlot as u, toDisplayString as d, withCtx as f } from "vue";
|
|
4
4
|
//#region src/components/SAvatarGroup/SAvatarGroup.types.ts
|
|
5
5
|
var p = /* @__PURE__ */ function(e) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { n as e, t } from "./useLink-Com5VhOk.js";
|
|
2
|
-
import { r as n, t as r } from "./SCheckbox-
|
|
2
|
+
import { r as n, t as r } from "./SCheckbox-BXV4bPOv.js";
|
|
3
3
|
import { Fragment as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, mergeModels as p, mergeProps as m, openBlock as h, renderSlot as g, resolveDynamicComponent as _, toDisplayString as v, unref as y, useAttrs as b, useModel as x, useSlots as S, withCtx as C } from "vue";
|
|
4
4
|
import { ESSkeletonType as w, SIcon as T, SSkeleton as E } from "@shtabapp/ui-kit-primitives";
|
|
5
5
|
//#region src/components/SCard/SCard.types.ts
|
|
@@ -23,7 +23,8 @@ var D = /* @__PURE__ */ function(e) {
|
|
|
23
23
|
}, F = {
|
|
24
24
|
key: 0,
|
|
25
25
|
class: "s-ui-card__selected-indicator",
|
|
26
|
-
"aria-hidden": "true"
|
|
26
|
+
"aria-hidden": "true",
|
|
27
|
+
inert: ""
|
|
27
28
|
}, I = /* @__PURE__ */ f({
|
|
28
29
|
inheritAttrs: !1,
|
|
29
30
|
__name: "SCard",
|
|
@@ -121,8 +122,7 @@ var D = /* @__PURE__ */ function(e) {
|
|
|
121
122
|
R.meta ? (h(), c("span", P, [g(e.$slots, "meta")])) : s("", !0)
|
|
122
123
|
]), J.value ? (h(), c("span", F, [g(e.$slots, "selected-indicator", {}, () => [d(y(r), {
|
|
123
124
|
"model-value": I.value,
|
|
124
|
-
size: y(n).EXTRA_SMALL
|
|
125
|
-
tabindex: -1
|
|
125
|
+
size: y(n).EXTRA_SMALL
|
|
126
126
|
}, null, 8, ["model-value", "size"])])])) : s("", !0)], 64))]),
|
|
127
127
|
_: 3
|
|
128
128
|
}, 16, ["class"]));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const e=require("./useLink-1LLWpdDZ.cjs"),t=require("./SCheckbox-D_YLWg6a.cjs");let n=require("vue"),r=require("@shtabapp/ui-kit-primitives");var i=function(e){return e.CARD=`card`,e.LIST=`list`,e}({}),a={key:0,class:`s-ui-card__content s-ui-card__content--skeleton`},o={class:`s-ui-card__content`},s={class:`s-ui-card__icon`,"aria-hidden":`true`},c={class:`s-ui-card__text`},l={key:0,class:`s-ui-card__title s-ui-typography-heading-h6-semibold`},u={key:1,class:`s-ui-card__subtitle s-ui-typography-body-12-regular`},d={key:0,class:`s-ui-card__meta s-ui-typography-label-12-medium`},f={key:0,class:`s-ui-card__selected-indicator`,"aria-hidden":`true`,inert:``},p=(0,n.defineComponent)({inheritAttrs:!1,__name:`SCard`,props:(0,n.mergeModels)({layout:{default:()=>i.CARD},title:{},subtitle:{},icon:{default:`page`},selectable:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},skeleton:{type:Boolean,default:!1},link:{},exact:{type:Boolean,default:!1},replace:{type:Boolean,default:!1}},{selected:{type:Boolean,default:!1},selectedModifiers:{}}),emits:(0,n.mergeModels)([`click`,`keydown`],[`update:selected`]),setup(p,{emit:m}){let h=(0,n.useModel)(p,`selected`),g=m,_=(0,n.useSlots)(),v=(0,n.useAttrs)(),y=e.t(()=>p.link,()=>p.exact,()=>p.replace),b=y.linkPresentation,x=(0,n.computed)(()=>p.disabled||p.skeleton),S=y.isLink,C=(0,n.computed)(()=>b.value.mode===`none`?`div`:b.value.rootTag),w=(0,n.computed)(()=>{if(x.value)return-1;if(!S.value)return 0}),T=(0,n.computed)(()=>({"aria-busy":p.skeleton?!0:void 0,"aria-disabled":x.value?!0:void 0,"aria-pressed":p.selectable&&!x.value&&!S.value&&h.value?!0:void 0,role:x.value||S.value?void 0:`button`,tabindex:w.value,...e.n(b.value,{replace:p.replace})})),E=(0,n.computed)(()=>({...T.value,...v})),D=(0,n.computed)(()=>p.selectable&&!x.value),O=(0,n.computed)(()=>p.layout===i.LIST?r.ESSkeletonType.S_CARD_LIST:r.ESSkeletonType.S_CARD),k=(0,n.computed)(()=>[`s-ui-card--layout-${p.layout}`,{"s-ui-card--selected":h.value,"s-ui-card--selectable":p.selectable,"s-ui-card--disabled":p.disabled,"s-ui-card--skeleton":p.skeleton,"s-ui-card--link":S.value,"s-ui-card--with-subtitle":!!(p.subtitle||_.subtitle)}]),A=e=>{if(x.value){e.preventDefault();return}if(y.isRouterLink.value){g(`click`,e);return}p.selectable&&(h.value=!h.value),g(`click`,e)},j=[`Enter`,` `,`Spacebar`],M=[`Enter`,` `],N=e=>{if(!x.value){if(g(`keydown`,e),y.isRouterLink.value&&j.includes(e.key)){e.preventDefault(),y.navigate();return}S.value||M.includes(e.key)&&(e.preventDefault(),e.currentTarget instanceof HTMLElement&&e.currentTarget.click())}};return(e,i)=>((0,n.openBlock)(),(0,n.createBlock)((0,n.resolveDynamicComponent)(C.value),(0,n.mergeProps)({class:[`s-ui-card`,k.value]},E.value,{onClick:A,onKeydown:N}),{default:(0,n.withCtx)(()=>[p.skeleton?((0,n.openBlock)(),(0,n.createElementBlock)(`div`,a,[(0,n.createVNode)((0,n.unref)(r.SSkeleton),{class:`s-ui-card__skeleton`,type:O.value},null,8,[`type`])])):((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:1},[(0,n.createElementVNode)(`div`,o,[(0,n.createElementVNode)(`span`,s,[(0,n.renderSlot)(e.$slots,`icon`,{},()=>[(0,n.createVNode)((0,n.unref)(r.SIcon),{name:p.icon,size:16},null,8,[`name`])])]),(0,n.createElementVNode)(`span`,c,[p.title||_.title?((0,n.openBlock)(),(0,n.createElementBlock)(`span`,l,[(0,n.renderSlot)(e.$slots,`title`,{},()=>[(0,n.createTextVNode)((0,n.toDisplayString)(p.title),1)])])):(0,n.createCommentVNode)(``,!0),p.subtitle||_.subtitle?((0,n.openBlock)(),(0,n.createElementBlock)(`span`,u,[(0,n.renderSlot)(e.$slots,`subtitle`,{},()=>[(0,n.createTextVNode)((0,n.toDisplayString)(p.subtitle),1)])])):(0,n.createCommentVNode)(``,!0)]),_.meta?((0,n.openBlock)(),(0,n.createElementBlock)(`span`,d,[(0,n.renderSlot)(e.$slots,`meta`)])):(0,n.createCommentVNode)(``,!0)]),D.value?((0,n.openBlock)(),(0,n.createElementBlock)(`span`,f,[(0,n.renderSlot)(e.$slots,`selected-indicator`,{},()=>[(0,n.createVNode)((0,n.unref)(t.t),{"model-value":h.value,size:(0,n.unref)(t.r).EXTRA_SMALL},null,8,[`model-value`,`size`])])])):(0,n.createCommentVNode)(``,!0)],64))]),_:3},16,[`class`]))}});Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return p}});
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import { computed as e, createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, mergeModels as o, normalizeClass as s, openBlock as c, unref as l, useModel as u, useTemplateRef as d, vModelCheckbox as f, watchEffect as p, withDirectives as m } from "vue";
|
|
2
|
+
import { SIcon as h } from "@shtabapp/ui-kit-primitives";
|
|
3
|
+
//#region src/components/SCheckbox/SCheckbox.types.ts
|
|
4
|
+
var g = /* @__PURE__ */ function(e) {
|
|
5
|
+
return e.EXTRA_SMALL = "extra-small", e.SMALL = "small", e;
|
|
6
|
+
}({}), _ = /* @__PURE__ */ function(e) {
|
|
7
|
+
return e.MAIN = "main", e.SUCCESS = "success", e;
|
|
8
|
+
}({}), v = [
|
|
9
|
+
"disabled",
|
|
10
|
+
"name",
|
|
11
|
+
"value"
|
|
12
|
+
], y = { class: "s-ui-checkbox__control" }, b = 16, x = /* @__PURE__ */ a({
|
|
13
|
+
__name: "SCheckbox",
|
|
14
|
+
props: /*@__PURE__*/ o({
|
|
15
|
+
color: { default: () => _.MAIN },
|
|
16
|
+
disabled: {
|
|
17
|
+
type: Boolean,
|
|
18
|
+
default: !1
|
|
19
|
+
},
|
|
20
|
+
indeterminate: {
|
|
21
|
+
type: Boolean,
|
|
22
|
+
default: !1
|
|
23
|
+
},
|
|
24
|
+
name: {},
|
|
25
|
+
size: { default: () => g.EXTRA_SMALL },
|
|
26
|
+
value: {}
|
|
27
|
+
}, {
|
|
28
|
+
modelValue: {
|
|
29
|
+
type: Boolean,
|
|
30
|
+
default: !1
|
|
31
|
+
},
|
|
32
|
+
modelModifiers: {}
|
|
33
|
+
}),
|
|
34
|
+
emits: /*@__PURE__*/ o(["change"], ["update:modelValue"]),
|
|
35
|
+
setup(a, { emit: o }) {
|
|
36
|
+
let g = u(a, "modelValue"), _ = o, x = d("checkboxInputRef");
|
|
37
|
+
p(() => {
|
|
38
|
+
let e = x.value;
|
|
39
|
+
e && (e.indeterminate = a.indeterminate);
|
|
40
|
+
});
|
|
41
|
+
let S = e(() => g.value), C = e(() => S.value && !a.indeterminate), w = e(() => [
|
|
42
|
+
`s-ui-checkbox--size-${a.size}`,
|
|
43
|
+
`s-ui-checkbox--color-${a.color}`,
|
|
44
|
+
{
|
|
45
|
+
"s-ui-checkbox--checked": S.value,
|
|
46
|
+
"s-ui-checkbox--indeterminate": a.indeterminate,
|
|
47
|
+
"s-ui-checkbox--disabled": a.disabled
|
|
48
|
+
}
|
|
49
|
+
]), T = (e) => {
|
|
50
|
+
e.target instanceof HTMLInputElement && _("change", e.target.checked);
|
|
51
|
+
};
|
|
52
|
+
return (e, o) => (c(), r("label", { class: s(["s-ui-checkbox", w.value]) }, [m(i("input", {
|
|
53
|
+
ref_key: "checkboxInputRef",
|
|
54
|
+
ref: x,
|
|
55
|
+
"onUpdate:modelValue": o[0] ||= (e) => g.value = e,
|
|
56
|
+
type: "checkbox",
|
|
57
|
+
class: "s-ui-checkbox__input",
|
|
58
|
+
disabled: a.disabled,
|
|
59
|
+
name: a.name,
|
|
60
|
+
value: a.value,
|
|
61
|
+
onChange: T
|
|
62
|
+
}, null, 40, v), [[f, g.value]]), i("span", y, [C.value ? (c(), t(l(h), {
|
|
63
|
+
key: 0,
|
|
64
|
+
class: "s-ui-checkbox__icon",
|
|
65
|
+
name: "checkMini",
|
|
66
|
+
size: b
|
|
67
|
+
})) : a.indeterminate ? (c(), t(l(h), {
|
|
68
|
+
key: 1,
|
|
69
|
+
class: "s-ui-checkbox__icon",
|
|
70
|
+
name: "minusMini",
|
|
71
|
+
size: b
|
|
72
|
+
})) : n("", !0)])], 2));
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
//#endregion
|
|
76
|
+
export { _ as n, g as r, x as t };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
let e=require("vue"),t=require("@shtabapp/ui-kit-primitives");var n=function(e){return e.EXTRA_SMALL=`extra-small`,e.SMALL=`small`,e}({}),r=function(e){return e.MAIN=`main`,e.SUCCESS=`success`,e}({}),i=[`disabled`,`name`,`value`],a={class:`s-ui-checkbox__control`},o=16,s=(0,e.defineComponent)({__name:`SCheckbox`,props:(0,e.mergeModels)({color:{default:()=>r.MAIN},disabled:{type:Boolean,default:!1},indeterminate:{type:Boolean,default:!1},name:{},size:{default:()=>n.EXTRA_SMALL},value:{}},{modelValue:{type:Boolean,default:!1},modelModifiers:{}}),emits:(0,e.mergeModels)([`change`],[`update:modelValue`]),setup(n,{emit:r}){let s=(0,e.useModel)(n,`modelValue`),c=r,l=(0,e.useTemplateRef)(`checkboxInputRef`);(0,e.watchEffect)(()=>{let e=l.value;e&&(e.indeterminate=n.indeterminate)});let u=(0,e.computed)(()=>s.value),d=(0,e.computed)(()=>u.value&&!n.indeterminate),f=(0,e.computed)(()=>[`s-ui-checkbox--size-${n.size}`,`s-ui-checkbox--color-${n.color}`,{"s-ui-checkbox--checked":u.value,"s-ui-checkbox--indeterminate":n.indeterminate,"s-ui-checkbox--disabled":n.disabled}]),p=e=>{e.target instanceof HTMLInputElement&&c(`change`,e.target.checked)};return(r,c)=>((0,e.openBlock)(),(0,e.createElementBlock)(`label`,{class:(0,e.normalizeClass)([`s-ui-checkbox`,f.value])},[(0,e.withDirectives)((0,e.createElementVNode)(`input`,{ref_key:`checkboxInputRef`,ref:l,"onUpdate:modelValue":c[0]||=e=>s.value=e,type:`checkbox`,class:`s-ui-checkbox__input`,disabled:n.disabled,name:n.name,value:n.value,onChange:p},null,40,i),[[e.vModelCheckbox,s.value]]),(0,e.createElementVNode)(`span`,a,[d.value?((0,e.openBlock)(),(0,e.createBlock)((0,e.unref)(t.SIcon),{key:0,class:`s-ui-checkbox__icon`,name:`checkMini`,size:o})):n.indeterminate?((0,e.openBlock)(),(0,e.createBlock)((0,e.unref)(t.SIcon),{key:1,class:`s-ui-checkbox__icon`,name:`minusMini`,size:o})):(0,e.createCommentVNode)(``,!0)])],2))}});Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return s}});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
let e=require("vue");var t=function(e){return e.BLUE=`blue`,e.RED=`red`,e.WHITE=`white`,e.BILLING=`billing`,e}({}),n=function(e){return e.SIZE_20=`20`,e.SIZE_24=`24`,e.SIZE_32=`32`,e}({}),r=[`tabindex`,`aria-disabled`,`inert`],i={class:`s-ui-chip__content`},a={key:0,class:`s-ui-chip__icon`},o={key:1,class:`s-ui-chip__prefix`},s={key:0,class:`s-ui-chip__actions`},c=(0,e.defineComponent)({__name:`SChip`,props:{color:{default:()=>t.BLUE},disabled:{type:Boolean,default:!1},size:{default:()=>n.SIZE_32}},setup(c){let l=(0,e.useSlots)(),u=(0,e.computed)(()=>c.color===t.BILLING),d=(0,e.computed)(()=>c.disabled?!1:u.value),f=(0,e.computed)(()=>c.disabled?-1:0),p=(0,e.computed)(()=>[`s-ui-chip--color-${c.color}`,`s-ui-chip--size-${c.size}`,{"s-ui-chip--disabled":c.disabled}]),m=(0,e.computed)(()=>c.size===n.SIZE_20?`s-ui-typography-label-12-medium`:`s-ui-typography-label-14-medium`),h={[n.SIZE_20]:16,[n.SIZE_24]:20,[n.SIZE_32]:20},g=(0,e.computed)(()=>h[c.size]);return(t,n)=>((0,e.openBlock)(),(0,e.createElementBlock)(`span`,{class:(0,e.normalizeClass)([`s-ui-chip`,p.value]),tabindex:f.value,role:`group`,"aria-disabled":c.disabled?!0:void 0,inert:c.disabled?!0:void 0},[(0,e.createElementVNode)(`span`,i,[(0,e.unref)(l).icon?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,a,[(0,e.renderSlot)(t.$slots,`icon`,{billing:d.value,disabled:c.disabled,size:g.value})])):(0,e.createCommentVNode)(``,!0),(0,e.unref)(l).prefix?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,o,[(0,e.renderSlot)(t.$slots,`prefix`,{disabled:c.disabled,size:c.size})])):(0,e.createCommentVNode)(``,!0),(0,e.unref)(l).default?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,{key:2,class:(0,e.normalizeClass)([`s-ui-chip__label`,m.value])},[(0,e.renderSlot)(t.$slots,`default`)],2)):(0,e.createCommentVNode)(``,!0)]),(0,e.unref)(l).actions?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,s,[(0,e.renderSlot)(t.$slots,`actions`,{billing:u.value,disabled:c.disabled})])):(0,e.createCommentVNode)(``,!0)],10,r))}});Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return t}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return c}});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require("./contrastSurfaceTextColor-BRjRzXyZ.cjs"),t=require("./SColorPalette-CqfVzhda.cjs"),n=require("./colorValue-Dda7fKd3.cjs"),r=require("./SButton.types-UKroD-ev.cjs"),i=require("./SButton-C-z_q5CG.cjs"),a=require("./useFloatingOverlay-B1UCUYQQ.cjs"),o=require("./SDropdown-_QUOP-rw.cjs"),s=require("./SSelect-DcTEwHx6.cjs");let c=require("vue"),l=require("@shtabapp/ui-kit-primitives"),u=require("@vueuse/core");var d=e=>Math.max(0,Math.min(255,Math.round(e))),f=e=>{let t=e%360;return t<0?t+360:t},p=e=>Math.max(0,Math.min(100,Math.round(e))),m=e=>{let t=e.slice(1);if(t.length===3){let e=t[0],n=t[1],r=t[2];return!e||!n||!r?void 0:`${e}${e}${n}${n}${r}${r}`}if(t.length===6||t.length===8)return t.slice(0,6)},h=e=>{let t=m(e);if(!t)return;let n=Number.parseInt(t.slice(0,2),16),r=Number.parseInt(t.slice(2,4),16),i=Number.parseInt(t.slice(4,6),16);if(!(Number.isNaN(n)||Number.isNaN(r)||Number.isNaN(i)))return{first:n,second:r,third:i}},g=e=>{let t=d(e.first),n=d(e.second),r=d(e.third);return`#${t.toString(16).padStart(2,`0`).toUpperCase()}${n.toString(16).padStart(2,`0`).toUpperCase()}${r.toString(16).padStart(2,`0`).toUpperCase()}`},_=e=>{let t=h(e);if(!t)return;let n=t.first/255,r=t.second/255,i=t.third/255,a=Math.max(n,r,i),o=Math.min(n,r,i),s=a-o,c=0,l=(a+o)/2;s!==0&&(c=a===n?((r-i)/s+(r<i?6:0))*60:a===r?((i-n)/s+2)*60:((n-r)/s+4)*60);let u=0;return s!==0&&(u=l>.5?s/(2-a-o):s/(a+o)),{first:Math.round(c),second:Math.round(u*100),third:Math.round(l*100)}},v=e=>{let t=f(e.first),n=p(e.second)/100,r=p(e.third)/100,i=e=>{let i=(t+e)/30;return d((r-n*Math.min(r,1-r)*Math.max(-1,Math.min(i%2-1,1)))*255)};return g({first:i(0),second:i(8),third:i(4)})},y=t=>{let n=t.toUpperCase(),r=n.startsWith(`#`)?n.slice(1):n;if(!/^[0-9A-F]{3}$/.test(r)&&!/^[0-9A-F]{6}$/.test(r))return;let i=`#${r}`;if(e.n(i))return g(h(i)??{first:0,second:0,third:0})},b=e=>e.slice(1).toUpperCase(),x=e=>{let t=e.first/255,n=e.second/255,r=e.third/255,i=Math.max(t,n,r),a=i-Math.min(t,n,r),o=0;a!==0&&(o=i===t?(n-r)/a%6:i===n?(r-t)/a+2:(t-n)/a+4,o=Math.round(o*60),o<0&&(o+=360));let s=i===0?0:a/i;return{hue:o,saturation:s,value:i}},S=e=>{let t=e.value*e.saturation,n=e.hue/60,r=t*(1-Math.abs(n%2-1)),i=e.value-t,a=0,o=0,s=0;return n>=0&&n<1?(a=t,o=r):n>=1&&n<2?(a=r,o=t):n>=2&&n<3?(o=t,s=r):n>=3&&n<4?(o=r,s=t):n>=4&&n<5?(a=r,s=t):(a=t,s=r),{first:d((a+i)*255),second:d((o+i)*255),third:d((s+i)*255)}},C=e=>{let t=h(e);if(t)return x(t)},w=e=>g(S(e)),T=[t.o.HEX,t.o.RGB,t.o.HSL],E={[t.o.HEX]:`Hex`,[t.o.RGB]:`RGB`,[t.o.HSL]:`HSL`},D=e=>{let t=getComputedStyle(e).backgroundColor.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)/);if(!t)return;let n=Number.parseInt(t[1]??`0`,10),r=Number.parseInt(t[2]??`0`,10),i=Number.parseInt(t[3]??`0`,10);return`#${n.toString(16).padStart(2,`0`).toUpperCase()}${r.toString(16).padStart(2,`0`).toUpperCase()}${i.toString(16).padStart(2,`0`).toUpperCase()}`},O=(t,r)=>{if(n.n(t)&&e.n(t))return t;if(r)return D(r)},k=(e,n)=>n===t.o.HEX?b(e):n===t.o.RGB?h(e)??{first:0,second:0,third:0}:_(e)??{first:0,second:0,third:0},A=e=>{let t=Number.parseInt(e,10);if(!Number.isNaN(t))return t},j=(e,n)=>{if(e===t.o.HEX)return typeof n==`string`?y(n):void 0;if(typeof n==`string`)return;if(e===t.o.RGB){let e=g({first:A(String(n.first))??0,second:A(String(n.second))??0,third:A(String(n.third))??0});return h(e)?e:void 0}let r=v({first:A(String(n.first))??0,second:A(String(n.second))??0,third:A(String(n.third))??0});if(r&&_(r))return r},M=17,N=`#000000`,P=e=>e??N,F=({modelValue:e,getEditableHex:t,saturationAreaRef:n,hueSliderRef:r,disabled:i,readonly:a})=>{let o=C(P(t()))??{hue:0,saturation:0,value:0},s=(0,c.ref)(o.hue),l=(0,c.ref)(o.saturation),d=(0,c.ref)(o.value),f=(0,c.ref)(!1),p=(0,c.ref)(!1),m=(0,c.ref)(!1),h=(0,c.shallowRef)(null),g=(0,c.shallowRef)(null),_=(0,c.computed)(()=>w({hue:s.value,saturation:l.value,value:d.value})),v=(0,c.computed)(()=>w({hue:s.value,saturation:1,value:1})),y=e=>{s.value=Math.max(0,Math.min(360,e))},b=(e,t)=>{l.value=Math.max(0,Math.min(1,e)),d.value=Math.max(0,Math.min(1,t))},x=e=>{let t=C(P(e));t&&(f.value=!0,t.saturation>0&&(s.value=t.hue),l.value=t.saturation,d.value=t.value,f.value=!1)},S=()=>{let e=t();e&&e.toUpperCase()!==_.value.toUpperCase()&&x(e)},T=()=>{let n=_.value;t()?.toUpperCase()!==n.toUpperCase()&&(f.value=!0,e.value=n,f.value=!1)};(0,c.watch)([s,l,d],()=>{f.value||T()}),(0,c.watch)(e,()=>{f.value||S()}),(0,c.onMounted)(()=>{(0,c.nextTick)(()=>{E(),D(),S()})});let E=()=>{h.value=n.value?.getBoundingClientRect()??null},D=()=>{g.value=r.value?.getBoundingClientRect()??null},O=(0,c.computed)(()=>{let e=h.value;return e?{transform:`translate3d(calc(${l.value*e.width}px - 50%), calc(${(1-d.value)*e.height}px - 50%), 0)`}:{}}),k=(0,c.computed)(()=>{let e=g.value;return e?{transform:`translate3d(-50%, calc(${s.value/360*e.height}px - 50%), 0)`}:{}}),A=()=>!i.value&&!a.value,j=e=>{let t=h.value;if(!t)return;let n=Math.max(0,Math.min(e.clientX-t.left,t.width)),r=Math.max(0,Math.min(e.clientY-t.top,t.height));b(n/t.width,1-r/t.height)},M=e=>{let t=g.value;t&&y(Math.max(0,Math.min(e.clientY-t.top,t.height))/t.height*360)},N=e=>{A()&&(E(),p.value=!0,j(e),e.currentTarget instanceof HTMLElement&&e.currentTarget.setPointerCapture(e.pointerId))},F=e=>{A()&&(D(),m.value=!0,M(e),e.currentTarget instanceof HTMLElement&&e.currentTarget.setPointerCapture(e.pointerId))},I=()=>{p.value=!1},L=()=>{m.value=!1};return(0,u.useEventListener)(n,`pointermove`,e=>{p.value&&j(e)}),(0,u.useEventListener)(n,`pointerup`,I),(0,u.useEventListener)(n,`pointercancel`,I),(0,u.useEventListener)(n,`lostpointercapture`,I),(0,u.useEventListener)(r,`pointermove`,e=>{m.value&&M(e)}),(0,u.useEventListener)(r,`pointerup`,L),(0,u.useEventListener)(r,`pointercancel`,L),(0,u.useEventListener)(r,`lostpointercapture`,L),{hexColor:_,hueBackground:v,saturationPointerStyle:O,huePointerStyle:k,handleSaturationPointerDown:N,handleHuePointerDown:F,syncFromModelValue:S}},I=e=>{if(!e)return null;let t=e.$el;if(!(t instanceof HTMLElement))return null;let n=t.querySelector(`.s-ui-color-swatch__fill`);return n instanceof HTMLElement?n:null},L={class:`s-ui-color-area__canvas-row`},R=[`aria-label`],z=[`aria-label`,`aria-disabled`],B=(0,c.defineComponent)({__name:`SColorArea`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1}},{modelValue:{required:!0},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let t=(0,c.useModel)(e,`modelValue`),{t:r}=(0,l.useUiKitI18n)(),i=(0,c.useTemplateRef)(`colorResolutionSwatchRef`),a=(0,c.useTemplateRef)(`saturationAreaRef`),o=(0,c.useTemplateRef)(`hueSliderRef`),s=()=>O(t.value,I(i.value)),u=(0,c.computed)(()=>n.a(t.value)),{hexColor:d,hueBackground:f,saturationPointerStyle:p,huePointerStyle:m,handleSaturationPointerDown:h,handleHuePointerDown:g}=F({modelValue:t,getEditableHex:s,saturationAreaRef:a,hueSliderRef:o,disabled:(0,c.toRef)(()=>e.disabled),readonly:(0,c.toRef)(()=>e.readonly)});return(t,n)=>((0,c.openBlock)(),(0,c.createElementBlock)(`div`,(0,c.mergeProps)({class:[`s-ui-color-area`,{"s-ui-color-area--disabled":e.disabled,"s-ui-color-area--readonly":e.readonly}]},t.$attrs),[(0,c.createVNode)((0,c.unref)(l.SColorSwatch),{ref_key:`colorResolutionSwatchRef`,ref:i,class:`s-ui-color-area__color-resolution`,color:u.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_24,tabindex:`-1`,"aria-hidden":`true`},null,8,[`color`,`size`]),(0,c.createElementVNode)(`div`,L,[(0,c.createElementVNode)(`div`,{ref_key:`saturationAreaRef`,ref:a,class:`s-ui-color-area__canvas`,role:`img`,"aria-label":(0,c.unref)(r)(`colorArea.saturationBrightness`),style:(0,c.normalizeStyle)({"--s-ui-color-area-hue":(0,c.unref)(f)}),onPointerdown:n[0]||=(...e)=>(0,c.unref)(h)&&(0,c.unref)(h)(...e)},[(0,c.createElementVNode)(`div`,{class:`s-ui-color-area__canvas-pointer`,style:(0,c.normalizeStyle)({...(0,c.unref)(p),backgroundColor:(0,c.unref)(d)})},null,4)],44,R),(0,c.createElementVNode)(`div`,{ref_key:`hueSliderRef`,ref:o,class:`s-ui-color-area__hue`,role:`slider`,"aria-label":(0,c.unref)(r)(`colorArea.hue`),"aria-valuemin":`0`,"aria-valuemax":`360`,"aria-disabled":e.disabled||e.readonly,onPointerdown:n[1]||=(...e)=>(0,c.unref)(g)&&(0,c.unref)(g)(...e)},[(0,c.createElementVNode)(`div`,{class:`s-ui-color-area__hue-pointer`,style:(0,c.normalizeStyle)({...(0,c.unref)(m),backgroundColor:(0,c.unref)(f)})},null,4)],40,z)])],16))}}),V={class:`s-ui-color-values__left`},H={class:`s-ui-color-values__format`},U={class:`s-ui-color-values__value-group`},W={class:`s-ui-color-values__inputs`},G={key:0,class:`s-ui-color-values__input-wrap`},K=[`disabled`,`readonly`,`aria-label`],q={class:`s-ui-color-values__input-wrap`},J=[`disabled`,`readonly`,`aria-label`],Y={class:`s-ui-color-values__input-wrap`},X=[`disabled`,`readonly`,`aria-label`],Z={class:`s-ui-color-values__input-wrap`},Q=[`disabled`,`readonly`,`aria-label`],$=(0,c.defineComponent)({__name:`SColorValues`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},formats:{default:()=>T}},{modelValue:{required:!0},modelModifiers:{},format:{default:t.o.HEX},formatModifiers:{}}),emits:(0,c.mergeModels)([`formatDropdownOpen`,`formatDropdownClose`],[`update:modelValue`,`update:format`]),setup(e,{emit:a}){let{t:o}=(0,l.useUiKitI18n)(),u=(0,c.useModel)(e,`modelValue`),d=(0,c.useModel)(e,`format`),f=a,p=(0,c.useTemplateRef)(`previewSwatchRef`),m=(0,c.ref)(``),h=(0,c.ref)(`0`),g=(0,c.ref)(`0`),_=(0,c.ref)(`0`),v=(0,c.computed)(()=>(e.formats.length>0?e.formats:T).map(e=>({value:e,label:E[e]}))),y=(0,c.computed)(()=>n.a(u.value)),b=(0,c.computed)(()=>O(u.value,I(p.value))),x=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.redChannel`):o(`colorValues.hueChannel`)),S=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.greenChannel`):o(`colorValues.saturationChannel`)),C=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.blueChannel`):o(`colorValues.lightnessChannel`)),w=()=>{let e=b.value;if(!e)return;let n=k(e,d.value);if(d.value===t.o.HEX&&typeof n==`string`){m.value=n;return}typeof n==`object`&&(h.value=String(n.first),g.value=String(n.second),_.value=String(n.third))};(0,c.watch)([u,d,b],()=>{w()}),(0,c.onMounted)(()=>{(0,c.nextTick)(()=>{w()})});let D=()=>{if(e.disabled||e.readonly)return;if(d.value===t.o.HEX){let e=j(t.o.HEX,m.value);e&&(u.value=e),w();return}let n=j(d.value,{first:Number.parseInt(h.value,10),second:Number.parseInt(g.value,10),third:Number.parseInt(_.value,10)});n&&(u.value=n),w()},A=e=>{e.key===`Enter`&&(e.preventDefault(),D())};return(n,a)=>((0,c.openBlock)(),(0,c.createElementBlock)(`div`,(0,c.mergeProps)({class:[`s-ui-color-values`,{"s-ui-color-values--disabled":e.disabled,"s-ui-color-values--readonly":e.readonly}]},n.$attrs),[(0,c.createElementVNode)(`div`,V,[(0,c.createVNode)((0,c.unref)(l.SColorSwatch),{ref_key:`previewSwatchRef`,ref:p,class:`s-ui-color-values__preview`,color:y.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,tabindex:`-1`,"aria-hidden":`true`},null,8,[`color`,`size`,`disabled`]),(0,c.createElementVNode)(`div`,H,[(0,c.createVNode)((0,c.unref)(s.t),{modelValue:d.value,"onUpdate:modelValue":a[0]||=e=>d.value=e,class:`s-ui-color-values__format-select`,options:v.value,disabled:e.disabled,readonly:e.readonly,bordered:!0,clearable:!1,"close-on-select":!0,"fit-viewport":!1,"aria-label":(0,c.unref)(o)(`colorValues.format`),onOpen:a[1]||=e=>f(`formatDropdownOpen`),onClose:a[2]||=e=>f(`formatDropdownClose`)},null,8,[`modelValue`,`options`,`disabled`,`readonly`,`aria-label`])])]),(0,c.createElementVNode)(`div`,U,[(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-values__pipette`,appearance:(0,c.unref)(r.t).BARE,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,icon:`pipette`,"aria-label":(0,c.unref)(o)(`colorValues.pickColor`),"aria-disabled":`true`,disabled:e.disabled,tabindex:`-1`},null,8,[`appearance`,`variant`,`size`,`aria-label`,`disabled`]),a[9]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,W,[d.value===(0,c.unref)(t.o).HEX?((0,c.openBlock)(),(0,c.createElementBlock)(`div`,G,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[3]||=e=>m.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`text`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":(0,c.unref)(o)(`colorValues.hexValue`),onBlur:D,onKeydown:A},null,40,K),[[c.vModelText,m.value]])])):((0,c.openBlock)(),(0,c.createElementBlock)(c.Fragment,{key:1},[(0,c.createElementVNode)(`div`,q,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[4]||=e=>h.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":x.value,onBlur:D,onKeydown:A},null,40,J),[[c.vModelText,h.value]])]),a[7]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,Y,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[5]||=e=>g.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":S.value,onBlur:D,onKeydown:A},null,40,X),[[c.vModelText,g.value]])]),a[8]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,Z,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[6]||=e=>_.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":C.value,onBlur:D,onKeydown:A},null,40,Q),[[c.vModelText,_.value]])])],64))])])],16))}}),ee={class:`s-ui-color-picker__section`},te={class:`s-ui-color-picker__label`},ne={class:`s-ui-color-picker__section`},re={class:`s-ui-color-picker__label`},ie={class:`s-ui-color-picker__custom-editor`},ae={class:`s-ui-color-picker__custom-actions`},oe=(0,c.defineComponent)({__name:`SColorPicker`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},recommendedColors:{},recentColors:{default:()=>[]}},{modelValue:{},modelModifiers:{}}),emits:(0,c.mergeModels)([`select`,`customEditorOpen`,`customEditorClose`,`formatDropdownOpen`,`formatDropdownClose`],[`update:modelValue`]),setup(e,{emit:n}){let u=(0,c.useModel)(e,`modelValue`),d=n,{t:f}=(0,l.useUiKitI18n)(),p=(0,c.ref)(!1),m=(0,c.ref)(`#526DE3`),h=(0,c.ref)(t.o.HEX),g=(0,c.computed)(()=>e.recommendedColors&&e.recommendedColors.length>0?e.recommendedColors:t.r),_=(0,c.computed)(()=>e.recentColors.length<=17?e.recentColors:e.recentColors.slice(0,17)),v=()=>{if(u.value){m.value=u.value;return}m.value=`#526DE3`},y=e=>{d(`select`,e)},b=()=>{u.value=m.value,d(`select`,m.value),p.value=!1},x=()=>{p.value=!1};return(0,c.watch)(p,(e,t)=>{if(e&&!t){v(),d(`customEditorOpen`);return}!e&&t&&d(`customEditorClose`)}),(n,v)=>((0,c.openBlock)(),(0,c.createBlock)((0,c.unref)(s.r),(0,c.mergeProps)({width:336},n.$attrs),{default:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,{class:(0,c.normalizeClass)([`s-ui-color-picker`,{"s-ui-color-picker--disabled":e.disabled}])},[(0,c.createElementVNode)(`section`,ee,[(0,c.createElementVNode)(`span`,te,(0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.recommendedColors`)),1),(0,c.createVNode)((0,c.unref)(t.t),{modelValue:u.value,"onUpdate:modelValue":v[0]||=e=>u.value=e,class:`s-ui-color-picker__palette`,layout:(0,c.unref)(t.n).GRID,colors:g.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,onSelect:y},null,8,[`modelValue`,`layout`,`colors`,`size`,`disabled`])]),(0,c.createElementVNode)(`section`,ne,[(0,c.createElementVNode)(`span`,re,(0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.recentColors`)),1),(0,c.createVNode)((0,c.unref)(t.t),{modelValue:u.value,"onUpdate:modelValue":v[7]||=e=>u.value=e,class:`s-ui-color-picker__palette`,layout:(0,c.unref)(t.n).ROW,colors:_.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,onSelect:y},{append:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(o.t),{modelValue:p.value,"onUpdate:modelValue":v[6]||=e=>p.value=e,placement:(0,c.unref)(a.i).RIGHT_START,offset:8,shift:!0,flip:!0,disabled:e.disabled,"dismiss-on-click-outside":!0,"dismiss-on-escape":!0},{trigger:(0,c.withCtx)(({toggle:t,triggerProps:n})=>[(0,c.createVNode)((0,c.unref)(i.t),(0,c.mergeProps)(n,{class:`s-ui-color-picker__add-button`,appearance:(0,c.unref)(r.t).OUTLINED,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,icon:`plus`,"aria-label":(0,c.unref)(f)(`colorPicker.addCustomColor`),disabled:e.disabled,onClick:t}),null,16,[`appearance`,`variant`,`size`,`aria-label`,`disabled`,`onClick`])]),content:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(s.r),{width:320},{footer:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,ae,[(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-picker__save-button`,appearance:(0,c.unref)(r.t).MAJOR,variant:(0,c.unref)(r.r).MAIN,size:(0,c.unref)(r.n).SMALL,disabled:e.disabled,onClick:b},{default:(0,c.withCtx)(()=>[(0,c.createTextVNode)((0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.save`)),1)]),_:1},8,[`appearance`,`variant`,`size`,`disabled`]),(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-picker__cancel-button`,appearance:(0,c.unref)(r.t).MINOR,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,disabled:e.disabled,onClick:x},{default:(0,c.withCtx)(()=>[(0,c.createTextVNode)((0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.cancel`)),1)]),_:1},8,[`appearance`,`variant`,`size`,`disabled`])])]),default:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,ie,[(0,c.createVNode)(B,{modelValue:m.value,"onUpdate:modelValue":v[1]||=e=>m.value=e,disabled:e.disabled},null,8,[`modelValue`,`disabled`]),(0,c.createVNode)($,{modelValue:m.value,"onUpdate:modelValue":v[2]||=e=>m.value=e,format:h.value,"onUpdate:format":v[3]||=e=>h.value=e,disabled:e.disabled,onFormatDropdownOpen:v[4]||=e=>d(`formatDropdownOpen`),onFormatDropdownClose:v[5]||=e=>d(`formatDropdownClose`)},null,8,[`modelValue`,`format`,`disabled`])])]),_:1})]),_:1},8,[`modelValue`,`placement`,`disabled`])]),_:1},8,[`modelValue`,`layout`,`colors`,`size`,`disabled`])])],2)]),_:1},16))}});Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return M}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return $}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return B}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return oe}});
|
|
1
|
+
const e=require("./contrastSurfaceTextColor-BRjRzXyZ.cjs"),t=require("./SColorPalette-CqfVzhda.cjs"),n=require("./colorValue-Dda7fKd3.cjs"),r=require("./SButton.types-UKroD-ev.cjs"),i=require("./SButton-C-z_q5CG.cjs"),a=require("./useFloatingOverlay-B1UCUYQQ.cjs"),o=require("./SDropdown-_QUOP-rw.cjs"),s=require("./SSelect-CMR4dxSn.cjs");let c=require("vue"),l=require("@shtabapp/ui-kit-primitives"),u=require("@vueuse/core");var d=e=>Math.max(0,Math.min(255,Math.round(e))),f=e=>{let t=e%360;return t<0?t+360:t},p=e=>Math.max(0,Math.min(100,Math.round(e))),m=e=>{let t=e.slice(1);if(t.length===3){let e=t[0],n=t[1],r=t[2];return!e||!n||!r?void 0:`${e}${e}${n}${n}${r}${r}`}if(t.length===6||t.length===8)return t.slice(0,6)},h=e=>{let t=m(e);if(!t)return;let n=Number.parseInt(t.slice(0,2),16),r=Number.parseInt(t.slice(2,4),16),i=Number.parseInt(t.slice(4,6),16);if(!(Number.isNaN(n)||Number.isNaN(r)||Number.isNaN(i)))return{first:n,second:r,third:i}},g=e=>{let t=d(e.first),n=d(e.second),r=d(e.third);return`#${t.toString(16).padStart(2,`0`).toUpperCase()}${n.toString(16).padStart(2,`0`).toUpperCase()}${r.toString(16).padStart(2,`0`).toUpperCase()}`},_=e=>{let t=h(e);if(!t)return;let n=t.first/255,r=t.second/255,i=t.third/255,a=Math.max(n,r,i),o=Math.min(n,r,i),s=a-o,c=0,l=(a+o)/2;s!==0&&(c=a===n?((r-i)/s+(r<i?6:0))*60:a===r?((i-n)/s+2)*60:((n-r)/s+4)*60);let u=0;return s!==0&&(u=l>.5?s/(2-a-o):s/(a+o)),{first:Math.round(c),second:Math.round(u*100),third:Math.round(l*100)}},v=e=>{let t=f(e.first),n=p(e.second)/100,r=p(e.third)/100,i=e=>{let i=(t+e)/30;return d((r-n*Math.min(r,1-r)*Math.max(-1,Math.min(i%2-1,1)))*255)};return g({first:i(0),second:i(8),third:i(4)})},y=t=>{let n=t.toUpperCase(),r=n.startsWith(`#`)?n.slice(1):n;if(!/^[0-9A-F]{3}$/.test(r)&&!/^[0-9A-F]{6}$/.test(r))return;let i=`#${r}`;if(e.n(i))return g(h(i)??{first:0,second:0,third:0})},b=e=>e.slice(1).toUpperCase(),x=e=>{let t=e.first/255,n=e.second/255,r=e.third/255,i=Math.max(t,n,r),a=i-Math.min(t,n,r),o=0;a!==0&&(o=i===t?(n-r)/a%6:i===n?(r-t)/a+2:(t-n)/a+4,o=Math.round(o*60),o<0&&(o+=360));let s=i===0?0:a/i;return{hue:o,saturation:s,value:i}},S=e=>{let t=e.value*e.saturation,n=e.hue/60,r=t*(1-Math.abs(n%2-1)),i=e.value-t,a=0,o=0,s=0;return n>=0&&n<1?(a=t,o=r):n>=1&&n<2?(a=r,o=t):n>=2&&n<3?(o=t,s=r):n>=3&&n<4?(o=r,s=t):n>=4&&n<5?(a=r,s=t):(a=t,s=r),{first:d((a+i)*255),second:d((o+i)*255),third:d((s+i)*255)}},C=e=>{let t=h(e);if(t)return x(t)},w=e=>g(S(e)),T=[t.o.HEX,t.o.RGB,t.o.HSL],E={[t.o.HEX]:`Hex`,[t.o.RGB]:`RGB`,[t.o.HSL]:`HSL`},D=e=>{let t=getComputedStyle(e).backgroundColor.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)/);if(!t)return;let n=Number.parseInt(t[1]??`0`,10),r=Number.parseInt(t[2]??`0`,10),i=Number.parseInt(t[3]??`0`,10);return`#${n.toString(16).padStart(2,`0`).toUpperCase()}${r.toString(16).padStart(2,`0`).toUpperCase()}${i.toString(16).padStart(2,`0`).toUpperCase()}`},O=(t,r)=>{if(n.n(t)&&e.n(t))return t;if(r)return D(r)},k=(e,n)=>n===t.o.HEX?b(e):n===t.o.RGB?h(e)??{first:0,second:0,third:0}:_(e)??{first:0,second:0,third:0},A=e=>{let t=Number.parseInt(e,10);if(!Number.isNaN(t))return t},j=(e,n)=>{if(e===t.o.HEX)return typeof n==`string`?y(n):void 0;if(typeof n==`string`)return;if(e===t.o.RGB){let e=g({first:A(String(n.first))??0,second:A(String(n.second))??0,third:A(String(n.third))??0});return h(e)?e:void 0}let r=v({first:A(String(n.first))??0,second:A(String(n.second))??0,third:A(String(n.third))??0});if(r&&_(r))return r},M=17,N=`#000000`,P=e=>e??N,F=({modelValue:e,getEditableHex:t,saturationAreaRef:n,hueSliderRef:r,disabled:i,readonly:a})=>{let o=C(P(t()))??{hue:0,saturation:0,value:0},s=(0,c.ref)(o.hue),l=(0,c.ref)(o.saturation),d=(0,c.ref)(o.value),f=(0,c.ref)(!1),p=(0,c.ref)(!1),m=(0,c.ref)(!1),h=(0,c.shallowRef)(null),g=(0,c.shallowRef)(null),_=(0,c.computed)(()=>w({hue:s.value,saturation:l.value,value:d.value})),v=(0,c.computed)(()=>w({hue:s.value,saturation:1,value:1})),y=e=>{s.value=Math.max(0,Math.min(360,e))},b=(e,t)=>{l.value=Math.max(0,Math.min(1,e)),d.value=Math.max(0,Math.min(1,t))},x=e=>{let t=C(P(e));t&&(f.value=!0,t.saturation>0&&(s.value=t.hue),l.value=t.saturation,d.value=t.value,f.value=!1)},S=()=>{let e=t();e&&e.toUpperCase()!==_.value.toUpperCase()&&x(e)},T=()=>{let n=_.value;t()?.toUpperCase()!==n.toUpperCase()&&(f.value=!0,e.value=n,f.value=!1)};(0,c.watch)([s,l,d],()=>{f.value||T()}),(0,c.watch)(e,()=>{f.value||S()}),(0,c.onMounted)(()=>{(0,c.nextTick)(()=>{E(),D(),S()})});let E=()=>{h.value=n.value?.getBoundingClientRect()??null},D=()=>{g.value=r.value?.getBoundingClientRect()??null},O=(0,c.computed)(()=>{let e=h.value;return e?{transform:`translate3d(calc(${l.value*e.width}px - 50%), calc(${(1-d.value)*e.height}px - 50%), 0)`}:{}}),k=(0,c.computed)(()=>{let e=g.value;return e?{transform:`translate3d(-50%, calc(${s.value/360*e.height}px - 50%), 0)`}:{}}),A=()=>!i.value&&!a.value,j=e=>{let t=h.value;if(!t)return;let n=Math.max(0,Math.min(e.clientX-t.left,t.width)),r=Math.max(0,Math.min(e.clientY-t.top,t.height));b(n/t.width,1-r/t.height)},M=e=>{let t=g.value;t&&y(Math.max(0,Math.min(e.clientY-t.top,t.height))/t.height*360)},N=e=>{A()&&(E(),p.value=!0,j(e),e.currentTarget instanceof HTMLElement&&e.currentTarget.setPointerCapture(e.pointerId))},F=e=>{A()&&(D(),m.value=!0,M(e),e.currentTarget instanceof HTMLElement&&e.currentTarget.setPointerCapture(e.pointerId))},I=()=>{p.value=!1},L=()=>{m.value=!1};return(0,u.useEventListener)(n,`pointermove`,e=>{p.value&&j(e)}),(0,u.useEventListener)(n,`pointerup`,I),(0,u.useEventListener)(n,`pointercancel`,I),(0,u.useEventListener)(n,`lostpointercapture`,I),(0,u.useEventListener)(r,`pointermove`,e=>{m.value&&M(e)}),(0,u.useEventListener)(r,`pointerup`,L),(0,u.useEventListener)(r,`pointercancel`,L),(0,u.useEventListener)(r,`lostpointercapture`,L),{hexColor:_,hueBackground:v,saturationPointerStyle:O,huePointerStyle:k,handleSaturationPointerDown:N,handleHuePointerDown:F,syncFromModelValue:S}},I=e=>{if(!e)return null;let t=e.$el;if(!(t instanceof HTMLElement))return null;let n=t.querySelector(`.s-ui-color-swatch__fill`);return n instanceof HTMLElement?n:null},L={class:`s-ui-color-area__canvas-row`},R=[`aria-label`],z=[`aria-label`,`aria-disabled`],B=(0,c.defineComponent)({__name:`SColorArea`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1}},{modelValue:{required:!0},modelModifiers:{}}),emits:[`update:modelValue`],setup(e){let t=(0,c.useModel)(e,`modelValue`),{t:r}=(0,l.useUiKitI18n)(),i=(0,c.useTemplateRef)(`colorResolutionSwatchRef`),a=(0,c.useTemplateRef)(`saturationAreaRef`),o=(0,c.useTemplateRef)(`hueSliderRef`),s=()=>O(t.value,I(i.value)),u=(0,c.computed)(()=>n.a(t.value)),{hexColor:d,hueBackground:f,saturationPointerStyle:p,huePointerStyle:m,handleSaturationPointerDown:h,handleHuePointerDown:g}=F({modelValue:t,getEditableHex:s,saturationAreaRef:a,hueSliderRef:o,disabled:(0,c.toRef)(()=>e.disabled),readonly:(0,c.toRef)(()=>e.readonly)});return(t,n)=>((0,c.openBlock)(),(0,c.createElementBlock)(`div`,(0,c.mergeProps)({class:[`s-ui-color-area`,{"s-ui-color-area--disabled":e.disabled,"s-ui-color-area--readonly":e.readonly}]},t.$attrs),[(0,c.createVNode)((0,c.unref)(l.SColorSwatch),{ref_key:`colorResolutionSwatchRef`,ref:i,class:`s-ui-color-area__color-resolution`,color:u.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_24,tabindex:`-1`,"aria-hidden":`true`},null,8,[`color`,`size`]),(0,c.createElementVNode)(`div`,L,[(0,c.createElementVNode)(`div`,{ref_key:`saturationAreaRef`,ref:a,class:`s-ui-color-area__canvas`,role:`img`,"aria-label":(0,c.unref)(r)(`colorArea.saturationBrightness`),style:(0,c.normalizeStyle)({"--s-ui-color-area-hue":(0,c.unref)(f)}),onPointerdown:n[0]||=(...e)=>(0,c.unref)(h)&&(0,c.unref)(h)(...e)},[(0,c.createElementVNode)(`div`,{class:`s-ui-color-area__canvas-pointer`,style:(0,c.normalizeStyle)({...(0,c.unref)(p),backgroundColor:(0,c.unref)(d)})},null,4)],44,R),(0,c.createElementVNode)(`div`,{ref_key:`hueSliderRef`,ref:o,class:`s-ui-color-area__hue`,role:`slider`,"aria-label":(0,c.unref)(r)(`colorArea.hue`),"aria-valuemin":`0`,"aria-valuemax":`360`,"aria-disabled":e.disabled||e.readonly,onPointerdown:n[1]||=(...e)=>(0,c.unref)(g)&&(0,c.unref)(g)(...e)},[(0,c.createElementVNode)(`div`,{class:`s-ui-color-area__hue-pointer`,style:(0,c.normalizeStyle)({...(0,c.unref)(m),backgroundColor:(0,c.unref)(f)})},null,4)],40,z)])],16))}}),V={class:`s-ui-color-values__left`},H={class:`s-ui-color-values__format`},U={class:`s-ui-color-values__value-group`},W={class:`s-ui-color-values__inputs`},G={key:0,class:`s-ui-color-values__input-wrap`},K=[`disabled`,`readonly`,`aria-label`],q={class:`s-ui-color-values__input-wrap`},J=[`disabled`,`readonly`,`aria-label`],Y={class:`s-ui-color-values__input-wrap`},X=[`disabled`,`readonly`,`aria-label`],Z={class:`s-ui-color-values__input-wrap`},Q=[`disabled`,`readonly`,`aria-label`],$=(0,c.defineComponent)({__name:`SColorValues`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},formats:{default:()=>T}},{modelValue:{required:!0},modelModifiers:{},format:{default:t.o.HEX},formatModifiers:{}}),emits:(0,c.mergeModels)([`formatDropdownOpen`,`formatDropdownClose`],[`update:modelValue`,`update:format`]),setup(e,{emit:a}){let{t:o}=(0,l.useUiKitI18n)(),u=(0,c.useModel)(e,`modelValue`),d=(0,c.useModel)(e,`format`),f=a,p=(0,c.useTemplateRef)(`previewSwatchRef`),m=(0,c.ref)(``),h=(0,c.ref)(`0`),g=(0,c.ref)(`0`),_=(0,c.ref)(`0`),v=(0,c.computed)(()=>(e.formats.length>0?e.formats:T).map(e=>({value:e,label:E[e]}))),y=(0,c.computed)(()=>n.a(u.value)),b=(0,c.computed)(()=>O(u.value,I(p.value))),x=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.redChannel`):o(`colorValues.hueChannel`)),S=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.greenChannel`):o(`colorValues.saturationChannel`)),C=(0,c.computed)(()=>d.value===t.o.RGB?o(`colorValues.blueChannel`):o(`colorValues.lightnessChannel`)),w=()=>{let e=b.value;if(!e)return;let n=k(e,d.value);if(d.value===t.o.HEX&&typeof n==`string`){m.value=n;return}typeof n==`object`&&(h.value=String(n.first),g.value=String(n.second),_.value=String(n.third))};(0,c.watch)([u,d,b],()=>{w()}),(0,c.onMounted)(()=>{(0,c.nextTick)(()=>{w()})});let D=()=>{if(e.disabled||e.readonly)return;if(d.value===t.o.HEX){let e=j(t.o.HEX,m.value);e&&(u.value=e),w();return}let n=j(d.value,{first:Number.parseInt(h.value,10),second:Number.parseInt(g.value,10),third:Number.parseInt(_.value,10)});n&&(u.value=n),w()},A=e=>{e.key===`Enter`&&(e.preventDefault(),D())};return(n,a)=>((0,c.openBlock)(),(0,c.createElementBlock)(`div`,(0,c.mergeProps)({class:[`s-ui-color-values`,{"s-ui-color-values--disabled":e.disabled,"s-ui-color-values--readonly":e.readonly}]},n.$attrs),[(0,c.createElementVNode)(`div`,V,[(0,c.createVNode)((0,c.unref)(l.SColorSwatch),{ref_key:`previewSwatchRef`,ref:p,class:`s-ui-color-values__preview`,color:y.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,tabindex:`-1`,"aria-hidden":`true`},null,8,[`color`,`size`,`disabled`]),(0,c.createElementVNode)(`div`,H,[(0,c.createVNode)((0,c.unref)(s.t),{modelValue:d.value,"onUpdate:modelValue":a[0]||=e=>d.value=e,class:`s-ui-color-values__format-select`,options:v.value,disabled:e.disabled,readonly:e.readonly,bordered:!0,clearable:!1,"close-on-select":!0,"fit-viewport":!1,"aria-label":(0,c.unref)(o)(`colorValues.format`),onOpen:a[1]||=e=>f(`formatDropdownOpen`),onClose:a[2]||=e=>f(`formatDropdownClose`)},null,8,[`modelValue`,`options`,`disabled`,`readonly`,`aria-label`])])]),(0,c.createElementVNode)(`div`,U,[(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-values__pipette`,appearance:(0,c.unref)(r.t).BARE,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,icon:`pipette`,"aria-label":(0,c.unref)(o)(`colorValues.pickColor`),"aria-disabled":`true`,disabled:e.disabled,tabindex:`-1`},null,8,[`appearance`,`variant`,`size`,`aria-label`,`disabled`]),a[9]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,W,[d.value===(0,c.unref)(t.o).HEX?((0,c.openBlock)(),(0,c.createElementBlock)(`div`,G,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[3]||=e=>m.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`text`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":(0,c.unref)(o)(`colorValues.hexValue`),onBlur:D,onKeydown:A},null,40,K),[[c.vModelText,m.value]])])):((0,c.openBlock)(),(0,c.createElementBlock)(c.Fragment,{key:1},[(0,c.createElementVNode)(`div`,q,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[4]||=e=>h.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":x.value,onBlur:D,onKeydown:A},null,40,J),[[c.vModelText,h.value]])]),a[7]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,Y,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[5]||=e=>g.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":S.value,onBlur:D,onKeydown:A},null,40,X),[[c.vModelText,g.value]])]),a[8]||=(0,c.createElementVNode)(`span`,{class:`s-ui-color-values__separator`,"aria-hidden":`true`},null,-1),(0,c.createElementVNode)(`div`,Z,[(0,c.withDirectives)((0,c.createElementVNode)(`input`,{"onUpdate:modelValue":a[6]||=e=>_.value=e,class:`s-ui-color-values__input s-ui-typography-body-14-regular`,type:`text`,inputmode:`numeric`,spellcheck:`false`,disabled:e.disabled,readonly:e.readonly,"aria-label":C.value,onBlur:D,onKeydown:A},null,40,Q),[[c.vModelText,_.value]])])],64))])])],16))}}),ee={class:`s-ui-color-picker__section`},te={class:`s-ui-color-picker__label`},ne={class:`s-ui-color-picker__section`},re={class:`s-ui-color-picker__label`},ie={class:`s-ui-color-picker__custom-editor`},ae={class:`s-ui-color-picker__custom-actions`},oe=(0,c.defineComponent)({__name:`SColorPicker`,props:(0,c.mergeModels)({disabled:{type:Boolean,default:!1},recommendedColors:{},recentColors:{default:()=>[]}},{modelValue:{},modelModifiers:{}}),emits:(0,c.mergeModels)([`select`,`customEditorOpen`,`customEditorClose`,`formatDropdownOpen`,`formatDropdownClose`],[`update:modelValue`]),setup(e,{emit:n}){let u=(0,c.useModel)(e,`modelValue`),d=n,{t:f}=(0,l.useUiKitI18n)(),p=(0,c.ref)(!1),m=(0,c.ref)(`#526DE3`),h=(0,c.ref)(t.o.HEX),g=(0,c.computed)(()=>e.recommendedColors&&e.recommendedColors.length>0?e.recommendedColors:t.r),_=(0,c.computed)(()=>e.recentColors.length<=17?e.recentColors:e.recentColors.slice(0,17)),v=()=>{if(u.value){m.value=u.value;return}m.value=`#526DE3`},y=e=>{d(`select`,e)},b=()=>{u.value=m.value,d(`select`,m.value),p.value=!1},x=()=>{p.value=!1};return(0,c.watch)(p,(e,t)=>{if(e&&!t){v(),d(`customEditorOpen`);return}!e&&t&&d(`customEditorClose`)}),(n,v)=>((0,c.openBlock)(),(0,c.createBlock)((0,c.unref)(s.r),(0,c.mergeProps)({width:336},n.$attrs),{default:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,{class:(0,c.normalizeClass)([`s-ui-color-picker`,{"s-ui-color-picker--disabled":e.disabled}])},[(0,c.createElementVNode)(`section`,ee,[(0,c.createElementVNode)(`span`,te,(0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.recommendedColors`)),1),(0,c.createVNode)((0,c.unref)(t.t),{modelValue:u.value,"onUpdate:modelValue":v[0]||=e=>u.value=e,class:`s-ui-color-picker__palette`,layout:(0,c.unref)(t.n).GRID,colors:g.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,onSelect:y},null,8,[`modelValue`,`layout`,`colors`,`size`,`disabled`])]),(0,c.createElementVNode)(`section`,ne,[(0,c.createElementVNode)(`span`,re,(0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.recentColors`)),1),(0,c.createVNode)((0,c.unref)(t.t),{modelValue:u.value,"onUpdate:modelValue":v[7]||=e=>u.value=e,class:`s-ui-color-picker__palette`,layout:(0,c.unref)(t.n).ROW,colors:_.value,size:(0,c.unref)(l.ESColorSwatchSize).SIZE_32,disabled:e.disabled,onSelect:y},{append:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(o.t),{modelValue:p.value,"onUpdate:modelValue":v[6]||=e=>p.value=e,placement:(0,c.unref)(a.i).RIGHT_START,offset:8,shift:!0,flip:!0,disabled:e.disabled,"dismiss-on-click-outside":!0,"dismiss-on-escape":!0},{trigger:(0,c.withCtx)(({toggle:t,triggerProps:n})=>[(0,c.createVNode)((0,c.unref)(i.t),(0,c.mergeProps)(n,{class:`s-ui-color-picker__add-button`,appearance:(0,c.unref)(r.t).OUTLINED,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,icon:`plus`,"aria-label":(0,c.unref)(f)(`colorPicker.addCustomColor`),disabled:e.disabled,onClick:t}),null,16,[`appearance`,`variant`,`size`,`aria-label`,`disabled`,`onClick`])]),content:(0,c.withCtx)(()=>[(0,c.createVNode)((0,c.unref)(s.r),{width:320},{footer:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,ae,[(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-picker__save-button`,appearance:(0,c.unref)(r.t).MAJOR,variant:(0,c.unref)(r.r).MAIN,size:(0,c.unref)(r.n).SMALL,disabled:e.disabled,onClick:b},{default:(0,c.withCtx)(()=>[(0,c.createTextVNode)((0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.save`)),1)]),_:1},8,[`appearance`,`variant`,`size`,`disabled`]),(0,c.createVNode)((0,c.unref)(i.t),{class:`s-ui-color-picker__cancel-button`,appearance:(0,c.unref)(r.t).MINOR,variant:(0,c.unref)(r.r).NEUTRAL,size:(0,c.unref)(r.n).SMALL,disabled:e.disabled,onClick:x},{default:(0,c.withCtx)(()=>[(0,c.createTextVNode)((0,c.toDisplayString)((0,c.unref)(f)(`colorPicker.cancel`)),1)]),_:1},8,[`appearance`,`variant`,`size`,`disabled`])])]),default:(0,c.withCtx)(()=>[(0,c.createElementVNode)(`div`,ie,[(0,c.createVNode)(B,{modelValue:m.value,"onUpdate:modelValue":v[1]||=e=>m.value=e,disabled:e.disabled},null,8,[`modelValue`,`disabled`]),(0,c.createVNode)($,{modelValue:m.value,"onUpdate:modelValue":v[2]||=e=>m.value=e,format:h.value,"onUpdate:format":v[3]||=e=>h.value=e,disabled:e.disabled,onFormatDropdownOpen:v[4]||=e=>d(`formatDropdownOpen`),onFormatDropdownClose:v[5]||=e=>d(`formatDropdownClose`)},null,8,[`modelValue`,`format`,`disabled`])])]),_:1})]),_:1},8,[`modelValue`,`placement`,`disabled`])]),_:1},8,[`modelValue`,`layout`,`colors`,`size`,`disabled`])])],2)]),_:1},16))}});Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return M}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return $}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return B}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return oe}});
|
|
@@ -5,7 +5,7 @@ import { n as s, r as c, t as l } from "./SButton.types-CpdHQtyx.js";
|
|
|
5
5
|
import { t as u } from "./SButton-DnU_XZ1C.js";
|
|
6
6
|
import { i as d } from "./useFloatingOverlay-QcumEYEq.js";
|
|
7
7
|
import { t as f } from "./SDropdown-CTQ5Qlez.js";
|
|
8
|
-
import { r as p, t as m } from "./SSelect-
|
|
8
|
+
import { r as p, t as m } from "./SSelect-pXiw_NyB.js";
|
|
9
9
|
import { Fragment as h, computed as g, createBlock as _, createElementBlock as v, createElementVNode as y, createTextVNode as b, createVNode as x, defineComponent as S, mergeModels as C, mergeProps as w, nextTick as T, normalizeClass as E, normalizeStyle as D, onMounted as O, openBlock as k, ref as A, shallowRef as j, toDisplayString as M, toRef as N, unref as P, useModel as F, useTemplateRef as I, vModelText as L, watch as R, withCtx as z, withDirectives as B } from "vue";
|
|
10
10
|
import { ESColorSwatchSize as V, SColorSwatch as ee, useUiKitI18n as H } from "@shtabapp/ui-kit-primitives";
|
|
11
11
|
import { useEventListener as U } from "@vueuse/core";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const e=require("./SButton.types-UKroD-ev.cjs"),t=require("./SButton-C-z_q5CG.cjs"),n=require("./SInlineMessage-gjkMiE-W.cjs"),r=require("./SLabel-CTiOAAOu.cjs"),i=require("./useFieldMessages-CzjU0ajM.cjs");let a=require("vue"),o=require("@shtabapp/ui-kit-primitives");var s=function(e){return e.NONE=`none`,e.HORIZONTAL=`horizontal`,e.VERTICAL=`vertical`,e}({}),c=[`inert`,`aria-disabled`],l={key:0,class:`s-ui-input__prepend`},u={class:`s-ui-input__row`},d={key:0,class:`s-ui-input__prefix`},f=[`id`,`type`,`name`,`placeholder`,`disabled`,`readonly`,`autocomplete`],p={key:0,class:`s-ui-input__inline`},m={key:1,class:`s-ui-input__clear`},h={key:2,class:`s-ui-input__action`},g={key:1,class:`s-ui-input__messages`},_=16,v=(0,a.defineComponent)({inheritAttrs:!1,__name:`SInput`,props:(0,a.mergeModels)({label:{},labelProps:{},placeholder:{},helpMessages:{},errorMessages:{},bordered:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},clearable:{type:Boolean,default:!1},hasValue:{type:Boolean},focused:{type:Boolean,default:!1},iconLeft:{},iconRight:{},customize:{default:()=>s.NONE},name:{},type:{default:`text`},id:{},autocomplete:{}},{modelValue:{default:``},modelModifiers:{}}),emits:(0,a.mergeModels)([`clear`,`focus`,`blur`],[`update:modelValue`]),setup(v,{expose:y,emit:b}){let x=(0,a.useModel)(v,`modelValue`),{t:S}=(0,o.useUiKitI18n)(),C=b,w=(0,a.useAttrs)(),T=(0,a.useSlots)(),E=(0,a.useId)(),D=(0,a.useTemplateRef)(`fieldElementRef`),O=(0,a.useTemplateRef)(`inputElementRef`),{isFocused:k,handleFocus:A,handleFocusOut:j}=i.n({isDisabled:()=>v.disabled,blurField:()=>X(),emitFocus:e=>C(`focus`,e),emitBlur:e=>C(`blur`,e)}),{normalizedHelpMessages:M,normalizedErrorMessages:N,hasErrorMessages:P,hasHelpMessages:F}=i.t(()=>v.helpMessages,()=>v.errorMessages),I=(0,a.computed)(()=>v.id?v.id:E),L=(0,a.computed)(()=>!!(v.label||T.label)),R=(0,a.computed)(()=>!!(v.iconLeft||T.prefix)),z=(0,a.computed)(()=>v.customize===s.VERTICAL&&!!T.prepend),B=(0,a.computed)(()=>v.customize===s.HORIZONTAL&&!!T.prepend),V=(0,a.computed)(()=>!v.clearable||v.disabled||v.readonly?!1:G.value),H=(0,a.computed)(()=>{if(!k.value)return-1}),U=(0,a.computed)(()=>!!(v.iconRight||T.action)),W=(0,a.computed)(()=>!!T.message||F.value||P.value),G=(0,a.computed)(()=>v.hasValue===void 0?x.value.length>0:v.hasValue),K=(0,a.computed)(()=>({"s-ui-input--disabled":v.disabled,"s-ui-input--readonly":v.readonly})),q=(0,a.computed)(()=>[{"s-ui-input__field--bordered":v.bordered,"s-ui-input__field--borderless":!v.bordered,"s-ui-input__field--disabled":v.disabled,"s-ui-input__field--readonly":v.readonly,"s-ui-input__field--error":P.value,"s-ui-input__field--filled":G.value,"s-ui-input__field--vertical":v.customize===s.VERTICAL,"s-ui-input__field--focused":k.value||v.focused}]),J=e=>{let t=D.value;t&&t.querySelector(`.s-ui-input__control, .s-ui-select__control, .s-ui-select__search-input, [tabindex]:not([tabindex="-1"])`)?.focus(e)},Y=e=>{if(T.control){J(e);return}O.value?.focus(e)},X=()=>{if(T.control){let e=document.activeElement;e instanceof HTMLElement&&D.value?.contains(e)&&e.blur();return}O.value?.blur()},Z=e=>{v.disabled||v.readonly||e.target instanceof HTMLElement&&(e.target.closest(`.s-ui-input__prepend, .s-ui-input__inline, .s-ui-input__clear, .s-ui-input__action`)||Y())},Q=()=>{x.value=``,C(`clear`),Y()};return y({blur:X,focus:Y,fieldElementRef:D,inputElementRef:O}),(i,y)=>((0,a.openBlock)(),(0,a.createElementBlock)(`div`,{class:(0,a.normalizeClass)([`s-ui-input`,K.value])},[L.value?((0,a.openBlock)(),(0,a.createBlock)((0,a.unref)(r.t),(0,a.mergeProps)({key:0},v.labelProps,{"html-for":I.value}),{default:(0,a.withCtx)(()=>[(0,a.renderSlot)(i.$slots,`label`,{},()=>[(0,a.createTextVNode)((0,a.toDisplayString)(v.label),1)])]),_:3},16,[`html-for`])):(0,a.createCommentVNode)(``,!0),(0,a.createElementVNode)(`div`,{ref_key:`fieldElementRef`,ref:D,class:(0,a.normalizeClass)([`s-ui-input__field`,q.value]),inert:v.disabled?!0:void 0,"aria-disabled":v.disabled?!0:void 0,onClick:y[2]||=e=>Z(e),onFocusout:y[3]||=(...e)=>(0,a.unref)(j)&&(0,a.unref)(j)(...e)},[z.value?((0,a.openBlock)(),(0,a.createElementBlock)(`div`,l,[(0,a.renderSlot)(i.$slots,`prepend`,{disabled:v.disabled})])):(0,a.createCommentVNode)(``,!0),(0,a.createElementVNode)(`div`,u,[R.value?((0,a.openBlock)(),(0,a.createElementBlock)(`span`,d,[(0,a.renderSlot)(i.$slots,`prefix`,{disabled:v.disabled},()=>[v.iconLeft?((0,a.openBlock)(),(0,a.createBlock)((0,a.unref)(o.SIcon),{key:0,name:v.iconLeft,size:_},null,8,[`name`])):(0,a.createCommentVNode)(``,!0)])])):(0,a.createCommentVNode)(``,!0),(0,a.createElementVNode)(`div`,{class:(0,a.normalizeClass)([`s-ui-input__control-wrap`,{"s-ui-input__control-wrap--horizontal":v.customize===(0,a.unref)(s).HORIZONTAL}])},[(0,a.renderSlot)(i.$slots,`control`,{disabled:v.disabled},()=>[(0,a.withDirectives)((0,a.createElementVNode)(`input`,(0,a.mergeProps)({id:I.value,ref_key:`inputElementRef`,ref:O,"onUpdate:modelValue":y[0]||=e=>x.value=e,class:`s-ui-input__control s-ui-typography-body-14-regular`,type:v.type,name:v.name,placeholder:v.placeholder,disabled:v.disabled,readonly:v.readonly,autocomplete:v.autocomplete},(0,a.unref)(w),{onFocus:y[1]||=(...e)=>(0,a.unref)(A)&&(0,a.unref)(A)(...e)}),null,16,f),[[a.vModelDynamic,x.value]])]),B.value?((0,a.openBlock)(),(0,a.createElementBlock)(`div`,p,[(0,a.renderSlot)(i.$slots,`prepend`,{disabled:v.disabled})])):(0,a.createCommentVNode)(``,!0)],2),V.value?((0,a.openBlock)(),(0,a.createElementBlock)(`span`,m,[(0,a.createVNode)((0,a.unref)(t.t),{appearance:(0,a.unref)(e.t).BARE,variant:(0,a.unref)(e.r).NEUTRAL,size:(0,a.unref)(e.n).SMALL,icon:`closeMini`,"aria-label":(0,a.unref)(S)(`input.clear`),tabindex:H.value,onClick:(0,a.withModifiers)(Q,[`stop`])},null,8,[`appearance`,`variant`,`size`,`aria-label`,`tabindex`])])):(0,a.createCommentVNode)(``,!0),U.value?((0,a.openBlock)(),(0,a.createElementBlock)(`span`,h,[(0,a.renderSlot)(i.$slots,`action`,{disabled:v.disabled},()=>[v.iconRight?((0,a.openBlock)(),(0,a.createBlock)((0,a.unref)(t.t),{key:0,appearance:(0,a.unref)(e.t).BARE,variant:(0,a.unref)(e.r).NEUTRAL,size:(0,a.unref)(e.n).SMALL,disabled:v.disabled,icon:v.iconRight,tabindex:-1},null,8,[`appearance`,`variant`,`size`,`disabled`,`icon`])):(0,a.createCommentVNode)(``,!0)])])):(0,a.createCommentVNode)(``,!0)])],42,c),W.value?((0,a.openBlock)(),(0,a.createElementBlock)(`div`,g,[(0,a.renderSlot)(i.$slots,`message`,{},()=>[((0,a.openBlock)(!0),(0,a.createElementBlock)(a.Fragment,null,(0,a.renderList)((0,a.unref)(M),(e,t)=>((0,a.openBlock)(),(0,a.createBlock)((0,a.unref)(n.t),{key:`help-${t}`,message:e},null,8,[`message`]))),128)),((0,a.openBlock)(!0),(0,a.createElementBlock)(a.Fragment,null,(0,a.renderList)((0,a.unref)(N),(e,t)=>((0,a.openBlock)(),(0,a.createBlock)((0,a.unref)(n.t),{key:`error-${t}`,message:e,"validation-status":(0,a.unref)(n.n).ERROR},null,8,[`message`,`validation-status`]))),128))])])):(0,a.createCommentVNode)(``,!0)],2))}});Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return v}});
|
|
@@ -8,13 +8,13 @@ import { SIcon as le, useUiKitI18n as ue } from "@shtabapp/ui-kit-primitives";
|
|
|
8
8
|
//#region src/components/SInput/SInput.types.ts
|
|
9
9
|
var E = /* @__PURE__ */ function(e) {
|
|
10
10
|
return e.NONE = "none", e.HORIZONTAL = "horizontal", e.VERTICAL = "vertical", e;
|
|
11
|
-
}({}),
|
|
11
|
+
}({}), de = ["inert", "aria-disabled"], D = {
|
|
12
12
|
key: 0,
|
|
13
13
|
class: "s-ui-input__prepend"
|
|
14
|
-
},
|
|
14
|
+
}, O = { class: "s-ui-input__row" }, k = {
|
|
15
15
|
key: 0,
|
|
16
16
|
class: "s-ui-input__prefix"
|
|
17
|
-
},
|
|
17
|
+
}, A = [
|
|
18
18
|
"id",
|
|
19
19
|
"type",
|
|
20
20
|
"name",
|
|
@@ -22,19 +22,19 @@ var E = /* @__PURE__ */ function(e) {
|
|
|
22
22
|
"disabled",
|
|
23
23
|
"readonly",
|
|
24
24
|
"autocomplete"
|
|
25
|
-
],
|
|
25
|
+
], j = {
|
|
26
26
|
key: 0,
|
|
27
27
|
class: "s-ui-input__inline"
|
|
28
|
-
},
|
|
28
|
+
}, M = {
|
|
29
29
|
key: 1,
|
|
30
30
|
class: "s-ui-input__clear"
|
|
31
|
-
},
|
|
31
|
+
}, N = {
|
|
32
32
|
key: 2,
|
|
33
33
|
class: "s-ui-input__action"
|
|
34
|
-
},
|
|
34
|
+
}, P = {
|
|
35
35
|
key: 1,
|
|
36
36
|
class: "s-ui-input__messages"
|
|
37
|
-
},
|
|
37
|
+
}, F = 16, I = /* @__PURE__ */ h({
|
|
38
38
|
inheritAttrs: !1,
|
|
39
39
|
__name: "SInput",
|
|
40
40
|
props: /*@__PURE__*/ g({
|
|
@@ -80,15 +80,15 @@ var E = /* @__PURE__ */ function(e) {
|
|
|
80
80
|
"focus",
|
|
81
81
|
"blur"
|
|
82
82
|
], ["update:modelValue"]),
|
|
83
|
-
setup(h, { expose: g, emit:
|
|
84
|
-
let
|
|
83
|
+
setup(h, { expose: g, emit: I }) {
|
|
84
|
+
let L = re(h, "modelValue"), { t: R } = ue(), z = I, B = w(), V = ie(), H = ne(), U = T("fieldElementRef"), W = T("inputElementRef"), { isFocused: G, handleFocus: K, handleFocusOut: q } = a({
|
|
85
85
|
isDisabled: () => h.disabled,
|
|
86
86
|
blurField: () => $(),
|
|
87
|
-
emitFocus: (e) =>
|
|
88
|
-
emitBlur: (e) =>
|
|
89
|
-
}), { normalizedHelpMessages:
|
|
90
|
-
if (!
|
|
91
|
-
}),
|
|
87
|
+
emitFocus: (e) => z("focus", e),
|
|
88
|
+
emitBlur: (e) => z("blur", e)
|
|
89
|
+
}), { normalizedHelpMessages: fe, normalizedErrorMessages: pe, hasErrorMessages: J, hasHelpMessages: me } = o(() => h.helpMessages, () => h.errorMessages), Y = c(() => h.id ? h.id : H), he = c(() => !!(h.label || V.label)), ge = c(() => !!(h.iconLeft || V.prefix)), _e = c(() => h.customize === E.VERTICAL && !!V.prepend), ve = c(() => h.customize === E.HORIZONTAL && !!V.prepend), ye = c(() => !h.clearable || h.disabled || h.readonly ? !1 : X.value), be = c(() => {
|
|
90
|
+
if (!G.value) return -1;
|
|
91
|
+
}), xe = c(() => !!(h.iconRight || V.action)), Se = c(() => !!V.message || me.value || J.value), X = c(() => h.hasValue === void 0 ? L.value.length > 0 : h.hasValue), Z = c(() => ({
|
|
92
92
|
"s-ui-input--disabled": h.disabled,
|
|
93
93
|
"s-ui-input--readonly": h.readonly
|
|
94
94
|
})), Ce = c(() => [{
|
|
@@ -96,60 +96,60 @@ var E = /* @__PURE__ */ function(e) {
|
|
|
96
96
|
"s-ui-input__field--borderless": !h.bordered,
|
|
97
97
|
"s-ui-input__field--disabled": h.disabled,
|
|
98
98
|
"s-ui-input__field--readonly": h.readonly,
|
|
99
|
-
"s-ui-input__field--error":
|
|
100
|
-
"s-ui-input__field--filled":
|
|
99
|
+
"s-ui-input__field--error": J.value,
|
|
100
|
+
"s-ui-input__field--filled": X.value,
|
|
101
101
|
"s-ui-input__field--vertical": h.customize === E.VERTICAL,
|
|
102
|
-
"s-ui-input__field--focused":
|
|
102
|
+
"s-ui-input__field--focused": G.value || h.focused
|
|
103
103
|
}]), we = (e) => {
|
|
104
|
-
let t =
|
|
104
|
+
let t = U.value;
|
|
105
105
|
t && t.querySelector(".s-ui-input__control, .s-ui-select__control, .s-ui-select__search-input, [tabindex]:not([tabindex=\"-1\"])")?.focus(e);
|
|
106
106
|
}, Q = (e) => {
|
|
107
|
-
if (
|
|
107
|
+
if (V.control) {
|
|
108
108
|
we(e);
|
|
109
109
|
return;
|
|
110
110
|
}
|
|
111
|
-
|
|
111
|
+
W.value?.focus(e);
|
|
112
112
|
}, $ = () => {
|
|
113
|
-
if (
|
|
113
|
+
if (V.control) {
|
|
114
114
|
let e = document.activeElement;
|
|
115
|
-
e instanceof HTMLElement &&
|
|
115
|
+
e instanceof HTMLElement && U.value?.contains(e) && e.blur();
|
|
116
116
|
return;
|
|
117
117
|
}
|
|
118
|
-
|
|
118
|
+
W.value?.blur();
|
|
119
119
|
}, Te = (e) => {
|
|
120
120
|
h.disabled || h.readonly || e.target instanceof HTMLElement && (e.target.closest(".s-ui-input__prepend, .s-ui-input__inline, .s-ui-input__clear, .s-ui-input__action") || Q());
|
|
121
121
|
}, Ee = () => {
|
|
122
|
-
|
|
122
|
+
L.value = "", z("clear"), Q();
|
|
123
123
|
};
|
|
124
124
|
return g({
|
|
125
125
|
blur: $,
|
|
126
126
|
focus: Q,
|
|
127
|
-
fieldElementRef:
|
|
128
|
-
inputElementRef:
|
|
127
|
+
fieldElementRef: U,
|
|
128
|
+
inputElementRef: W
|
|
129
129
|
}), (a, o) => (y(), d("div", { class: v(["s-ui-input", Z.value]) }, [
|
|
130
|
-
|
|
130
|
+
he.value ? (y(), l(C(te), _({ key: 0 }, h.labelProps, { "html-for": Y.value }), {
|
|
131
131
|
default: oe(() => [x(a.$slots, "label", {}, () => [p(S(h.label), 1)])]),
|
|
132
132
|
_: 3
|
|
133
133
|
}, 16, ["html-for"])) : u("", !0),
|
|
134
134
|
f("div", {
|
|
135
135
|
ref_key: "fieldElementRef",
|
|
136
|
-
ref:
|
|
136
|
+
ref: U,
|
|
137
137
|
class: v(["s-ui-input__field", Ce.value]),
|
|
138
138
|
inert: h.disabled ? !0 : void 0,
|
|
139
139
|
"aria-disabled": h.disabled ? !0 : void 0,
|
|
140
140
|
onClick: o[2] ||= (e) => Te(e),
|
|
141
|
-
onFocusout: o[3] ||= (...e) => C(
|
|
142
|
-
}, [
|
|
143
|
-
|
|
141
|
+
onFocusout: o[3] ||= (...e) => C(q) && C(q)(...e)
|
|
142
|
+
}, [_e.value ? (y(), d("div", D, [x(a.$slots, "prepend", { disabled: h.disabled })])) : u("", !0), f("div", O, [
|
|
143
|
+
ge.value ? (y(), d("span", k, [x(a.$slots, "prefix", { disabled: h.disabled }, () => [h.iconLeft ? (y(), l(C(le), {
|
|
144
144
|
key: 0,
|
|
145
145
|
name: h.iconLeft,
|
|
146
|
-
size:
|
|
146
|
+
size: F
|
|
147
147
|
}, null, 8, ["name"])) : u("", !0)])])) : u("", !0),
|
|
148
148
|
f("div", { class: v(["s-ui-input__control-wrap", { "s-ui-input__control-wrap--horizontal": h.customize === C(E).HORIZONTAL }]) }, [x(a.$slots, "control", { disabled: h.disabled }, () => [se(f("input", _({
|
|
149
|
-
id:
|
|
149
|
+
id: Y.value,
|
|
150
150
|
ref_key: "inputElementRef",
|
|
151
|
-
ref:
|
|
152
|
-
"onUpdate:modelValue": o[0] ||= (e) =>
|
|
151
|
+
ref: W,
|
|
152
|
+
"onUpdate:modelValue": o[0] ||= (e) => L.value = e,
|
|
153
153
|
class: "s-ui-input__control s-ui-typography-body-14-regular",
|
|
154
154
|
type: h.type,
|
|
155
155
|
name: h.name,
|
|
@@ -157,14 +157,14 @@ var E = /* @__PURE__ */ function(e) {
|
|
|
157
157
|
disabled: h.disabled,
|
|
158
158
|
readonly: h.readonly,
|
|
159
159
|
autocomplete: h.autocomplete
|
|
160
|
-
}, C(
|
|
161
|
-
|
|
160
|
+
}, C(B), { onFocus: o[1] ||= (...e) => C(K) && C(K)(...e) }), null, 16, A), [[ae, L.value]])]), ve.value ? (y(), d("div", j, [x(a.$slots, "prepend", { disabled: h.disabled })])) : u("", !0)], 2),
|
|
161
|
+
ye.value ? (y(), d("span", M, [m(C(r), {
|
|
162
162
|
appearance: C(n).BARE,
|
|
163
163
|
variant: C(t).NEUTRAL,
|
|
164
164
|
size: C(e).SMALL,
|
|
165
165
|
icon: "closeMini",
|
|
166
|
-
"aria-label": C(
|
|
167
|
-
tabindex:
|
|
166
|
+
"aria-label": C(R)("input.clear"),
|
|
167
|
+
tabindex: be.value,
|
|
168
168
|
onClick: ce(Ee, ["stop"])
|
|
169
169
|
}, null, 8, [
|
|
170
170
|
"appearance",
|
|
@@ -173,7 +173,7 @@ var E = /* @__PURE__ */ function(e) {
|
|
|
173
173
|
"aria-label",
|
|
174
174
|
"tabindex"
|
|
175
175
|
])])) : u("", !0),
|
|
176
|
-
|
|
176
|
+
xe.value ? (y(), d("span", N, [x(a.$slots, "action", { disabled: h.disabled }, () => [h.iconRight ? (y(), l(C(r), {
|
|
177
177
|
key: 0,
|
|
178
178
|
appearance: C(n).BARE,
|
|
179
179
|
variant: C(t).NEUTRAL,
|
|
@@ -188,11 +188,11 @@ var E = /* @__PURE__ */ function(e) {
|
|
|
188
188
|
"disabled",
|
|
189
189
|
"icon"
|
|
190
190
|
])) : u("", !0)])])) : u("", !0)
|
|
191
|
-
])], 42,
|
|
192
|
-
|
|
191
|
+
])], 42, de),
|
|
192
|
+
Se.value ? (y(), d("div", P, [x(a.$slots, "message", {}, () => [(y(!0), d(s, null, b(C(fe), (e, t) => (y(), l(C(i), {
|
|
193
193
|
key: `help-${t}`,
|
|
194
194
|
message: e
|
|
195
|
-
}, null, 8, ["message"]))), 128)), (y(!0), d(s, null, b(C(
|
|
195
|
+
}, null, 8, ["message"]))), 128)), (y(!0), d(s, null, b(C(pe), (e, t) => (y(), l(C(i), {
|
|
196
196
|
key: `error-${t}`,
|
|
197
197
|
message: e,
|
|
198
198
|
"validation-status": C(ee).ERROR
|
|
@@ -201,4 +201,4 @@ var E = /* @__PURE__ */ function(e) {
|
|
|
201
201
|
}
|
|
202
202
|
});
|
|
203
203
|
//#endregion
|
|
204
|
-
export { E as n,
|
|
204
|
+
export { E as n, I as t };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { n as e, o as t, r as n, t as r } from "./useSelectionGroup-cKj38lEN.js";
|
|
2
|
-
import { r as i, t as a } from "./SListItem-
|
|
2
|
+
import { r as i, t as a } from "./SListItem-DJ8uSadf.js";
|
|
3
3
|
import { Fragment as o, computed as s, createBlock as c, createElementBlock as l, createElementVNode as u, createSlots as d, createVNode as f, defineComponent as p, mergeModels as m, mergeProps as h, nextTick as ee, normalizeClass as g, normalizeStyle as _, openBlock as v, provide as te, renderList as ne, renderSlot as y, toValue as b, unref as x, useId as re, useModel as S, useSlots as ie, useTemplateRef as ae, withCtx as C } from "vue";
|
|
4
4
|
import { ESIconName as w, SSpinner as oe, useUiKitI18n as se } from "@shtabapp/ui-kit-primitives";
|
|
5
5
|
import { useInfiniteScroll as T } from "@vueuse/core";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require("./useSelectionGroup-TaektE-I.cjs"),t=require("./SListItem-CdveotJe.cjs");let n=require("vue"),r=require("@shtabapp/ui-kit-primitives"),i=require("@vueuse/core"),a=require("@tanstack/vue-virtual");var o=(e,t)=>{if(typeof t==`function`)return t(e);let n=e[t];return typeof n==`string`?n:typeof n==`number`?String(n):``},s=(e,t)=>{let n=e[t];return Array.isArray(n)?n.filter(e=>typeof e==`object`&&!!e):[]},c=(e,t)=>{if(!t)return!1;let n=e[t];return typeof n==`boolean`?n:!1},l=`__s-ui-load-more:`,u=e=>`${l}${e}`,d=(e,t,n,r)=>{s(e,n).forEach(e=>{let i=o(e,t);i&&r.add(i),d(e,t,n,r)})},f=(e,t,n,r)=>{for(let i of e){if(o(i,n)===t)return i;let e=f(s(i,r),t,n,r);if(e)return e}},p=(e,t,n,r,i,a,l,d)=>{e.forEach(e=>{let f=o(e,t);if(!f)return;let m=s(e,n),h=m.length>0,g=r.includes(f);l.push({key:f,item:e,depth:i,flatIndex:l.length,hasChildren:h,expanded:g,parentKey:a}),h&&g&&p(m,t,n,r,i+1,f,l,d),h&&g&&c(e,d)&&l.push({key:u(f),item:e,depth:i+1,flatIndex:l.length,hasChildren:!1,expanded:!1,parentKey:f,loadMoreForKey:f})})},m=({items:e,childrenKey:t,itemKey:r,expanded:i,hasMoreChildrenKey:a})=>({flatRows:(0,n.computed)(()=>{let o=[],s=(0,n.toValue)(e),c=(0,n.toValue)(t),l=(0,n.toValue)(r),u=(0,n.toValue)(a);return p(s,l,c,i.value,0,void 0,o,u),o}),toggleExpanded:a=>{let o=(0,n.toValue)(e),s=(0,n.toValue)(t),c=(0,n.toValue)(r),l=new Set(i.value);if(l.has(a)){l.delete(a);let e=f(o,a,c,s);if(e){let t=new Set;d(e,c,s,t),t.forEach(e=>{l.delete(e)})}}else l.add(a);i.value=[...l]},isExpanded:e=>i.value.includes(e)}),h=(e,t)=>(0,i.useInfiniteScroll)(e,()=>{t.onEndReached()},{distance:(0,n.toValue)(t.distance),canLoadMore:()=>t.canLoadMore===void 0?!0:(0,n.toValue)(t.canLoadMore),direction:`bottom`}),g=function(e){return e.NONE=`none`,e.TWO_X_SMALL=`2x-small`,e.X_SMALL=`x-small`,e.SMALL=`small`,e.MEDIUM=`medium`,e.X_MEDIUM=`x-medium`,e.LARGE=`large`,e.X_LARGE=`x-large`,e.TWO_X_LARGE=`2x-large`,e}({}),_=g.TWO_X_SMALL,ee={[g.NONE]:`var(--s-ui-space-gap-none)`,[g.TWO_X_SMALL]:`var(--s-ui-space-gap-2x-small)`,[g.X_SMALL]:`var(--s-ui-space-gap-x-small)`,[g.SMALL]:`var(--s-ui-space-gap-small)`,[g.MEDIUM]:`var(--s-ui-space-gap-medium)`,[g.X_MEDIUM]:`var(--s-ui-space-gap-x-medium)`,[g.LARGE]:`var(--s-ui-space-gap-large)`,[g.X_LARGE]:`var(--s-ui-space-gap-x-large)`,[g.TWO_X_LARGE]:`var(--s-ui-space-gap-2x-large)`},te={[g.NONE]:0,[g.TWO_X_SMALL]:2,[g.X_SMALL]:4,[g.SMALL]:8,[g.MEDIUM]:12,[g.X_MEDIUM]:16,[g.LARGE]:20,[g.X_LARGE]:24,[g.TWO_X_LARGE]:32},ne=(e,t)=>`s-ui-list-option-${e}-${t}`,v=(e,t)=>{let n=e[t];if(typeof n==`string`)return n},y=(e,t)=>{let n=e[t];return typeof n==`boolean`?n:!1},b=e=>e in r.ESIconName,x=(e,t)=>{let n=e[t];if(typeof n==`string`&&n.length>0&&b(n))return n},S=(e,t)=>typeof t==`string`&&t?t:Array.isArray(t)&&t[0]?t[0]:e,re=e=>e.some(e=>e.hasChildren||e.parentKey),C=(e,t,n)=>{if(!e.hasChildren)return null;if(!e.expanded)return{type:`expand`,rowKey:t};let r=n.find(e=>e.parentKey===t);return r?{type:`select`,rowKey:r.key}:null},w=(e,t)=>e.hasChildren&&e.expanded?{type:`collapse`,rowKey:t}:e.parentKey?{type:`select`,rowKey:e.parentKey}:null,T=(e,t,n)=>{let r=n.find(e=>e.key===t);return r?e===`ArrowRight`?C(r,t,n):w(r,t):null},E=(e,t,n,r)=>{for(let i=t;i>=0&&i<e.length;i+=n){let t=e[i];if(t&&t.depth<=r)return t.key}return null},ie=(e,t,n)=>{let r=n.findIndex(e=>e.key===t);if(r===-1)return null;let i=n[r];if(!i)return null;let a=e===`ArrowDown`?1:-1;return E(n,r+a,a,i.depth)},ae=[`role`,`aria-multiselectable`],oe=[`aria-multiselectable`,`aria-activedescendant`,`tabindex`],se=[`data-index`],ce={key:2,class:`s-ui-list__static`},D=(0,n.defineComponent)({__name:`SList`,props:(0,n.mergeModels)({items:{},itemKey:{type:[String,Function],default:`id`},childrenKey:{default:`children`},titleKey:{default:`title`},subtitleKey:{default:`subtitle`},iconLeftKey:{default:`iconLeft`},disabledKey:{default:`disabled`},itemProps:{type:Function},selectionMode:{default:()=>e.n.NONE},mandatory:{type:Boolean,default:!1},virtual:{type:Boolean},gap:{default:()=>_},estimateItemSize:{default:36},overscan:{default:5},endReachedDistance:{default:0},canLoadMore:{type:Function},height:{default:320},maxHeight:{},revealRight:{type:Boolean,default:!1},expandOnClick:{type:Boolean,default:!1},hasMoreChildrenKey:{},loadingMoreChildrenKeys:{default:()=>[]}},{modelValue:{},modelModifiers:{},selected:{},selectedModifiers:{},expanded:{default:()=>[]},expandedModifiers:{}}),emits:(0,n.mergeModels)([`endReached`,`loadMoreChildren`],[`update:modelValue`,`update:selected`,`update:expanded`]),setup(i,{expose:o,emit:s}){let c=(0,n.useModel)(i,`modelValue`),l=(0,n.useModel)(i,`selected`),u=(0,n.useModel)(i,`expanded`),d=s,f=(0,n.useSlots)(),p=(0,n.useId)(),g=(0,n.useTemplateRef)(`scrollElementRef`),_=(0,n.useTemplateRef)(`listRootElementRef`),b=(0,n.computed)(()=>te[i.gap]),C=(0,n.computed)(()=>i.items!==void 0),w=(0,n.computed)(()=>C.value?i.virtual===void 0?!0:i.virtual:!1),{flatRows:E,toggleExpanded:D}=m({items:()=>i.items??[],childrenKey:()=>i.childrenKey,itemKey:()=>i.itemKey,expanded:u,hasMoreChildrenKey:()=>i.hasMoreChildrenKey}),{t:O}=(0,r.useUiKitI18n)(),k=(0,n.computed)(()=>new Set(i.loadingMoreChildrenKeys)),A=(0,n.computed)(()=>O(`list.loadMore`)),j=e=>e.loadMoreForKey?k.value.has(e.loadMoreForKey):!1,M=(e,t)=>{k.value.has(e)||d(`loadMoreChildren`,{key:e,item:t})},N=e=>{e.loadMoreForKey&&M(e.loadMoreForKey,e.item)},P=e=>({parentKey:e.loadMoreForKey??``,parentItem:e.item,depth:e.depth,loading:j(e),loadMore:()=>{N(e)}}),F=(0,a.useVirtualizer)((0,n.computed)(()=>({count:E.value.length,getScrollElement:()=>g.value,estimateSize:()=>i.estimateItemSize,gap:b.value,overscan:i.overscan}))),I=(0,n.computed)(()=>{if(C.value)return E.value.map(e=>e.key)}),L=(0,n.computed)(()=>{let e=new Set;for(let t of E.value)!t.loadMoreForKey&&y(t.item,i.disabledKey)&&e.add(t.key);return e}),R=async e=>{if(!w.value)return;let t=E.value.findIndex(t=>t.key===e);t!==-1&&(F.value.scrollToIndex(t,{align:`auto`}),await new Promise(e=>{requestAnimationFrame(()=>{e()})}),await(0,n.nextTick)())},z=e=>ne(p,e),B=e.o({modelValue:()=>l.value,onUpdateModelValue:e=>{l.value=e},mode:()=>i.selectionMode,mandatory:()=>i.mandatory,orientation:()=>e.r.VERTICAL,enableTabNavigation:!0,focusMode:()=>w.value?e.t.ACTIVE_DESCENDANT:e.t.DOM,orderedValues:I,isValueDisabled:e=>L.value.has(e),onBeforeFocusItem:async e=>{await R(e)},onFocusGroup:()=>{g.value?.focus()}}),V=(0,n.computed)(()=>C.value&&re(E.value)),H=()=>{if(w.value){g.value?.focus();return}_.value?.focus()},U=()=>{B.focusedValue.value=void 0,c.value=void 0;let e=document.activeElement;e instanceof HTMLElement&&e!==g.value&&e.blur(),H()},W=async e=>{w.value&&await R(e)},G=async e=>{if(U(),e.type===`expand`||e.type===`collapse`){D(e.rowKey),B.select(e.rowKey,!1),await W(e.rowKey);return}B.select(e.rowKey,!1),await W(e.rowKey)},K=async(e,t)=>{if(!V.value||e.key!==`ArrowUp`&&e.key!==`ArrowDown`)return!1;let n=S(t,l.value),r=ie(e.key,n,E.value);return r?(e.preventDefault(),U(),B.select(r,!1),await W(r),!0):!1},le=async(e,t)=>{if(!V.value||e.key!==`ArrowLeft`&&e.key!==`ArrowRight`)return!1;let n=S(t,l.value),r=T(e.key,n,E.value);return r?(e.preventDefault(),await G(r),!0):!1},q=()=>{if(c.value)return c.value;let e=S(``,l.value);if(e)return e;let t=I.value;if(t){for(let e of t)if(!L.value.has(e))return e}},ue=()=>q(),de=async e=>{let t=ue();t&&await J(e,t)},fe=[`Enter`,` `,`Spacebar`],pe=(e,t)=>{if(!fe.includes(e.key))return!1;let n=E.value.find(e=>e.key===t);return n?.loadMoreForKey?(e.preventDefault(),M(n.loadMoreForKey,n.item),!0):!1},J=async(e,t)=>{pe(e,t)||await K(e,t)||await le(e,t)||(await B.handleItemKeydown(e,t),c.value=B.focusedValue.value,!B.focusedValue.value&&!w.value&&H())},me=async e=>{let t=q();t&&await J(e,t)},he=async e=>{if(w.value||e.target!==_.value)return;let t=q();t&&await J(e,t)},ge=async()=>{let e=q();if(!e){H();return}await B.focusItem(e,!1)};(0,n.provide)(t.r,{mode:()=>i.selectionMode,isSelected:B.isSelected,selectItem:B.toggle,registerItem:B.registerItem,getItemTabIndex:B.getItemTabIndex,getGroupTabIndex:B.getGroupTabIndex,handleItemKeydown:J,activeKey:()=>c.value,setActiveKey:e=>{c.value=e},isExpanded:e=>u.value.includes(e),toggleExpanded:e=>{if(C.value){D(e);return}let t=new Set(u.value);t.has(e)?t.delete(e):t.add(e),u.value=[...t]},revealRight:()=>i.revealRight,expandOnClick:()=>i.expandOnClick,getItemOptionId:e=>{if(w.value)return z(e)},usesActiveDescendantNavigation:()=>w.value,handlesTreeKeyboardNavigation:()=>C.value});let _e=(0,n.computed)(()=>F.value.getVirtualItems()),ve=(0,n.computed)(()=>_e.value.flatMap(e=>{let t=E.value[e.index];return t?[{virtualRow:e,flatRow:t}]:[]})),ye=(0,n.computed)(()=>F.value.getTotalSize()),be=(0,n.computed)(()=>({height:`${ye.value}px`,position:`relative`,width:`100%`})),Y=(0,n.computed)(()=>{let e={};return typeof i.height==`number`?e.height=`${i.height}px`:i.height&&(e.height=i.height),i.maxHeight&&(typeof i.maxHeight==`number`?e.maxHeight=`${i.maxHeight}px`:e.maxHeight=i.maxHeight),e}),xe=(0,n.computed)(()=>({"s-ui-list--virtual":w.value,"s-ui-list--static":!w.value})),Se=(0,n.computed)(()=>({"--s-ui-list-gap":ee[i.gap]})),X=(0,n.computed)(()=>({"s-ui-list__scroll--flat":C.value&&!w.value})),Z=(0,n.computed)(()=>{if(i.selectionMode===e.n.MULTIPLE)return!0}),Ce=(0,n.computed)(()=>{if(!w.value)return`listbox`}),we=(0,n.computed)(()=>{if(!w.value)return Z.value}),Te=(0,n.computed)(()=>{if(w.value)return B.getGroupTabIndex()}),Ee=(0,n.computed)(()=>c.value?c.value:S(``,l.value)),De=(0,n.computed)(()=>{if(!w.value)return;let e=Ee.value;if(e)return z(e)});h(()=>g.value,{distance:()=>i.endReachedDistance,canLoadMore:()=>i.canLoadMore?i.canLoadMore():!0,onEndReached:()=>{d(`endReached`,{direction:`bottom`})}});let Oe=e=>({position:`absolute`,top:0,left:0,width:`100%`,transform:`translateY(${e.start}px)`}),ke=e=>{e instanceof HTMLElement&&F.value.measureElement(e)},Q=e=>{let t=e.item,n={rowKey:e.key,depth:e.depth,expandable:e.hasChildren,expanded:e.expanded,selected:B.isSelected(e.key),active:c.value===e.key,disabled:y(t,i.disabledKey),title:v(t,i.titleKey),subtitle:v(t,i.subtitleKey),iconLeft:x(t,i.iconLeftKey),revealRight:i.revealRight};return i.itemProps?{...n,...i.itemProps(t,e)}:n},$=e=>({...e,revealRight:i.revealRight,toggleExpanded:()=>{D(e.key)}});return o({focusNavigation:ge,handleKeyboardNavigation:me}),(e,i)=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{ref_key:`listRootElementRef`,ref:_,class:(0,n.normalizeClass)([`s-ui-list`,xe.value]),style:(0,n.normalizeStyle)(Se.value),role:Ce.value,"aria-multiselectable":we.value,tabindex:`-1`,onKeydown:he},[C.value&&w.value?((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{key:0,ref_key:`scrollElementRef`,ref:g,class:(0,n.normalizeClass)([`s-ui-list__scroll`,X.value]),style:(0,n.normalizeStyle)(Y.value),role:`listbox`,"aria-multiselectable":Z.value,"aria-activedescendant":De.value,tabindex:Te.value,onKeydown:de},[(0,n.createElementVNode)(`div`,{class:`s-ui-list__virtual-panel`,style:(0,n.normalizeStyle)(be.value)},[((0,n.openBlock)(!0),(0,n.createElementBlock)(n.Fragment,null,(0,n.renderList)(ve.value,i=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{key:i.virtualRow.index,class:`s-ui-list__virtual-row`,"data-index":i.virtualRow.index,ref_for:!0,ref:ke,style:(0,n.normalizeStyle)(Oe(i.virtualRow))},[i.flatRow.loadMoreForKey?((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:0},[(0,n.unref)(f).loadMore?(0,n.renderSlot)(e.$slots,`loadMore`,(0,n.mergeProps)({key:0,ref_for:!0},P(i.flatRow))):((0,n.openBlock)(),(0,n.createBlock)((0,n.unref)(t.t),{key:1,"row-key":i.flatRow.key,depth:i.flatRow.depth,tiny:``,title:A.value,onClick:e=>N(i.flatRow)},(0,n.createSlots)({_:2},[j(i.flatRow)?{name:`icon-left`,fn:(0,n.withCtx)(()=>[(0,n.createVNode)((0,n.unref)(r.SSpinner),{size:16})]),key:`0`}:void 0]),1032,[`row-key`,`depth`,`title`,`onClick`]))],64)):((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:1},[(0,n.unref)(f).item?(0,n.renderSlot)(e.$slots,`item`,(0,n.mergeProps)({key:0,ref_for:!0},$(i.flatRow))):((0,n.openBlock)(),(0,n.createBlock)((0,n.unref)(t.t),(0,n.mergeProps)({key:1,ref_for:!0},Q(i.flatRow)),null,16))],64))],12,se))),128))],4)],46,oe)):C.value?((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{key:1,ref_key:`scrollElementRef`,ref:g,class:(0,n.normalizeClass)([`s-ui-list__scroll`,X.value]),style:(0,n.normalizeStyle)(Y.value)},[((0,n.openBlock)(!0),(0,n.createElementBlock)(n.Fragment,null,(0,n.renderList)((0,n.unref)(E),i=>((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:i.key},[i.loadMoreForKey?((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:0},[(0,n.unref)(f).loadMore?(0,n.renderSlot)(e.$slots,`loadMore`,(0,n.mergeProps)({key:0,ref_for:!0},P(i))):((0,n.openBlock)(),(0,n.createBlock)((0,n.unref)(t.t),{key:1,"row-key":i.key,depth:i.depth,tiny:``,title:A.value,onClick:e=>N(i)},(0,n.createSlots)({_:2},[j(i)?{name:`icon-left`,fn:(0,n.withCtx)(()=>[(0,n.createVNode)((0,n.unref)(r.SSpinner),{size:16})]),key:`0`}:void 0]),1032,[`row-key`,`depth`,`title`,`onClick`]))],64)):((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:1},[(0,n.unref)(f).item?(0,n.renderSlot)(e.$slots,`item`,(0,n.mergeProps)({key:0,ref_for:!0},$(i))):((0,n.openBlock)(),(0,n.createBlock)((0,n.unref)(t.t),(0,n.mergeProps)({key:1,ref_for:!0},Q(i)),null,16))],64))],64))),128))],6)):((0,n.openBlock)(),(0,n.createElementBlock)(`div`,ce,[(0,n.renderSlot)(e.$slots,`default`)]))],46,ae))}});Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return v}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return x}}),Object.defineProperty(exports,"s",{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return D}});
|
|
1
|
+
const e=require("./useSelectionGroup-TaektE-I.cjs"),t=require("./SListItem-DBGDVeoJ.cjs");let n=require("vue"),r=require("@shtabapp/ui-kit-primitives"),i=require("@vueuse/core"),a=require("@tanstack/vue-virtual");var o=(e,t)=>{if(typeof t==`function`)return t(e);let n=e[t];return typeof n==`string`?n:typeof n==`number`?String(n):``},s=(e,t)=>{let n=e[t];return Array.isArray(n)?n.filter(e=>typeof e==`object`&&!!e):[]},c=(e,t)=>{if(!t)return!1;let n=e[t];return typeof n==`boolean`?n:!1},l=`__s-ui-load-more:`,u=e=>`${l}${e}`,d=(e,t,n,r)=>{s(e,n).forEach(e=>{let i=o(e,t);i&&r.add(i),d(e,t,n,r)})},f=(e,t,n,r)=>{for(let i of e){if(o(i,n)===t)return i;let e=f(s(i,r),t,n,r);if(e)return e}},p=(e,t,n,r,i,a,l,d)=>{e.forEach(e=>{let f=o(e,t);if(!f)return;let m=s(e,n),h=m.length>0,g=r.includes(f);l.push({key:f,item:e,depth:i,flatIndex:l.length,hasChildren:h,expanded:g,parentKey:a}),h&&g&&p(m,t,n,r,i+1,f,l,d),h&&g&&c(e,d)&&l.push({key:u(f),item:e,depth:i+1,flatIndex:l.length,hasChildren:!1,expanded:!1,parentKey:f,loadMoreForKey:f})})},m=({items:e,childrenKey:t,itemKey:r,expanded:i,hasMoreChildrenKey:a})=>({flatRows:(0,n.computed)(()=>{let o=[],s=(0,n.toValue)(e),c=(0,n.toValue)(t),l=(0,n.toValue)(r),u=(0,n.toValue)(a);return p(s,l,c,i.value,0,void 0,o,u),o}),toggleExpanded:a=>{let o=(0,n.toValue)(e),s=(0,n.toValue)(t),c=(0,n.toValue)(r),l=new Set(i.value);if(l.has(a)){l.delete(a);let e=f(o,a,c,s);if(e){let t=new Set;d(e,c,s,t),t.forEach(e=>{l.delete(e)})}}else l.add(a);i.value=[...l]},isExpanded:e=>i.value.includes(e)}),h=(e,t)=>(0,i.useInfiniteScroll)(e,()=>{t.onEndReached()},{distance:(0,n.toValue)(t.distance),canLoadMore:()=>t.canLoadMore===void 0?!0:(0,n.toValue)(t.canLoadMore),direction:`bottom`}),g=function(e){return e.NONE=`none`,e.TWO_X_SMALL=`2x-small`,e.X_SMALL=`x-small`,e.SMALL=`small`,e.MEDIUM=`medium`,e.X_MEDIUM=`x-medium`,e.LARGE=`large`,e.X_LARGE=`x-large`,e.TWO_X_LARGE=`2x-large`,e}({}),_=g.TWO_X_SMALL,ee={[g.NONE]:`var(--s-ui-space-gap-none)`,[g.TWO_X_SMALL]:`var(--s-ui-space-gap-2x-small)`,[g.X_SMALL]:`var(--s-ui-space-gap-x-small)`,[g.SMALL]:`var(--s-ui-space-gap-small)`,[g.MEDIUM]:`var(--s-ui-space-gap-medium)`,[g.X_MEDIUM]:`var(--s-ui-space-gap-x-medium)`,[g.LARGE]:`var(--s-ui-space-gap-large)`,[g.X_LARGE]:`var(--s-ui-space-gap-x-large)`,[g.TWO_X_LARGE]:`var(--s-ui-space-gap-2x-large)`},te={[g.NONE]:0,[g.TWO_X_SMALL]:2,[g.X_SMALL]:4,[g.SMALL]:8,[g.MEDIUM]:12,[g.X_MEDIUM]:16,[g.LARGE]:20,[g.X_LARGE]:24,[g.TWO_X_LARGE]:32},ne=(e,t)=>`s-ui-list-option-${e}-${t}`,v=(e,t)=>{let n=e[t];if(typeof n==`string`)return n},y=(e,t)=>{let n=e[t];return typeof n==`boolean`?n:!1},b=e=>e in r.ESIconName,x=(e,t)=>{let n=e[t];if(typeof n==`string`&&n.length>0&&b(n))return n},S=(e,t)=>typeof t==`string`&&t?t:Array.isArray(t)&&t[0]?t[0]:e,re=e=>e.some(e=>e.hasChildren||e.parentKey),C=(e,t,n)=>{if(!e.hasChildren)return null;if(!e.expanded)return{type:`expand`,rowKey:t};let r=n.find(e=>e.parentKey===t);return r?{type:`select`,rowKey:r.key}:null},w=(e,t)=>e.hasChildren&&e.expanded?{type:`collapse`,rowKey:t}:e.parentKey?{type:`select`,rowKey:e.parentKey}:null,T=(e,t,n)=>{let r=n.find(e=>e.key===t);return r?e===`ArrowRight`?C(r,t,n):w(r,t):null},E=(e,t,n,r)=>{for(let i=t;i>=0&&i<e.length;i+=n){let t=e[i];if(t&&t.depth<=r)return t.key}return null},ie=(e,t,n)=>{let r=n.findIndex(e=>e.key===t);if(r===-1)return null;let i=n[r];if(!i)return null;let a=e===`ArrowDown`?1:-1;return E(n,r+a,a,i.depth)},ae=[`role`,`aria-multiselectable`],oe=[`aria-multiselectable`,`aria-activedescendant`,`tabindex`],se=[`data-index`],ce={key:2,class:`s-ui-list__static`},D=(0,n.defineComponent)({__name:`SList`,props:(0,n.mergeModels)({items:{},itemKey:{type:[String,Function],default:`id`},childrenKey:{default:`children`},titleKey:{default:`title`},subtitleKey:{default:`subtitle`},iconLeftKey:{default:`iconLeft`},disabledKey:{default:`disabled`},itemProps:{type:Function},selectionMode:{default:()=>e.n.NONE},mandatory:{type:Boolean,default:!1},virtual:{type:Boolean},gap:{default:()=>_},estimateItemSize:{default:36},overscan:{default:5},endReachedDistance:{default:0},canLoadMore:{type:Function},height:{default:320},maxHeight:{},revealRight:{type:Boolean,default:!1},expandOnClick:{type:Boolean,default:!1},hasMoreChildrenKey:{},loadingMoreChildrenKeys:{default:()=>[]}},{modelValue:{},modelModifiers:{},selected:{},selectedModifiers:{},expanded:{default:()=>[]},expandedModifiers:{}}),emits:(0,n.mergeModels)([`endReached`,`loadMoreChildren`],[`update:modelValue`,`update:selected`,`update:expanded`]),setup(i,{expose:o,emit:s}){let c=(0,n.useModel)(i,`modelValue`),l=(0,n.useModel)(i,`selected`),u=(0,n.useModel)(i,`expanded`),d=s,f=(0,n.useSlots)(),p=(0,n.useId)(),g=(0,n.useTemplateRef)(`scrollElementRef`),_=(0,n.useTemplateRef)(`listRootElementRef`),b=(0,n.computed)(()=>te[i.gap]),C=(0,n.computed)(()=>i.items!==void 0),w=(0,n.computed)(()=>C.value?i.virtual===void 0?!0:i.virtual:!1),{flatRows:E,toggleExpanded:D}=m({items:()=>i.items??[],childrenKey:()=>i.childrenKey,itemKey:()=>i.itemKey,expanded:u,hasMoreChildrenKey:()=>i.hasMoreChildrenKey}),{t:O}=(0,r.useUiKitI18n)(),k=(0,n.computed)(()=>new Set(i.loadingMoreChildrenKeys)),A=(0,n.computed)(()=>O(`list.loadMore`)),j=e=>e.loadMoreForKey?k.value.has(e.loadMoreForKey):!1,M=(e,t)=>{k.value.has(e)||d(`loadMoreChildren`,{key:e,item:t})},N=e=>{e.loadMoreForKey&&M(e.loadMoreForKey,e.item)},P=e=>({parentKey:e.loadMoreForKey??``,parentItem:e.item,depth:e.depth,loading:j(e),loadMore:()=>{N(e)}}),F=(0,a.useVirtualizer)((0,n.computed)(()=>({count:E.value.length,getScrollElement:()=>g.value,estimateSize:()=>i.estimateItemSize,gap:b.value,overscan:i.overscan}))),I=(0,n.computed)(()=>{if(C.value)return E.value.map(e=>e.key)}),L=(0,n.computed)(()=>{let e=new Set;for(let t of E.value)!t.loadMoreForKey&&y(t.item,i.disabledKey)&&e.add(t.key);return e}),R=async e=>{if(!w.value)return;let t=E.value.findIndex(t=>t.key===e);t!==-1&&(F.value.scrollToIndex(t,{align:`auto`}),await new Promise(e=>{requestAnimationFrame(()=>{e()})}),await(0,n.nextTick)())},z=e=>ne(p,e),B=e.o({modelValue:()=>l.value,onUpdateModelValue:e=>{l.value=e},mode:()=>i.selectionMode,mandatory:()=>i.mandatory,orientation:()=>e.r.VERTICAL,enableTabNavigation:!0,focusMode:()=>w.value?e.t.ACTIVE_DESCENDANT:e.t.DOM,orderedValues:I,isValueDisabled:e=>L.value.has(e),onBeforeFocusItem:async e=>{await R(e)},onFocusGroup:()=>{g.value?.focus()}}),V=(0,n.computed)(()=>C.value&&re(E.value)),H=()=>{if(w.value){g.value?.focus();return}_.value?.focus()},U=()=>{B.focusedValue.value=void 0,c.value=void 0;let e=document.activeElement;e instanceof HTMLElement&&e!==g.value&&e.blur(),H()},W=async e=>{w.value&&await R(e)},G=async e=>{if(U(),e.type===`expand`||e.type===`collapse`){D(e.rowKey),B.select(e.rowKey,!1),await W(e.rowKey);return}B.select(e.rowKey,!1),await W(e.rowKey)},K=async(e,t)=>{if(!V.value||e.key!==`ArrowUp`&&e.key!==`ArrowDown`)return!1;let n=S(t,l.value),r=ie(e.key,n,E.value);return r?(e.preventDefault(),U(),B.select(r,!1),await W(r),!0):!1},le=async(e,t)=>{if(!V.value||e.key!==`ArrowLeft`&&e.key!==`ArrowRight`)return!1;let n=S(t,l.value),r=T(e.key,n,E.value);return r?(e.preventDefault(),await G(r),!0):!1},q=()=>{if(c.value)return c.value;let e=S(``,l.value);if(e)return e;let t=I.value;if(t){for(let e of t)if(!L.value.has(e))return e}},ue=()=>q(),de=async e=>{let t=ue();t&&await J(e,t)},fe=[`Enter`,` `,`Spacebar`],pe=(e,t)=>{if(!fe.includes(e.key))return!1;let n=E.value.find(e=>e.key===t);return n?.loadMoreForKey?(e.preventDefault(),M(n.loadMoreForKey,n.item),!0):!1},J=async(e,t)=>{pe(e,t)||await K(e,t)||await le(e,t)||(await B.handleItemKeydown(e,t),c.value=B.focusedValue.value,!B.focusedValue.value&&!w.value&&H())},me=async e=>{let t=q();t&&await J(e,t)},he=async e=>{if(w.value||e.target!==_.value)return;let t=q();t&&await J(e,t)},ge=async()=>{let e=q();if(!e){H();return}await B.focusItem(e,!1)};(0,n.provide)(t.r,{mode:()=>i.selectionMode,isSelected:B.isSelected,selectItem:B.toggle,registerItem:B.registerItem,getItemTabIndex:B.getItemTabIndex,getGroupTabIndex:B.getGroupTabIndex,handleItemKeydown:J,activeKey:()=>c.value,setActiveKey:e=>{c.value=e},isExpanded:e=>u.value.includes(e),toggleExpanded:e=>{if(C.value){D(e);return}let t=new Set(u.value);t.has(e)?t.delete(e):t.add(e),u.value=[...t]},revealRight:()=>i.revealRight,expandOnClick:()=>i.expandOnClick,getItemOptionId:e=>{if(w.value)return z(e)},usesActiveDescendantNavigation:()=>w.value,handlesTreeKeyboardNavigation:()=>C.value});let _e=(0,n.computed)(()=>F.value.getVirtualItems()),ve=(0,n.computed)(()=>_e.value.flatMap(e=>{let t=E.value[e.index];return t?[{virtualRow:e,flatRow:t}]:[]})),ye=(0,n.computed)(()=>F.value.getTotalSize()),be=(0,n.computed)(()=>({height:`${ye.value}px`,position:`relative`,width:`100%`})),Y=(0,n.computed)(()=>{let e={};return typeof i.height==`number`?e.height=`${i.height}px`:i.height&&(e.height=i.height),i.maxHeight&&(typeof i.maxHeight==`number`?e.maxHeight=`${i.maxHeight}px`:e.maxHeight=i.maxHeight),e}),xe=(0,n.computed)(()=>({"s-ui-list--virtual":w.value,"s-ui-list--static":!w.value})),Se=(0,n.computed)(()=>({"--s-ui-list-gap":ee[i.gap]})),X=(0,n.computed)(()=>({"s-ui-list__scroll--flat":C.value&&!w.value})),Z=(0,n.computed)(()=>{if(i.selectionMode===e.n.MULTIPLE)return!0}),Ce=(0,n.computed)(()=>{if(!w.value)return`listbox`}),we=(0,n.computed)(()=>{if(!w.value)return Z.value}),Te=(0,n.computed)(()=>{if(w.value)return B.getGroupTabIndex()}),Ee=(0,n.computed)(()=>c.value?c.value:S(``,l.value)),De=(0,n.computed)(()=>{if(!w.value)return;let e=Ee.value;if(e)return z(e)});h(()=>g.value,{distance:()=>i.endReachedDistance,canLoadMore:()=>i.canLoadMore?i.canLoadMore():!0,onEndReached:()=>{d(`endReached`,{direction:`bottom`})}});let Oe=e=>({position:`absolute`,top:0,left:0,width:`100%`,transform:`translateY(${e.start}px)`}),ke=e=>{e instanceof HTMLElement&&F.value.measureElement(e)},Q=e=>{let t=e.item,n={rowKey:e.key,depth:e.depth,expandable:e.hasChildren,expanded:e.expanded,selected:B.isSelected(e.key),active:c.value===e.key,disabled:y(t,i.disabledKey),title:v(t,i.titleKey),subtitle:v(t,i.subtitleKey),iconLeft:x(t,i.iconLeftKey),revealRight:i.revealRight};return i.itemProps?{...n,...i.itemProps(t,e)}:n},$=e=>({...e,revealRight:i.revealRight,toggleExpanded:()=>{D(e.key)}});return o({focusNavigation:ge,handleKeyboardNavigation:me}),(e,i)=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{ref_key:`listRootElementRef`,ref:_,class:(0,n.normalizeClass)([`s-ui-list`,xe.value]),style:(0,n.normalizeStyle)(Se.value),role:Ce.value,"aria-multiselectable":we.value,tabindex:`-1`,onKeydown:he},[C.value&&w.value?((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{key:0,ref_key:`scrollElementRef`,ref:g,class:(0,n.normalizeClass)([`s-ui-list__scroll`,X.value]),style:(0,n.normalizeStyle)(Y.value),role:`listbox`,"aria-multiselectable":Z.value,"aria-activedescendant":De.value,tabindex:Te.value,onKeydown:de},[(0,n.createElementVNode)(`div`,{class:`s-ui-list__virtual-panel`,style:(0,n.normalizeStyle)(be.value)},[((0,n.openBlock)(!0),(0,n.createElementBlock)(n.Fragment,null,(0,n.renderList)(ve.value,i=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{key:i.virtualRow.index,class:`s-ui-list__virtual-row`,"data-index":i.virtualRow.index,ref_for:!0,ref:ke,style:(0,n.normalizeStyle)(Oe(i.virtualRow))},[i.flatRow.loadMoreForKey?((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:0},[(0,n.unref)(f).loadMore?(0,n.renderSlot)(e.$slots,`loadMore`,(0,n.mergeProps)({key:0,ref_for:!0},P(i.flatRow))):((0,n.openBlock)(),(0,n.createBlock)((0,n.unref)(t.t),{key:1,"row-key":i.flatRow.key,depth:i.flatRow.depth,tiny:``,title:A.value,onClick:e=>N(i.flatRow)},(0,n.createSlots)({_:2},[j(i.flatRow)?{name:`icon-left`,fn:(0,n.withCtx)(()=>[(0,n.createVNode)((0,n.unref)(r.SSpinner),{size:16})]),key:`0`}:void 0]),1032,[`row-key`,`depth`,`title`,`onClick`]))],64)):((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:1},[(0,n.unref)(f).item?(0,n.renderSlot)(e.$slots,`item`,(0,n.mergeProps)({key:0,ref_for:!0},$(i.flatRow))):((0,n.openBlock)(),(0,n.createBlock)((0,n.unref)(t.t),(0,n.mergeProps)({key:1,ref_for:!0},Q(i.flatRow)),null,16))],64))],12,se))),128))],4)],46,oe)):C.value?((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{key:1,ref_key:`scrollElementRef`,ref:g,class:(0,n.normalizeClass)([`s-ui-list__scroll`,X.value]),style:(0,n.normalizeStyle)(Y.value)},[((0,n.openBlock)(!0),(0,n.createElementBlock)(n.Fragment,null,(0,n.renderList)((0,n.unref)(E),i=>((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:i.key},[i.loadMoreForKey?((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:0},[(0,n.unref)(f).loadMore?(0,n.renderSlot)(e.$slots,`loadMore`,(0,n.mergeProps)({key:0,ref_for:!0},P(i))):((0,n.openBlock)(),(0,n.createBlock)((0,n.unref)(t.t),{key:1,"row-key":i.key,depth:i.depth,tiny:``,title:A.value,onClick:e=>N(i)},(0,n.createSlots)({_:2},[j(i)?{name:`icon-left`,fn:(0,n.withCtx)(()=>[(0,n.createVNode)((0,n.unref)(r.SSpinner),{size:16})]),key:`0`}:void 0]),1032,[`row-key`,`depth`,`title`,`onClick`]))],64)):((0,n.openBlock)(),(0,n.createElementBlock)(n.Fragment,{key:1},[(0,n.unref)(f).item?(0,n.renderSlot)(e.$slots,`item`,(0,n.mergeProps)({key:0,ref_for:!0},$(i))):((0,n.openBlock)(),(0,n.createBlock)((0,n.unref)(t.t),(0,n.mergeProps)({key:1,ref_for:!0},Q(i)),null,16))],64))],64))),128))],6)):((0,n.openBlock)(),(0,n.createElementBlock)(`div`,ce,[(0,n.renderSlot)(e.$slots,`default`)]))],46,ae))}});Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return v}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return x}}),Object.defineProperty(exports,"s",{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return D}});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const e=require("./SButton.types-UKroD-ev.cjs"),t=require("./SButton-C-z_q5CG.cjs"),n=require("./useSelectLink-DDdMmsJB.cjs");let r=require("vue"),i=require("@shtabapp/ui-kit-primitives");var a=Symbol(`sListInjectionKey`),o=function(e){return e.NEUTRAL=`neutral`,e.MAIN=`main`,e.ERROR=`error`,e.BILLING=`billing`,e}({}),s=[`id`,`tabindex`,`aria-selected`,`aria-disabled`,`aria-readonly`,`aria-busy`,`aria-expanded`],c={key:0,class:`s-ui-list-item__level`},l={class:`s-ui-list-item__body`},u={key:0,class:`s-ui-list-item__icon-left`},d={class:`s-ui-list-item__text`},f={key:0,class:`s-ui-list-item__title s-ui-typography-label-14-medium`},p={key:1,class:`s-ui-list-item__subtitle s-ui-typography-body-12-regular`},m={key:1,class:`s-ui-list-item__title-action`},h={key:1,class:`s-ui-list-item__actions`},g={class:`s-ui-list-item__actions-reveal`},_={class:`s-ui-list-item__actions-inner`},v={key:0,class:`s-ui-list-item__trailing`},y={key:1,class:`s-ui-list-item__action-end`},b=16,x=`.s-ui-list-item__expand, .s-ui-list-item__title-action, .s-ui-list-item__actions`,S=(0,r.defineComponent)({__name:`SListItem`,props:{depth:{default:0},expandable:{type:Boolean,default:!1},expanded:{type:Boolean,default:!1},variant:{default:()=>o.NEUTRAL},tiny:{type:Boolean,default:!1},selected:{type:Boolean,default:!1},active:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},title:{},subtitle:{},iconLeft:{},rowKey:{},revealRight:{type:Boolean},expandOnClick:{type:Boolean}},emits:[`click`,`toggleExpand`,`keydown`],setup(S,{expose:C,emit:w}){let T=w,E=(0,r.computed)(()=>({disabled:S.disabled,readonly:S.readonly})),D=(0,r.useSlots)(),O=(0,r.useTemplateRef)(`listItemElementRef`),k=(0,r.inject)(a,null),{t:A}=(0,i.useUiKitI18n)(),j=n.n({group:()=>k,value:()=>S.rowKey,el:()=>O.value,disabled:()=>S.disabled||S.loading,interactive:()=>!S.readonly&&!S.loading}),M=(0,r.computed)(()=>S.variant===o.BILLING&&!S.disabled),N=(0,r.computed)(()=>!!(D.trailing||D.right||D[`action-end`])),P=(0,r.computed)(()=>k&&S.rowKey?k.isExpanded(S.rowKey):S.expanded),F=(0,r.computed)(()=>P.value?A(`listItem.collapse`):A(`listItem.expand`)),I=(0,r.computed)(()=>j.isInGroup.value?j.isActive.value:S.selected),L=(0,r.computed)(()=>k&&S.rowKey?k.activeKey()===S.rowKey:S.active),R=(0,r.computed)(()=>S.revealRight?!0:k?k.revealRight():!1),z=(0,r.computed)(()=>S.expandOnClick?!0:k?k.expandOnClick():!1),B=(0,r.computed)(()=>{if(!(!k||!S.rowKey))return k.getItemOptionId(S.rowKey)}),V=(0,r.computed)(()=>{if(k?.usesActiveDescendantNavigation())return-1;if(!(S.disabled||S.readonly||S.loading))return j.tabIndex.value===void 0?0:j.tabIndex.value}),H=(0,r.computed)(()=>({"--s-ui-list-item-depth":String(S.depth)})),U=(0,r.computed)(()=>[`s-ui-list-item--variant-${S.variant}`,{"s-ui-list-item--tiny":S.tiny,"s-ui-list-item--selected":I.value,"s-ui-list-item--active":L.value,"s-ui-list-item--disabled":S.disabled,"s-ui-list-item--readonly":S.readonly,"s-ui-list-item--loading":S.loading,"s-ui-list-item--expandable":S.expandable,"s-ui-list-item--reveal-right":R.value}]),W=()=>{if(k&&S.rowKey){k.toggleExpanded(S.rowKey);return}T(`toggleExpand`)},G=()=>{S.disabled||S.readonly||S.loading||W()},K=e=>e.target instanceof Element&&!!e.target.closest(x),q=e=>{S.disabled||S.readonly||S.loading||K(e)||(S.expandable&&z.value&&(k&&S.rowKey?k.toggleExpanded(S.rowKey):T(`toggleExpand`)),k&&S.rowKey&&k.setActiveKey(S.rowKey),j.isInGroup.value&&j.handleClick(),T(`click`,e))},J=e=>!S.expandable||k?.handlesTreeKeyboardNavigation()||e.key!==`ArrowLeft`&&e.key!==`ArrowRight`||e.key===`ArrowRight`===P.value?!1:(e.preventDefault(),W(),!0),Y=e=>{S.disabled||S.readonly||S.loading||(!J(e)&&j.isInGroup.value&&j.handleKeydown(e),T(`keydown`,e))};return C({listItemElementRef:O}),(n,a)=>((0,r.openBlock)(),(0,r.createElementBlock)(`div`,{ref_key:`listItemElementRef`,ref:O,id:B.value,class:(0,r.normalizeClass)([`s-ui-list-item`,U.value]),style:(0,r.normalizeStyle)(H.value),tabindex:V.value,role:`option`,"aria-selected":I.value?!0:void 0,"aria-disabled":S.disabled||S.loading?!0:void 0,"aria-readonly":S.readonly?!0:void 0,"aria-busy":S.loading?!0:void 0,"aria-expanded":S.expandable&&!S.loading?P.value:void 0,onClick:q,onKeydown:Y},[S.loading?((0,r.openBlock)(),(0,r.createBlock)((0,r.unref)(i.SSkeleton),{key:0,type:(0,r.unref)(i.ESSkeletonType).S_LIST_ITEM},null,8,[`type`])):((0,r.openBlock)(),(0,r.createElementBlock)(r.Fragment,{key:1},[S.expandable||S.depth||(0,r.unref)(D).level?((0,r.openBlock)(),(0,r.createElementBlock)(`div`,c,[(0,r.renderSlot)(n.$slots,`level`,{},()=>[S.expandable?((0,r.openBlock)(),(0,r.createBlock)((0,r.unref)(t.t),{key:0,class:(0,r.normalizeClass)([`s-ui-list-item__expand`,{"s-ui-list-item__expand--expanded":P.value}]),appearance:(0,r.unref)(e.t).BARE,variant:(0,r.unref)(e.r).NEUTRAL,size:(0,r.unref)(e.n).SMALL,icon:`chevronMiniRight`,disabled:S.disabled||S.readonly,tabindex:-1,"aria-label":F.value,onClick:(0,r.withModifiers)(G,[`stop`])},null,8,[`class`,`appearance`,`variant`,`size`,`disabled`,`aria-label`])):(0,r.createCommentVNode)(``,!0)])])):(0,r.createCommentVNode)(``,!0),(0,r.createElementVNode)(`div`,l,[S.iconLeft||(0,r.unref)(D)[`icon-left`]?((0,r.openBlock)(),(0,r.createElementBlock)(`div`,u,[(0,r.renderSlot)(n.$slots,`icon-left`,{},()=>[S.iconLeft?((0,r.openBlock)(),(0,r.createBlock)((0,r.unref)(i.SIcon),{key:0,name:S.iconLeft,size:b,billing:M.value},null,8,[`name`,`billing`])):(0,r.createCommentVNode)(``,!0)])])):(0,r.createCommentVNode)(``,!0),(0,r.createElementVNode)(`div`,d,[S.title||(0,r.unref)(D).title?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,f,[(0,r.renderSlot)(n.$slots,`title`,{},()=>[(0,r.createTextVNode)((0,r.toDisplayString)(S.title),1)])])):(0,r.createCommentVNode)(``,!0),S.subtitle||(0,r.unref)(D).subtitle?((0,r.openBlock)(),(0,r.createElementBlock)(`span`,p,[(0,r.renderSlot)(n.$slots,`subtitle`,{},()=>[(0,r.createTextVNode)((0,r.toDisplayString)(S.subtitle),1)])])):(0,r.createCommentVNode)(``,!0)]),(0,r.unref)(D)[`title-action`]?((0,r.openBlock)(),(0,r.createElementBlock)(`div`,m,[(0,r.renderSlot)(n.$slots,`title-action`,(0,r.normalizeProps)((0,r.guardReactiveProps)(E.value)))])):(0,r.createCommentVNode)(``,!0)]),N.value?((0,r.openBlock)(),(0,r.createElementBlock)(`div`,h,[(0,r.createElementVNode)(`div`,g,[(0,r.createElementVNode)(`div`,_,[(0,r.unref)(D).trailing?((0,r.openBlock)(),(0,r.createElementBlock)(`div`,v,[(0,r.renderSlot)(n.$slots,`trailing`,(0,r.normalizeProps)((0,r.guardReactiveProps)(E.value)))])):(0,r.createCommentVNode)(``,!0),(0,r.renderSlot)(n.$slots,`right`,(0,r.normalizeProps)((0,r.guardReactiveProps)(E.value))),(0,r.unref)(D)[`action-end`]?((0,r.openBlock)(),(0,r.createElementBlock)(`div`,y,[(0,r.renderSlot)(n.$slots,`action-end`,(0,r.normalizeProps)((0,r.guardReactiveProps)(E.value)))])):(0,r.createCommentVNode)(``,!0)])])])):(0,r.createCommentVNode)(``,!0)],64))],46,s))}});Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return S}});
|