@rei/cedar 11.0.1 → 13.0.0-alpha.3

package/dist/lib/src/components/input/CdrInput.vue_vue_type_script_lang.mjs

@@ -0,0 +1,155 @@
+import { defineComponent, ref, computed, useCssModule } from 'vue';
+import validateProp from '../../utils/propValidator.mjs';
+import '../labelStandalone/CdrLabelStandalone.mjs';
+import '../formError/CdrFormError.mjs';
+import sizeProps from '../../props/size.mjs';
+import backgroundProps from '../../props/background.mjs';
+import { buildClass } from '../../utils/buildClass.mjs';
+import mapClasses from '../../utils/mapClasses.mjs';
+import script$1 from '../labelStandalone/CdrLabelStandalone.vue_vue_type_script_lang.mjs';
+import script$2 from '../formError/CdrFormError.vue_vue_type_script_lang.mjs';
+
+var script = defineComponent({
+  name: 'CdrInput',
+  components: {
+    CdrLabelStandalone: script$1,
+    CdrFormError: script$2,
+  },
+  inheritAttrs: false,
+  props: {
+    /**
+     * `id` for the input that is mapped to the label `for` attribute.
+    */
+    id: {
+      type: String,
+      required: true,
+    },
+    /**
+     *  'type' attribute for the input as defined by w3c.
+     *  Only supporting text|email|number|password|search|url.
+     *  The increment/decrement webkit psuedo element is hidden for number.
+    */
+    type: {
+      type: [String],
+      default: 'text',
+      validator: (value) => validateProp(
+        value,
+        // TODO: moar types?
+        ['text', 'email', 'number', 'password', 'search', 'url', 'tel'],
+      ),
+    },
+    /**
+     * Label text. This is required for a11y even if hiding the label with `hideLabel`.
+    */
+    label: {
+      type: String,
+      required: true,
+    },
+    // sets default attrs for inputs that should use a numeric keyboard but are not strictly "numbers" (security code, CC number, postal code)
+    numeric: {
+      type: Boolean,
+      default: false,
+    },
+    /**
+     * Removes the label element but sets the input `aria-label` to `label` text for a11y.
+    */
+    hideLabel: Boolean,
+    /**
+     * Number of rows for input.  Converts component to text-area if rows greater than 1.
+    */
+    rows: Number,
+    // Set which background type the input renders on
+    background: backgroundProps,
+    size: sizeProps,
+
+    /**
+     * Override the error message role, default is `status`.
+     */
+    errorRole: {
+      type: String,
+      required: false,
+      default: 'status',
+    },
+    // Set error styling
+    error: {
+      type: [Boolean, String],
+      default: false,
+    },
+    disabled: Boolean,
+    required: Boolean,
+    optional: Boolean,
+    modelValue: {
+      type: [String, Number],
+    },
+  },
+  setup(props, ctx) {
+    const baseClass = 'cdr-input';
+    // console.log(ctx.slots['post-icon']);
+    // TODO: delete un-used hasSlot props
+    const isFocused = ref(false);
+    const hasHelperTop = ctx.slots['helper-text-top'];
+    const hasHelperBottom = ctx.slots['helper-text-bottom'];
+    const hasPreIcon = ctx.slots['pre-icon'];
+    const hasPostIcon = ctx.slots['post-icon'];
+    const hasPostIcons = hasPostIcon && ctx.slots['post-icon']().length > 1;
+    const hasInfo = ctx.slots.info;
+    const hasInfoAction = ctx.slots['info-action'];
+
+    const multilineClass = computed(() => props.rows > 1 && 'cdr-input--multiline');
+    const preIconClass = computed(() => hasPreIcon && 'cdr-input--preicon');
+    // TODO: make one class for this? if possible? there must have been a reason i did it like this.....
+    const postIconClass = computed(() => hasPostIcon && 'cdr-input--posticon');
+    const postIconsClass = computed(() => hasPostIcons && 'cdr-input--posticons');
+    const errorClass = computed(() => props.error && 'cdr-input--error');
+    const backgroundClass = computed(() => `cdr-input--${props.background}`);
+    const sizeClass = computed(() => props.size && buildClass(baseClass, props.size));
+    const focusedClass = computed(() => isFocused.value && 'cdr-input--focus');
+
+    const describedby = computed(() => {
+      return [
+        ctx.slots['helper-text-top'] ? `${props.id}-helper-text-top` : '',
+        ctx.slots['helper-text-bottom'] ? `${props.id}-helper-text-bottom` : '',
+        ctx.attrs['aria-describedby'],
+      ].filter((x) => x).join(' ');
+    });
+
+
+    const inputAttrs = computed(() => {
+      const isNum = props.numeric || props.type === 'number';
+      return {
+        autocorrect: 'off',
+        spellcheck: 'false',
+        autocapitalize: 'off',
+        pattern: (isNum && '[0-9]*') || null,
+        inputmode: (isNum && 'numeric') || null,
+        novalidate: isNum || null,
+        ...ctx.attrs,
+      };
+    });
+
+    return {
+      style: useCssModule(),
+      baseClass,
+      sizeClass,
+      focusedClass,
+      multilineClass,
+      preIconClass,
+      postIconClass,
+      postIconsClass,
+      errorClass,
+      backgroundClass,
+      isFocused,
+      hasHelperTop,
+      hasHelperBottom,
+      hasPreIcon,
+      hasPostIcon,
+      hasInfo,
+      hasInfoAction,
+      inputAttrs,
+      describedby,
+      mapClasses,
+    };
+  },
+});
+
+export { script as default };

