@varlet/ui 3.2.11 → 3.2.12-alpha.1717078222679

package/es/action-sheet/style/index.mjs

@@ -3,5 +3,5 @@ import '../../icon/icon.css'
 import '../../ripple/ripple.css'
 import '../../popup/popup.css'
 import '../actionSheet.css'
-import '../ActionItemSfc.css'
 import '../ActionSheetSfc.css'
+import '../ActionItemSfc.css'

package/es/cell/style/index.mjs

@@ -1,4 +1,5 @@
 import '../../styles/common.css'
 import '../../icon/icon.css'
+import '../../ripple/ripple.css'
 import '../cell.css'
 import '../CellSfc.css'

package/es/checkbox/Checkbox.mjs

@@ -94,7 +94,7 @@ function __render__(_ctx, _cache) {
               onClick: _cache[2] || (_cache[2] = (...args) => _ctx.handleTextClick && _ctx.handleTextClick(...args))
             },
             [
-              _renderSlot(_ctx.$slots, "default")
+              _renderSlot(_ctx.$slots, "default", { checked: _ctx.checked })
             ],
             2
             /* CLASS */

package/es/checkbox-group/CheckboxGroup.mjs

@@ -28,10 +28,11 @@ function __render__(_ctx, _cache) {
             { key: 0 },
             _renderList(_ctx.checkboxGroupOptions, (option) => {
               return _openBlock(), _createBlock(_component_checkbox_group_option, {
-                key: option.value.toString(),
-                checked: _ctx.modelValue.includes(option.value),
+                key: option[_ctx.valueKey],
+                "label-key": _ctx.labelKey,
+                "value-key": _ctx.valueKey,
                 option
-              }, null, 8, ["checked", "option"]);
+              }, null, 8, ["label-key", "value-key", "option"]);
             }),
             128
             /* KEYED_FRAGMENT */

package/es/checkbox-group/CheckboxGroupOption.mjs

