@opentiny/vue-checkbox - npm Package Compare versions

Comparing version 3.11.0 to 3.12.0

lib/index.js

@@ -71,2 +71,3 @@ function _extends() {
   text: String,
+  customClass: [String, Object, Array],
   validateEvent: {
@@ -98,3 +99,3 @@ type: Boolean,
 });
-var version = "3.11.0";
+var version = "3.12.0";
 Checkbox.model = {
@@ -101,0 +102,0 @@ prop: "modelValue",

lib/mobile-first.js

 import { renderless, api } from "@opentiny/vue-renderless/checkbox/vue";
 import { defineComponent, props, setup as _setup } from "@opentiny/vue-common";
 import { iconHalfselect, iconCheckedSur, iconCheck } from "@opentiny/vue-icon";
-import { resolveComponent, openBlock, createElementBlock, mergeProps, createElementVNode, normalizeClass, createBlock, createCommentVNode, withDirectives, withModifiers, vModelCheckbox, renderSlot, createTextVNode, toDisplayString, Fragment } from "vue";
+import { resolveComponent, openBlock, createElementBlock, mergeProps, createElementVNode, normalizeClass, createVNode, withDirectives, withModifiers, vModelCheckbox, renderSlot, createTextVNode, toDisplayString, createCommentVNode } from "vue";
 function _createForOfIteratorHelperLoose_tiny(o, allowArrayLike) {
@@ -71,3 +71,2 @@ var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
 var _hoisted_3 = {
-  class: "inline-flex p-3 sm:p-0",
   tabindex: "1"
@@ -79,3 +78,4 @@ };
   key: 0,
-  class: "text-color-text-primary cursor-default"
+  ref: "label",
+  class: "py-3 sm:py-0 pl-0 sm:pl-2 text-color-text-primary mr-5 flex-auto"
 };
@@ -88,32 +88,25 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     "data-tag": "tiny-checkbox",
-    class: _ctx.m("inline-flex sm:items-center text-sm leading-5 cursor-pointer", _ctx.state.size === "medium" ? "sm:text-sm" : "sm:text-xs", {
-      "sm:py-2": _ctx.state.vertical
-    }, _ctx.state.isDisplayOnly || _ctx.state.isGroupDisplayOnly ? _ctx.state.isChecked ? "cursor-default after:content-[';'] after:inline-block last:after:content-['']" : "hidden" : "", _ctx.state.showLabel ? "inline-flex" : "", _ctx.customClass),
+    class: _ctx.m("inline-flex sm:items-center text-sm sm:py-2 leading-5 cursor-pointer", _ctx.state.size === "medium" ? "sm:text-sm" : "sm:text-xs", _ctx.customClass),
     id: _ctx.id,
     tabindex: "-1"
   }, _ctx.a(_ctx.$attrs, ["class", "style", "onClick"], true)), [createElementVNode("span", {
-    class: normalizeClass(["relative", _ctx.state.size === "medium" ? "sm:w-6 sm:h-6" : "sm:h-4 sm:w-4", _ctx.state.isDisplayOnly || _ctx.state.isGroupDisplayOnly ? "hidden" : ""]),
+    class: normalizeClass(["relative w-11 h-11 sm:p-0", _ctx.state.size === "medium" ? "sm:w-6 sm:h-6" : "sm:h-4 sm:w-4", _ctx.state.isDisplayOnly || _ctx.state.isGroupDisplayOnly ? "hidden" : ""]),
     role: _ctx.indeterminate ? "checkbox" : false,
     "aria-checked": _ctx.indeterminate ? "mixed" : false
-  }, [createElementVNode("span", _hoisted_3, [!_ctx.state.isChecked && !_ctx.indeterminate ? (openBlock(), createBlock(_component_icon_check, {
-    key: 0,
+  }, [createElementVNode("span", _hoisted_3, [createVNode(_component_icon_check, {
     "data-tag": "icon-check",
-    "custom-class": ["w-5 h-5 flex-1", _ctx.state.size === "medium" ? "sm:w-6 sm:h-6" : "sm:w-4 sm:h-4"],
-    class: normalizeClass([_ctx.state.isDisabled ? "[&_path:nth-of-type(2)]:fill-color-icon-disabled [&_path:nth-of-type(1)]:fill-color-bg-3 cursor-not-allowed" : "[&_path:nth-of-type(1)]:fill-color-icon-inverse [&_path:nth-of-type(2)]:fill-color-none-hover"])
-  }, null, 8, ["custom-class", "class"])) : _ctx.indeterminate ? (openBlock(), createBlock(_component_icon_halfselect, {
-    key: 1,
+    class: normalizeClass(_ctx.m("w-5 h-5 absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-0", _ctx.state.size === "medium" ? "sm:w-6 sm:h-6" : "sm:w-4 sm:h-4", _ctx.state.isDisabled ? "[&_path:nth-of-type(2)]:fill-color-icon-disabled [&_path:nth-of-type(1)]:fill-color-bg-3 cursor-not-allowed" : "[&_path:nth-of-type(1)]:fill-color-icon-inverse [&_path:nth-of-type(2)]:fill-color-none-hover"))
+  }, null, 8, ["class"]), createVNode(_component_icon_halfselect, {
     "data-tag": "icon-halfselect",
-    "custom-class": _ctx.m("w-5 h-5 flex-1 [&_path:nth-of-type(2)]:fill-color-icon-inverse", _ctx.state.isDisabled ? "[&_path:nth-of-type(1)]:fill-color-brand-disabled cursor-not-allowed" : "[&_path:nth-of-type(1)]:fill-color-brand", _ctx.state.size === "medium" ? "sm:w-6 sm:h-6" : "sm:w-4 sm:h-4")
-  }, null, 8, ["custom-class"])) : _ctx.state.isChecked ? (openBlock(), createBlock(_component_icon_checked_sur, {
-    key: 2,
+    class: normalizeClass(_ctx.m("w-5 h-5 absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 transition-all [&_path:nth-of-type(2)]:fill-color-icon-inverse", _ctx.indeterminate ? "opacity-100 scale-100 z-10" : "opacity-0 scale-0 z-0", _ctx.state.isDisabled ? "[&_path:nth-of-type(1)]:fill-color-brand-disabled cursor-not-allowed" : "[&_path:nth-of-type(1)]:fill-color-brand [&_path:nth-of-type(1)]:shadow-xsm", _ctx.state.size === "medium" ? "sm:w-6 sm:h-6" : "sm:w-4 sm:h-4"))
+  }, null, 8, ["class"]), createVNode(_component_icon_checked_sur, {
     "data-tag": "icon-checked-sur",
-    "custom-class": ["w-5 h-5", _ctx.state.size === "medium" ? "sm:w-6 sm:h-6" : "sm:w-4 sm:h-4"],
-    class: normalizeClass(_ctx.m("flex-1 [&_path:nth-of-type(2)]:fill-color-icon-inverse", _ctx.state.isDisabled ? "[&_path:nth-of-type(1)]:fill-color-brand-disabled cursor-not-allowed" : "[&_path:nth-of-type(1)]:fill-color-brand"))
-  }, null, 8, ["custom-class", "class"])) : createCommentVNode("v-if", true)]), _ctx.trueLabel || _ctx.falseLabel ? withDirectives((openBlock(), createElementBlock("input", {
+    class: normalizeClass(_ctx.m("w-5 h-5", _ctx.state.size === "medium" ? "sm:w-6 sm:h-6" : "sm:w-4 sm:h-4", "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 transition-all [&_path:nth-of-type(2)]:fill-color-icon-inverse", _ctx.state.isChecked && !_ctx.indeterminate ? "opacity-100 scale-100 z-10" : "opacity-0 scale-0 z-0", _ctx.state.isDisabled ? "[&_path:nth-of-type(1)]:fill-color-brand-disabled cursor-not-allowed" : "[&_path:nth-of-type(1)]:fill-color-brand [&_path:nth-of-type(2)]:shadow-xsm"))
+  }, null, 8, ["class"])]), _ctx.trueLabel || _ctx.falseLabel ? withDirectives((openBlock(), createElementBlock("input", {
     key: 0,
-    class: "absolute left-0 right-0 top-0 bottom-0 w-0 h-0 -z-10 opacity-0",
+    class: "absolute inset-0 w-0 h-0 -z-10 opacity-0",
     type: "checkbox",
     "aria-hidden": _ctx.indeterminate ? "true" : "false",
     name: _ctx.name,
-    disabled: _ctx.state.inputDisabled,
+    disabled: _ctx.state.isDisabled,
     "true-value": _ctx.trueLabel,
@@ -137,6 +130,6 @@ "false-value": _ctx.falseLabel,
     key: 1,
-    class: "absolute left-0 right-0 top-0 bottom-0 w-0 h-0 -z-10 opacity-0",
+    class: "absolute inset-0 w-0 h-0 -z-10 opacity-0",
     type: "checkbox",
     "aria-hidden": _ctx.indeterminate ? "true" : "false",
-    disabled: _ctx.state.inputDisabled,
+    disabled: _ctx.state.isDisabled,
     value: _ctx.label,
@@ -158,12 +151,8 @@ name: _ctx.name,
     }, ["stop"]))
-  }, null, 40, _hoisted_5)), [[vModelCheckbox, _ctx.state.model]])], 10, _hoisted_2), _ctx.slots.default && _ctx.slots.default() || _ctx.state.isShowText ? (openBlock(), createElementBlock(
+  }, null, 40, _hoisted_5)), [[vModelCheckbox, _ctx.state.model]])], 10, _hoisted_2), _ctx.slots.default && _ctx.slots.default() || _ctx.text || _ctx.label ? (openBlock(), createElementBlock(
     "span",
-    {
-      key: 0,
-      ref: "label",
-      class: normalizeClass(_ctx.m("py-3 sm:py-0 pl-0 sm:pl-2 mr-5 flex-auto", _ctx.state.isDisabled ? "cursor-not-allowed text-color-text-disabled" : "text-color-text-primary", _ctx.state.isDisplayOnly || _ctx.state.isGroupDisplayOnly ? "p-0 sm:p-0 m-0 text-color-text-primary cursor-default" : ""))
-    },
+    _hoisted_6,
     [renderSlot(_ctx.$slots, "default", {}, function() {
       return [createTextVNode(
-        toDisplayString(_ctx.state.showText),
+        toDisplayString(_ctx.text || _ctx.label),
         1
@@ -173,19 +162,5 @@ /* TEXT */
     })],
-    2
-    /* CLASS */
-  )) : (openBlock(), createElementBlock(
-    Fragment,
-    {
-      key: 1
-    },
-    [_ctx.state.isDisplayOnly ? (openBlock(), createElementBlock(
-      "span",
-      _hoisted_6,
-      toDisplayString(_ctx.state.displayLabel),
-      1
-      /* TEXT */
-    )) : createCommentVNode("v-if", true)],
-    64
-    /* STABLE_FRAGMENT */
-  ))], 16, _hoisted_1);
+    512
+    /* NEED_PATCH */
+  )) : createCommentVNode("v-if", true)], 16, _hoisted_1);
 }