package/dist/lib/src/components/input/CdrInput.vue_vue_type_template_id_0727bc24_lang.mjs

@@ -0,0 +1,153 @@
+import { resolveComponent, openBlock, createBlock, createSlots, withCtx, createElementVNode, normalizeClass, createElementBlock, mergeProps, renderSlot, createCommentVNode } from 'vue';
+
+const _hoisted_1 = ["rows", "id", "disabled", "aria-required", "aria-invalid", "aria-errormessage", "value", "aria-describedby"];
+const _hoisted_2 = ["type", "id", "disabled", "aria-required", "aria-invalid", "aria-errormessage", "aria-describedby", "value"];
+const _hoisted_3 = ["id"];
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_cdr_form_error = resolveComponent("cdr-form-error");
+  const _component_cdr_label_standalone = resolveComponent("cdr-label-standalone");
+
+  return (openBlock(), createBlock(_component_cdr_label_standalone, {
+    "for-id": _ctx.id,
+    label: _ctx.label,
+    "hide-label": _ctx.hideLabel,
+    required: _ctx.required,
+    optional: _ctx.optional,
+    disabled: _ctx.disabled
+  }, createSlots({
+    default: withCtx(() => [
+      createElementVNode("div", {
+        class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-input-wrap', _ctx.focusedClass))
+      }, [
+        (_ctx.rows && _ctx.rows > 1)
+          ? (openBlock(), createElementBlock("textarea", mergeProps({
+              key: 0,
+              rows: _ctx.rows,
+              class: _ctx.mapClasses(_ctx.style,
+                           _ctx.baseClass,
+                           _ctx.multilineClass,
+                           _ctx.preIconClass,
+                           _ctx.postIconClass,
+                           _ctx.postIconsClass,
+                           _ctx.errorClass,
+                           _ctx.backgroundClass,
+                           _ctx.sizeClass,
+        ),
+              id: _ctx.id,
+              disabled: _ctx.disabled,
+              "aria-required": _ctx.required || null,
+              "aria-invalid": !!_ctx.error || null,
+              "aria-errormessage": (!!_ctx.error && `${_ctx.id}-error`) || null
+            }, _ctx.inputAttrs, {
+              value: _ctx.modelValue,
+              "aria-describedby": _ctx.describedby || null,
+              onInput: _cache[0] || (_cache[0] = $event => (_ctx.$emit('update:modelValue', $event.target.value))),
+              onFocus: _cache[1] || (_cache[1] = $event => (_ctx.isFocused = true)),
+              onBlur: _cache[2] || (_cache[2] = $event => (_ctx.isFocused = false))
+            }), null, 16 /* FULL_PROPS */, _hoisted_1))
+          : (openBlock(), createElementBlock("input", mergeProps({
+              key: 1,
+              type: _ctx.type,
+              class: _ctx.mapClasses(_ctx.style,
+                           _ctx.baseClass,
+                           _ctx.preIconClass,
+                           _ctx.postIconClass,
+                           _ctx.postIconsClass,
+                           _ctx.errorClass,
+                           _ctx.backgroundClass,
+                           _ctx.sizeClass,
+        ),
+              id: _ctx.id,
+              disabled: _ctx.disabled,
+              "aria-required": _ctx.required || null,
+              "aria-invalid": !!_ctx.error || null,
+              "aria-errormessage": (!!_ctx.error && `${_ctx.id}-error`) || null
+            }, _ctx.inputAttrs, {
+              "aria-describedby": _ctx.describedby || null,
+              value: _ctx.modelValue,
+              onInput: _cache[3] || (_cache[3] = $event => (_ctx.$emit('update:modelValue', $event.target.value))),
+              onFocus: _cache[4] || (_cache[4] = $event => (_ctx.isFocused = true)),
+              onBlur: _cache[5] || (_cache[5] = $event => (_ctx.isFocused = false))
+            }), null, 16 /* FULL_PROPS */, _hoisted_2)),
+        (_ctx.hasPreIcon)
+          ? (openBlock(), createElementBlock("span", {
+              key: 2,
+              class: normalizeClass(_ctx.style['cdr-input__pre-icon'])
+            }, [
+              renderSlot(_ctx.$slots, "pre-icon")
+            ], 2 /* CLASS */))
+          : createCommentVNode("v-if", true),
+        (_ctx.hasPostIcon)
+          ? (openBlock(), createElementBlock("span", {
+              key: 3,
+              class: normalizeClass(_ctx.style['cdr-input__post-icon'])
+            }, [
+              renderSlot(_ctx.$slots, "post-icon")
+            ], 2 /* CLASS */))
+          : createCommentVNode("v-if", true)
+      ], 2 /* CLASS */)
+    ]),
+    _: 2 /* DYNAMIC */
+  }, [
+    (_ctx.hasHelperTop)
+      ? {
+          name: "helper",
+          fn: withCtx(() => [
+            renderSlot(_ctx.$slots, "helper-text-top")
+          ])
+        }
+      : undefined,
+    (_ctx.hasInfo)
+      ? {
+          name: "info",
+          fn: withCtx(() => [
+            renderSlot(_ctx.$slots, "info")
+          ])
+        }
+      : undefined,
+    (_ctx.hasInfoAction)
+      ? {
+          name: "info-action",
+          fn: withCtx(() => [
+            renderSlot(_ctx.$slots, "info-action")
+          ])
+        }
+      : undefined,
+    (_ctx.hasHelperBottom && !_ctx.error)
+      ? {
+          name: "helper-text-bottom",
+          fn: withCtx(() => [
+            createElementVNode("span", {
+              id: `${_ctx.id}-helper-text-bottom`,
+              class: normalizeClass(_ctx.style['cdr-input__helper-text'])
+            }, [
+              renderSlot(_ctx.$slots, "helper-text-bottom")
+            ], 10 /* CLASS, PROPS */, _hoisted_3)
+          ])
+        }
+      : undefined,
+    (_ctx.error)
+      ? {
+          name: "error",
+          fn: withCtx(() => [
+            (_ctx.error)
+              ? (openBlock(), createBlock(_component_cdr_form_error, {
+                  key: 0,
+                  error: _ctx.error,
+                  role: _ctx.errorRole,
+                  id: `${_ctx.id}-error`
+                }, {
+                  error: withCtx(() => [
+                    renderSlot(_ctx.$slots, "error")
+                  ]),
+                  _: 3 /* FORWARDED */
+                }, 8 /* PROPS */, ["error", "role", "id"]))
+              : createCommentVNode("v-if", true)
+          ])
+        }
+      : undefined
+  ]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["for-id", "label", "hide-label", "required", "optional", "disabled"]))
+}
+
+export { render };

