tide-design-system 2.5.19 → 2.6.0

package/dist/components/TideInputTextarea.vue2.js

@@ -0,0 +1,147 @@
+import { defineComponent, useModel, ref, computed, watchEffect, watch, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, toDisplayString, createCommentVNode, withDirectives, vModelText, createBlock, mergeModels } from "vue";
+import _sfc_main$1 from "./TideInputSupportingText.vue.js";
+import { useFormContext } from "../composables/useTideForm.js";
+import { CSS } from "../types/Styles.js";
+import { ERROR_DISPLAY } from "../types/Validation.js";
+import { VALIDATION_RESULT, getFieldValidationResult } from "../utilities/validation.js";
+const _hoisted_1 = ["for"];
+const _hoisted_2 = ["maxlength", "minlength", "name", "required", "rows", "id"];
+const __default__ = {};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "TideInputTextarea",
+  props: /* @__PURE__ */ mergeModels({
+    error: { default: "" },
+    errorDisplay: { default: ERROR_DISPLAY.LAZY },
+    inputId: { default: void 0 },
+    label: { default: void 0 },
+    maxlength: { default: void 0 },
+    minlength: { default: void 0 },
+    name: { default: void 0 },
+    required: { type: Boolean, default: false },
+    rows: { default: 8 },
+    supportingText: { default: void 0 },
+    validators: { default: void 0 }
+  }, {
+    "modelValue": { required: true },
+    "modelModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["valid"], ["update:modelValue"]),
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const modelValue = useModel(__props, "modelValue");
+    const formContext = useFormContext();
+    const errorRef = ref(VALIDATION_RESULT.NO_ERROR);
+    const hasFocus = ref(false);
+    const isValidating = ref(false);
+    const textareaElement = ref(null);
+    const formattedLabel = computed(() => props.required ? `${props.label} *` : props.label);
+    const showError = computed(() => {
+      if (hasErrorFromProp.value) return true;
+      if (!isValidating.value) return false;
+      return !errorRef.value.valid;
+    });
+    const hasErrorFromProp = computed(() => props.error !== "");
+    const hasMinilabel = computed(() => hasFocus.value || !isEmpty.value);
+    const isEmpty = computed(() => modelValue.value === "");
+    const supportingTextMessage = computed(() => showError.value && errorRef.value.message || props.supportingText);
+    const handleFocus = () => {
+      hasFocus.value = true;
+      if (props.errorDisplay === ERROR_DISPLAY.EAGER) isValidating.value = true;
+    };
+    const handleFocusOut = () => {
+      hasFocus.value = false;
+      if (props.errorDisplay === ERROR_DISPLAY.LAZY) isValidating.value = true;
+    };
+    const handleFieldClick = () => {
+      var _a;
+      (_a = textareaElement.value) == null ? void 0 : _a.focus();
+    };
+    const preventTextareaFocusLossOnMousedown = (e) => {
+      if (!hasFocus.value) return;
+      if (e.target !== textareaElement.value) e.preventDefault();
+    };
+    watchEffect(() => {
+      errorRef.value = getFieldValidationResult({
+        errorFromProps: props.error,
+        maxlength: props.maxlength,
+        minlength: props.minlength,
+        required: props.required,
+        validators: props.validators,
+        value: modelValue
+      });
+    });
+    watch(
+      () => formContext == null ? void 0 : formContext.forceShowErrors.value,
+      (newValue) => {
+        if (newValue) isValidating.value = true;
+      },
+      { immediate: true }
+    );
+    watch(
+      errorRef,
+      () => {
+        emit("valid", errorRef.value.valid);
+      },
+      { deep: true, immediate: true }
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["tide-input-textarea", unref(CSS).DISPLAY.FLEX, unref(CSS).FLEX.DIRECTION.COLUMN, unref(CSS).GAP.QUARTER, showError.value && "error"])
+      }, [
+        createElementVNode("label", {
+          class: normalizeClass([
+            "tide-input-textarea-field",
+            unref(CSS).GAP.HALF,
+            unref(CSS).POSITION.RELATIVE,
+            unref(CSS).BORDER.RADIUS.HALF,
+            unref(CSS).PADDING.TOP.HALF,
+            unref(CSS).OVERFLOW.XY.HIDDEN,
+            unref(CSS).BG.SURFACE.DEFAULT,
+            unref(CSS).CURSOR.TEXT
+          ]),
+          for: __props.inputId,
+          onClick: handleFieldClick,
+          onMousedown: preventTextareaFocusLossOnMousedown
+        }, [
+          __props.label ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass([
+              "tide-input-textarea-label",
+              unref(CSS).PADDING.X.ONE,
+              hasMinilabel.value ? ["minilabel", unref(CSS).FONT.ROLE.LABEL_3] : unref(CSS).FONT.ROLE.LABEL_1,
+              !showError.value && unref(CSS).FONT.COLOR.SURFACE.VARIANT,
+              unref(CSS).POINTER_EVENTS.OFF
+            ])
+          }, toDisplayString(formattedLabel.value), 3)) : createCommentVNode("", true),
+          withDirectives(createElementVNode("textarea", {
+            class: normalizeClass([unref(CSS).DISPLAY.BLOCK, unref(CSS).FONT.ROLE.BODY_1, unref(CSS).PADDING.X.ONE, unref(CSS).WIDTH.FULL]),
+            maxlength: __props.maxlength,
+            minlength: __props.minlength,
+            name: __props.name,
+            ref_key: "textareaElement",
+            ref: textareaElement,
+            required: __props.required,
+            rows: __props.rows,
+            onFocus: handleFocus,
+            onFocusout: handleFocusOut,
+            id: __props.inputId,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event)
+          }, null, 42, _hoisted_2), [
+            [vModelText, modelValue.value]
+          ])
+        ], 42, _hoisted_1),
+        supportingTextMessage.value ? (openBlock(), createBlock(_sfc_main$1, {
+          key: 0,
+          "is-error": showError.value,
+          message: supportingTextMessage.value
+        }, null, 8, ["is-error", "message"])) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TideInputTextarea.vue2.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TideInputTextarea.vue2.js","sources":["../../src/components/TideInputTextarea.vue"],"sourcesContent":["<script lang=\"ts\">\n  /**\n   * Renders a textarea input intended to be used in forms.\n   *\n   * @see the [Storybook interface](https://tide-design-system.netlify.app/?path=/docs/components-tideinputtextarea--docs) for TideInputTextarea\n   */\n  export default {};\n</script>\n\n<script lang=\"ts\" setup>\n  import { computed, ref, watch, watchEffect } from 'vue';\n\n  import TideInputSupportingText from '@/components/TideInputSupportingText.vue';\n  import { useFormContext } from '@/composables/useTideForm';\n  import { CSS } from '@/types/Styles';\n  import { ERROR_DISPLAY } from '@/types/Validation';\n  import { VALIDATION_RESULT, getFieldValidationResult } from '@/utilities/validation';\n\n  import type { ErrorDisplay, ValidationResult, Validator } from '@/types/Validation';\n\n  type Props = {\n    /** Overrides the default error message and valid state */\n    error?: string;\n\n    /** Determines whether errors display prior to blur */\n    errorDisplay?: ErrorDisplay;\n\n    /** Unique ID attribute (to bind input label to input) */\n    inputId?: string;\n\n    /** Label content */\n    label?: string;\n\n    /** Applies a maximum character count to the input */\n    maxlength?: number | undefined;\n\n    /** Applies a minimum character count to the input */\n    minlength?: number | undefined;\n\n    /** Name attribute */\n    name?: string;\n\n    /** Determines whether input is required */\n    required?: boolean;\n\n    /** Determines the height of the input */\n    rows?: number;\n\n    /** Explainer text beneath input */\n    supportingText?: string;\n\n    /** Determines method(s) used to check for valid input value upon invoking relevant listener event(s) */\n    validators?: Validator[];\n  };\n\n  const props = withDefaults(defineProps<Props>(), {\n    error: '',\n    errorDisplay: ERROR_DISPLAY.LAZY,\n    inputId: undefined,\n    label: undefined,\n    maxlength: undefined,\n    minlength: undefined,\n    name: undefined,\n    required: false,\n    rows: 8,\n    supportingText: undefined,\n    validators: undefined,\n  });\n\n  type Emits = {\n    (event: 'valid', isValid: boolean): void;\n  };\n  const emit = defineEmits<Emits>();\n\n  const modelValue = defineModel<string>({ required: true });\n\n  const formContext = useFormContext();\n\n  const errorRef = ref<ValidationResult>(VALIDATION_RESULT.NO_ERROR);\n  const hasFocus = ref<boolean>(false);\n  const isValidating = ref<boolean>(false);\n  const textareaElement = ref<HTMLTextAreaElement | null>(null);\n\n  const formattedLabel = computed(() => (props.required ? `${props.label} *` : props.label));\n  const showError = computed(() => {\n    if (hasErrorFromProp.value) return true;\n    if (!isValidating.value) return false;\n    return !errorRef.value.valid;\n  });\n  const hasErrorFromProp = computed(() => props.error !== '');\n  const hasMinilabel = computed(() => hasFocus.value || !isEmpty.value);\n  const isEmpty = computed(() => modelValue.value === '');\n  const supportingTextMessage = computed(() => (showError.value && errorRef.value.message) || props.supportingText);\n\n  const handleFocus = () => {\n    hasFocus.value = true;\n    if (props.errorDisplay === ERROR_DISPLAY.EAGER) isValidating.value = true;\n  };\n\n  const handleFocusOut = () => {\n    hasFocus.value = false;\n    if (props.errorDisplay === ERROR_DISPLAY.LAZY) isValidating.value = true;\n  };\n\n  const handleFieldClick = () => {\n    textareaElement.value?.focus();\n  };\n\n  const preventTextareaFocusLossOnMousedown = (e: MouseEvent) => {\n    if (!hasFocus.value) return;\n    if (e.target !== textareaElement.value) e.preventDefault();\n  };\n\n  watchEffect(() => {\n    errorRef.value = getFieldValidationResult({\n      errorFromProps: props.error,\n      maxlength: props.maxlength,\n      minlength: props.minlength,\n      required: props.required,\n      validators: props.validators,\n      value: modelValue,\n    });\n  });\n\n  watch(\n    () => formContext?.forceShowErrors.value,\n    (newValue) => {\n      if (newValue) isValidating.value = true;\n    },\n    { immediate: true }\n  );\n\n  watch(\n    errorRef,\n    () => {\n      emit('valid', errorRef.value.valid);\n    },\n    { deep: true, immediate: true }\n  );\n</script>\n\n<template>\n  <div\n    :class=\"['tide-input-textarea', CSS.DISPLAY.FLEX, CSS.FLEX.DIRECTION.COLUMN, CSS.GAP.QUARTER, showError && 'error']\"\n  >\n    <label\n      :class=\"[\n        'tide-input-textarea-field',\n        CSS.GAP.HALF,\n        CSS.POSITION.RELATIVE,\n        CSS.BORDER.RADIUS.HALF,\n        CSS.PADDING.TOP.HALF,\n        CSS.OVERFLOW.XY.HIDDEN,\n        CSS.BG.SURFACE.DEFAULT,\n        CSS.CURSOR.TEXT,\n      ]\"\n      :for=\"inputId\"\n      @click=\"handleFieldClick\"\n      @mousedown=\"preventTextareaFocusLossOnMousedown\"\n    >\n      <div\n        :class=\"[\n          'tide-input-textarea-label',\n          CSS.PADDING.X.ONE,\n          hasMinilabel ? ['minilabel', CSS.FONT.ROLE.LABEL_3] : CSS.FONT.ROLE.LABEL_1,\n          !showError && CSS.FONT.COLOR.SURFACE.VARIANT,\n          CSS.POINTER_EVENTS.OFF,\n        ]\"\n        v-if=\"label\"\n      >\n        {{ formattedLabel }}\n      </div>\n\n      <textarea\n        :class=\"[CSS.DISPLAY.BLOCK, CSS.FONT.ROLE.BODY_1, CSS.PADDING.X.ONE, CSS.WIDTH.FULL]\"\n        :maxlength=\"maxlength\"\n        :minlength=\"minlength\"\n        :name=\"name\"\n        ref=\"textareaElement\"\n        :required=\"required\"\n        :rows=\"rows\"\n        @focus=\"handleFocus\"\n        @focusout=\"handleFocusOut\"\n        :id=\"inputId\"\n        v-model=\"modelValue\"\n      />\n    </label>\n\n    <TideInputSupportingText\n      :is-error=\"showError\"\n      :message=\"supportingTextMessage\"\n      v-if=\"supportingTextMessage\"\n    />\n  </div>\n</template>\n\n<style scoped>\n  textarea {\n    resize: vertical;\n  }\n\n  .tide-input-textarea-label {\n    height: 1.1875rem;\n    transition: font-size var(--tide-animate), transform var(--tide-animate);\n  }\n\n  .tide-input-textarea.error {\n    color: var(--tide-error-primary);\n  }\n\n  .tide-input-textarea.error .tide-input-textarea-field {\n    outline-color: var(--tide-error-border);\n    background-color: var(--tide-error-surface);\n  }\n\n  .tide-input-textarea.error:focus-within .tide-input-textarea-field {\n    outline-color: var(--tide-error-border);\n  }\n\n  .tide-input-textarea:focus-within .tide-input-textarea-field {\n    --tide-input-outline-width: var(--tide-border-width-2);\n    outline-color: var(--tide-border-high);\n  }\n\n  .tide-input-textarea textarea {\n    outline: none;\n  }\n\n  .tide-input-textarea-field {\n    --tide-input-outline-width: var(--tide-border-width-1);\n    outline: var(--tide-input-outline-width) solid var(--tide-border);\n    outline-offset: calc(var(--tide-input-outline-width) * -1);\n    color: var(--tide-on-surface);\n  }\n</style>\n"],"names":["_useModel","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_createBlock","TideInputSupportingText"],"mappings":";;;;;;;;AAME,MAAA,cAAe,CAAA;;;;;;;;;;;;;;;;;;;;;;AAiDf,UAAM,QAAQ;AAiBd,UAAM,OAAO;AAEb,UAAM,aAAaA,8BAAsC;AAEzD,UAAM,cAAc,eAAA;AAEpB,UAAM,WAAW,IAAsB,kBAAkB,QAAQ;AACjE,UAAM,WAAW,IAAa,KAAK;AACnC,UAAM,eAAe,IAAa,KAAK;AACvC,UAAM,kBAAkB,IAAgC,IAAI;AAE5D,UAAM,iBAAiB,SAAS,MAAO,MAAM,WAAW,GAAG,MAAM,KAAK,OAAO,MAAM,KAAM;AACzF,UAAM,YAAY,SAAS,MAAM;AAC/B,UAAI,iBAAiB,MAAO,QAAO;AACnC,UAAI,CAAC,aAAa,MAAO,QAAO;AAChC,aAAO,CAAC,SAAS,MAAM;AAAA,IACzB,CAAC;AACD,UAAM,mBAAmB,SAAS,MAAM,MAAM,UAAU,EAAE;AAC1D,UAAM,eAAe,SAAS,MAAM,SAAS,SAAS,CAAC,QAAQ,KAAK;AACpE,UAAM,UAAU,SAAS,MAAM,WAAW,UAAU,EAAE;AACtD,UAAM,wBAAwB,SAAS,MAAO,UAAU,SAAS,SAAS,MAAM,WAAY,MAAM,cAAc;AAEhH,UAAM,cAAc,MAAM;AACxB,eAAS,QAAQ;AACjB,UAAI,MAAM,iBAAiB,cAAc,oBAAoB,QAAQ;AAAA,IACvE;AAEA,UAAM,iBAAiB,MAAM;AAC3B,eAAS,QAAQ;AACjB,UAAI,MAAM,iBAAiB,cAAc,mBAAmB,QAAQ;AAAA,IACtE;AAEA,UAAM,mBAAmB,MAAM;;AAC7B,4BAAgB,UAAhB,mBAAuB;AAAA,IACzB;AAEA,UAAM,sCAAsC,CAAC,MAAkB;AAC7D,UAAI,CAAC,SAAS,MAAO;AACrB,UAAI,EAAE,WAAW,gBAAgB,SAAS,eAAA;AAAA,IAC5C;AAEA,gBAAY,MAAM;AAChB,eAAS,QAAQ,yBAAyB;AAAA,QACxC,gBAAgB,MAAM;AAAA,QACtB,WAAW,MAAM;AAAA,QACjB,WAAW,MAAM;AAAA,QACjB,UAAU,MAAM;AAAA,QAChB,YAAY,MAAM;AAAA,QAClB,OAAO;AAAA,MAAA,CACR;AAAA,IACH,CAAC;AAED;AAAA,MACE,MAAM,2CAAa,gBAAgB;AAAA,MACnC,CAAC,aAAa;AACZ,YAAI,uBAAuB,QAAQ;AAAA,MACrC;AAAA,MACA,EAAE,WAAW,KAAA;AAAA,IAAK;AAGpB;AAAA,MACE;AAAA,MACA,MAAM;AACJ,aAAK,SAAS,SAAS,MAAM,KAAK;AAAA,MACpC;AAAA,MACA,EAAE,MAAM,MAAM,WAAW,KAAA;AAAA,IAAK;;0BAKhCC,mBAmDM,OAAA;AAAA,QAlDH,OAAKC,eAAA,CAAA,uBAA0BC,WAAI,QAAQ,MAAMA,WAAI,KAAK,UAAU,QAAQA,MAAA,GAAA,EAAI,IAAI,SAAS,UAAA,SAAS,OAAA,CAAA;AAAA,MAAA;QAEvGC,mBAyCQ,SAAA;AAAA,UAxCL,OAAKF,eAAA;AAAA;YAAiDC,MAAA,GAAA,EAAI,IAAI;AAAA,YAAcA,MAAA,GAAA,EAAI,SAAS;AAAA,YAAkBA,MAAA,GAAA,EAAI,OAAO,OAAO;AAAA,YAAcA,MAAA,GAAA,EAAI,QAAQ,IAAI;AAAA,YAAcA,MAAA,GAAA,EAAI,SAAS,GAAG;AAAA,YAAgBA,MAAA,GAAA,EAAI,GAAG,QAAQ;AAAA,YAAiBA,MAAA,GAAA,EAAI,OAAO;AAAA,UAAA;UAUpP,KAAK,QAAA;AAAA,UACL,SAAO;AAAA,UACP,aAAW;AAAA,QAAA;UAUJ,QAAA,sBARRF,mBAWM,OAAA;AAAA;YAVH,OAAKC,eAAA;AAAA;cAAqDC,MAAA,GAAA,EAAI,QAAQ,EAAE;AAAA,cAAe,aAAA,QAAY,CAAA,aAAiBA,MAAA,GAAA,EAAI,KAAK,KAAK,OAAO,IAAIA,WAAI,KAAK,KAAK;AAAA,eAAoB,UAAA,SAAaA,WAAI,KAAK,MAAM,QAAQ;AAAA,cAAmBA,MAAA,GAAA,EAAI,eAAe;AAAA,YAAA;6BASvP,eAAA,KAAc,GAAA,CAAA;yBAGnBC,mBAYE,YAAA;AAAA,YAXC,OAAKF,eAAA,CAAGC,MAAA,GAAA,EAAI,QAAQ,OAAOA,MAAA,GAAA,EAAI,KAAK,KAAK,QAAQA,MAAA,GAAA,EAAI,QAAQ,EAAE,KAAKA,MAAA,GAAA,EAAI,MAAM,IAAI,CAAA;AAAA,YAClF,WAAW,QAAA;AAAA,YACX,WAAW,QAAA;AAAA,YACX,MAAM,QAAA;AAAA,qBACH;AAAA,YAAJ,KAAI;AAAA,YACH,UAAU,QAAA;AAAA,YACV,MAAM,QAAA;AAAA,YACN,SAAO;AAAA,YACP,YAAU;AAAA,YACV,IAAI,QAAA;AAAA,yEACI,WAAU,QAAA;AAAA,UAAA;yBAAV,WAAA,KAAU;AAAA,UAAA;;QAOf,sBAAA,sBAHRE,YAIEC,aAAA;AAAA;UAHC,YAAU,UAAA;AAAA,UACV,SAAS,sBAAA;AAAA,QAAA;;;;;"}