@@ -192,0 +167,0 @@ var mobileFirst = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);

package.json

 {
   "name": "@opentiny/vue-checkbox",
-  "version": "3.11.0",
+  "version": "3.12.0",
   "description": "",
@@ -10,4 +10,4 @@ "main": "./lib/index.js",
   "dependencies": {
-    "@opentiny/vue-common": "~3.11.0",
-    "@opentiny/vue-renderless": "~3.11.0"
+    "@opentiny/vue-common": "~3.12.0",
+    "@opentiny/vue-renderless": "~3.12.0"
   },
@@ -14,0 +14,0 @@ "license": "MIT",

src/index.d.ts

@@ -38,2 +38,3 @@ export declare const $constants: {
     text: StringConstructor;
+    customClass: (ObjectConstructor | StringConstructor | ArrayConstructor)[];
     validateEvent: {
@@ -89,2 +90,3 @@ type: BooleanConstructor;
     text: StringConstructor;
+    customClass: (ObjectConstructor | StringConstructor | ArrayConstructor)[];
     validateEvent: {
@@ -141,2 +143,3 @@ type: BooleanConstructor;
     text: StringConstructor;
+    customClass: (ObjectConstructor | StringConstructor | ArrayConstructor)[];
     validateEvent: {
@@ -143,0 +146,0 @@ type: BooleanConstructor;

src/mobile-first.vue.d.ts

@@ -16,4 +16,4 @@ declare const _default: import("@vue/runtime-core").DefineComponent<Readonly<{
     border?: any;
+    customClass?: any;
     id?: any;
-    customClass?: any;
     validateEvent?: any;
@@ -27,3 +27,3 @@ displayOnly?: any;
     controls?: any;
-}>, any, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, ("update:modelValue" | "complete" | "change")[], "update:modelValue" | "complete" | "change", import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<Readonly<{
+}>, any, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, ("update:modelValue" | "change" | "complete")[], "update:modelValue" | "change" | "complete", import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<Readonly<{
     text?: any;
@@ -43,4 +43,4 @@ label?: any;
     border?: any;
+    customClass?: any;
     id?: any;
-    customClass?: any;
     validateEvent?: any;
@@ -73,4 +73,4 @@ displayOnly?: any;
     readonly border?: any;
+    readonly customClass?: any;
     readonly id?: any;
-    readonly customClass?: any;
     readonly validateEvent?: any;
@@ -77,0 +77,0 @@ readonly displayOnly?: any;

src/pc.vue.d.ts

@@ -26,3 +26,3 @@ import type { ICheckboxApi } from '@opentiny/vue-renderless/types/checkbox.type';
     controls?: any;
-}>, ICheckboxApi, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, ("update:modelValue" | "complete" | "change")[], "update:modelValue" | "complete" | "change", import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<Readonly<{
+}>, ICheckboxApi, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, ("update:modelValue" | "change" | "complete")[], "update:modelValue" | "change" | "complete", import("@vue/runtime-core").VNodeProps & import("@vue/runtime-core").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<Readonly<{
     text?: any;
@@ -29,0 +29,0 @@ label?: any;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

38420

decreased by-1.21%

Lines of code

1009

decreased by-1.94%

Dependency changes

• + Added@opentiny/vue-common@3.12.0(transitive)

• + Added@opentiny/vue-locale@3.12.0(transitive)

• + Added@opentiny/vue-renderless@3.12.1(transitive)

• + Added@opentiny/vue-theme@3.12.1(transitive)

• + Added@opentiny/vue-theme-mobile@3.12.0(transitive)

• - Removed@opentiny/vue-common@3.11.0(transitive)

• - Removed@opentiny/vue-locale@3.11.0(transitive)

• - Removed@opentiny/vue-renderless@3.11.8(transitive)

• - Removed@opentiny/vue-theme@3.11.6(transitive)

• - Removed@opentiny/vue-theme-mobile@3.11.1(transitive)

• Updated@opentiny/vue-common@~3.12.0

• Updated@opentiny/vue-renderless@~3.12.0