package/dist/lib/src/components/input/styles/CdrInput.module.scss_vue_type_style_index_0_src_id_0727bc24_module_true_lang.css.mjs

@@ -0,0 +1,3 @@
+var style0 = {"cdr-input":"cdr-input_13-0-0-alpha-3","cdr-input--focus":"cdr-input--focus_13-0-0-alpha-3","cdr-input--multiline":"cdr-input--multiline_13-0-0-alpha-3","cdr-input--preicon":"cdr-input--preicon_13-0-0-alpha-3","cdr-input--posticon":"cdr-input--posticon_13-0-0-alpha-3","cdr-input--posticons":"cdr-input--posticons_13-0-0-alpha-3","cdr-input--primary":"cdr-input--primary_13-0-0-alpha-3","cdr-input--secondary":"cdr-input--secondary_13-0-0-alpha-3","cdr-input--error":"cdr-input--error_13-0-0-alpha-3","cdr-input--large":"cdr-input--large_13-0-0-alpha-3","cdr-input--large@xs":"cdr-input--large@xs_13-0-0-alpha-3","cdr-input--large@sm":"cdr-input--large@sm_13-0-0-alpha-3","cdr-input--large@md":"cdr-input--large@md_13-0-0-alpha-3","cdr-input--large@lg":"cdr-input--large@lg_13-0-0-alpha-3","cdr-input__pre-icon":"cdr-input__pre-icon_13-0-0-alpha-3","cdr-input__post-icon":"cdr-input__post-icon_13-0-0-alpha-3","cdr-input__helper-text":"cdr-input__helper-text_13-0-0-alpha-3","cdr-input-wrap":"cdr-input-wrap_13-0-0-alpha-3"};
+
+export { style0 as default };