@@ -6,7 +6,14 @@ import { isFunction } from "@varlet/shared";
 var stdin_default = defineComponent({
   name: "CheckboxGroupOption",
   props: {
-    checked: Boolean,
+    labelKey: {
+      type: String,
+      required: true
+    },
+    valueKey: {
+      type: String,
+      required: true
+    },
     option: Object
   },
   setup(props) {
@@ -15,10 +22,12 @@ var stdin_default = defineComponent({
         return;
       }
       return _createVNode(Checkbox, {
-        "checkedValue": props.option.value,
+        "checkedValue": props.option[props.valueKey],
         "disabled": props.option.disabled
       }, {
-        default: () => [isFunction(props.option.label) ? props.option.label(props.option, props.checked) : props.option.label]
+        default: ({
+          checked
+        }) => isFunction(props.option[props.labelKey]) ? props.option[props.labelKey](props.option, checked) : props.option[props.labelKey]
       });
     };
   }

package/es/checkbox-group/props.mjs

@@ -6,6 +6,14 @@ const props = {
   },
   max: [String, Number],
   options: Array,
+  labelKey: {
+    type: String,
+    default: "label"
+  },
+  valueKey: {
+    type: String,
+    default: "value"
+  },
   direction: {
     type: String,
     default: "horizontal"

package/es/floating-panel/FloatingPanel.mjs

@@ -8,7 +8,7 @@ import { toNumber, isEmpty, preventDefault, call } from "@varlet/shared";
 const { name, n, classes } = createNamespace("floating-panel");
 const DEFAULT_START_ANCHOR = 100;
 const OVERFLOW_REDUCE_RATIO = 0.2;
-import { normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, renderSlot as _renderSlot, normalizeStyle as _normalizeStyle, Teleport as _Teleport, openBlock as _openBlock, createBlock as _createBlock } from "vue";
+import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, normalizeStyle as _normalizeStyle, Teleport as _Teleport, openBlock as _openBlock, createBlock as _createBlock } from "vue";
 function __render__(_ctx, _cache) {
   return _openBlock(), _createBlock(_Teleport, {
     to: _ctx.teleport === false ? void 0 : _ctx.teleport,
@@ -31,25 +31,27 @@ function __render__(_ctx, _cache) {
         onTouchcancel: _cache[3] || (_cache[3] = (...args) => _ctx.handleTouchend && _ctx.handleTouchend(...args))
       },
       [
-        _createElementVNode(
-          "div",
-          {
-            class: _normalizeClass(_ctx.n("header"))
-          },
-          [
-            _createElementVNode(
-              "div",
-              {
-                class: _normalizeClass(_ctx.n("header-toolbar"))
-              },
-              null,
-              2
-              /* CLASS */
-            )
-          ],
-          2
-          /* CLASS */
-        ),
+        _renderSlot(_ctx.$slots, "header", {}, () => [
+          _createElementVNode(
+            "div",
+            {
+              class: _normalizeClass(_ctx.n("header"))
+            },
+            [
+              _createElementVNode(
+                "div",
+                {
+                  class: _normalizeClass(_ctx.n("header-toolbar"))
+                },
+                null,
+                2
+                /* CLASS */
+              )
+            ],
+            2
+            /* CLASS */
+          )
+        ]),
         _createElementVNode(
           "div",
           {

package/es/index.bundle.mjs

@@ -262,7 +262,7 @@ import './tooltip/style/index.mjs'
 import './uploader/style/index.mjs'
 import './watermark/style/index.mjs'
 
-const version = '3.2.11'
+const version = '3.2.12-alpha.1717078222679'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)

package/es/index.mjs

@@ -174,7 +174,7 @@ export * from './tooltip/index.mjs'
 export * from './uploader/index.mjs'
 export * from './watermark/index.mjs'
 
-const version = '3.2.11'
+const version = '3.2.12-alpha.1717078222679'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)

package/es/paper/style/index.mjs

@@ -1,4 +1,5 @@
 import '../../styles/common.css'
 import '../../styles/elevation.css'
+import '../../ripple/ripple.css'
 import '../paper.css'
 import '../PaperSfc.css'

package/es/snackbar/style/index.mjs

@@ -1,7 +1,7 @@
 import '../../styles/common.css'
-import '../SnackbarSfc.css'
 import '../../styles/elevation.css'
 import '../../loading/loading.css'
 import '../../icon/icon.css'
 import '../snackbar.css'
 import '../coreSfc.css'
+import '../SnackbarSfc.css'

package/es/uploader/style/index.mjs

@@ -1,11 +1,12 @@
 import '../../styles/common.css'
 import '../../styles/elevation.css'
+import '../../hover-overlay/hoverOverlay.css'
+import '../../ripple/ripple.css'
 import '../../form-details/formDetails.css'
 import '../../icon/icon.css'
 import '../../popup/popup.css'
 import '../../swipe/swipe.css'
 import '../../swipe-item/swipeItem.css'
 import '../../image-preview/imagePreview.css'
-import '../../hover-overlay/hoverOverlay.css'
 import '../uploader.css'
 import '../UploaderSfc.css'

package/es/varlet.esm.js

@@ -4175,7 +4175,7 @@ function py(e, n) {
               onClick: n[2] || (n[2] = (...l) => e.handleTextClick && e.handleTextClick(...l))
             },
             [
-              R(e.$slots, "default")
+              R(e.$slots, "default", { checked: e.checked })
             ],
             2
             /* CLASS */
@@ -4294,17 +4294,26 @@ const n5 = ra;
 var at = ra, vy = _({
   name: "CheckboxGroupOption",
   props: {
-    checked: Boolean,
+    labelKey: {
+      type: String,
+      required: !0
+    },
+    valueKey: {
+      type: String,
+      required: !0
+    },
     option: Object
   },
   setup(e) {
     return () => {
       if (e.option != null)
         return G(at, {
-          checkedValue: e.option.value,
+          checkedValue: e.option[e.valueKey],
           disabled: e.option.disabled
         }, {
-          default: () => [jo(e.option.label) ? e.option.label(e.option, e.checked) : e.option.label]
+          default: ({
+            checked: n
+          }) => jo(e.option[e.labelKey]) ? e.option[e.labelKey](e.option, n) : e.option[e.labelKey]
         });
     };
   }
@@ -4316,6 +4325,14 @@ const Nf = {
   },
   max: [String, Number],
   options: Array,
+  labelKey: {
+    type: String,
+    default: "label"
+  },
+  valueKey: {
+    type: String,
+    default: "value"
+  },
   direction: {
     type: String,
     default: "horizontal"
@@ -4346,10 +4363,11 @@ function by(e, n) {
             Re,
             { key: 0 },
             _e(e.checkboxGroupOptions, (r) => (g(), Oe(o, {
-              key: r.value.toString(),
-              checked: e.modelValue.includes(r.value),
+              key: r[e.valueKey],
+              "label-key": e.labelKey,
+              "value-key": e.valueKey,
               option: r
-            }, null, 8, ["checked", "option"]))),
+            }, null, 8, ["label-key", "value-key", "option"]))),
             128
             /* KEYED_FRAGMENT */
           )) : X("v-if", !0),
@@ -10714,25 +10732,27 @@ function Uw(e, n) {
         onTouchcancel: n[3] || (n[3] = (...o) => e.handleTouchend && e.handleTouchend(...o))
       },
       [
-        A(
-          "div",
-          {
-            class: p(e.n("header"))
-          },
-          [
-            A(
-              "div",
-              {
-                class: p(e.n("header-toolbar"))
-              },
-              null,
-              2
-              /* CLASS */
-            )
-          ],
-          2
-          /* CLASS */
-        ),
+        R(e.$slots, "header", {}, () => [
+          A(
+            "div",
+            {
+              class: p(e.n("header"))
+            },
+            [
+              A(
+                "div",
+                {
+                  class: p(e.n("header-toolbar"))
+                },
+                null,
+                2
+                /* CLASS */
+              )
+            ],
+            2
+            /* CLASS */
+          )
+        ]),
         A(
           "div",
           {
@@ -22412,7 +22432,7 @@ re(mi);
 se(mi, qm);
 const uT = mi;
 var Jl = mi;
-const T8 = "3.2.11";
+const T8 = "3.2.12-alpha.1717078222679";
 function E8(e) {
   Ei.install && e.use(Ei), Di.install && e.use(Di), Mi.install && e.use(Mi), Ai.install && e.use(Ai), Ni.install && e.use(Ni), Sr.install && e.use(Sr), Vi.install && e.use(Vi), Li.install && e.use(Li), Ri.install && e.use(Ri), Fi.install && e.use(Fi), Cn.install && e.use(Cn), Ui.install && e.use(Ui), Hi.install && e.use(Hi), Yi.install && e.use(Yi), at.install && e.use(at), ji.install && e.use(ji), Pr.install && e.use(Pr), Wi.install && e.use(Wi), Ki.install && e.use(Ki), qi.install && e.use(qi), Gi.install && e.use(Gi), In.install && e.use(In), Qi.install && e.use(Qi), tl.install && e.use(tl), al.install && e.use(al), il.install && e.use(il), ll.install && e.use(ll), Br.install && e.use(Br), cl.install && e.use(cl), dl.install && e.use(dl), At.install && e.use(At), fl.install && e.use(fl), pl.install && e.use(pl), On.install && e.use(On), zn.install && e.use(zn), Nn.install && e.use(Nn), Xe.install && e.use(Xe), vl.install && e.use(vl), Lt.install && e.use(Lt), ml.install && e.use(ml), hl.install && e.use(hl), Mr.install && e.use(Mr), Dt.install && e.use(Dt), gl.install && e.use(gl), bl.install && e.use(bl), rt.install && e.use(rt), yl.install && e.use(yl), Ti.install && e.use(Ti), Rt.install && e.use(Rt), Ar.install && e.use(Ar), Nr.install && e.use(Nr), kl.install && e.use(kl), $l.install && e.use($l), wl.install && e.use(wl), Cl.install && e.use(Cl), Sl.install && e.use(Sl), wo.install && e.use(wo), Pl.install && e.use(Pl), zl.install && e.use(zl), Ol.install && e.use(Ol), Tl.install && e.use(Tl), El.install && e.use(El), Dl.install && e.use(Dl), on.install && e.use(on), Bl.install && e.use(Bl), Il.install && e.use(Il), Ml.install && e.use(Ml), Al.install && e.use(Al), Vl.install && e.use(Vl), Ll.install && e.use(Ll), Rl.install && e.use(Rl), Fl.install && e.use(Fl), st.install && e.use(st), Ul.install && e.use(Ul), Nt.install && e.use(Nt), Vt.install && e.use(Vt), Hl.install && e.use(Hl), Yl.install && e.use(Yl), jl.install && e.use(jl), Wl.install && e.use(Wl), Kl.install && e.use(Kl), ql.install && e.use(ql), Gl.install && e.use(Gl), Xl.install && e.use(Xl), Ir.install && e.use(Ir), Zl.install && e.use(Zl), Jl.install && e.use(Jl);
 }

package/highlight/web-types.en-US.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "framework": "vue",
-  "version": "3.2.11",
+  "version": "3.2.12-alpha.1717078222679",
   "name": "VARLET",
   "contributions": {
     "html": {
@@ -1446,6 +1446,24 @@
                 "kind": "expression"
               }
             },
+            {
+              "name": "label-key",
+              "description": "As the key that uniquely identifies label",
+              "default": "label",
+              "value": {
+                "type": "string",
+                "kind": "expression"
+              }
+            },
+            {
+              "name": "value-key",
+              "description": "As the key that uniquely identifies value",
+              "default": "value",
+              "value": {
+                "type": "string",
+                "kind": "expression"
+              }
+            },
             {
               "name": "rules",
               "description": "The validation rules, return `true` to indicate that the validation passed. The remaining values are converted to text as user prompts",
@@ -3055,6 +3073,10 @@
             {
               "name": "default",
               "description": "Custom panel content"
+            },
+            {
+              "name": "header",
+              "description": "Custom panel header"
             }
           ]
         },

package/highlight/web-types.zh-CN.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "framework": "vue",
-  "version": "3.2.11",
+  "version": "3.2.12-alpha.1717078222679",
   "name": "VARLET",
   "contributions": {
     "html": {
@@ -1605,6 +1605,24 @@
                 "kind": "expression"
               }
             },
+            {
+              "name": "label-key",
+              "description": "作为 label 唯一标识的键名",
+              "default": "label",
+              "value": {
+                "type": "string",
+                "kind": "expression"
+              }
+            },
+            {
+              "name": "value-key",
+              "description": "作为 value 唯一标识的键名",
+              "default": "value",
+              "value": {
+                "type": "string",
+                "kind": "expression"
+              }
+            },
             {
               "name": "rules",
               "description": "验证规则，返回 `true` 表示验证通过，其余的值则转换为文本作为用户提示",
@@ -3214,6 +3232,10 @@
             {
               "name": "default",
               "description": "自定义面板内容"
+            },
+            {
+              "name": "header",
+              "description": "自定义面板标头"
             }
           ]
         },

package/lib/varlet.cjs.js

@@ -5214,7 +5214,7 @@ function __render__$14(_ctx, _cache) {
               onClick: _cache[2] || (_cache[2] = (...args) => _ctx.handleTextClick && _ctx.handleTextClick(...args))
             },
             [
-              vue.renderSlot(_ctx.$slots, "default")
+              vue.renderSlot(_ctx.$slots, "default", { checked: _ctx.checked })
             ],
             2
             /* CLASS */
@@ -5377,7 +5377,14 @@ var stdin_default$58 = stdin_default$59;
 var stdin_default$57 = vue.defineComponent({
   name: "CheckboxGroupOption",
   props: {
-    checked: Boolean,
+    labelKey: {
+      type: String,
+      required: true
+    },
+    valueKey: {
+      type: String,
+      required: true
+    },
     option: Object
   },
   setup(props2) {
@@ -5386,10 +5393,12 @@ var stdin_default$57 = vue.defineComponent({
         return;
       }
       return vue.createVNode(stdin_default$58, {
-        "checkedValue": props2.option.value,
+        "checkedValue": props2.option[props2.valueKey],
         "disabled": props2.option.disabled
       }, {
-        default: () => [isFunction(props2.option.label) ? props2.option.label(props2.option, props2.checked) : props2.option.label]
+        default: ({
+          checked
+        }) => isFunction(props2.option[props2.labelKey]) ? props2.option[props2.labelKey](props2.option, checked) : props2.option[props2.labelKey]
       });
     };
   }
@@ -5401,6 +5410,14 @@ const props$Y = {
   },
   max: [String, Number],
   options: Array,
+  labelKey: {
+    type: String,
+    default: "label"
+  },
+  valueKey: {
+    type: String,
+    default: "value"
+  },
   direction: {
     type: String,
     default: "horizontal"
@@ -5434,10 +5451,11 @@ function __render__$13(_ctx, _cache) {
             { key: 0 },
             vue.renderList(_ctx.checkboxGroupOptions, (option) => {
               return vue.openBlock(), vue.createBlock(_component_checkbox_group_option, {
-                key: option.value.toString(),
-                checked: _ctx.modelValue.includes(option.value),
+                key: option[_ctx.valueKey],
+                "label-key": _ctx.labelKey,
+                "value-key": _ctx.valueKey,
                 option
-              }, null, 8, ["checked", "option"]);
+              }, null, 8, ["label-key", "value-key", "option"]);
             }),
             128
             /* KEYED_FRAGMENT */
@@ -14718,25 +14736,27 @@ function __render__$L(_ctx, _cache) {
         onTouchcancel: _cache[3] || (_cache[3] = (...args) => _ctx.handleTouchend && _ctx.handleTouchend(...args))
       },
       [
-        vue.createElementVNode(
-          "div",
-          {
-            class: vue.normalizeClass(_ctx.n("header"))
-          },
-          [
-            vue.createElementVNode(
-              "div",
-              {
-                class: vue.normalizeClass(_ctx.n("header-toolbar"))
-              },
-              null,
-              2
-              /* CLASS */
-            )
-          ],
-          2
-          /* CLASS */
-        ),
+        vue.renderSlot(_ctx.$slots, "header", {}, () => [
+          vue.createElementVNode(
+            "div",
+            {
+              class: vue.normalizeClass(_ctx.n("header"))
+            },
+            [
+              vue.createElementVNode(
+                "div",
+                {
+                  class: vue.normalizeClass(_ctx.n("header-toolbar"))
+                },
+                null,
+                2
+                /* CLASS */
+              )
+            ],
+            2
+            /* CLASS */
+          )
+        ]),
         vue.createElementVNode(
           "div",
           {
@@ -28600,7 +28620,7 @@ withInstall(stdin_default$1);
 withPropsDefaultsSetter(stdin_default$1, props);
 const _WatermarkComponent = stdin_default$1;
 var stdin_default = stdin_default$1;
-const version = "3.2.11";
+const version = "3.2.12-alpha.1717078222679";
 function install(app) {
   stdin_default$5F.install && app.use(stdin_default$5F);
   stdin_default$5D.install && app.use(stdin_default$5D);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "3.2.11",
+  "version": "3.2.12-alpha.1717078222679",
   "description": "A material like components library",
   "main": "lib/varlet.cjs.js",
   "module": "es/index.mjs",
@@ -48,9 +48,9 @@
     "@popperjs/core": "^2.11.6",
     "dayjs": "^1.10.4",
     "decimal.js": "^10.2.1",
-    "@varlet/icons": "3.2.11",
-    "@varlet/shared": "3.2.11",
-    "@varlet/use": "3.2.11"
+    "@varlet/use": "3.2.12-alpha.1717078222679",
+    "@varlet/icons": "3.2.12-alpha.1717078222679",
+    "@varlet/shared": "3.2.12-alpha.1717078222679"
   },
   "devDependencies": {
     "@vue/runtime-core": "3.4.21",
@@ -66,9 +66,9 @@
     "typescript": "^5.1.5",
     "vue": "3.4.21",
     "vue-router": "4.2.0",
-    "@varlet/ui": "3.2.11",
-    "@varlet/touch-emulator": "3.2.11",
-    "@varlet/cli": "3.2.11"
+    "@varlet/ui": "3.2.12-alpha.1717078222679",
+    "@varlet/cli": "3.2.12-alpha.1717078222679",
+    "@varlet/touch-emulator": "3.2.12-alpha.1717078222679"
   },
   "scripts": {
     "dev": "varlet-cli dev",

package/types/checkbox.d.ts

@@ -24,13 +24,17 @@ export interface CheckboxProps extends BasicAttributes {
   'onUpdate:indeterminate'?: ListenerProp<(value: boolean) => void>
 }
 
+export interface CheckboxData {
+  checked: boolean
+}
+
 export class Checkbox extends VarComponent {
   static setPropsDefaults: SetPropsDefaults<CheckboxProps>
 
   $props: CheckboxProps
 
   $slots: {
-    default(): VNode[]
+    default(data: CheckboxData): VNode[]
     'checked-icon'(): VNode[]
     'unchecked-icon'(): VNode[]
     'indeterminate-icon'(): VNode[]

package/types/checkboxGroup.d.ts

@@ -15,8 +15,10 @@ export type CheckboxGroupOptionLabelRender = (option: CheckboxGroupOption, check
 
 export interface CheckboxGroupOption {
   label?: string | VNode | CheckboxGroupOptionLabelRender
-  disabled?: boolean
   value?: any
+  disabled?: boolean
+
+  [key: PropertyKey]: any
 }
 
 export { CheckboxGroupDirection }
@@ -24,6 +26,8 @@ export { CheckboxGroupDirection }
 export interface CheckboxGroupProps extends BasicAttributes {
   modelValue?: any[]
   max?: string | number
+  labelKey?: string
+  valueKey?: string
   options?: Array<CheckboxGroupOption>
   direction?: CheckboxGroupDirection
   validateTrigger?: Array<CheckboxGroupValidateTrigger>

package/types/floatingPanel.d.ts

@@ -22,6 +22,8 @@ export class FloatingPanel extends VarComponent {
 
   $slots: {
     default(): VNode[]
+
+    header(): VNode[]
   }
 }