package/dist/components/TideInputTextareaDeprecated.vue.js

@@ -0,0 +1,8 @@
+import _sfc_main from "./TideInputTextareaDeprecated.vue2.js";
+/* empty css                                 */
+import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
+const TideInputTextareaDeprecated = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9b7af68f"]]);
+export {
+  TideInputTextareaDeprecated as default
+};
+//# sourceMappingURL=TideInputTextareaDeprecated.vue.js.map

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

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

package/dist/components/TideInputTextareaDeprecated.vue2.js

@@ -0,0 +1,136 @@
+import { defineComponent, ref, computed, watch, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, toDisplayString, createCommentVNode, withDirectives, vModelText, createBlock } from "vue";
+import _sfc_main$1 from "./TideIcon.vue.js";
+/* empty css              */
+import { ICON } from "../types/Icon.js";
+import { SIZE } from "../types/Size.js";
+import { CSS } from "../types/Styles.js";
+import { getErrorMessage, getFieldHasError, handleFieldValidation } from "../utilities/validation-deprecated.js";
+const _hoisted_1 = ["for"];
+const _hoisted_2 = ["maxlength", "minlength", "name", "required", "rows", "id"];
+const __default__ = {};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "TideInputTextareaDeprecated",
+  props: {
+    error: { type: [String, Boolean], default: false },
+    inputId: { default: void 0 },
+    label: { default: void 0 },
+    maxlength: { default: void 0 },
+    minlength: { default: void 0 },
+    name: { default: void 0 },
+    required: { type: Boolean, default: false },
+    rows: { default: 8 },
+    supportingText: { default: void 0 },
+    value: { default: void 0 }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const error = ref(props.error);
+    const hasFocus = ref(false);
+    const input = ref(null);
+    const value = ref(props.value);
+    const errorMessage = computed(() => getErrorMessage(props.error, error.value));
+    const formattedLabel = computed(() => props.required ? `${props.label} *` : props.label);
+    const hasError = computed(
+      () => props.required && value.value !== void 0 && !value.value || getFieldHasError(error.value, props.error)
+    );
+    const hasMinilabel = computed(() => hasFocus.value || !isEmpty.value);
+    const isEmpty = computed(() => value.value === "" || value.value === void 0);
+    const handleFocus = () => {
+      hasFocus.value = true;
+    };
+    const handleFocusOut = () => {
+      hasFocus.value = false;
+      if (!value.value) {
+        value.value = "";
+      }
+    };
+    const handleValidation = () => {
+      return handleFieldValidation({
+        error,
+        errorFromProps: props.error,
+        maxlength: props.maxlength,
+        minlength: props.minlength,
+        required: props.required,
+        value
+      });
+    };
+    watch(
+      () => props.value,
+      (newValue, oldValue) => {
+        if (newValue !== oldValue || newValue !== value.value) {
+          value.value = newValue;
+        }
+      }
+    );
+    __expose({
+      error,
+      required: props.required,
+      value
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["tide-input-textarea", unref(CSS).DISPLAY.FLEX, unref(CSS).FLEX.DIRECTION.COLUMN, unref(CSS).GAP.QUARTER, hasError.value && "error"])
+      }, [
+        createElementVNode("label", {
+          class: normalizeClass([
+            "tide-input-textarea-field",
+            unref(CSS).GAP.HALF,
+            unref(CSS).POSITION.RELATIVE,
+            unref(CSS).BORDER.RADIUS.HALF,
+            unref(CSS).PADDING.LEFT.ONE,
+            unref(CSS).PADDING.TOP.HALF,
+            unref(CSS).OVERFLOW.XY.HIDDEN,
+            unref(CSS).BG.SURFACE.DEFAULT,
+            unref(CSS).CURSOR.TEXT
+          ]),
+          for: __props.inputId
+        }, [
+          __props.label ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass([
+              "tide-input-textarea-label",
+              hasMinilabel.value ? ["minilabel", unref(CSS).FONT.ROLE.LABEL_3] : unref(CSS).FONT.ROLE.LABEL_1,
+              !hasError.value && unref(CSS).FONT.COLOR.SURFACE.VARIANT,
+              unref(CSS).POINTER_EVENTS.OFF
+            ])
+          }, toDisplayString(formattedLabel.value), 3)) : createCommentVNode("", true),
+          withDirectives(createElementVNode("textarea", {
+            class: normalizeClass([unref(CSS).DISPLAY.BLOCK, unref(CSS).WIDTH.FULL, unref(CSS).FONT.ROLE.BODY_1]),
+            maxlength: __props.maxlength,
+            minlength: __props.minlength,
+            name: __props.name,
+            ref_key: "input",
+            ref: input,
+            required: __props.required,
+            rows: __props.rows,
+            onChange: handleValidation,
+            onFocus: handleFocus,
+            onFocusout: handleFocusOut,
+            id: __props.inputId,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => value.value = $event)
+          }, null, 42, _hoisted_2), [
+            [vModelText, value.value]
+          ])
+        ], 10, _hoisted_1),
+        __props.supportingText || hasError.value ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass([unref(CSS).DISPLAY.FLEX, unref(CSS).AXIS2.CENTER, unref(CSS).GAP.QUARTER])
+        }, [
+          hasError.value ? (openBlock(), createBlock(_sfc_main$1, {
+            key: 0,
+            icon: unref(ICON).ERROR,
+            size: unref(SIZE).SMALL
+          }, null, 8, ["icon", "size"])) : createCommentVNode("", true),
+          createElementVNode("div", {
+            class: normalizeClass([unref(CSS).FONT.ROLE.LABEL_3])
+          }, toDisplayString(hasError.value ? errorMessage.value : __props.supportingText), 3)
+        ], 2)) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TideInputTextareaDeprecated.vue2.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TideInputTextareaDeprecated.vue2.js","sources":["../../src/components/TideInputTextareaDeprecated.vue"],"sourcesContent":["<script lang=\"ts\">\n  /**\n   * @deprecated Use `TideInputTextarea.vue` imported from 'tide-design-system' npm package instead.\n   */\n  export default {};\n</script>\n\n<script lang=\"ts\" setup>\n  import { computed, ref, watch } from 'vue';\n\n  import TideIcon from '@/components/TideIcon.vue';\n  import { ICON } from '@/types/Icon';\n  import { SIZE } from '@/types/Size';\n  import { CSS } from '@/types/Styles';\n  import { getErrorMessage, getFieldHasError, handleFieldValidation } from '@/utilities/validation-deprecated';\n\n  import type { ValidationError } from '@/types/ValidationDeprecated';\n\n  type Props = {\n    error?: ValidationError;\n    inputId?: string;\n    label?: string;\n    maxlength?: number | undefined;\n    minlength?: number | undefined;\n    name?: string;\n    required?: boolean;\n    rows?: number;\n    supportingText?: string;\n    value?: string;\n  };\n\n  const props = withDefaults(defineProps<Props>(), {\n    error: false,\n    inputId: undefined,\n    label: undefined,\n    maxlength: undefined,\n    minlength: undefined,\n    name: undefined,\n    required: false,\n    rows: 8,\n    supportingText: undefined,\n    value: undefined,\n  });\n\n  const error = ref(props.error);\n  const hasFocus = ref(false);\n  const input = ref<HTMLInputElement | null>(null);\n  const value = ref(props.value);\n\n  const errorMessage = computed(() => getErrorMessage(props.error, error.value));\n  const formattedLabel = computed(() => (props.required ? `${props.label} *` : props.label));\n  const hasError = computed(\n    () => (props.required && value.value !== undefined && !value.value) || getFieldHasError(error.value, props.error)\n  );\n  const hasMinilabel = computed(() => hasFocus.value || !isEmpty.value);\n  const isEmpty = computed(() => value.value === '' || value.value === undefined);\n\n  const handleFocus = () => {\n    hasFocus.value = true;\n  };\n\n  const handleFocusOut = () => {\n    hasFocus.value = false;\n\n    if (!value.value) {\n      value.value = '';\n    }\n  };\n\n  const handleValidation = () => {\n    return handleFieldValidation({\n      error,\n      errorFromProps: props.error,\n      maxlength: props.maxlength,\n      minlength: props.minlength,\n      required: props.required,\n      value,\n    });\n  };\n\n  watch(\n    () => props.value,\n    (newValue, oldValue) => {\n      if (newValue !== oldValue || newValue !== value.value) {\n        value.value = newValue;\n      }\n    }\n  );\n\n  defineExpose({\n    error,\n    required: props.required,\n    value,\n  });\n</script>\n\n<template>\n  <div\n    :class=\"['tide-input-textarea', CSS.DISPLAY.FLEX, CSS.FLEX.DIRECTION.COLUMN, CSS.GAP.QUARTER, hasError && 'error']\"\n  >\n    <label\n      :class=\"[\n        'tide-input-textarea-field',\n        CSS.GAP.HALF,\n        CSS.POSITION.RELATIVE,\n        CSS.BORDER.RADIUS.HALF,\n        CSS.PADDING.LEFT.ONE,\n        CSS.PADDING.TOP.HALF,\n        CSS.OVERFLOW.XY.HIDDEN,\n        CSS.BG.SURFACE.DEFAULT,\n        CSS.CURSOR.TEXT,\n      ]\"\n      :for=\"inputId\"\n    >\n      <div\n        :class=\"[\n          'tide-input-textarea-label',\n          hasMinilabel ? ['minilabel', CSS.FONT.ROLE.LABEL_3] : CSS.FONT.ROLE.LABEL_1,\n          !hasError && CSS.FONT.COLOR.SURFACE.VARIANT,\n          CSS.POINTER_EVENTS.OFF,\n        ]\"\n        v-if=\"label\"\n      >\n        {{ formattedLabel }}\n      </div>\n\n      <textarea\n        :class=\"[CSS.DISPLAY.BLOCK, CSS.WIDTH.FULL, CSS.FONT.ROLE.BODY_1]\"\n        :maxlength=\"maxlength\"\n        :minlength=\"minlength\"\n        :name=\"name\"\n        ref=\"input\"\n        :required=\"required\"\n        :rows=\"rows\"\n        @change=\"handleValidation\"\n        @focus=\"handleFocus\"\n        @focusout=\"handleFocusOut\"\n        :id=\"inputId\"\n        v-model=\"value\"\n      />\n    </label>\n\n    <div\n      :class=\"[CSS.DISPLAY.FLEX, CSS.AXIS2.CENTER, CSS.GAP.QUARTER]\"\n      v-if=\"supportingText || hasError\"\n    >\n      <TideIcon\n        :icon=\"ICON.ERROR\"\n        :size=\"SIZE.SMALL\"\n        v-if=\"hasError\"\n      />\n\n      <div :class=\"[CSS.FONT.ROLE.LABEL_3]\">\n        {{ hasError ? errorMessage : supportingText }}\n      </div>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n  textarea {\n    resize: vertical;\n  }\n\n  .tide-input-textarea-label {\n    height: 1.1875rem;\n    transition: font-size var(--tide-animate), transform var(--tide-animate);\n  }\n\n  .tide-input-textarea.error {\n    color: var(--tide-error-primary);\n  }\n\n  .tide-input-textarea.error .tide-input-textarea-field {\n    outline-color: var(--tide-error-border);\n    background-color: var(--tide-error-surface);\n  }\n\n  .tide-input-textarea.error:focus-within .tide-input-textarea-field {\n    outline-color: var(--tide-error-border);\n  }\n\n  .tide-input-textarea:focus-within .tide-input-textarea-field {\n    --tide-input-outline-width: var(--tide-border-width-2);\n    outline-color: var(--tide-border-high);\n  }\n\n  .tide-input-textarea textarea {\n    outline: none;\n  }\n\n  .tide-input-textarea-field {\n    --tide-input-outline-width: var(--tide-border-width-1);\n    outline: var(--tide-input-outline-width) solid var(--tide-border);\n    outline-offset: calc(var(--tide-input-outline-width) * -1);\n    color: var(--tide-on-surface);\n  }\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_unref","_createElementVNode","_createBlock","TideIcon"],"mappings":"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"}

