@semplice-studio/pa-design-system 0.1.1 → 0.3.0

package/dist/components/PaCard/PaCard.vue.d.ts

@@ -17,26 +17,29 @@ export interface PaCardProps {
     imageAlt?: string;
     imageRatio?: PaImageRatio;
 }
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PaCardProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PaCardProps> & Readonly<{}>, {
-    variant: PaCardVariant;
-    titleLevel: 1 | 2 | 3 | 4 | 5 | 6;
-    imageAlt: string;
-    typology: PaCardTypology;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    'header-leading'?: (props: {}) => any;
+declare var __VLS_4: {}, __VLS_12: {}, __VLS_18: {}, __VLS_20: {}, __VLS_22: {}, __VLS_24: {}, __VLS_26: {};
+type __VLS_Slots = {} & {
+    'header-leading'?: (props: typeof __VLS_4) => any;
 } & {
-    'header-trailing'?: (props: {}) => any;
+    'header-trailing'?: (props: typeof __VLS_12) => any;
 } & {
-    title?: (props: {}) => any;
+    title?: (props: typeof __VLS_18) => any;
 } & {
-    subtitle?: (props: {}) => any;
+    subtitle?: (props: typeof __VLS_20) => any;
 } & {
-    body?: (props: {}) => any;
+    body?: (props: typeof __VLS_22) => any;
 } & {
-    signature?: (props: {}) => any;
+    signature?: (props: typeof __VLS_24) => any;
 } & {
-    footer?: (props: {}) => any;
-}>;
+    footer?: (props: typeof __VLS_26) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<PaCardProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PaCardProps> & Readonly<{}>, {
+    variant: PaCardVariant;
+    titleLevel: 1 | 2 | 3 | 4 | 5 | 6;
+    imageAlt: string;
+    typology: PaCardTypology;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/components/PaCard/PaCard.vue.js

@@ -1,8 +1,8 @@
 import o from "./PaCard.vue2.js";
 /* empty css            */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-d5096dd1"]]);
+const f = /* @__PURE__ */ r(o, [["__scopeId", "data-v-830dccf3"]]);
 export {
-  m as default
+  f as default
 };
 //# sourceMappingURL=PaCard.vue.js.map

package/dist/components/PaCard/PaCard.vue2.js

@@ -1,40 +1,35 @@
-import { defineComponent as I, computed as a, useSlots as B, openBlock as t, createElementBlock as s, normalizeClass as T, createElementVNode as y, createVNode as N, createCommentVNode as l, renderSlot as r, createBlock as g, createTextVNode as n, toDisplayString as d, resolveDynamicComponent as V, withCtx as H } from "vue";
-import L from "../PaIcon/PaIcon.vue.js";
-import P from "../PaImage/PaImage.vue.js";
-import R from "../PaTag/PaTag.vue.js";
-const z = ["aria-labelledby"], A = { class: "pa-card__layout" }, D = {
+import { defineComponent as B, computed as a, useSlots as C, useId as T, openBlock as t, createElementBlock as s, normalizeClass as N, createElementVNode as y, createVNode as V, createCommentVNode as l, renderSlot as r, createBlock as g, createTextVNode as n, toDisplayString as d, resolveDynamicComponent as H, withCtx as L } from "vue";
+import P from "../PaIcon/PaIcon.vue.js";
+import R from "../PaImage/PaImage.vue.js";
+import z from "../PaTag/PaTag.vue.js";
+const A = ["aria-labelledby"], D = { class: "pa-card__layout" }, E = {
   key: 0,
   class: "pa-card__image-cell"
-}, E = { class: "pa-card__content" }, w = {
+}, w = { class: "pa-card__content" }, j = {
   key: 0,
   class: "pa-card__header"
-}, U = {
+}, q = {
   key: 0,
   class: "pa-card__header-leading"
-}, j = {
+}, F = {
   key: 1,
   class: "pa-card__header-trailing"
-}, q = {
+}, G = {
   key: 1,
   class: "pa-card__title-block"
-}, F = {
+}, J = {
   key: 1,
   class: "pa-card__subtitle"
-}, G = {
+}, K = {
   key: 2,
   class: "pa-card__body"
-}, J = { class: "pa-card__body-text" }, K = {
+}, M = { class: "pa-card__body-text" }, O = {
   key: 3,
   class: "pa-card__signature"
-}, M = {
+}, Q = {
   key: 4,
   class: "pa-card__footer"
-};
-let O = 0;
-function Q() {
-  return ++O;
-}
-const ee = /* @__PURE__ */ I({
+}, x = /* @__PURE__ */ B({
   __name: "PaCard",
   props: {
     typology: { default: "portrait" },
@@ -54,82 +49,82 @@ const ee = /* @__PURE__ */ I({
   setup(e) {
     const o = e, b = a(
       () => o.imageRatio ?? (o.typology === "landscape" ? "1:1" : "3:2")
-    ), c = B(), v = `pa-card-${Q()}__title`, u = a(() => !!c.title || !!o.title), h = a(() => !!c.subtitle || !!o.subtitle), f = a(() => !!c.body || !!o.body), k = a(() => !!c.signature || !!o.signature), m = a(
+    ), c = C(), v = `pa-card-${T()}__title`, u = a(() => !!c.title || !!o.title), h = a(() => !!c.subtitle || !!o.subtitle), f = a(() => !!c.body || !!o.body), k = a(() => !!c.signature || !!o.signature), m = a(
       () => !!c["header-leading"] || !!o.category || !!o.categoryIcon
     ), _ = a(
       () => !!c["header-trailing"] || !!o.date
-    ), $ = a(() => m.value || _.value), p = a(() => u.value || h.value), S = a(() => u.value ? v : void 0), C = a(() => `h${o.titleLevel}`);
-    return (i, W) => (t(), s("article", {
-      class: T(["pa-card", [`pa-card--${e.typology}`, `pa-card--${e.variant}`]]),
+    ), $ = a(() => m.value || _.value), p = a(() => u.value || h.value), S = a(() => u.value ? v : void 0), I = a(() => `h${o.titleLevel}`);
+    return (i, U) => (t(), s("article", {
+      class: N(["pa-card", [`pa-card--${e.typology}`, `pa-card--${e.variant}`]]),
       "aria-labelledby": S.value
     }, [
-      y("div", A, [
-        e.imageSrc && e.typology !== "process" ? (t(), s("div", D, [
-          N(P, {
+      y("div", D, [
+        e.imageSrc && e.typology !== "process" ? (t(), s("div", E, [
+          V(R, {
             src: e.imageSrc,
             alt: e.imageAlt,
             ratio: b.value
           }, null, 8, ["src", "alt", "ratio"])
         ])) : l("", !0),
-        y("div", E, [
-          $.value ? (t(), s("div", w, [
-            m.value ? (t(), s("div", U, [
+        y("div", w, [
+          $.value ? (t(), s("div", j, [
+            m.value ? (t(), s("div", q, [
               r(i.$slots, "header-leading", {}, () => [
-                e.categoryIcon ? (t(), g(L, {
+                e.categoryIcon ? (t(), g(P, {
                   key: 0,
                   name: e.categoryIcon,
                   size: "lg"
-                }, null, 8, ["name"])) : e.category ? (t(), g(R, {
+                }, null, 8, ["name"])) : e.category ? (t(), g(z, {
                   key: 1,
                   variant: "info",
                   label: e.category
                 }, null, 8, ["label"])) : l("", !0)
               ], !0)
             ])) : l("", !0),
-            _.value ? (t(), s("div", j, [
+            _.value ? (t(), s("div", F, [
               r(i.$slots, "header-trailing", {}, () => [
                 n(d(e.date), 1)
               ], !0)
             ])) : l("", !0)
           ])) : l("", !0),
-          p.value ? (t(), s("div", q, [
-            u.value ? (t(), g(V(C.value), {
+          p.value ? (t(), s("div", G, [
+            u.value ? (t(), g(H(I.value), {
               key: 0,
               id: v,
               class: "pa-card__title"
             }, {
-              default: H(() => [
+              default: L(() => [
                 r(i.$slots, "title", {}, () => [
                   n(d(e.title), 1)
                 ], !0)
               ]),
               _: 3
             })) : l("", !0),
-            h.value ? (t(), s("p", F, [
+            h.value ? (t(), s("p", J, [
               r(i.$slots, "subtitle", {}, () => [
                 n(d(e.subtitle), 1)
               ], !0)
             ])) : l("", !0)
           ])) : l("", !0),
-          f.value ? (t(), s("div", G, [
+          f.value ? (t(), s("div", K, [
             r(i.$slots, "body", {}, () => [
-              y("p", J, d(e.body), 1)
+              y("p", M, d(e.body), 1)
             ], !0)
           ])) : l("", !0),
-          k.value ? (t(), s("p", K, [
+          k.value ? (t(), s("p", O, [
             r(i.$slots, "signature", {}, () => [
               n(d(e.signature), 1)
             ], !0)
           ])) : l("", !0),
-          i.$slots.footer ? (t(), s("div", M, [
+          i.$slots.footer ? (t(), s("div", Q, [
             r(i.$slots, "footer", {}, void 0, !0)
           ])) : l("", !0)
         ])
       ])
-    ], 10, z));
+    ], 10, A));
   }
 });
 export {
-  ee as default
+  x as default
 };
 //# sourceMappingURL=PaCard.vue2.js.map

package/dist/components/PaCard/PaCard.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaCard.vue2.js","sources":["../../../src/components/PaCard/PaCard.vue"],"sourcesContent":["<script lang=\"ts\">\nlet cardUid = 0\nfunction nextCardId() {\n  return ++cardUid\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, useSlots } from 'vue'\nimport PaIcon from '../PaIcon/PaIcon.vue'\nimport PaImage from '../PaImage/PaImage.vue'\nimport PaTag from '../PaTag/PaTag.vue'\nimport type { PaImageRatio } from '../PaImage/PaImage.vue'\nimport type { PaIconName } from '../PaIcon/PaIcon.vue'\n\nexport type PaCardTypology = 'landscape' | 'portrait' | 'process'\nexport type PaCardVariant = 'light' | 'dark'\n\nexport interface PaCardProps {\n  typology?: PaCardTypology\n  variant?: PaCardVariant\n  title?: string\n  titleLevel?: 1 | 2 | 3 | 4 | 5 | 6\n  subtitle?: string\n  body?: string\n  signature?: string\n  date?: string\n  category?: string\n  categoryIcon?: PaIconName\n  imageSrc?: string\n  imageAlt?: string\n  imageRatio?: PaImageRatio\n}\n\nconst props = withDefaults(defineProps<PaCardProps>(), {\n  typology: 'portrait',\n  variant: 'light',\n  titleLevel: 3,\n  imageAlt: '',\n})\n\nconst resolvedRatio = computed<PaImageRatio>(\n  () => props.imageRatio ?? (props.typology === 'landscape' ? '1:1' : '3:2'),\n)\n\nconst slots = useSlots()\n\nconst titleId = `pa-card-${nextCardId()}__title`\n\nconst hasTitle = computed(() => !!slots.title || !!props.title)\nconst hasSubtitle = computed(() => !!slots.subtitle || !!props.subtitle)\nconst hasBody = computed(() => !!slots.body || !!props.body)\nconst hasSignature = computed(() => !!slots.signature || !!props.signature)\nconst hasHeaderLeading = computed(\n  () => !!slots['header-leading'] || !!props.category || !!props.categoryIcon,\n)\nconst hasHeaderTrailing = computed(\n  () => !!slots['header-trailing'] || !!props.date,\n)\nconst hasHeader = computed(() => hasHeaderLeading.value || hasHeaderTrailing.value)\nconst hasTitleBlock = computed(() => hasTitle.value || hasSubtitle.value)\nconst labelledBy = computed(() => (hasTitle.value ? titleId : undefined))\nconst titleTag = computed(() => `h${props.titleLevel}` as const)\n</script>\n\n<template>\n  <article class=\"pa-card\"\n           :class=\"[`pa-card--${typology}`, `pa-card--${variant}`]\"\n           :aria-labelledby=\"labelledBy\">\n    <div class=\"pa-card__layout\">\n    <div v-if=\"imageSrc && typology !== 'process'\"\n         class=\"pa-card__image-cell\">\n      <PaImage :src=\"imageSrc\"\n               :alt=\"imageAlt\"\n               :ratio=\"resolvedRatio\" />\n    </div>\n\n    <div class=\"pa-card__content\">\n      <div v-if=\"hasHeader\"\n           class=\"pa-card__header\">\n        <div v-if=\"hasHeaderLeading\"\n             class=\"pa-card__header-leading\">\n          <slot name=\"header-leading\">\n            <PaIcon v-if=\"categoryIcon\"\n                    :name=\"categoryIcon\"\n                    size=\"lg\" />\n            <PaTag v-else-if=\"category\"\n                   variant=\"info\"\n                   :label=\"category\" />\n          </slot>\n        </div>\n        <div v-if=\"hasHeaderTrailing\"\n             class=\"pa-card__header-trailing\">\n          <slot name=\"header-trailing\">{{ date }}</slot>\n        </div>\n      </div>\n\n      <div v-if=\"hasTitleBlock\"\n           class=\"pa-card__title-block\">\n        <component :is=\"titleTag\"\n                   v-if=\"hasTitle\"\n                   :id=\"titleId\"\n                   class=\"pa-card__title\">\n          <slot name=\"title\">{{ title }}</slot>\n        </component>\n        <p v-if=\"hasSubtitle\"\n           class=\"pa-card__subtitle\">\n          <slot name=\"subtitle\">{{ subtitle }}</slot>\n        </p>\n      </div>\n\n      <div v-if=\"hasBody\"\n           class=\"pa-card__body\">\n        <slot name=\"body\">\n          <p class=\"pa-card__body-text\">{{ body }}</p>\n        </slot>\n      </div>\n\n      <p v-if=\"hasSignature\"\n         class=\"pa-card__signature\">\n        <slot name=\"signature\">{{ signature }}</slot>\n      </p>\n\n      <div v-if=\"$slots.footer\"\n           class=\"pa-card__footer\">\n        <slot name=\"footer\" />\n      </div>\n    </div>\n    </div>\n  </article>\n</template>\n\n<style scoped>\n.pa-card {\n  display: block;\n  background-color: var(--pa-card-bg);\n  border-radius: var(--pa-radius-smooth);\n  box-shadow: var(--pa-shadow-elevation-01);\n  overflow: hidden;\n  container-type: inline-size;\n}\n\n.pa-card__layout {\n  display: flex;\n  flex-direction: column;\n}\n\n.pa-card--light {\n  --pa-card-bg: var(--pa-color-bg-white);\n  --pa-card-title-color: var(--pa-color-primary);\n  --pa-card-body-color: var(--pa-color-text-secondary-gray);\n  --pa-card-date-color: var(--pa-color-text-secondary-gray);\n  --pa-card-signature-color: var(--pa-color-text-secondary-gray);\n  --pa-card-subtitle-color: var(--pa-color-text-secondary-gray);\n  --pa-card-action-color: var(--pa-color-primary);\n}\n\n.pa-card--dark {\n  --pa-card-bg: var(--pa-color-bg-primary-dark-115);\n  --pa-card-title-color: var(--pa-color-bg-white);\n  --pa-card-body-color: var(--pa-color-bg-white);\n  --pa-card-date-color: var(--pa-color-bg-white);\n  --pa-card-signature-color: var(--pa-color-bg-white);\n  --pa-card-subtitle-color: var(--pa-color-bg-white);\n  --pa-card-action-color: var(--pa-color-accent);\n}\n\n.pa-card--process.pa-card--dark {\n  --pa-card-title-color: var(--pa-color-bg-white);\n}\n\n.pa-card--portrait .pa-card__image-cell {\n  width: 100%;\n}\n\n.pa-card--portrait .pa-card__content {\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  padding: 32px;\n  min-width: 0;\n}\n\n.pa-card__header {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  width: 100%;\n}\n\n.pa-card__header-leading {\n  flex: 1 0 0;\n  min-width: 0;\n}\n\n.pa-card__header-trailing {\n  flex: 0 0 auto;\n  font-family: var(--pa-font-family-mono);\n  font-weight: 400;\n  font-size: 16px;\n  line-height: 18px;\n  color: var(--pa-card-date-color);\n}\n\n.pa-card__title-block {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  width: 100%;\n}\n\n.pa-card__title {\n  margin: 0;\n  font-family: var(--pa-font-family-base);\n  font-weight: 700;\n  font-size: 24px;\n  line-height: 28px;\n  letter-spacing: -0.5px;\n  color: var(--pa-card-title-color);\n}\n\n.pa-card--portrait .pa-card__subtitle {\n  margin: 0;\n  font-family: var(--pa-font-family-base);\n  font-weight: 600;\n  font-size: 18px;\n  line-height: 22px;\n  letter-spacing: -0.5px;\n  color: var(--pa-card-subtitle-color);\n}\n\n.pa-card__body,\n.pa-card__body-text {\n  margin: 0;\n  font-family: var(--pa-font-family-base);\n  font-weight: 400;\n  font-size: 16px;\n  line-height: 20px;\n  color: var(--pa-card-body-color);\n}\n\n.pa-card__signature {\n  margin: 0;\n  font-family: var(--pa-font-family-mono);\n  font-weight: 400;\n  font-size: 16px;\n  line-height: 18px;\n  color: var(--pa-card-signature-color);\n}\n\n.pa-card__footer {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  width: 100%;\n}\n\n/* Landscape */\n.pa-card--landscape .pa-card__layout {\n  display: grid;\n  grid-template-columns: 370px 1fr;\n  align-items: stretch;\n}\n\n.pa-card--landscape .pa-card__image-cell {\n  width: auto;\n  height: 100%;\n}\n\n.pa-card--landscape .pa-card__content {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  gap: 24px;\n  padding: 32px 48px;\n}\n\n.pa-card--landscape .pa-card__title {\n  font-size: 32px;\n  line-height: 36px;\n  letter-spacing: -1px;\n}\n\n.pa-card--landscape .pa-card__subtitle {\n  margin: 0;\n  font-family: var(--pa-font-family-base);\n  font-weight: 600;\n  font-size: 20px;\n  line-height: 24px;\n  letter-spacing: -0.5px;\n  color: var(--pa-card-subtitle-color);\n}\n\n/* Process */\n.pa-card--process .pa-card__content {\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  padding: 32px;\n  min-width: 0;\n}\n\n.pa-card--process.pa-card--light {\n  --pa-card-title-color: var(--pa-color-text-secondary-gray);\n}\n\n.pa-card--process .pa-card__subtitle,\n.pa-card--process .pa-card__signature {\n  display: none;\n}\n\n.pa-card--process .pa-card__footer {\n  padding-top: 24px;\n}\n\n.pa-card--process .pa-card__header-leading :deep(svg) {\n  width: 32px;\n  height: 32px;\n}\n\n@container (max-width: 720px) {\n  .pa-card--landscape .pa-card__layout {\n    grid-template-columns: 1fr;\n  }\n\n  .pa-card--landscape .pa-card__image-cell {\n    width: 100%;\n    height: auto;\n  }\n\n  .pa-card--landscape .pa-card__image-cell :deep(.pa-image) {\n    aspect-ratio: 3 / 2 !important;\n  }\n\n  .pa-card--landscape .pa-card__content {\n    padding: 24px;\n  }\n\n  .pa-card--landscape .pa-card__title {\n    font-size: 24px;\n    line-height: 28px;\n    letter-spacing: -0.5px;\n  }\n}\n</style>\n"],"names":["cardUid","nextCardId","props","__props","resolvedRatio","computed","slots","useSlots","titleId","hasTitle","hasSubtitle","hasBody","hasSignature","hasHeaderLeading","hasHeaderTrailing","hasHeader","hasTitleBlock","labelledBy","titleTag","_createElementBlock","_normalizeClass","_createElementVNode","_hoisted_2","_openBlock","_hoisted_3","_createVNode","PaImage","_hoisted_4","_hoisted_5","_hoisted_6","_renderSlot","_ctx","_createBlock","PaIcon","PaTag","_hoisted_7","_hoisted_8","_resolveDynamicComponent","_hoisted_9","_hoisted_10","_hoisted_11","_toDisplayString","_hoisted_12","$slots","_hoisted_13"],"mappings":"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"}
+{"version":3,"file":"PaCard.vue2.js","sources":["../../../src/components/PaCard/PaCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, useId, useSlots } from 'vue'\nimport PaIcon from '../PaIcon/PaIcon.vue'\nimport PaImage from '../PaImage/PaImage.vue'\nimport PaTag from '../PaTag/PaTag.vue'\nimport type { PaImageRatio } from '../PaImage/PaImage.vue'\nimport type { PaIconName } from '../PaIcon/PaIcon.vue'\n\nexport type PaCardTypology = 'landscape' | 'portrait' | 'process'\nexport type PaCardVariant = 'light' | 'dark'\n\nexport interface PaCardProps {\n  typology?: PaCardTypology\n  variant?: PaCardVariant\n  title?: string\n  titleLevel?: 1 | 2 | 3 | 4 | 5 | 6\n  subtitle?: string\n  body?: string\n  signature?: string\n  date?: string\n  category?: string\n  categoryIcon?: PaIconName\n  imageSrc?: string\n  imageAlt?: string\n  imageRatio?: PaImageRatio\n}\n\nconst props = withDefaults(defineProps<PaCardProps>(), {\n  typology: 'portrait',\n  variant: 'light',\n  titleLevel: 3,\n  imageAlt: '',\n})\n\nconst resolvedRatio = computed<PaImageRatio>(\n  () => props.imageRatio ?? (props.typology === 'landscape' ? '1:1' : '3:2'),\n)\n\nconst slots = useSlots()\n\nconst titleId = `pa-card-${useId()}__title`\n\nconst hasTitle = computed(() => !!slots.title || !!props.title)\nconst hasSubtitle = computed(() => !!slots.subtitle || !!props.subtitle)\nconst hasBody = computed(() => !!slots.body || !!props.body)\nconst hasSignature = computed(() => !!slots.signature || !!props.signature)\nconst hasHeaderLeading = computed(\n  () => !!slots['header-leading'] || !!props.category || !!props.categoryIcon,\n)\nconst hasHeaderTrailing = computed(\n  () => !!slots['header-trailing'] || !!props.date,\n)\nconst hasHeader = computed(() => hasHeaderLeading.value || hasHeaderTrailing.value)\nconst hasTitleBlock = computed(() => hasTitle.value || hasSubtitle.value)\nconst labelledBy = computed(() => (hasTitle.value ? titleId : undefined))\nconst titleTag = computed(() => `h${props.titleLevel}` as const)\n</script>\n\n<template>\n  <article class=\"pa-card\"\n           :class=\"[`pa-card--${typology}`, `pa-card--${variant}`]\"\n           :aria-labelledby=\"labelledBy\">\n    <div class=\"pa-card__layout\">\n    <div v-if=\"imageSrc && typology !== 'process'\"\n         class=\"pa-card__image-cell\">\n      <PaImage :src=\"imageSrc\"\n               :alt=\"imageAlt\"\n               :ratio=\"resolvedRatio\" />\n    </div>\n\n    <div class=\"pa-card__content\">\n      <div v-if=\"hasHeader\"\n           class=\"pa-card__header\">\n        <div v-if=\"hasHeaderLeading\"\n             class=\"pa-card__header-leading\">\n          <slot name=\"header-leading\">\n            <PaIcon v-if=\"categoryIcon\"\n                    :name=\"categoryIcon\"\n                    size=\"lg\" />\n            <PaTag v-else-if=\"category\"\n                   variant=\"info\"\n                   :label=\"category\" />\n          </slot>\n        </div>\n        <div v-if=\"hasHeaderTrailing\"\n             class=\"pa-card__header-trailing\">\n          <slot name=\"header-trailing\">{{ date }}</slot>\n        </div>\n      </div>\n\n      <div v-if=\"hasTitleBlock\"\n           class=\"pa-card__title-block\">\n        <component :is=\"titleTag\"\n                   v-if=\"hasTitle\"\n                   :id=\"titleId\"\n                   class=\"pa-card__title\">\n          <slot name=\"title\">{{ title }}</slot>\n        </component>\n        <p v-if=\"hasSubtitle\"\n           class=\"pa-card__subtitle\">\n          <slot name=\"subtitle\">{{ subtitle }}</slot>\n        </p>\n      </div>\n\n      <div v-if=\"hasBody\"\n           class=\"pa-card__body\">\n        <slot name=\"body\">\n          <p class=\"pa-card__body-text\">{{ body }}</p>\n        </slot>\n      </div>\n\n      <p v-if=\"hasSignature\"\n         class=\"pa-card__signature\">\n        <slot name=\"signature\">{{ signature }}</slot>\n      </p>\n\n      <div v-if=\"$slots.footer\"\n           class=\"pa-card__footer\">\n        <slot name=\"footer\" />\n      </div>\n    </div>\n    </div>\n  </article>\n</template>\n\n<style scoped>\n.pa-card {\n  display: block;\n  background-color: var(--pa-card-bg);\n  border-radius: var(--pa-radius-smooth);\n  box-shadow: var(--pa-shadow-elevation-01);\n  overflow: hidden;\n  container-type: inline-size;\n}\n\n.pa-card__layout {\n  display: flex;\n  flex-direction: column;\n}\n\n.pa-card--light {\n  --pa-card-bg: var(--pa-color-bg-white);\n  --pa-card-title-color: var(--pa-color-primary);\n  --pa-card-body-color: var(--pa-color-text-secondary-gray);\n  --pa-card-date-color: var(--pa-color-text-secondary-gray);\n  --pa-card-signature-color: var(--pa-color-text-secondary-gray);\n  --pa-card-subtitle-color: var(--pa-color-text-secondary-gray);\n  --pa-card-action-color: var(--pa-color-primary);\n}\n\n.pa-card--dark {\n  --pa-card-bg: var(--pa-color-bg-primary-dark-115);\n  --pa-card-title-color: var(--pa-color-bg-white);\n  --pa-card-body-color: var(--pa-color-bg-white);\n  --pa-card-date-color: var(--pa-color-bg-white);\n  --pa-card-signature-color: var(--pa-color-bg-white);\n  --pa-card-subtitle-color: var(--pa-color-bg-white);\n  --pa-card-action-color: var(--pa-color-accent);\n}\n\n.pa-card--process.pa-card--dark {\n  --pa-card-title-color: var(--pa-color-bg-white);\n}\n\n.pa-card--portrait .pa-card__image-cell {\n  width: 100%;\n}\n\n.pa-card--portrait .pa-card__content {\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  padding: 32px;\n  min-width: 0;\n}\n\n.pa-card__header {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  width: 100%;\n}\n\n.pa-card__header-leading {\n  flex: 1 0 0;\n  min-width: 0;\n}\n\n.pa-card__header-trailing {\n  flex: 0 0 auto;\n  font-family: var(--pa-font-family-mono);\n  font-weight: 400;\n  font-size: 16px;\n  line-height: 18px;\n  color: var(--pa-card-date-color);\n}\n\n.pa-card__title-block {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  width: 100%;\n}\n\n.pa-card__title {\n  margin: 0;\n  font-family: var(--pa-font-family-base);\n  font-weight: 700;\n  font-size: 24px;\n  line-height: 28px;\n  letter-spacing: -0.5px;\n  color: var(--pa-card-title-color);\n}\n\n.pa-card--portrait .pa-card__subtitle {\n  margin: 0;\n  font-family: var(--pa-font-family-base);\n  font-weight: 600;\n  font-size: 18px;\n  line-height: 22px;\n  letter-spacing: -0.5px;\n  color: var(--pa-card-subtitle-color);\n}\n\n.pa-card__body,\n.pa-card__body-text {\n  margin: 0;\n  font-family: var(--pa-font-family-base);\n  font-weight: 400;\n  font-size: 16px;\n  line-height: 20px;\n  color: var(--pa-card-body-color);\n}\n\n.pa-card__signature {\n  margin: 0;\n  font-family: var(--pa-font-family-mono);\n  font-weight: 400;\n  font-size: 16px;\n  line-height: 18px;\n  color: var(--pa-card-signature-color);\n}\n\n.pa-card__footer {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  width: 100%;\n}\n\n/* Landscape */\n.pa-card--landscape .pa-card__layout {\n  display: grid;\n  grid-template-columns: 370px 1fr;\n  align-items: stretch;\n}\n\n.pa-card--landscape .pa-card__image-cell {\n  width: auto;\n  height: 100%;\n}\n\n.pa-card--landscape .pa-card__content {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  gap: 24px;\n  padding: 32px 48px;\n}\n\n.pa-card--landscape .pa-card__title {\n  font-size: 32px;\n  line-height: 36px;\n  letter-spacing: -1px;\n}\n\n.pa-card--landscape .pa-card__subtitle {\n  margin: 0;\n  font-family: var(--pa-font-family-base);\n  font-weight: 600;\n  font-size: 20px;\n  line-height: 24px;\n  letter-spacing: -0.5px;\n  color: var(--pa-card-subtitle-color);\n}\n\n/* Process */\n.pa-card--process .pa-card__content {\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  padding: 32px;\n  min-width: 0;\n}\n\n.pa-card--process.pa-card--light {\n  --pa-card-title-color: var(--pa-color-text-secondary-gray);\n}\n\n.pa-card--process .pa-card__subtitle,\n.pa-card--process .pa-card__signature {\n  display: none;\n}\n\n.pa-card--process .pa-card__footer {\n  padding-top: 24px;\n}\n\n.pa-card--process .pa-card__header-leading :deep(svg) {\n  width: 32px;\n  height: 32px;\n}\n\n@container (max-width: 720px) {\n  .pa-card--landscape .pa-card__layout {\n    grid-template-columns: 1fr;\n  }\n\n  .pa-card--landscape .pa-card__image-cell {\n    width: 100%;\n    height: auto;\n  }\n\n  .pa-card--landscape .pa-card__image-cell :deep(.pa-image) {\n    aspect-ratio: 3 / 2 !important;\n  }\n\n  .pa-card--landscape .pa-card__content {\n    padding: 24px;\n  }\n\n  .pa-card--landscape .pa-card__title {\n    font-size: 24px;\n    line-height: 28px;\n    letter-spacing: -0.5px;\n  }\n}\n</style>\n"],"names":["props","__props","resolvedRatio","computed","slots","useSlots","titleId","useId","hasTitle","hasSubtitle","hasBody","hasSignature","hasHeaderLeading","hasHeaderTrailing","hasHeader","hasTitleBlock","labelledBy","titleTag","_createElementBlock","_normalizeClass","_createElementVNode","_hoisted_2","_openBlock","_hoisted_3","_createVNode","PaImage","_hoisted_4","_hoisted_5","_hoisted_6","_renderSlot","_ctx","_createBlock","PaIcon","PaTag","_hoisted_7","_hoisted_8","_resolveDynamicComponent","_hoisted_9","_hoisted_10","_hoisted_11","_toDisplayString","_hoisted_12","$slots","_hoisted_13"],"mappings":"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"}

package/dist/components/PaCheckbox/PaCheckbox.vue.d.ts

@@ -10,14 +10,13 @@ export interface PaCheckboxProps {
     error?: string | boolean;
     valid?: boolean;
 }
-export declare function nextPaCheckboxId(): string;
-declare const _default: import("vue").DefineComponent<PaCheckboxProps & {
+type __VLS_Props = PaCheckboxProps;
+type __VLS_PublicProps = __VLS_Props & {
     modelValue?: boolean;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+};
+declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<PaCheckboxProps & {
-    modelValue?: boolean;
-}> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {
     error: string | boolean;

package/dist/components/PaCheckbox/PaCheckbox.vue.js

@@ -1,10 +1,8 @@
 import o from "./PaCheckbox.vue2.js";
-import { nextPaCheckboxId as p } from "./PaCheckbox.vue2.js";
 /* empty css                */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-const a = /* @__PURE__ */ t(o, [["__scopeId", "data-v-e4cfd6c4"]]);
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-4c1d4d61"]]);
 export {
-  a as default,
-  p as nextPaCheckboxId
+  m as default
 };
 //# sourceMappingURL=PaCheckbox.vue.js.map

package/dist/components/PaCheckbox/PaCheckbox.vue.js.map

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

package/dist/components/PaCheckbox/PaCheckbox.vue2.js

@@ -1,16 +1,11 @@
-import { defineComponent as C, useModel as M, computed as l, openBlock as t, createElementBlock as n, createElementVNode as c, normalizeClass as h, withDirectives as V, vModelCheckbox as q, createBlock as b, createCommentVNode as r, toDisplayString as p, mergeModels as I } from "vue";
+import { defineComponent as M, useModel as C, useId as V, computed as l, openBlock as t, createElementBlock as c, createElementVNode as n, normalizeClass as h, withDirectives as q, vModelCheckbox as I, createBlock as b, createCommentVNode as r, toDisplayString as p, mergeModels as w } from "vue";
 import k from "../PaIcon/PaIcon.vue.js";
-const w = { class: "pa-checkbox-field" }, z = ["for"], T = { class: "pa-checkbox__box" }, $ = ["id", "name", "value", "disabled", "required", ".indeterminate", "aria-invalid", "aria-describedby"], A = {
+const z = { class: "pa-checkbox-field" }, T = ["for"], $ = { class: "pa-checkbox__box" }, A = ["id", "name", "value", "disabled", "required", ".indeterminate", "aria-invalid", "aria-describedby"], D = {
   key: 0,
   class: "pa-checkbox__label"
-}, D = ["id"];
-let E = 0;
-function N() {
-  return `pa-checkbox-${++E}`;
-}
-const j = /* @__PURE__ */ C({
+}, E = ["id"], U = /* @__PURE__ */ M({
   __name: "PaCheckbox",
-  props: /* @__PURE__ */ I({
+  props: /* @__PURE__ */ w({
     label: {},
     id: {},
     name: {},
@@ -27,14 +22,14 @@ const j = /* @__PURE__ */ C({
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const a = e, s = M(e, "modelValue"), f = N(), i = l(() => a.id ?? f), u = l(() => `${i.value}-msg`), x = l(() => s.value), y = l(() => !s.value && a.indeterminate), o = l(() => !!a.error), m = l(() => a.valid && !o.value), g = l(
+    const a = e, s = C(e, "modelValue"), f = `pa-checkbox-${V()}`, d = l(() => a.id ?? f), u = l(() => `${d.value}-msg`), x = l(() => s.value), y = l(() => !s.value && a.indeterminate), o = l(() => !!a.error), m = l(() => a.valid && !o.value), g = l(
       () => typeof a.error == "string" && a.error.length > 0 ? a.error : null
     ), _ = l(
       () => !o.value && !m.value && a.helperText ? a.helperText : null
-    ), d = l(() => g.value ?? _.value);
-    return (P, v) => (t(), n("div", w, [
-      c("label", {
-        for: i.value,
+    ), i = l(() => g.value ?? _.value);
+    return (N, v) => (t(), c("div", z, [
+      n("label", {
+        for: d.value,
         class: h([
           "pa-checkbox",
           {
@@ -44,9 +39,9 @@ const j = /* @__PURE__ */ C({
           }
         ])
       }, [
-        c("span", T, [
-          V(c("input", {
-            id: i.value,
+        n("span", $, [
+          q(n("input", {
+            id: d.value,
             "onUpdate:modelValue": v[0] || (v[0] = (B) => s.value = B),
             type: "checkbox",
             name: e.name,
@@ -55,10 +50,10 @@ const j = /* @__PURE__ */ C({
             required: e.required,
             ".indeterminate": e.indeterminate,
             "aria-invalid": o.value || void 0,
-            "aria-describedby": d.value ? u.value : void 0,
+            "aria-describedby": i.value ? u.value : void 0,
             class: "pa-checkbox__input"
-          }, null, 40, $), [
-            [q, s.value]
+          }, null, 40, A), [
+            [I, s.value]
           ]),
           x.value ? (t(), b(k, {
             key: 0,
@@ -72,18 +67,17 @@ const j = /* @__PURE__ */ C({
             class: "pa-checkbox__glyph"
           })) : r("", !0)
         ]),
-        e.label ? (t(), n("span", A, p(e.label), 1)) : r("", !0)
-      ], 10, z),
-      d.value ? (t(), n("div", {
+        e.label ? (t(), c("span", D, p(e.label), 1)) : r("", !0)
+      ], 10, T),
+      i.value ? (t(), c("div", {
         key: 0,
         id: u.value,
         class: h(["pa-checkbox__message", { "pa-checkbox__message--error": o.value }])
-      }, p(d.value), 11, D)) : r("", !0)
+      }, p(i.value), 11, E)) : r("", !0)
     ]));
   }
 });
 export {
-  j as default,
-  N as nextPaCheckboxId
+  U as default
 };
 //# sourceMappingURL=PaCheckbox.vue2.js.map

package/dist/components/PaCheckbox/PaCheckbox.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaCheckbox.vue2.js","sources":["../../../src/components/PaCheckbox/PaCheckbox.vue"],"sourcesContent":["<script lang=\"ts\">\nlet uid = 0\nexport function nextPaCheckboxId() {\n  return `pa-checkbox-${++uid}`\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport PaIcon from '../PaIcon/PaIcon.vue'\n\nexport interface PaCheckboxProps {\n  label?: string\n  id?: string\n  name?: string\n  value?: string\n  indeterminate?: boolean\n  disabled?: boolean\n  required?: boolean\n  helperText?: string\n  error?: string | boolean\n  valid?: boolean\n}\n\nconst props = withDefaults(defineProps<PaCheckboxProps>(), {\n  indeterminate: false,\n  disabled: false,\n  required: false,\n  error: false,\n  valid: false,\n})\n\nconst model = defineModel<boolean>({ default: false })\n\nconst generatedId = nextPaCheckboxId()\nconst inputId = computed(() => props.id ?? generatedId)\nconst messageId = computed(() => `${inputId.value}-msg`)\n\nconst showCheck = computed(() => model.value)\nconst showMinus = computed(() => !model.value && props.indeterminate)\n\nconst errorActive = computed(() => Boolean(props.error))\nconst validActive = computed(() => props.valid && !errorActive.value)\n\nconst errorMessage = computed(() =>\n  typeof props.error === 'string' && props.error.length > 0 ? props.error : null,\n)\nconst helperMessage = computed(() =>\n  !errorActive.value && !validActive.value && props.helperText ? props.helperText : null,\n)\nconst message = computed(() => errorMessage.value ?? helperMessage.value)\n</script>\n\n<template>\n  <div class=\"pa-checkbox-field\">\n    <label\n      :for=\"inputId\"\n      :class=\"[\n        'pa-checkbox',\n        {\n          'pa-checkbox--disabled': disabled,\n          'pa-checkbox--error': errorActive,\n          'pa-checkbox--valid': validActive,\n        },\n      ]\"\n    >\n      <span class=\"pa-checkbox__box\">\n        <input\n          :id=\"inputId\"\n          v-model=\"model\"\n          type=\"checkbox\"\n          :name=\"name\"\n          :value=\"value\"\n          :disabled=\"disabled\"\n          :required=\"required\"\n          :indeterminate.prop=\"indeterminate\"\n          :aria-invalid=\"errorActive || undefined\"\n          :aria-describedby=\"message ? messageId : undefined\"\n          class=\"pa-checkbox__input\"\n        />\n        <PaIcon\n          v-if=\"showCheck\"\n          name=\"check\"\n          size=\"sm\"\n          class=\"pa-checkbox__glyph\"\n        />\n        <PaIcon\n          v-else-if=\"showMinus\"\n          name=\"minus\"\n          size=\"sm\"\n          class=\"pa-checkbox__glyph\"\n        />\n      </span>\n      <span v-if=\"label\" class=\"pa-checkbox__label\">{{ label }}</span>\n    </label>\n    <div\n      v-if=\"message\"\n      :id=\"messageId\"\n      :class=\"['pa-checkbox__message', { 'pa-checkbox__message--error': errorActive }]\"\n    >\n      {{ message }}\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.pa-checkbox-field {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: var(--pa-space-2xs);\n  font-family: var(--pa-font-family-base);\n}\n\n.pa-checkbox {\n  display: inline-flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 10px;\n  cursor: pointer;\n}\n\n.pa-checkbox--disabled {\n  cursor: not-allowed;\n}\n\n.pa-checkbox__box {\n  position: relative;\n  flex: 0 0 auto;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n}\n\n.pa-checkbox__input {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  appearance: none;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  background: var(--pa-color-bg-white);\n  border: var(--pa-border-xs) solid var(--pa-color-neutral-gray);\n  border-radius: var(--pa-radius-smooth);\n  cursor: inherit;\n  transition: border-color 120ms ease, background-color 120ms ease;\n}\n\n.pa-checkbox:hover:not(.pa-checkbox--disabled) .pa-checkbox__input:not(:checked):not(:indeterminate) {\n  border-color: var(--pa-color-primary-hover);\n}\n\n.pa-checkbox:hover:not(.pa-checkbox--disabled):not(.pa-checkbox--error):not(.pa-checkbox--valid) .pa-checkbox__label {\n  color: var(--pa-color-primary-hover);\n}\n\n.pa-checkbox__input:focus { outline: none; }\n\n.pa-checkbox__input:focus-visible {\n  outline: var(--pa-border-xs) solid var(--pa-color-primary-focus-border);\n  outline-offset: 3px;\n}\n\n.pa-checkbox__input:checked,\n.pa-checkbox__input:indeterminate {\n  background: var(--pa-color-primary);\n  border-color: var(--pa-color-primary);\n}\n\n.pa-checkbox--error .pa-checkbox__input:not(:disabled) {\n  border-color: var(--pa-color-error);\n}\n\n.pa-checkbox--valid .pa-checkbox__input:not(:disabled) {\n  border-color: var(--pa-color-success);\n}\n\n.pa-checkbox__input:disabled {\n  cursor: not-allowed;\n  background: var(--pa-color-bg-disabled-gray);\n  border-color: var(--pa-color-bg-disabled-gray);\n}\n\n.pa-checkbox__glyph {\n  position: relative;\n  width: 12px;\n  height: 12px;\n  pointer-events: none;\n  color: var(--pa-color-text-white);\n}\n\n.pa-checkbox--disabled .pa-checkbox__glyph {\n  color: var(--pa-color-text-disabled-gray);\n}\n\n.pa-checkbox__label {\n  font-size: var(--pa-font-body-size);\n  line-height: var(--pa-font-body-line-height);\n  font-weight: var(--pa-font-body-weight);\n  color: var(--pa-color-text-secondary-gray);\n}\n\n.pa-checkbox--disabled .pa-checkbox__label {\n  color: var(--pa-color-text-disabled-gray);\n}\n\n.pa-checkbox__message {\n  font-size: var(--pa-font-label-helper-size);\n  line-height: var(--pa-font-label-helper-line-height);\n  font-weight: var(--pa-font-label-helper-weight);\n  color: var(--pa-color-text-secondary-gray);\n  padding-left: 34px;\n}\n\n.pa-checkbox__message--error {\n  color: var(--pa-color-error);\n}\n</style>\n"],"names":["uid","nextPaCheckboxId","props","__props","model","_useModel","generatedId","inputId","computed","messageId","showCheck","showMinus","errorActive","validActive","errorMessage","helperMessage","message","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_hoisted_3","$event","_createBlock","PaIcon","_hoisted_5","_toDisplayString","_hoisted_6"],"mappings":";;;;;;AACA,IAAIA,IAAM;AACH,SAASC,IAAmB;AACjC,SAAO,eAAe,EAAED,CAAG;AAC7B;;;;;;;;;;;;;;;;;;;;AAoBA,UAAME,IAAQC,GAQRC,IAAQC,EAAoBF,GAAA,YAAmB,GAE/CG,IAAcL,EAAA,GACdM,IAAUC,EAAS,MAAMN,EAAM,MAAMI,CAAW,GAChDG,IAAYD,EAAS,MAAM,GAAGD,EAAQ,KAAK,MAAM,GAEjDG,IAAYF,EAAS,MAAMJ,EAAM,KAAK,GACtCO,IAAYH,EAAS,MAAM,CAACJ,EAAM,SAASF,EAAM,aAAa,GAE9DU,IAAcJ,EAAS,MAAM,EAAQN,EAAM,KAAM,GACjDW,IAAcL,EAAS,MAAMN,EAAM,SAAS,CAACU,EAAY,KAAK,GAE9DE,IAAeN;AAAA,MAAS,MAC5B,OAAON,EAAM,SAAU,YAAYA,EAAM,MAAM,SAAS,IAAIA,EAAM,QAAQ;AAAA,IAAA,GAEtEa,IAAgBP;AAAA,MAAS,MAC7B,CAACI,EAAY,SAAS,CAACC,EAAY,SAASX,EAAM,aAAaA,EAAM,aAAa;AAAA,IAAA,GAE9Ec,IAAUR,EAAS,MAAMM,EAAa,SAASC,EAAc,KAAK;sBAItEE,EAAA,GAAAC,EAgDM,OAhDNC,GAgDM;AAAA,MA/CJC,EAuCQ,SAAA;AAAA,QAtCL,KAAKb,EAAA;AAAA,QACL,OAAKc,EAAA;AAAA;;qCAAwElB,EAAA;AAAA,kCAA0CS,EAAA;AAAA,kCAA6CC,EAAA;AAAA,UAAA;AAAA;;QASrKO,EA0BO,QA1BPE,GA0BO;AAAA,YAzBLF,EAYE,SAAA;AAAA,YAXC,IAAIb,EAAA;AAAA,0DACIH,EAAK,QAAAmB;AAAA,YACd,MAAK;AAAA,YACJ,MAAMpB,EAAA;AAAA,YACN,OAAOA,EAAA;AAAA,YACP,UAAUA,EAAA;AAAA,YACV,UAAUA,EAAA;AAAA,YACV,kBAAoBA,EAAA;AAAA,YACpB,gBAAcS,EAAA,SAAe;AAAA,YAC7B,oBAAkBI,EAAA,QAAUP,EAAA,QAAY;AAAA,YACzC,OAAM;AAAA,UAAA;gBATGL,EAAA,KAAK;AAAA,UAAA;UAYRM,EAAA,cADRc,EAKEC,GAAA;AAAA;YAHA,MAAK;AAAA,YACL,MAAK;AAAA,YACL,OAAM;AAAA,UAAA,MAGKd,EAAA,cADba,EAKEC,GAAA;AAAA;YAHA,MAAK;AAAA,YACL,MAAK;AAAA,YACL,OAAM;AAAA,UAAA;;QAGEtB,EAAA,cAAZe,EAAgE,QAAhEQ,GAAgEC,EAAfxB,EAAA,KAAK,GAAA,CAAA;;MAGhDa,EAAA,cADRE,EAMM,OAAA;AAAA;QAJH,IAAIT,EAAA;AAAA,QACJ,mEAAiEG,EAAA,OAAW,CAAA;AAAA,MAAA,KAE1EI,EAAA,KAAO,GAAA,IAAAY,CAAA;;;;"}
+{"version":3,"file":"PaCheckbox.vue2.js","sources":["../../../src/components/PaCheckbox/PaCheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, useId } from 'vue'\nimport PaIcon from '../PaIcon/PaIcon.vue'\n\nexport interface PaCheckboxProps {\n  label?: string\n  id?: string\n  name?: string\n  value?: string\n  indeterminate?: boolean\n  disabled?: boolean\n  required?: boolean\n  helperText?: string\n  error?: string | boolean\n  valid?: boolean\n}\n\nconst props = withDefaults(defineProps<PaCheckboxProps>(), {\n  indeterminate: false,\n  disabled: false,\n  required: false,\n  error: false,\n  valid: false,\n})\n\nconst model = defineModel<boolean>({ default: false })\n\nconst generatedId = `pa-checkbox-${useId()}`\nconst inputId = computed(() => props.id ?? generatedId)\nconst messageId = computed(() => `${inputId.value}-msg`)\n\nconst showCheck = computed(() => model.value)\nconst showMinus = computed(() => !model.value && props.indeterminate)\n\nconst errorActive = computed(() => Boolean(props.error))\nconst validActive = computed(() => props.valid && !errorActive.value)\n\nconst errorMessage = computed(() =>\n  typeof props.error === 'string' && props.error.length > 0 ? props.error : null,\n)\nconst helperMessage = computed(() =>\n  !errorActive.value && !validActive.value && props.helperText ? props.helperText : null,\n)\nconst message = computed(() => errorMessage.value ?? helperMessage.value)\n</script>\n\n<template>\n  <div class=\"pa-checkbox-field\">\n    <label\n      :for=\"inputId\"\n      :class=\"[\n        'pa-checkbox',\n        {\n          'pa-checkbox--disabled': disabled,\n          'pa-checkbox--error': errorActive,\n          'pa-checkbox--valid': validActive,\n        },\n      ]\"\n    >\n      <span class=\"pa-checkbox__box\">\n        <input\n          :id=\"inputId\"\n          v-model=\"model\"\n          type=\"checkbox\"\n          :name=\"name\"\n          :value=\"value\"\n          :disabled=\"disabled\"\n          :required=\"required\"\n          :indeterminate.prop=\"indeterminate\"\n          :aria-invalid=\"errorActive || undefined\"\n          :aria-describedby=\"message ? messageId : undefined\"\n          class=\"pa-checkbox__input\"\n        />\n        <PaIcon\n          v-if=\"showCheck\"\n          name=\"check\"\n          size=\"sm\"\n          class=\"pa-checkbox__glyph\"\n        />\n        <PaIcon\n          v-else-if=\"showMinus\"\n          name=\"minus\"\n          size=\"sm\"\n          class=\"pa-checkbox__glyph\"\n        />\n      </span>\n      <span v-if=\"label\" class=\"pa-checkbox__label\">{{ label }}</span>\n    </label>\n    <div\n      v-if=\"message\"\n      :id=\"messageId\"\n      :class=\"['pa-checkbox__message', { 'pa-checkbox__message--error': errorActive }]\"\n    >\n      {{ message }}\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.pa-checkbox-field {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: var(--pa-space-2xs);\n  font-family: var(--pa-font-family-base);\n}\n\n.pa-checkbox {\n  display: inline-flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 10px;\n  cursor: pointer;\n}\n\n.pa-checkbox--disabled {\n  cursor: not-allowed;\n}\n\n.pa-checkbox__box {\n  position: relative;\n  flex: 0 0 auto;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n}\n\n.pa-checkbox__input {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  appearance: none;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  background: var(--pa-color-bg-white);\n  border: var(--pa-border-xs) solid var(--pa-color-neutral-gray);\n  border-radius: var(--pa-radius-smooth);\n  cursor: inherit;\n  transition: border-color 120ms ease, background-color 120ms ease;\n}\n\n.pa-checkbox:hover:not(.pa-checkbox--disabled) .pa-checkbox__input:not(:checked):not(:indeterminate) {\n  border-color: var(--pa-color-primary-hover);\n}\n\n.pa-checkbox:hover:not(.pa-checkbox--disabled):not(.pa-checkbox--error):not(.pa-checkbox--valid) .pa-checkbox__label {\n  color: var(--pa-color-primary-hover);\n}\n\n.pa-checkbox__input:focus { outline: none; }\n\n.pa-checkbox__input:focus-visible {\n  outline: var(--pa-border-xs) solid var(--pa-color-primary-focus-border);\n  outline-offset: 3px;\n}\n\n.pa-checkbox__input:checked,\n.pa-checkbox__input:indeterminate {\n  background: var(--pa-color-primary);\n  border-color: var(--pa-color-primary);\n}\n\n.pa-checkbox--error .pa-checkbox__input:not(:disabled) {\n  border-color: var(--pa-color-error);\n}\n\n.pa-checkbox--valid .pa-checkbox__input:not(:disabled) {\n  border-color: var(--pa-color-success);\n}\n\n.pa-checkbox__input:disabled {\n  cursor: not-allowed;\n  background: var(--pa-color-bg-disabled-gray);\n  border-color: var(--pa-color-bg-disabled-gray);\n}\n\n.pa-checkbox__glyph {\n  position: relative;\n  width: 12px;\n  height: 12px;\n  pointer-events: none;\n  color: var(--pa-color-text-white);\n}\n\n.pa-checkbox--disabled .pa-checkbox__glyph {\n  color: var(--pa-color-text-disabled-gray);\n}\n\n.pa-checkbox__label {\n  font-size: var(--pa-font-body-size);\n  line-height: var(--pa-font-body-line-height);\n  font-weight: var(--pa-font-body-weight);\n  color: var(--pa-color-text-secondary-gray);\n}\n\n.pa-checkbox--disabled .pa-checkbox__label {\n  color: var(--pa-color-text-disabled-gray);\n}\n\n.pa-checkbox__message {\n  font-size: var(--pa-font-label-helper-size);\n  line-height: var(--pa-font-label-helper-line-height);\n  font-weight: var(--pa-font-label-helper-weight);\n  color: var(--pa-color-text-secondary-gray);\n  padding-left: 34px;\n}\n\n.pa-checkbox__message--error {\n  color: var(--pa-color-error);\n}\n</style>\n"],"names":["props","__props","model","_useModel","generatedId","useId","inputId","computed","messageId","showCheck","showMinus","errorActive","validActive","errorMessage","helperMessage","message","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_hoisted_3","$event","_createBlock","PaIcon","_hoisted_5","_toDisplayString","_hoisted_6"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAiBA,UAAMA,IAAQC,GAQRC,IAAQC,EAAoBF,GAAA,YAAmB,GAE/CG,IAAc,eAAeC,EAAA,CAAO,IACpCC,IAAUC,EAAS,MAAMP,EAAM,MAAMI,CAAW,GAChDI,IAAYD,EAAS,MAAM,GAAGD,EAAQ,KAAK,MAAM,GAEjDG,IAAYF,EAAS,MAAML,EAAM,KAAK,GACtCQ,IAAYH,EAAS,MAAM,CAACL,EAAM,SAASF,EAAM,aAAa,GAE9DW,IAAcJ,EAAS,MAAM,EAAQP,EAAM,KAAM,GACjDY,IAAcL,EAAS,MAAMP,EAAM,SAAS,CAACW,EAAY,KAAK,GAE9DE,IAAeN;AAAA,MAAS,MAC5B,OAAOP,EAAM,SAAU,YAAYA,EAAM,MAAM,SAAS,IAAIA,EAAM,QAAQ;AAAA,IAAA,GAEtEc,IAAgBP;AAAA,MAAS,MAC7B,CAACI,EAAY,SAAS,CAACC,EAAY,SAASZ,EAAM,aAAaA,EAAM,aAAa;AAAA,IAAA,GAE9Ee,IAAUR,EAAS,MAAMM,EAAa,SAASC,EAAc,KAAK;sBAItEE,EAAA,GAAAC,EAgDM,OAhDNC,GAgDM;AAAA,MA/CJC,EAuCQ,SAAA;AAAA,QAtCL,KAAKb,EAAA;AAAA,QACL,OAAKc,EAAA;AAAA;;qCAAwEnB,EAAA;AAAA,kCAA0CU,EAAA;AAAA,kCAA6CC,EAAA;AAAA,UAAA;AAAA;;QASrKO,EA0BO,QA1BPE,GA0BO;AAAA,YAzBLF,EAYE,SAAA;AAAA,YAXC,IAAIb,EAAA;AAAA,0DACIJ,EAAK,QAAAoB;AAAA,YACd,MAAK;AAAA,YACJ,MAAMrB,EAAA;AAAA,YACN,OAAOA,EAAA;AAAA,YACP,UAAUA,EAAA;AAAA,YACV,UAAUA,EAAA;AAAA,YACV,kBAAoBA,EAAA;AAAA,YACpB,gBAAcU,EAAA,SAAe;AAAA,YAC7B,oBAAkBI,EAAA,QAAUP,EAAA,QAAY;AAAA,YACzC,OAAM;AAAA,UAAA;gBATGN,EAAA,KAAK;AAAA,UAAA;UAYRO,EAAA,cADRc,EAKEC,GAAA;AAAA;YAHA,MAAK;AAAA,YACL,MAAK;AAAA,YACL,OAAM;AAAA,UAAA,MAGKd,EAAA,cADba,EAKEC,GAAA;AAAA;YAHA,MAAK;AAAA,YACL,MAAK;AAAA,YACL,OAAM;AAAA,UAAA;;QAGEvB,EAAA,cAAZgB,EAAgE,QAAhEQ,GAAgEC,EAAfzB,EAAA,KAAK,GAAA,CAAA;;MAGhDc,EAAA,cADRE,EAMM,OAAA;AAAA;QAJH,IAAIT,EAAA;AAAA,QACJ,mEAAiEG,EAAA,OAAW,CAAA;AAAA,MAAA,KAE1EI,EAAA,KAAO,GAAA,IAAAY,CAAA;;;;"}

package/dist/components/PaCheckboxGroup/PaCheckboxGroup.vue.d.ts

@@ -14,14 +14,13 @@ export interface PaCheckboxGroupProps {
     required?: boolean;
     disabled?: boolean;
 }
-export declare function nextPaCheckboxGroupId(): string;
-declare const _default: import("vue").DefineComponent<PaCheckboxGroupProps & {
+type __VLS_Props = PaCheckboxGroupProps;
+type __VLS_PublicProps = __VLS_Props & {
     modelValue?: string[];
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+};
+declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: string[]) => any;
-}, string, import("vue").PublicProps, Readonly<PaCheckboxGroupProps & {
-    modelValue?: string[];
-}> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
 }>, {
     error: string | boolean;

package/dist/components/PaCheckboxGroup/PaCheckboxGroup.vue.js

@@ -1,10 +1,8 @@
 import o from "./PaCheckboxGroup.vue2.js";
-import { nextPaCheckboxGroupId as c } from "./PaCheckboxGroup.vue2.js";
 /* empty css                     */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const a = /* @__PURE__ */ r(o, [["__scopeId", "data-v-e3404f8b"]]);
+const c = /* @__PURE__ */ r(o, [["__scopeId", "data-v-9c675dab"]]);
 export {
-  a as default,
-  c as nextPaCheckboxGroupId
+  c as default
 };
 //# sourceMappingURL=PaCheckboxGroup.vue.js.map

package/dist/components/PaCheckboxGroup/PaCheckboxGroup.vue.js.map

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

package/dist/components/PaCheckboxGroup/PaCheckboxGroup.vue2.js

@@ -1,17 +1,12 @@
-import { defineComponent as q, useModel as C, computed as r, openBlock as d, createElementBlock as i, normalizeClass as h, createTextVNode as I, toDisplayString as f, createCommentVNode as b, Fragment as M, renderList as T, createBlock as _, mergeModels as $ } from "vue";
-import N from "../PaCheckbox/PaCheckbox.vue.js";
-const P = ["aria-labelledby", "aria-required", "aria-invalid", "aria-describedby"], S = ["id"], A = {
+import { defineComponent as q, useModel as C, useId as I, computed as r, openBlock as u, createElementBlock as i, normalizeClass as h, createTextVNode as M, toDisplayString as f, createCommentVNode as b, Fragment as T, renderList as _, createBlock as $, mergeModels as N } from "vue";
+import S from "../PaCheckbox/PaCheckbox.vue.js";
+const A = ["aria-labelledby", "aria-required", "aria-invalid", "aria-describedby"], P = ["id"], U = {
   key: 0,
   class: "pa-checkbox-group__required",
   "aria-hidden": "true"
-}, G = ["id"];
-let U = 0;
-function w() {
-  return `pa-checkbox-group-${++U}`;
-}
-const E = /* @__PURE__ */ q({
+}, w = ["id"], E = /* @__PURE__ */ q({
   __name: "PaCheckboxGroup",
-  props: /* @__PURE__ */ $({
+  props: /* @__PURE__ */ N({
     options: {},
     label: {},
     id: {},
@@ -27,24 +22,24 @@ const E = /* @__PURE__ */ q({
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const a = e, o = C(e, "modelValue"), k = w(), s = r(() => a.id ?? k), m = r(() => `${s.value}-label`), p = r(() => `${s.value}-msg`), x = r(() => a.name ?? `${s.value}-name`), u = r(() => !!a.error), c = r(() => a.valid && !u.value), y = r(
+    const a = e, o = C(e, "modelValue"), k = `pa-checkbox-group-${I()}`, n = r(() => a.id ?? k), m = r(() => `${n.value}-label`), p = r(() => `${n.value}-msg`), x = r(() => a.name ?? `${n.value}-name`), d = r(() => !!a.error), c = r(() => a.valid && !d.value), y = r(
       () => typeof a.error == "string" && a.error.length > 0 ? a.error : null
     ), B = r(
-      () => !u.value && !c.value && a.helperText ? a.helperText : null
+      () => !d.value && !c.value && a.helperText ? a.helperText : null
     ), v = r(() => y.value ?? B.value);
-    function V(n, g) {
+    function V(s, g) {
       if (g) {
-        if (o.value.includes(n)) return;
-        const l = /* @__PURE__ */ new Set([...o.value, n]);
+        if (o.value.includes(s)) return;
+        const l = /* @__PURE__ */ new Set([...o.value, s]);
         o.value = a.options.map((t) => t.value).filter((t) => l.has(t));
       } else
-        o.value = o.value.filter((l) => l !== n);
+        o.value = o.value.filter((l) => l !== s);
     }
-    return (n, g) => (d(), i("div", {
+    return (s, g) => (u(), i("div", {
       class: h([
         "pa-checkbox-group",
         {
-          "pa-checkbox-group--error": u.value,
+          "pa-checkbox-group--error": d.value,
           "pa-checkbox-group--valid": c.value,
           "pa-checkbox-group--disabled": e.disabled
         }
@@ -52,38 +47,37 @@ const E = /* @__PURE__ */ q({
       role: "group",
       "aria-labelledby": e.label ? m.value : void 0,
       "aria-required": e.required || void 0,
-      "aria-invalid": u.value || void 0,
+      "aria-invalid": d.value || void 0,
       "aria-describedby": v.value ? p.value : void 0
     }, [
-      e.label ? (d(), i("span", {
+      e.label ? (u(), i("span", {
         key: 0,
         id: m.value,
         class: "pa-checkbox-group__label"
       }, [
-        I(f(e.label), 1),
-        e.required ? (d(), i("span", A, "*")) : b("", !0)
-      ], 8, S)) : b("", !0),
-      (d(!0), i(M, null, T(e.options, (l) => (d(), _(N, {
+        M(f(e.label), 1),
+        e.required ? (u(), i("span", U, "*")) : b("", !0)
+      ], 8, P)) : b("", !0),
+      (u(!0), i(T, null, _(e.options, (l) => (u(), $(S, {
         key: l.value,
         "model-value": o.value.includes(l.value),
         label: l.label,
         value: l.value,
         name: x.value,
         disabled: e.disabled || l.disabled,
-        error: u.value,
+        error: d.value,
         valid: c.value,
         "onUpdate:modelValue": (t) => V(l.value, t)
       }, null, 8, ["model-value", "label", "value", "name", "disabled", "error", "valid", "onUpdate:modelValue"]))), 128)),
-      v.value ? (d(), i("div", {
+      v.value ? (u(), i("div", {
         key: 1,
         id: p.value,
-        class: h(["pa-checkbox-group__message", { "pa-checkbox-group__message--error": u.value }])
-      }, f(v.value), 11, G)) : b("", !0)
-    ], 10, P));
+        class: h(["pa-checkbox-group__message", { "pa-checkbox-group__message--error": d.value }])
+      }, f(v.value), 11, w)) : b("", !0)
+    ], 10, A));
   }
 });
 export {
-  E as default,
-  w as nextPaCheckboxGroupId
+  E as default
 };
 //# sourceMappingURL=PaCheckboxGroup.vue2.js.map