@pequity/squirrel 1.2.11 → 1.2.12

package/dist/cjs/p-checkbox.js

@@ -1,9 +1,8 @@
 "use strict";
 const vue = require("vue");
 const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
-const _hoisted_1 = { class: "inline-flex items-center" };
-const _hoisted_2 = ["checked"];
-const _hoisted_3 = {
+const _hoisted_1 = ["checked"];
+const _hoisted_2 = {
   key: 0,
   class: "ml-2 text-sm"
 };
@@ -25,22 +24,33 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   },
   emits: ["update:modelValue"],
   setup(__props) {
+    const allAttrs = vue.useAttrs();
+    const attrs = vue.computed(() => {
+      const { class: classes, style: style2, ...rest } = allAttrs;
+      return rest;
+    });
+    const style = vue.computed(() => {
+      return allAttrs.style;
+    });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("label", _hoisted_1, [
+      return vue.openBlock(), vue.createElementBlock("label", {
+        class: vue.normalizeClass(["inline-flex items-center", [{ hidden: _ctx.$attrs.hidden }, _ctx.$attrs.class]]),
+        style: vue.normalizeStyle(style.value)
+      }, [
         vue.renderSlot(_ctx.$slots, "label-before", {}, void 0, true),
         vue.createElementVNode("input", vue.mergeProps({
           type: "checkbox",
-          class: "h-4 w-4 shrink-0 appearance-none rounded border border-p-gray-30 bg-surface duration-100 ease-in-out checked:border-none checked:bg-primary disabled:opacity-50",
-          checked: __props.modelValue
-        }, _ctx.$attrs, {
+          class: "h-4 w-4 shrink-0 appearance-none rounded border border-p-gray-30 bg-surface duration-100 ease-in-out checked:border-none checked:bg-primary disabled:opacity-50"
+        }, attrs.value, {
+          checked: __props.modelValue,
           onChange: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:modelValue", $event.target.checked))
-        }), null, 16, _hoisted_2),
+        }), null, 16, _hoisted_1),
         vue.renderSlot(_ctx.$slots, "label", {}, () => [
-          __props.label ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true)
+          __props.label ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true)
         ], true)
-      ]);
+      ], 6);
     };
   }
 });
-const pCheckbox = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-6729bf3b"]]);
+const pCheckbox = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-01f2e2c0"]]);
 module.exports = pCheckbox;

package/dist/es/p-checkbox.js

@@ -1,8 +1,7 @@
-import { defineComponent, openBlock, createElementBlock, renderSlot, createElementVNode, mergeProps, toDisplayString, createCommentVNode } from "vue";
+import { defineComponent, useAttrs, computed, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot, createElementVNode, mergeProps, toDisplayString, createCommentVNode } from "vue";
 import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
-const _hoisted_1 = { class: "inline-flex items-center" };
-const _hoisted_2 = ["checked"];
-const _hoisted_3 = {
+const _hoisted_1 = ["checked"];
+const _hoisted_2 = {
   key: 0,
   class: "ml-2 text-sm"
 };
@@ -24,24 +23,35 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   emits: ["update:modelValue"],
   setup(__props) {
+    const allAttrs = useAttrs();
+    const attrs = computed(() => {
+      const { class: classes, style: style2, ...rest } = allAttrs;
+      return rest;
+    });
+    const style = computed(() => {
+      return allAttrs.style;
+    });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("label", _hoisted_1, [
+      return openBlock(), createElementBlock("label", {
+        class: normalizeClass(["inline-flex items-center", [{ hidden: _ctx.$attrs.hidden }, _ctx.$attrs.class]]),
+        style: normalizeStyle(style.value)
+      }, [
         renderSlot(_ctx.$slots, "label-before", {}, void 0, true),
         createElementVNode("input", mergeProps({
           type: "checkbox",
-          class: "h-4 w-4 shrink-0 appearance-none rounded border border-p-gray-30 bg-surface duration-100 ease-in-out checked:border-none checked:bg-primary disabled:opacity-50",
-          checked: __props.modelValue
-        }, _ctx.$attrs, {
+          class: "h-4 w-4 shrink-0 appearance-none rounded border border-p-gray-30 bg-surface duration-100 ease-in-out checked:border-none checked:bg-primary disabled:opacity-50"
+        }, attrs.value, {
+          checked: __props.modelValue,
           onChange: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:modelValue", $event.target.checked))
-        }), null, 16, _hoisted_2),
+        }), null, 16, _hoisted_1),
         renderSlot(_ctx.$slots, "label", {}, () => [
-          __props.label ? (openBlock(), createElementBlock("div", _hoisted_3, toDisplayString(__props.label), 1)) : createCommentVNode("", true)
+          __props.label ? (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(__props.label), 1)) : createCommentVNode("", true)
         ], true)
-      ]);
+      ], 6);
     };
   }
 });
-const pCheckbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-6729bf3b"]]);
+const pCheckbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-01f2e2c0"]]);
 export {
   pCheckbox as default
 };

package/dist/style.css

@@ -256,7 +256,7 @@ div[id^=popper_].dropdown .v-popper__inner .dropdown-menu .dropdown-divider {
   --tw-content: "";
   content: var(--tw-content);
 }
-input[type='checkbox'][data-v-6729bf3b]:checked {
+input[type='checkbox'][data-v-01f2e2c0]:checked {
   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3E%3C/svg%3E");
 }
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pequity/squirrel",
   "description": "Squirrel component library",
-  "version": "1.2.11",
+  "version": "1.2.12",
   "packageManager": "pnpm@8.9.2",
   "type": "module",
   "scripts": {
@@ -75,7 +75,7 @@
     "@types/jest": "^29.5.12",
     "@types/jsdom": "^21.1.7",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^20.14.8",
+    "@types/node": "^20.14.9",
     "@vitejs/plugin-vue": "^5.0.5",
     "@vue/compiler-sfc": "3.4.30",
     "@vue/test-utils": "^2.4.6",

package/squirrel/components/p-checkbox/p-checkbox.vue

@@ -1,11 +1,11 @@
 <template>
-  <label class="inline-flex items-center">
+  <label class="inline-flex items-center" :class="[{ hidden: $attrs.hidden }, $attrs.class]" :style="style">
     <slot name="label-before"></slot>
     <input
       type="checkbox"
       class="h-4 w-4 shrink-0 appearance-none rounded border border-p-gray-30 bg-surface duration-100 ease-in-out checked:border-none checked:bg-primary disabled:opacity-50"
+      v-bind="attrs"
       :checked="modelValue"
-      v-bind="$attrs"
       @change="$emit('update:modelValue', ($event.target as HTMLInputElement).checked)"
     />
     <slot name="label">
@@ -17,6 +17,8 @@
 </template>
 
 <script setup lang="ts">
+import { type StyleValue, computed, useAttrs } from 'vue';
+
 defineOptions({
   name: 'PCheckbox',
   inheritAttrs: false,
@@ -34,6 +36,18 @@ defineProps({
     default: '',
   },
 });
+
+const allAttrs = useAttrs();
+
+const attrs = computed(() => {
+  const { class: classes, style, ...rest } = allAttrs;
+
+  return rest;
+});
+
+const style = computed(() => {
+  return allAttrs.style as StyleValue;
+});
 </script>
 
 <style lang="css" scoped>