package/dist/components/TideLink.vue.js

@@ -0,0 +1,63 @@
+import { defineComponent, computed, openBlock, createBlock, resolveDynamicComponent, unref, normalizeClass, withCtx, createCommentVNode, createElementVNode, toDisplayString } from "vue";
+import _sfc_main$1 from "./InternalBaseLink.vue.js";
+import _sfc_main$2 from "./TideIcon.vue.js";
+/* empty css              */
+import { ELEMENT } from "../types/Element.js";
+import { SIZE } from "../types/Size.js";
+import { CSS } from "../types/Styles.js";
+import { TARGET } from "../types/Target.js";
+const __default__ = {};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "TideLink",
+  props: {
+    element: { default: ELEMENT.LINK },
+    href: { default: void 0 },
+    iconLeading: { default: void 0 },
+    iconSize: { default: SIZE.SMALL },
+    iconTrailing: { default: void 0 },
+    isNewTab: { type: Boolean, default: false },
+    label: { default: void 0 },
+    subtle: { type: Boolean, default: false }
+  },
+  setup(__props) {
+    const props = __props;
+    const rootElement = computed(() => props.element === ELEMENT.LINK ? _sfc_main$1 : props.element);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(rootElement.value), {
+        class: normalizeClass([
+          "tide-link",
+          unref(CSS).DISPLAY.INLINE,
+          unref(CSS).ALIGN.X.LEFT,
+          __props.subtle ? [unref(CSS).UNDERLINE.REST.OFF, unref(CSS).UNDERLINE.HOVER.ON] : [unref(CSS).UNDERLINE.REST.ON, unref(CSS).UNDERLINE.HOVER.OFF]
+        ]),
+        href: props.href,
+        target: props.isNewTab ? unref(TARGET).BLANK : unref(TARGET).SELF,
+        type: __props.element === unref(ELEMENT).BUTTON ? unref(ELEMENT).BUTTON : void 0
+      }, {
+        default: withCtx(() => [
+          props.iconLeading ? (openBlock(), createBlock(_sfc_main$2, {
+            key: 0,
+            class: normalizeClass([unref(CSS).DISPLAY.INLINE_BLOCK, unref(CSS).ALIGN.Y.MIDDLE, unref(CSS).MARGIN.RIGHT.QUARTER, unref(CSS).POINTER_EVENTS.OFF]),
+            icon: props.iconLeading,
+            size: __props.iconSize
+          }, null, 8, ["class", "icon", "size"])) : createCommentVNode("", true),
+          createElementVNode("span", {
+            class: normalizeClass([unref(CSS).ALIGN.Y.MIDDLE])
+          }, toDisplayString(props.label), 3),
+          props.iconTrailing ? (openBlock(), createBlock(_sfc_main$2, {
+            key: 1,
+            class: normalizeClass([unref(CSS).DISPLAY.INLINE_BLOCK, unref(CSS).ALIGN.Y.MIDDLE, unref(CSS).MARGIN.LEFT.QUARTER, unref(CSS).POINTER_EVENTS.OFF]),
+            icon: props.iconTrailing,
+            size: __props.iconSize
+          }, null, 8, ["class", "icon", "size"])) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["class", "href", "target", "type"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TideLink.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TideLink.vue.js","sources":["../../src/components/TideLink.vue"],"sourcesContent":["<script lang=\"ts\">\n  /**\n   * Renders a link element.\n   *\n   * @see the [Storybook interface](https://tide-design-system.netlify.app/?path=/docs/components-tidelink--docs) for TideLink\n   */\n  export default {};\n</script>\n\n<script lang=\"ts\" setup>\n  import { computed } from 'vue';\n\n  import InternalBaseLink from '@/components/InternalBaseLink.vue';\n  import TideIcon from '@/components/TideIcon.vue';\n  import { ELEMENT } from '@/types/Element';\n  import { SIZE } from '@/types/Size';\n  import { CSS } from '@/types/Styles';\n  import { TARGET } from '@/types/Target';\n\n  import type { Element } from '@/types/Element';\n  import type { Icon } from '@/types/Icon';\n  import type { Size } from '@/types/Size';\n\n  type Props = {\n    /** HTML tag type */\n    element?: Element;\n\n    /** URL to open (Link only) */\n    href?: string;\n\n    /** Icon to left of label */\n    iconLeading?: Icon;\n\n    /** Size of the icons */\n    iconSize?: Size;\n\n    /** Icon to right of label */\n    iconTrailing?: Icon;\n\n    /** Determines whether to target a new browser tab (Link only) */\n    isNewTab?: boolean;\n\n    /** Link text */\n    label: string;\n\n    /** Hides the underline until hovered, de-emphasizing the link */\n    subtle?: boolean;\n  };\n\n  const props = withDefaults(defineProps<Props>(), {\n    element: ELEMENT.LINK,\n    href: undefined,\n    iconLeading: undefined,\n    iconSize: SIZE.SMALL,\n    iconTrailing: undefined,\n    isNewTab: false,\n    label: undefined,\n    subtle: false,\n  });\n\n  const rootElement = computed(() => (props.element === ELEMENT.LINK ? InternalBaseLink : props.element));\n</script>\n\n<template>\n  <component\n    :class=\"[\n      'tide-link',\n      CSS.DISPLAY.INLINE,\n      CSS.ALIGN.X.LEFT,\n      subtle ? [CSS.UNDERLINE.REST.OFF, CSS.UNDERLINE.HOVER.ON] : [CSS.UNDERLINE.REST.ON, CSS.UNDERLINE.HOVER.OFF],\n    ]\"\n    :href=\"props.href\"\n    :target=\"props.isNewTab ? TARGET.BLANK : TARGET.SELF\"\n    :type=\"element === ELEMENT.BUTTON ? ELEMENT.BUTTON : undefined\"\n    :is=\"rootElement\"\n  >\n    <TideIcon\n      :class=\"[CSS.DISPLAY.INLINE_BLOCK, CSS.ALIGN.Y.MIDDLE, CSS.MARGIN.RIGHT.QUARTER, CSS.POINTER_EVENTS.OFF]\"\n      :icon=\"props.iconLeading\"\n      :size=\"iconSize\"\n      v-if=\"props.iconLeading\"\n    />\n\n    <span :class=\"[CSS.ALIGN.Y.MIDDLE]\">\n      {{ props.label }}\n    </span>\n\n    <TideIcon\n      :class=\"[CSS.DISPLAY.INLINE_BLOCK, CSS.ALIGN.Y.MIDDLE, CSS.MARGIN.LEFT.QUARTER, CSS.POINTER_EVENTS.OFF]\"\n      :icon=\"props.iconTrailing\"\n      :size=\"iconSize\"\n      v-if=\"props.iconTrailing\"\n    />\n  </component>\n</template>\n"],"names":["InternalBaseLink","_openBlock","_createBlock","_resolveDynamicComponent","_normalizeClass","_unref","TideIcon","_createElementVNode","_toDisplayString"],"mappings":";;;;;;;;AAME,MAAA,cAAe,CAAA;;;;;;;;;;;;;;;AA2Cf,UAAM,QAAQ;AAWd,UAAM,cAAc,SAAS,MAAO,MAAM,YAAY,QAAQ,OAAOA,cAAmB,MAAM,OAAQ;;AAItG,aAAAC,aAAAC,YA6BYC,wBAnBL,YAAA,KAAW,GAAA;AAAA,QATf,OAAKC,eAAA;AAAA;UAA6BC,MAAA,GAAA,EAAI,QAAQ;AAAA,UAAcA,MAAA,GAAA,EAAI,MAAM,EAAE;AAAA,UAAY,QAAA,SAAM,CAAIA,MAAA,GAAA,EAAI,UAAU,KAAK,KAAKA,MAAA,GAAA,EAAI,UAAU,MAAM,EAAE,IAAA,CAAKA,MAAA,GAAA,EAAI,UAAU,KAAK,IAAIA,MAAA,GAAA,EAAI,UAAU,MAAM,GAAG;AAAA,QAAA;QAM/L,MAAM,MAAM;AAAA,QACZ,QAAQ,MAAM,WAAWA,MAAA,MAAA,EAAO,QAAQA,MAAA,MAAA,EAAO;AAAA,QAC/C,MAAM,QAAA,YAAYA,MAAA,OAAA,EAAQ,SAASA,MAAA,OAAA,EAAQ,SAAS;AAAA,MAAA;yBAGrD,MAKE;AAAA,UADM,MAAM,4BAJdH,YAKEI,aAAA;AAAA;YAJC,OAAKF,eAAA,CAAGC,MAAA,GAAA,EAAI,QAAQ,cAAcA,MAAA,GAAA,EAAI,MAAM,EAAE,QAAQA,MAAA,GAAA,EAAI,OAAO,MAAM,SAASA,MAAA,GAAA,EAAI,eAAe,GAAG,CAAA;AAAA,YACtG,MAAM,MAAM;AAAA,YACZ,MAAM,QAAA;AAAA,UAAA;UAITE,mBAEO,QAAA;AAAA,YAFA,uBAAQF,MAAA,GAAA,EAAI,MAAM,EAAE,MAAM,CAAA;AAAA,UAAA,GAC5BG,gBAAA,MAAM,KAAK,GAAA,CAAA;AAAA,UAOR,MAAM,6BAJdN,YAKEI,aAAA;AAAA;YAJC,OAAKF,eAAA,CAAGC,MAAA,GAAA,EAAI,QAAQ,cAAcA,MAAA,GAAA,EAAI,MAAM,EAAE,QAAQA,MAAA,GAAA,EAAI,OAAO,KAAK,SAASA,MAAA,GAAA,EAAI,eAAe,GAAG,CAAA;AAAA,YACrG,MAAM,MAAM;AAAA,YACZ,MAAM,QAAA;AAAA,UAAA;;;;;;;"}

package/dist/components/TideLink.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./TideLink.vue.js";
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TideLink.vue2.js.map

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

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

package/dist/components/TideMenuItem.vue.js

@@ -0,0 +1,8 @@
+import _sfc_main from "./TideMenuItem.vue2.js";
+/* empty css                  */
+import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
+const TideMenuItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-da373674"]]);
+export {
+  TideMenuItem as default
+};
+//# sourceMappingURL=TideMenuItem.vue.js.map

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

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

package/dist/components/TideMenuItem.vue2.js

@@ -0,0 +1,55 @@
+import { defineComponent, openBlock, createBlock, resolveDynamicComponent, unref, normalizeClass, withCtx, createElementVNode, toDisplayString, createCommentVNode } from "vue";
+import _sfc_main$1 from "./TideIcon.vue.js";
+/* empty css              */
+import { ELEMENT } from "../types/Element.js";
+import { SIZE } from "../types/Size.js";
+import { CSS } from "../types/Styles.js";
+import { TARGET } from "../types/Target.js";
+const __default__ = {};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "TideMenuItem",
+  props: {
+    element: { default: ELEMENT.LINK },
+    href: { default: void 0 },
+    isNewTab: { type: Boolean, default: false },
+    iconTrailing: { default: void 0 },
+    label: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(__props.element), {
+        class: normalizeClass([
+          "tide-menu-item",
+          unref(CSS).AXIS2.CENTER,
+          unref(CSS).BORDER.RADIUS.ZERO,
+          unref(CSS).DISPLAY.FLEX,
+          unref(CSS).ELLIPSIS,
+          unref(CSS).FONT.ROLE.LABEL_1,
+          unref(CSS).GAP.QUARTER,
+          unref(CSS).PADDING.X.ONE,
+          unref(CSS).PADDING.Y.HALF,
+          unref(CSS).UNDERLINE.REST.OFF,
+          unref(CSS).WIDTH.FULL
+        ]),
+        href: __props.href,
+        target: __props.isNewTab ? unref(TARGET).BLANK : void 0
+      }, {
+        default: withCtx(() => [
+          createElementVNode("span", null, toDisplayString(__props.label), 1),
+          __props.iconTrailing ? (openBlock(), createBlock(_sfc_main$1, {
+            key: 0,
+            class: normalizeClass([unref(CSS).MARGIN.LEFT.AUTO]),
+            icon: __props.iconTrailing,
+            size: unref(SIZE).LARGE
+          }, null, 8, ["class", "icon", "size"])) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["class", "href", "target"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TideMenuItem.vue2.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TideMenuItem.vue2.js","sources":["../../src/components/TideMenuItem.vue"],"sourcesContent":["<script lang=\"ts\">\n  /**\n   * Renders a generic menu item intended to be used in navigation menus or dropdowns.\n   *\n   * @see the [Storybook interface](https://tide-design-system.netlify.app/?path=/docs/components-tidemenuitem--docs) for TideMenuItem\n   */\n  export default {};\n</script>\n\n<script setup lang=\"ts\">\n  import TideIcon from '@/components/TideIcon.vue';\n  import { ELEMENT } from '@/types/Element';\n  import { SIZE } from '@/types/Size';\n  import { CSS } from '@/types/Styles';\n  import { TARGET } from '@/types/Target';\n\n  import type { Element } from '@/types/Element';\n  import type { Icon } from '@/types/Icon';\n\n  type Props = {\n    /** The element to render the root element as. */\n    element?: Element;\n\n    /** The href attribute to apply when the element is a link. */\n    href?: string;\n\n    /** Whether to open link in a new tab. */\n    isNewTab?: boolean;\n\n    /** Icon to show after the label. */\n    iconTrailing?: Icon;\n\n    /** The label to be displayed. */\n    label: string;\n  };\n\n  withDefaults(defineProps<Props>(), {\n    element: ELEMENT.LINK,\n    href: undefined,\n    iconTrailing: undefined,\n    isNewTab: false,\n  });\n</script>\n\n<template>\n  <component\n    :class=\"[\n      'tide-menu-item',\n      CSS.AXIS2.CENTER,\n      CSS.BORDER.RADIUS.ZERO,\n      CSS.DISPLAY.FLEX,\n      CSS.ELLIPSIS,\n      CSS.FONT.ROLE.LABEL_1,\n      CSS.GAP.QUARTER,\n      CSS.PADDING.X.ONE,\n      CSS.PADDING.Y.HALF,\n      CSS.UNDERLINE.REST.OFF,\n      CSS.WIDTH.FULL,\n    ]\"\n    :href=\"href\"\n    :target=\"isNewTab ? TARGET.BLANK : undefined\"\n    :is=\"element\"\n  >\n    <span>{{ label }}</span>\n\n    <TideIcon\n      :class=\"[CSS.MARGIN.LEFT.AUTO]\"\n      :icon=\"iconTrailing\"\n      :size=\"SIZE.LARGE\"\n      v-if=\"iconTrailing\"\n    />\n  </component>\n</template>\n\n<style scoped>\n  .tide-menu-item {\n    height: 40px;\n  }\n\n  .tide-menu-item:hover {\n    background-color: var(--tide-surface-variant);\n  }\n</style>\n"],"names":["_openBlock","_createBlock","_resolveDynamicComponent","_normalizeClass","_unref","_createElementVNode","TideIcon"],"mappings":";;;;;;;AAME,MAAA,cAAe,CAAA;;;;;;;;;;;;;AAuCf,aAAAA,aAAAC,YA0BYC,wBAVL,QAAA,OAAO,GAAA;AAAA,QAfX,OAAKC,eAAA;AAAA;UAAkCC,MAAA,GAAA,EAAI,MAAM;AAAA,UAAcA,MAAA,GAAA,EAAI,OAAO,OAAO;AAAA,UAAYA,MAAA,GAAA,EAAI,QAAQ;AAAA,UAAYA,MAAA,GAAA,EAAI;AAAA,UAAgBA,MAAA,GAAA,EAAI,KAAK,KAAK;AAAA,UAAeA,MAAA,GAAA,EAAI,IAAI;AAAA,UAAeA,MAAA,GAAA,EAAI,QAAQ,EAAE;AAAA,UAAWA,MAAA,GAAA,EAAI,QAAQ,EAAE;AAAA,UAAYA,MAAA,GAAA,EAAI,UAAU,KAAK;AAAA,UAAWA,MAAA,GAAA,EAAI,MAAM;AAAA,QAAA;QAaxR,MAAM,QAAA;AAAA,QACN,QAAQ,QAAA,WAAWA,cAAO,QAAQ;AAAA,MAAA;yBAGnC,MAAwB;AAAA,UAAxBC,mBAAwB,8BAAf,QAAA,KAAK,GAAA,CAAA;AAAA,UAMN,QAAA,6BAJRJ,YAKEK,aAAA;AAAA;YAJC,uBAAQF,MAAA,GAAA,EAAI,OAAO,KAAK,IAAI,CAAA;AAAA,YAC5B,MAAM,QAAA;AAAA,YACN,MAAMA,MAAA,IAAA,EAAK;AAAA,UAAA;;;;;;;"}

package/dist/components/TideModal.vue.js

@@ -0,0 +1,8 @@
+import _sfc_main from "./TideModal.vue2.js";
+/* empty css               */
+import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
+const TideModal = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-48b2fcd3"]]);
+export {
+  TideModal as default
+};
+//# sourceMappingURL=TideModal.vue.js.map

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

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