package/dist/lib/src/components/labelStandalone/CdrLabelStandalone.mjs

@@ -1,85 +1,10 @@
-import modules_2157aaf7 from './styles/CdrLabelStandalone.mjs';
+import script from './CdrLabelStandalone.vue_vue_type_script_lang.mjs';
+export { default } from './CdrLabelStandalone.vue_vue_type_script_lang.mjs';
+import { render } from './CdrLabelStandalone.vue_vue_type_template_id_0fc61c8e_lang.mjs';
+import style0 from './styles/CdrLabelStandalone.module.scss_vue_type_style_index_0_src_id_0fc61c8e_module_true_lang.css.mjs';
 
-var CdrLabelStandalone = {
-  name: 'CdrLabelStandalone',
-  props: {
-    forId: {
-      type: String,
-      required: true
-    },
-    label: String,
-    disabled: Boolean,
-    required: Boolean,
-    optional: Boolean,
-    hideLabel: Boolean
-  },
+const cssModules = script.__cssModules = {};
+cssModules["$style"] = style0;
 
-  data() {
-    return {
-      style: modules_2157aaf7
-    };
-  },
-
-  computed: {
-    labelClass() {
-      return {
-        [this.style['cdr-label-standalone__label']]: true,
-        [this.style['cdr-label-standalone__label--disabled']]: this.disabled,
-        [this.style['cdr-label-standalone__label--sr-only']]: this.hideLabel
-      };
-    },
-
-    inputClass() {
-      const hasLabelContent = !this.hideLabel || this.$slots.helper || this.$slots.info;
-      return {
-        [this.style['cdr-label-standalone__input-wrap']]: true,
-        [this.style['cdr-label-standalone__input-spacing']]: hasLabelContent
-      };
-    },
-
-    labelEl() {
-      const h = this.$createElement;
-      const requiredEl = this.required ? h("span", {
-        "attrs": {
-          "aria-label": "required"
-        }
-      }, ["*"]) : '';
-      const optionalEl = this.optional ? h("span", {
-        "class": this.style['cdr-label-standalone__optional']
-      }, ["(optional)"]) : '';
-      return h("label", {
-        "class": this.labelClass,
-        "attrs": {
-          "for": this.forId
-        },
-        "ref": "label"
-      }, [this.label, requiredEl || optionalEl ? ' ' : '', requiredEl || optionalEl]);
-    }
-
-  },
-
-  render() {
-    const h = arguments[0];
-    return h("div", {
-      "class": this.style['cdr-label-standalone']
-    }, [h("div", {
-      "class": this.style['cdr-label-standalone__label-wrapper']
-    }, [this.labelEl, !this.hideLabel && this.$slots.helper && h("br"), this.$slots.helper && h("span", {
-      "class": this.style['cdr-label-standalone__helper'],
-      "attrs": {
-        "id": "".concat(this.forId, "-helper-text-top")
-      }
-    }, [this.$slots.helper])]), h("div", {
-      "class": this.inputClass
-    }, [this.$slots.default, this.$slots['info-action'] && h("div", {
-      "class": this.style['cdr-label-standalone__info-action']
-    }, [this.$slots['info-action']])]), this.$slots.info && h("span", {
-      "class": this.style['cdr-label-standalone__info']
-    }, [this.$slots.info]), h("div", {
-      "class": this.style['cdr-label-standalone__post-content']
-    }, [this.$slots['helper-text-bottom'], this.$slots.error])]);
-  }
-
-};
-
-export default CdrLabelStandalone;
+script.render = render;
+script.__file = "src/components/labelStandalone/CdrLabelStandalone.vue";

package/dist/lib/src/components/labelStandalone/CdrLabelStandalone.vue_vue_type_script_lang.mjs

@@ -0,0 +1,42 @@
+import { defineComponent, computed, useCssModule } from 'vue';
+import mapClasses from '../../utils/mapClasses.mjs';
+
+var script = defineComponent({
+  name: 'CdrLabelStandalone',
+  props: {
+    forId: {
+      type: String,
+      required: true,
+    },
+    label: String,
+    disabled: Boolean,
+    required: Boolean,
+    optional: Boolean,
+    hideLabel: Boolean,
+  },
+  setup(props, ctx) {
+    const baseClass = 'cdr-label-standalone';
+    const hasHelper = ctx.slots.helper;
+    const hasInfo = ctx.slots.info;
+    const hasInfoAction = ctx.slots['info-action'];
+    const disabledLabelClass = computed(() => props.disabled
+      && 'cdr-label-standalone__label--disabled');
+    const srOnlyLabelClass = computed(() => props.hideLabel
+      && 'cdr-label-standalone__label--sr-only');
+    const inputSpacingClass = computed(() => (!props.hideLabel || hasHelper || hasInfo)
+      && 'cdr-label-standalone__input--spacing');
+    return {
+      style: useCssModule(),
+      mapClasses,
+      hasHelper,
+      hasInfo,
+      hasInfoAction,
+      baseClass,
+      disabledLabelClass,
+      srOnlyLabelClass,
+      inputSpacingClass,
+    };
+  },
+});
+
+export { script as default };

package/dist/lib/src/components/labelStandalone/CdrLabelStandalone.vue_vue_type_template_id_0fc61c8e_lang.mjs

@@ -0,0 +1,75 @@
+import { openBlock, createElementBlock, normalizeClass, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, renderSlot } from 'vue';
+
+const _hoisted_1 = ["for"];
+const _hoisted_2 = {
+  key: 0,
+  "aria-label": "required"
+};
+const _hoisted_3 = { key: 0 };
+const _hoisted_4 = ["id"];
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return (openBlock(), createElementBlock("div", {
+    class: normalizeClass(_ctx.style[_ctx.baseClass])
+  }, [
+    createElementVNode("div", {
+      class: normalizeClass(_ctx.style['cdr-label-standalone__label-wrapper'])
+    }, [
+      createElementVNode("label", {
+        class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-label-standalone__label', _ctx.disabledLabelClass, _ctx.srOnlyLabelClass)),
+        for: _ctx.forId
+      }, [
+        createTextVNode(toDisplayString(_ctx.label) + toDisplayString(_ctx.required || _ctx.optional ? '' : '') + " ", 1 /* TEXT */),
+        (_ctx.required)
+          ? (openBlock(), createElementBlock("span", _hoisted_2, "*"))
+          : (_ctx.optional)
+            ? (openBlock(), createElementBlock("span", {
+                key: 1,
+                class: normalizeClass(_ctx.style['cdr-label-standalone__optional'])
+              }, "(optional)", 2 /* CLASS */))
+            : createCommentVNode("v-if", true)
+      ], 10 /* CLASS, PROPS */, _hoisted_1),
+      (!_ctx.hideLabel && _ctx.hasHelper)
+        ? (openBlock(), createElementBlock("br", _hoisted_3))
+        : createCommentVNode("v-if", true),
+      (_ctx.hasHelper)
+        ? (openBlock(), createElementBlock("span", {
+            key: 1,
+            class: normalizeClass(_ctx.style['cdr-label-standalone__helper']),
+            id: `${_ctx.forId}-helper-text-top`
+          }, [
+            renderSlot(_ctx.$slots, "helper")
+          ], 10 /* CLASS, PROPS */, _hoisted_4))
+        : createCommentVNode("v-if", true)
+    ], 2 /* CLASS */),
+    createElementVNode("div", {
+      class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-label-standalone__input-wrap', _ctx.inputSpacingClass))
+    }, [
+      renderSlot(_ctx.$slots, "default"),
+      (_ctx.hasInfoAction)
+        ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass(_ctx.style['cdr-label-standalone__info-action'])
+          }, [
+            renderSlot(_ctx.$slots, "info-action")
+          ], 2 /* CLASS */))
+        : createCommentVNode("v-if", true)
+    ], 2 /* CLASS */),
+    (_ctx.hasInfo)
+      ? (openBlock(), createElementBlock("span", {
+          key: 0,
+          class: normalizeClass(_ctx.style['cdr-label-standalone__info'])
+        }, [
+          renderSlot(_ctx.$slots, "info")
+        ], 2 /* CLASS */))
+      : createCommentVNode("v-if", true),
+    createElementVNode("div", {
+      class: normalizeClass(_ctx.style['cdr-label-standalone__post-content'])
+    }, [
+      renderSlot(_ctx.$slots, "helper-text-bottom"),
+      renderSlot(_ctx.$slots, "error")
+    ], 2 /* CLASS */)
+  ], 2 /* CLASS */))
+}
+
+export { render };

package/dist/lib/src/components/labelStandalone/styles/CdrLabelStandalone.module.scss_vue_type_style_index_0_src_id_0fc61c8e_module_true_lang.css.mjs

@@ -0,0 +1,3 @@
+var style0 = {"cdr-label-standalone":"cdr-label-standalone_13-0-0-alpha-3","cdr-label-standalone__label-wrapper":"cdr-label-standalone__label-wrapper_13-0-0-alpha-3","cdr-label-standalone__label":"cdr-label-standalone__label_13-0-0-alpha-3","cdr-label-standalone__label--sr-only":"cdr-label-standalone__label--sr-only_13-0-0-alpha-3","cdr-label-standalone__label--disabled":"cdr-label-standalone__label--disabled_13-0-0-alpha-3","cdr-label-standalone__optional":"cdr-label-standalone__optional_13-0-0-alpha-3","cdr-label-standalone__helper":"cdr-label-standalone__helper_13-0-0-alpha-3","cdr-label-standalone__info":"cdr-label-standalone__info_13-0-0-alpha-3","cdr-label-standalone__post-content":"cdr-label-standalone__post-content_13-0-0-alpha-3","cdr-label-standalone__info-action":"cdr-label-standalone__info-action_13-0-0-alpha-3","cdr-label-standalone__input-wrap":"cdr-label-standalone__input-wrap_13-0-0-alpha-3","cdr-label-standalone__input-spacing":"cdr-label-standalone__input-spacing_13-0-0-alpha-3"};
+
+export { style0 as default };

package/dist/lib/src/components/labelWrapper/CdrLabelWrapper.mjs

@@ -1,54 +1,10 @@
-import clsx from 'clsx';
-import modules_fba16867 from './styles/CdrLabelWrapper.mjs';
-import modifier from '../../mixins/modifier.mjs';
-import size from '../../mixins/size.mjs';
-import validateProp from '../../utils/propValidator.mjs';
+import script from './CdrLabelWrapper.vue_vue_type_script_lang.mjs';
+export { default } from './CdrLabelWrapper.vue_vue_type_script_lang.mjs';
+import { render } from './CdrLabelWrapper.vue_vue_type_template_id_1b3bfeb0_lang.mjs';
+import style0 from './styles/CdrLabelWrapper.module.scss_vue_type_style_index_0_src_id_1b3bfeb0_module_true_lang.css.mjs';
 
-var CdrLabelWrapper = {
-  name: 'CdrLabelWrapper',
-  mixins: [modifier, size],
-  inheritAttrs: false,
-  props: {
-    labelClass: String,
-    contentClass: String,
-    background: {
-      type: [String],
-      default: 'primary',
-      validator: value => validateProp(value, ['primary', 'secondary'])
-    },
-    disabled: Boolean
-  },
+const cssModules = script.__cssModules = {};
+cssModules["$style"] = style0;
 
-  data() {
-    return {
-      style: modules_fba16867
-    };
-  },
-
-  computed: {
-    baseClass() {
-      return 'cdr-label-wrapper';
-    },
-
-    disabledClass() {
-      return this.disabled ? this.style['cdr-label-wrapper--disabled'] : '';
-    }
-
-  },
-
-  render() {
-    const h = arguments[0];
-    return h("div", {
-      "class": this.style['cdr-label-wrapper__container']
-    }, [h("label", {
-      "class": clsx(this.style['cdr-label-wrapper'], this.style["cdr-label-wrapper--".concat(this.background)], this.disabledClass, this.modifierClass, this.sizeClass, this.labelClass)
-    }, [this.$slots.input, h("span", {
-      "class": this.style['cdr-label-wrapper__figure']
-    }), h("div", {
-      "class": clsx(this.style['cdr-label-wrapper__content'], this.contentClass)
-    }, [this.$slots.default])])]);
-  }
-
-};
-
-export default CdrLabelWrapper;
+script.render = render;
+script.__file = "src/components/labelWrapper/CdrLabelWrapper.vue";

package/dist/lib/src/components/labelWrapper/CdrLabelWrapper.vue_vue_type_script_lang.mjs

@@ -0,0 +1,32 @@
+import { defineComponent, computed, useCssModule } from 'vue';
+import { buildClass } from '../../utils/buildClass.mjs';
+import backgroundProps from '../../props/background.mjs';
+import mapClasses from '../../utils/mapClasses.mjs';
+
+var script = defineComponent({
+  name: 'CdrLabelWrapper',
+  props: {
+    labelClass: String,
+    contentClass: String,
+    background: backgroundProps,
+    disabled: Boolean,
+    modifier: String,
+    size: String,
+  },
+  setup(props) {
+    const baseClass = 'cdr-label-wrapper';
+    const modifierClass = computed(() => buildClass(baseClass, props.modifier));
+    const sizeClass = computed(() => props.size && buildClass(baseClass, props.size));
+    const disabledClass = computed(() => props.disabled && buildClass(baseClass, 'disabled')); // TODO: this works right?
+    return {
+      style: useCssModule(),
+      mapClasses,
+      baseClass,
+      modifierClass,
+      sizeClass,
+      disabledClass,
+    };
+  },
+});
+
+export { script as default };

package/dist/lib/src/components/labelWrapper/CdrLabelWrapper.vue_vue_type_template_id_1b3bfeb0_lang.mjs

@@ -0,0 +1,29 @@
+import { openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot } from 'vue';
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return (openBlock(), createElementBlock("div", {
+    class: normalizeClass(_ctx.style['cdr-label-wrapper__container'])
+  }, [
+    createElementVNode("label", {
+      class: normalizeClass(_ctx.mapClasses(_ctx.style,
+                         'cdr-label-wrapper',
+                         `cdr-label-wrapper--${_ctx.background}`,
+                         _ctx.disabledClass,
+                         _ctx.modifierClass,
+                         _ctx.sizeClass,
+      ).concat(` ${_ctx.labelClass || ''}`))
+    }, [
+      renderSlot(_ctx.$slots, "input"),
+      createElementVNode("span", {
+        class: normalizeClass(_ctx.style['cdr-label-wrapper__figure'])
+      }, null, 2 /* CLASS */),
+      createElementVNode("div", {
+        class: normalizeClass(_ctx.mapClasses(_ctx.style, 'cdr-label-wrapper__content', _ctx.contentClass))
+      }, [
+        renderSlot(_ctx.$slots, "default")
+      ], 2 /* CLASS */)
+    ], 2 /* CLASS */)
+  ], 2 /* CLASS */))
+}
+
+export { render };

package/dist/lib/src/components/labelWrapper/styles/CdrLabelWrapper.module.scss_vue_type_style_index_0_src_id_1b3bfeb0_module_true_lang.css.mjs

@@ -0,0 +1,3 @@
+var style0 = {"cdr-label-wrapper":"cdr-label-wrapper_13-0-0-alpha-3","cdr-label-wrapper__container":"cdr-label-wrapper__container_13-0-0-alpha-3","cdr-label-wrapper--primary":"cdr-label-wrapper--primary_13-0-0-alpha-3","cdr-label-wrapper--secondary":"cdr-label-wrapper--secondary_13-0-0-alpha-3","cdr-label-wrapper--disabled":"cdr-label-wrapper--disabled_13-0-0-alpha-3","cdr-label-wrapper__figure":"cdr-label-wrapper__figure_13-0-0-alpha-3","cdr-label-wrapper__content":"cdr-label-wrapper__content_13-0-0-alpha-3","cdr-label-wrapper--hide-figure":"cdr-label-wrapper--hide-figure_13-0-0-alpha-3","cdr-label-wrapper--small":"cdr-label-wrapper--small_13-0-0-alpha-3","cdr-label-wrapper--medium":"cdr-label-wrapper--medium_13-0-0-alpha-3","cdr-label-wrapper--large":"cdr-label-wrapper--large_13-0-0-alpha-3","cdr-label-wrapper--small@xs":"cdr-label-wrapper--small@xs_13-0-0-alpha-3","cdr-label-wrapper--medium@xs":"cdr-label-wrapper--medium@xs_13-0-0-alpha-3","cdr-label-wrapper--large@xs":"cdr-label-wrapper--large@xs_13-0-0-alpha-3","cdr-label-wrapper--small@sm":"cdr-label-wrapper--small@sm_13-0-0-alpha-3","cdr-label-wrapper--medium@sm":"cdr-label-wrapper--medium@sm_13-0-0-alpha-3","cdr-label-wrapper--large@sm":"cdr-label-wrapper--large@sm_13-0-0-alpha-3","cdr-label-wrapper--small@md":"cdr-label-wrapper--small@md_13-0-0-alpha-3","cdr-label-wrapper--medium@md":"cdr-label-wrapper--medium@md_13-0-0-alpha-3","cdr-label-wrapper--large@md":"cdr-label-wrapper--large@md_13-0-0-alpha-3","cdr-label-wrapper--small@lg":"cdr-label-wrapper--small@lg_13-0-0-alpha-3","cdr-label-wrapper--medium@lg":"cdr-label-wrapper--medium@lg_13-0-0-alpha-3","cdr-label-wrapper--large@lg":"cdr-label-wrapper--large@lg_13-0-0-alpha-3"};
+
+export { style0 as default };