tide-design-system 2.5.19 → 2.6.0

package/dist/components/TideButtonPagination.vue2.js

@@ -0,0 +1,44 @@
+import { defineComponent, computed, openBlock, createBlock, resolveDynamicComponent, unref, normalizeClass, withCtx, createElementVNode, toDisplayString } from "vue";
+import _sfc_main$1 from "./InternalBaseLink.vue.js";
+import { ELEMENT_BROAD, ELEMENT } from "../types/Element.js";
+import { CSS } from "../types/Styles.js";
+const __default__ = {};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "TideButtonPagination",
+  props: {
+    disabled: { type: Boolean, default: false },
+    element: { default: ELEMENT_BROAD.BUTTON },
+    href: { default: void 0 },
+    label: { default: void 0 }
+  },
+  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-button-icon",
+          [unref(CSS).DISPLAY.INLINE_BLOCK, unref(CSS).BORDER.RADIUS.FULL, unref(CSS).PADDING.FULL.HALF],
+          props.element === unref(ELEMENT_BROAD).LINK ? [unref(CSS).UNDERLINE.REST.OFF] : "",
+          props.element === unref(ELEMENT_BROAD).DIV ? [unref(CSS).CURSOR.POINTER] : "",
+          [unref(CSS).FONT.ROLE.HEADLINE_3]
+        ]),
+        disabled: props.element === unref(ELEMENT_BROAD).BUTTON && props.disabled,
+        href: props.element === unref(ELEMENT_BROAD).LINK && props.href ? props.href : void 0,
+        type: __props.element === unref(ELEMENT_BROAD).BUTTON ? unref(ELEMENT_BROAD).BUTTON : void 0
+      }, {
+        default: withCtx(() => [
+          createElementVNode("span", {
+            class: normalizeClass(["label", unref(CSS).DISPLAY.FLEX, unref(CSS).AXIS1.CENTER, unref(CSS).AXIS2.CENTER])
+          }, toDisplayString(props.label), 3)
+        ]),
+        _: 1
+      }, 8, ["class", "disabled", "href", "type"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TideButtonPagination.vue2.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TideButtonPagination.vue2.js","sources":["../../src/components/TideButtonPagination.vue"],"sourcesContent":["<script lang=\"ts\">\n  /**\n   * Renders a button component for use in pagination purposes.\n   *\n   * @see the [Storybook interface](https://tide-design-system.netlify.app/?path=/docs/components-tidebuttonpagination--docs) for TideButtonPagination\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 { ELEMENT, ELEMENT_BROAD } from '@/types/Element';\n  import { CSS } from '@/types/Styles';\n\n  import type { ElementBroad } from '@/types/Element';\n\n  type Props = {\n    /** Indicates whether Pagination Button is associated with the displayed page */\n    disabled?: boolean;\n\n    /** HTML tag type */\n    element?: ElementBroad;\n\n    /** URL to open<br />(Link only) */\n    href?: string;\n\n    /** Button text */\n    label: string | number;\n  };\n\n  const props = withDefaults(defineProps<Props>(), {\n    disabled: false,\n    element: ELEMENT_BROAD.BUTTON,\n    href: undefined,\n    label: undefined,\n  });\n\n  const rootElement = computed(() => (props.element === ELEMENT.LINK ? InternalBaseLink : props.element));\n</script>\n\n<template>\n  <component\n    :class=\"[\n      'tide-button-icon',\n      [CSS.DISPLAY.INLINE_BLOCK, CSS.BORDER.RADIUS.FULL, CSS.PADDING.FULL.HALF],\n      props.element === ELEMENT_BROAD.LINK ? [CSS.UNDERLINE.REST.OFF] : '',\n      props.element === ELEMENT_BROAD.DIV ? [CSS.CURSOR.POINTER] : '',\n      [CSS.FONT.ROLE.HEADLINE_3],\n    ]\"\n    :disabled=\"props.element === ELEMENT_BROAD.BUTTON && props.disabled\"\n    :href=\"props.element === ELEMENT_BROAD.LINK && props.href ? props.href : undefined\"\n    :type=\"element === ELEMENT_BROAD.BUTTON ? ELEMENT_BROAD.BUTTON : undefined\"\n    :is=\"rootElement\"\n  >\n    <span :class=\"['label', CSS.DISPLAY.FLEX, CSS.AXIS1.CENTER, CSS.AXIS2.CENTER]\">\n      {{ props.label }}\n    </span>\n  </component>\n</template>\n\n<style scoped>\n  .tide-button-icon,\n  .tide-link-as-button-icon {\n    border: 1px solid var(--tide-white);\n    background: var(--tide-white);\n    color: var(--tide-secondary);\n  }\n\n  .tide-button-icon:not(:disabled):hover,\n  .tide-link-as-button-icon:not(:disabled):hover {\n    border: 1px solid var(--tide-surface-variant);\n    background: var(--tide-surface-variant);\n  }\n\n  .tide-button-icon:disabled,\n  .tide-link-as-button-icon:disabled {\n    border: 1px solid var(--tide-border-high);\n  }\n\n  .tide-button-icon .label,\n  .tide-link-as-button-icon .label {\n    width: 1.5rem;\n    height: 1.5rem;\n  }\n</style>\n"],"names":["InternalBaseLink","_openBlock","_createBlock","_resolveDynamicComponent","_normalizeClass","_unref","_createElementVNode","_toDisplayString"],"mappings":";;;;AAME,MAAA,cAAe,CAAA;;;;;;;;;;;AA0Bf,UAAM,QAAQ;AAOd,UAAM,cAAc,SAAS,MAAO,MAAM,YAAY,QAAQ,OAAOA,cAAmB,MAAM,OAAQ;;AAItG,aAAAC,aAAAC,YAgBYC,wBALL,YAAA,KAAW,GAAA;AAAA,QAVf,OAAKC,eAAA;AAAA;UAAqC,CAAAC,MAAA,GAAA,EAAI,QAAQ,cAAcA,MAAA,GAAA,EAAI,OAAO,OAAO,MAAMA,MAAA,GAAA,EAAI,QAAQ,KAAK,IAAI;AAAA,UAAS,MAAM,YAAYA,MAAA,aAAA,EAAc,OAAI,CAAIA,MAAA,GAAA,EAAI,UAAU,KAAK,GAAG,IAAA;AAAA,UAAc,MAAM,YAAYA,MAAA,aAAA,EAAc,MAAG,CAAIA,MAAA,GAAA,EAAI,OAAO,OAAO,IAAA;AAAA,UAAe,CAAAA,MAAA,GAAA,EAAI,KAAK,KAAK,UAAU;AAAA,QAAA;QAOtS,UAAU,MAAM,YAAYA,MAAA,aAAA,EAAc,UAAU,MAAM;AAAA,QAC1D,MAAM,MAAM,YAAYA,qBAAc,QAAQ,MAAM,OAAO,MAAM,OAAO;AAAA,QACxE,MAAM,QAAA,YAAYA,MAAA,aAAA,EAAc,SAASA,MAAA,aAAA,EAAc,SAAS;AAAA,MAAA;yBAGjE,MAEO;AAAA,UAFPC,mBAEO,QAAA;AAAA,YAFA,gCAAiBD,MAAA,GAAA,EAAI,QAAQ,MAAMA,MAAA,GAAA,EAAI,MAAM,QAAQA,WAAI,MAAM,MAAM,CAAA;AAAA,UAAA,GACvEE,gBAAA,MAAM,KAAK,GAAA,CAAA;AAAA,QAAA;;;;;;"}

package/dist/components/TideButtonSave.vue.js

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

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

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

package/dist/components/TideButtonSave.vue2.js

@@ -0,0 +1,56 @@
+import { defineComponent, ref, useModel, watch, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, normalizeStyle } from "vue";
+import { CSS } from "../types/Styles.js";
+const __default__ = {};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "TideButtonSave",
+  props: {
+    "modelValue": { type: Boolean, ...{ required: true } },
+    "modelModifiers": {}
+  },
+  emits: ["update:modelValue"],
+  setup(__props) {
+    const isTouched = ref(false);
+    const isSaved = useModel(__props, "modelValue");
+    watch(
+      isSaved,
+      () => {
+        if (!isTouched.value) isTouched.value = true;
+      },
+      { immediate: false }
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("button", {
+        class: normalizeClass(["tide-button-save", unref(CSS).PADDING.FULL.QUARTER, isSaved.value && "saved"]),
+        onClick: _cache[0] || (_cache[0] = ($event) => isSaved.value = !isSaved.value),
+        type: "button"
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(["heart-container", unref(CSS).DISPLAY.FLEX, isSaved.value && isTouched.value && "animate-heartbeat"])
+        }, [
+          (openBlock(), createElementBlock("svg", {
+            class: normalizeClass(["tide-button-save-icon", unref(CSS).FLEX.GROW.OFF, unref(CSS).FLEX.SHRINK.OFF]),
+            height: "32",
+            viewBox: "0 0 24 24",
+            width: "32",
+            xmlns: "http://www.w3.org/2000/svg"
+          }, [
+            createElementVNode("path", {
+              class: normalizeClass(["heart-filled", isSaved.value ? "" : "filled-transparent"]),
+              style: normalizeStyle({ color: isSaved.value ? "var(--tide-red-200)" : "" }),
+              d: "m12 21-1.45-1.3c-1.6833-1.5167-3.075-2.825-4.175-3.925-1.1-1.1-1.975-2.0875-2.625-2.9625-.65-.875-1.1042-1.6792-1.3625-2.4125C2.1292 9.6667 2 8.9167 2 8.15c0-1.5667.525-2.875 1.575-3.925C4.625 3.175 5.9333 2.65 7.5 2.65c.8667 0 1.6917.1833 2.475.55.7833.3667 1.4583.8833 2.025 1.55.5667-.6667 1.2417-1.1833 2.025-1.55.7833-.3667 1.6083-.55 2.475-.55 1.5667 0 2.875.525 3.925 1.575C21.475 5.275 22 6.5833 22 8.15c0 .7667-.1292 1.5167-.3875 2.25-.2583.7333-.7125 1.5375-1.3625 2.4125s-1.525 1.8625-2.625 2.9625c-1.1 1.1-2.4917 2.4083-4.175 3.925L12 21Z"
+            }, null, 6),
+            createElementVNode("path", {
+              class: normalizeClass(["heart-outline", unref(CSS).FONT.COLOR.SURFACE.INVERSE]),
+              d: "m12 21-1.45-1.3c-1.6833-1.5167-3.075-2.825-4.175-3.925-1.1-1.1-1.975-2.0875-2.625-2.9625-.65-.875-1.1042-1.6792-1.3625-2.4125C2.1292 9.6667 2 8.9167 2 8.15c0-1.5667.525-2.875 1.575-3.925C4.625 3.175 5.9333 2.65 7.5 2.65c.8667 0 1.6917.1833 2.475.55.7833.3667 1.4583.8833 2.025 1.55.5667-.6667 1.2417-1.1833 2.025-1.55.7833-.3667 1.6083-.55 2.475-.55 1.5667 0 2.875.525 3.925 1.575C21.475 5.275 22 6.5833 22 8.15c0 .7667-.1292 1.5167-.3875 2.25-.2583.7333-.7125 1.5375-1.3625 2.4125s-1.525 1.8625-2.625 2.9625c-1.1 1.1-2.4917 2.4083-4.175 3.925L12 21Zm0-2.7c1.6-1.4333 2.9167-2.6625 3.95-3.6875s1.85-1.9167 2.45-2.675c.6-.7583 1.0167-1.4333 1.25-2.025.2333-.5917.35-1.1792.35-1.7625 0-1-.3333-1.8333-1-2.5-.6667-.6667-1.5-1-2.5-1-.7833 0-1.5083.2208-2.175.6625C13.6583 5.7542 13.2 6.3167 12.95 7h-1.9c-.25-.6833-.7083-1.2458-1.375-1.6875S8.2833 4.65 7.5 4.65c-1 0-1.8333.3333-2.5 1-.6667.6667-1 1.5-1 2.5 0 .5833.1167 1.1708.35 1.7625.2333.5917.65 1.2667 1.25 2.025s1.4167 1.65 2.45 2.675S10.4 16.8667 12 18.3Z"
+            }, null, 2)
+          ], 2))
+        ], 2)
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TideButtonSave.vue2.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TideButtonSave.vue2.js","sources":["../../src/components/TideButtonSave.vue"],"sourcesContent":["<script lang=\"ts\">\n  /**\n   * Renders a button component for use to save items.\n   *\n   * @see the [Storybook interface](https://tide-design-system.netlify.app/?path=/docs/components-tidebuttonsave--docs) for TideButtonSave\n   */\n  export default {};\n</script>\n\n<script setup lang=\"ts\">\n  import { ref, watch } from 'vue';\n\n  import { CSS } from '@/types/Styles';\n\n  const isTouched = ref(false);\n  const isSaved = defineModel<boolean>({ required: true });\n\n  watch(\n    isSaved,\n    () => {\n      if (!isTouched.value) isTouched.value = true;\n    },\n    { immediate: false }\n  );\n</script>\n\n<template>\n  <button\n    :class=\"['tide-button-save', CSS.PADDING.FULL.QUARTER, isSaved && 'saved']\"\n    @click=\"isSaved = !isSaved\"\n    type=\"button\"\n  >\n    <div :class=\"['heart-container', CSS.DISPLAY.FLEX, isSaved && isTouched && 'animate-heartbeat']\">\n      <svg\n        :class=\"['tide-button-save-icon', CSS.FLEX.GROW.OFF, CSS.FLEX.SHRINK.OFF]\"\n        height=\"32\"\n        viewBox=\"0 0 24 24\"\n        width=\"32\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          :class=\"['heart-filled', isSaved ? '' : 'filled-transparent']\"\n          :style=\"{ color: isSaved ? 'var(--tide-red-200)' : '' }\"\n          d=\"m12 21-1.45-1.3c-1.6833-1.5167-3.075-2.825-4.175-3.925-1.1-1.1-1.975-2.0875-2.625-2.9625-.65-.875-1.1042-1.6792-1.3625-2.4125C2.1292 9.6667 2 8.9167 2 8.15c0-1.5667.525-2.875 1.575-3.925C4.625 3.175 5.9333 2.65 7.5 2.65c.8667 0 1.6917.1833 2.475.55.7833.3667 1.4583.8833 2.025 1.55.5667-.6667 1.2417-1.1833 2.025-1.55.7833-.3667 1.6083-.55 2.475-.55 1.5667 0 2.875.525 3.925 1.575C21.475 5.275 22 6.5833 22 8.15c0 .7667-.1292 1.5167-.3875 2.25-.2583.7333-.7125 1.5375-1.3625 2.4125s-1.525 1.8625-2.625 2.9625c-1.1 1.1-2.4917 2.4083-4.175 3.925L12 21Z\"\n        />\n\n        <path\n          :class=\"['heart-outline', CSS.FONT.COLOR.SURFACE.INVERSE]\"\n          d=\"m12 21-1.45-1.3c-1.6833-1.5167-3.075-2.825-4.175-3.925-1.1-1.1-1.975-2.0875-2.625-2.9625-.65-.875-1.1042-1.6792-1.3625-2.4125C2.1292 9.6667 2 8.9167 2 8.15c0-1.5667.525-2.875 1.575-3.925C4.625 3.175 5.9333 2.65 7.5 2.65c.8667 0 1.6917.1833 2.475.55.7833.3667 1.4583.8833 2.025 1.55.5667-.6667 1.2417-1.1833 2.025-1.55.7833-.3667 1.6083-.55 2.475-.55 1.5667 0 2.875.525 3.925 1.575C21.475 5.275 22 6.5833 22 8.15c0 .7667-.1292 1.5167-.3875 2.25-.2583.7333-.7125 1.5375-1.3625 2.4125s-1.525 1.8625-2.625 2.9625c-1.1 1.1-2.4917 2.4083-4.175 3.925L12 21Zm0-2.7c1.6-1.4333 2.9167-2.6625 3.95-3.6875s1.85-1.9167 2.45-2.675c.6-.7583 1.0167-1.4333 1.25-2.025.2333-.5917.35-1.1792.35-1.7625 0-1-.3333-1.8333-1-2.5-.6667-.6667-1.5-1-2.5-1-.7833 0-1.5083.2208-2.175.6625C13.6583 5.7542 13.2 6.3167 12.95 7h-1.9c-.25-.6833-.7083-1.2458-1.375-1.6875S8.2833 4.65 7.5 4.65c-1 0-1.8333.3333-2.5 1-.6667.6667-1 1.5-1 2.5 0 .5833.1167 1.1708.35 1.7625.2333.5917.65 1.2667 1.25 2.025s1.4167 1.65 2.45 2.675S10.4 16.8667 12 18.3Z\"\n        />\n      </svg>\n    </div>\n  </button>\n</template>\n\n<style scoped>\n  .heart-container {\n    --rotate-during-heart-beat: 9deg;\n    filter: drop-shadow(0px 2px 8px rgba(0, 0, 0, 0.3));\n    transition: var(--tide-duration-300) var(--tide-easing-ease-out);\n    transition-property: transform, scale;\n    rotate: 0deg;\n  }\n\n  .heart-container.animate-heartbeat {\n    animation: heartBeat var(--tide-duration-150);\n    animation-direction: alternate;\n    animation-iteration-count: 4;\n  }\n\n  .heart-container:active {\n    scale: 0.9;\n    transition-duration: var(--tide-duration-75);\n  }\n\n  .tide-button-save-icon {\n    fill: currentColor;\n  }\n\n  @media (hover: hover) {\n    .heart-container {\n      --rotate-during-heart-beat: 0deg;\n    }\n\n    .tide-button-save:where(:hover, :focus-visible) .heart-container {\n      transform: rotate(9deg);\n    }\n  }\n\n  .heart-filled {\n    scale: 0.985; /* avoid hairline border render issue */\n    transform-origin: center;\n    transition: color var(--tide-duration-75) var(--tide-easing-linear);\n  }\n\n  .filled-transparent {\n    color: var(--tide-transparent-400);\n  }\n\n  @keyframes heartBeat {\n    from {\n      scale: 1;\n      rotate: 0deg;\n    }\n    to {\n      scale: 1.25;\n      rotate: var(--rotate-during-heart-beat);\n    }\n  }\n</style>\n"],"names":["_useModel","_createElementBlock","_normalizeClass","_unref","_createElementVNode"],"mappings":";;AAME,MAAA,cAAe,CAAA;;;;;;;;;;AAQf,UAAM,YAAY,IAAI,KAAK;AAC3B,UAAM,UAAUA,SAAoB,SAAA,YAAmB;AAEvD;AAAA,MACE;AAAA,MACA,MAAM;AACJ,YAAI,CAAC,UAAU,MAAO,WAAU,QAAQ;AAAA,MAC1C;AAAA,MACA,EAAE,WAAW,MAAA;AAAA,IAAM;;0BAKrBC,mBAyBS,UAAA;AAAA,QAxBN,OAAKC,eAAA,CAAA,oBAAuBC,WAAI,QAAQ,KAAK,SAAS,QAAA,SAAO,OAAA,CAAA;AAAA,QAC7D,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAE,QAAA,QAAO,CAAI,QAAA;AAAA,QACnB,MAAK;AAAA,MAAA;QAELC,mBAmBM,OAAA;AAAA,UAnBA,OAAKF,eAAA,CAAA,mBAAsBC,WAAI,QAAQ,MAAM,QAAA,SAAW,UAAA,SAAS,mBAAA,CAAA;AAAA,QAAA;wBACrEF,mBAiBM,OAAA;AAAA,YAhBH,OAAKC,eAAA,CAAA,yBAA4BC,MAAA,GAAA,EAAI,KAAK,KAAK,KAAKA,WAAI,KAAK,OAAO,GAAG,CAAA;AAAA,YACxE,QAAO;AAAA,YACP,SAAQ;AAAA,YACR,OAAM;AAAA,YACN,OAAM;AAAA,UAAA;YAENC,mBAIE,QAAA;AAAA,cAHC,uCAAwB,QAAA,QAAO,KAAA,oBAAA,CAAA;AAAA,cAC/B,+BAAgB,QAAA,QAAO,wBAAA,IAAA;AAAA,cACxB,GAAE;AAAA,YAAA;YAGJA,mBAGE,QAAA;AAAA,cAFC,OAAKF,eAAA,CAAA,iBAAoBC,WAAI,KAAK,MAAM,QAAQ,OAAO,CAAA;AAAA,cACxD,GAAE;AAAA,YAAA;;;;;;;"}

package/dist/components/TideButtonSegmented.vue.js

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

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

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

package/dist/components/TideButtonSegmented.vue2.js

@@ -0,0 +1,82 @@
+import { defineComponent, useModel, useId, computed, openBlock, createElementBlock, normalizeClass, unref, Fragment, renderList, createElementVNode, toDisplayString, createCommentVNode, mergeModels } from "vue";
+import { CSS } from "../types/Styles.js";
+const _hoisted_1 = ["data-track"];
+const _hoisted_2 = ["checked", "form", "name", "value", "onChange"];
+const __default__ = {};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "TideButtonSegmented",
+  props: /* @__PURE__ */ mergeModels({
+    tabs: {},
+    name: {}
+  }, {
+    "modelValue": { required: true },
+    "modelModifiers": {}
+  }),
+  emits: ["update:modelValue"],
+  setup(__props) {
+    const props = __props;
+    const currentIndex = useModel(__props, "modelValue");
+    const uniqueId = useId();
+    const inputFormAttribute = computed(() => props.name ? void 0 : "none");
+    const inputNameAttribute = computed(() => props.name ?? uniqueId);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          "tide-button-segmented",
+          unref(CSS).BG.SURFACE.VARIANT,
+          unref(CSS).BORDER.RADIUS.FULL,
+          unref(CSS).DISPLAY.FLEX,
+          unref(CSS).FLEX.SHRINK.OFF,
+          unref(CSS).GAP.QUARTER,
+          unref(CSS).OVERFLOW.XY.AUTO,
+          unref(CSS).PADDING.FULL.QUARTER
+        ]),
+        role: "radiogroup"
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(__props.tabs, (tab, index) => {
+          return openBlock(), createElementBlock("label", {
+            class: normalizeClass([
+              "tide-button-segmented-tab",
+              index === currentIndex.value ? [unref(CSS).BG.SURFACE.DEFAULT, unref(CSS).FONT.COLOR.SURFACE.DEFAULT, unref(CSS).SHADOW.BOTTOM] : ["inactive", unref(CSS).FONT.COLOR.SURFACE.VARIANT],
+              unref(CSS).ALIGN.X.CENTER,
+              unref(CSS).BORDER.FULL.TWO,
+              unref(CSS).BORDER.RADIUS.FULL,
+              unref(CSS).CURSOR.POINTER,
+              unref(CSS).FLEX.GROW.ON,
+              unref(CSS).FLEX.SHRINK.OFF,
+              unref(CSS).FONT.ROLE.BUTTON_1,
+              unref(CSS).PADDING.X.HALF,
+              unref(CSS).PADDING.Y.QUARTER,
+              unref(CSS).WHITESPACE_WRAP.OFF,
+              unref(CSS).WIDTH.AUTO
+            ]),
+            "data-track": tab.dataTrack || void 0,
+            key: tab.label
+          }, [
+            createElementVNode("input", {
+              checked: index === currentIndex.value,
+              class: normalizeClass(["tide-screen-reader-only"]),
+              form: inputFormAttribute.value,
+              name: inputNameAttribute.value,
+              value: index,
+              onChange: ($event) => currentIndex.value = index,
+              type: "radio"
+            }, null, 40, _hoisted_2),
+            createElementVNode("span", {
+              class: normalizeClass([unref(CSS).FONT.ROLE.LABEL_2_SEMIBOLD])
+            }, toDisplayString(tab.label), 3),
+            tab.count && tab.count > 0 ? (openBlock(), createElementBlock("span", {
+              key: 0,
+              class: normalizeClass([unref(CSS).FONT.ROLE.LABEL_2_SEMIBOLD])
+            }, " (" + toDisplayString(tab.count) + ") ", 3)) : createCommentVNode("", true)
+          ], 10, _hoisted_1);
+        }), 128))
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TideButtonSegmented.vue2.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TideButtonSegmented.vue2.js","sources":["../../src/components/TideButtonSegmented.vue"],"sourcesContent":["<script lang=\"ts\">\n  /**\n   * Renders a segmented button component for navigation purposes.\n   *\n   * Powered by native input[type=\"radio\"] under the hood for enhanced accessibility.\n   *\n   * @see the [Storybook interface](https://tide-design-system.netlify.app/?path=/docs/components-tidebuttonsegmented--docs) for TideButtonSegmented\n   */\n  export default {};\n</script>\n\n<script lang=\"ts\" setup>\n  import { computed, useId } from 'vue';\n\n  import { CSS } from '@/types/Styles';\n\n  import type { Tab } from '@/types/Tab';\n\n  type Props = {\n    /** Sets label and callback for each tab */\n    tabs: Tab[] | readonly Tab[];\n\n    /** Opts in as a native HTML form field with this name. */\n    name?: string;\n  };\n\n  const props = defineProps<Props>();\n\n  const currentIndex = defineModel<number>({ required: true });\n\n  const uniqueId = useId();\n\n  const inputFormAttribute = computed(() => (props.name ? undefined : 'none'));\n  const inputNameAttribute = computed(() => props.name ?? uniqueId);\n</script>\n\n<template>\n  <div\n    :class=\"[\n      'tide-button-segmented',\n      CSS.BG.SURFACE.VARIANT,\n      CSS.BORDER.RADIUS.FULL,\n      CSS.DISPLAY.FLEX,\n      CSS.FLEX.SHRINK.OFF,\n      CSS.GAP.QUARTER,\n      CSS.OVERFLOW.XY.AUTO,\n      CSS.PADDING.FULL.QUARTER,\n    ]\"\n    role=\"radiogroup\"\n  >\n    <label\n      :class=\"[\n        'tide-button-segmented-tab',\n        index === currentIndex\n          ? [CSS.BG.SURFACE.DEFAULT, CSS.FONT.COLOR.SURFACE.DEFAULT, CSS.SHADOW.BOTTOM]\n          : ['inactive', CSS.FONT.COLOR.SURFACE.VARIANT],\n        CSS.ALIGN.X.CENTER,\n        CSS.BORDER.FULL.TWO,\n        CSS.BORDER.RADIUS.FULL,\n        CSS.CURSOR.POINTER,\n        CSS.FLEX.GROW.ON,\n        CSS.FLEX.SHRINK.OFF,\n        CSS.FONT.ROLE.BUTTON_1,\n        CSS.PADDING.X.HALF,\n        CSS.PADDING.Y.QUARTER,\n        CSS.WHITESPACE_WRAP.OFF,\n        CSS.WIDTH.AUTO,\n      ]\"\n      :data-track=\"tab.dataTrack || undefined\"\n      :key=\"tab.label\"\n      v-for=\"(tab, index) in tabs\"\n    >\n      <input\n        :checked=\"index === currentIndex\"\n        :class=\"['tide-screen-reader-only']\"\n        :form=\"inputFormAttribute\"\n        :name=\"inputNameAttribute\"\n        :value=\"index\"\n        @change=\"currentIndex = index\"\n        type=\"radio\"\n      />\n\n      <span :class=\"[CSS.FONT.ROLE.LABEL_2_SEMIBOLD]\">\n        {{ tab.label }}\n      </span>\n\n      <span\n        :class=\"[CSS.FONT.ROLE.LABEL_2_SEMIBOLD]\"\n        v-if=\"tab.count && tab.count > 0\"\n      >\n        ({{ tab.count }})\n      </span>\n    </label>\n  </div>\n</template>\n\n<style scoped>\n  .tide-button-segmented {\n    max-width: 23.3rem;\n    align-self: stretch;\n  }\n\n  .tide-button-segmented:has(:focus-visible) {\n    outline: auto;\n  }\n\n  .inactive {\n    border-color: var(--tide-surface-variant);\n  }\n\n  .inactive:hover {\n    border-color: var(--tide-border);\n    color: var(--tide-surface-default);\n  }\n</style>\n"],"names":["_useModel","_createElementBlock","_normalizeClass","_unref","_openBlock","_Fragment","_renderList","_createElementVNode","_toDisplayString"],"mappings":";;;;AAQE,MAAA,cAAe,CAAA;;;;;;;;;;;;;AAkBf,UAAM,QAAQ;AAEd,UAAM,eAAeA,8BAAsC;AAE3D,UAAM,WAAW,MAAA;AAEjB,UAAM,qBAAqB,SAAS,MAAO,MAAM,OAAO,SAAY,MAAO;AAC3E,UAAM,qBAAqB,SAAS,MAAM,MAAM,QAAQ,QAAQ;;0BAIhEC,mBAwDM,OAAA;AAAA,QAvDH,OAAKC,eAAA;AAAA;UAAyCC,MAAA,GAAA,EAAI,GAAG,QAAQ;AAAA,UAAeA,MAAA,GAAA,EAAI,OAAO,OAAO;AAAA,UAAYA,MAAA,GAAA,EAAI,QAAQ;AAAA,UAAYA,MAAA,GAAA,EAAI,KAAK,OAAO;AAAA,UAAWA,MAAA,GAAA,EAAI,IAAI;AAAA,UAAeA,MAAA,GAAA,EAAI,SAAS,GAAG;AAAA,UAAYA,MAAA,GAAA,EAAI,QAAQ,KAAK;AAAA,QAAA;QAUlO,MAAK;AAAA,MAAA;SAELC,UAAA,IAAA,GAAAH,mBA0CQI,UAAA,MAAAC,WAtBiB,QAAA,MAAI,CAAnB,KAAK,UAAK;8BApBpBL,mBA0CQ,SAAA;AAAA,YAzCL,OAAKC,eAAA;AAAA;cAAiD,UAAU,aAAA,SAA0BC,MAAA,GAAA,EAAI,GAAG,QAAQ,SAASA,WAAI,KAAK,MAAM,QAAQ,SAASA,MAAA,GAAA,EAAI,OAAO,MAAM,IAA2B,CAAA,YAAAA,MAAA,GAAA,EAAI,KAAK,MAAM,QAAQ,OAAO;AAAA,cAAWA,MAAA,GAAA,EAAI,MAAM,EAAE;AAAA,cAAgBA,MAAA,GAAA,EAAI,OAAO,KAAK;AAAA,cAAaA,MAAA,GAAA,EAAI,OAAO,OAAO;AAAA,cAAcA,MAAA,GAAA,EAAI,OAAO;AAAA,cAAiBA,MAAA,GAAA,EAAI,KAAK,KAAK;AAAA,cAAYA,MAAA,GAAA,EAAI,KAAK,OAAO;AAAA,cAAaA,MAAA,GAAA,EAAI,KAAK,KAAK;AAAA,cAAkBA,MAAA,GAAA,EAAI,QAAQ,EAAE;AAAA,cAAcA,MAAA,GAAA,EAAI,QAAQ,EAAE;AAAA,cAAiBA,MAAA,GAAA,EAAI,gBAAgB;AAAA,cAAaA,MAAA,GAAA,EAAI,MAAM;AAAA,YAAA;YAiBzhB,cAAY,IAAI,aAAa;AAAA,YAC7B,KAAK,IAAI;AAAA,UAAA;YAGVI,mBAQE,SAAA;AAAA,cAPC,SAAS,UAAU,aAAA;AAAA,cACnB,sBAAO,CAAA,yBAAA,CAA2B;AAAA,cAClC,MAAM,mBAAA;AAAA,cACN,MAAM,mBAAA;AAAA,cACN,OAAO;AAAA,cACP,UAAM,CAAA,WAAE,aAAA,QAAe;AAAA,cACxB,MAAK;AAAA,YAAA;YAGPA,mBAEO,QAAA;AAAA,cAFA,uBAAQJ,MAAA,GAAA,EAAI,KAAK,KAAK,gBAAgB,CAAA;AAAA,YAAA,GACxCK,gBAAA,IAAI,KAAK,GAAA,CAAA;AAAA,YAKN,IAAI,SAAS,IAAI,QAAK,kBAF9BP,mBAKO,QAAA;AAAA;cAJJ,uBAAQE,MAAA,GAAA,EAAI,KAAK,KAAK,gBAAgB,CAAA;AAAA,YAAA,GAExC,OACEK,gBAAG,IAAI,KAAK,IAAG,MAClB,CAAA;;;;;;;"}

package/dist/components/TideCard.vue.js

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

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

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

package/dist/components/TideCard.vue2.js

@@ -0,0 +1,72 @@
+import { defineComponent, computed, openBlock, createBlock, resolveDynamicComponent, unref, normalizeClass, withCtx, createCommentVNode, createElementVNode, toDisplayString, createElementBlock } from "vue";
+import _sfc_main$1 from "./InternalBaseLink.vue.js";
+import _sfc_main$2 from "./TideIcon.vue.js";
+/* empty css              */
+import { TYPE_CARD } from "../types/Card.js";
+import { ELEMENT_BROAD } from "../types/Element.js";
+import { SIZE } from "../types/Size.js";
+import { CSS } from "../types/Styles.js";
+const __default__ = {};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "TideCard",
+  props: {
+    description: { default: void 0 },
+    heading: {},
+    icon: { default: void 0 },
+    selected: { type: Boolean, default: void 0 },
+    type: { default: TYPE_CARD.INFORMATIONAL },
+    href: { default: void 0 }
+  },
+  setup(__props) {
+    const props = __props;
+    const rootElement = computed(
+      () => props.href ? _sfc_main$1 : props.type === TYPE_CARD.INFORMATIONAL ? ELEMENT_BROAD.DIV : ELEMENT_BROAD.BUTTON
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(rootElement.value), {
+        class: normalizeClass([
+          "tide-card",
+          unref(CSS).BORDER.COLOR.LOW,
+          unref(CSS).BORDER.FULL.ONE,
+          unref(CSS).BORDER.RADIUS.HALF,
+          unref(CSS).DISPLAY.FLEX,
+          unref(CSS).GAP.QUARTER,
+          unref(CSS).PADDING.FULL.ONE,
+          unref(CSS).WIDTH.FULL,
+          unref(CSS).ALIGN.X.LEFT,
+          unref(CSS).FLEX.DIRECTION.COLUMN,
+          __props.type !== unref(TYPE_CARD).INFORMATIONAL && "hoverable",
+          __props.type === unref(TYPE_CARD).SELECTABLE && __props.selected && "selected"
+        ]),
+        href: __props.href,
+        type: rootElement.value === unref(ELEMENT_BROAD).BUTTON ? unref(ELEMENT_BROAD).BUTTON : void 0
+      }, {
+        default: withCtx(() => [
+          __props.icon ? (openBlock(), createBlock(_sfc_main$2, {
+            key: 0,
+            class: normalizeClass([unref(CSS).FLEX.GROW.OFF, unref(CSS).FLEX.SHRINK.OFF]),
+            icon: __props.icon,
+            size: unref(SIZE).SMALL
+          }, null, 8, ["class", "icon", "size"])) : createCommentVNode("", true),
+          createElementVNode("div", {
+            class: normalizeClass([unref(CSS).AXIS2.START, unref(CSS).DISPLAY.FLEX, unref(CSS).FLEX.DIRECTION.COLUMN, unref(CSS).GAP.QUARTER])
+          }, [
+            createElementVNode("div", {
+              class: normalizeClass([unref(CSS).FONT.ROLE.LABEL_1_SEMIBOLD, unref(CSS).FONT.COLOR.SURFACE.DEFAULT])
+            }, toDisplayString(__props.heading), 3),
+            __props.description ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              class: normalizeClass([unref(CSS).FONT.ROLE.LABEL_2, unref(CSS).FONT.COLOR.SURFACE.VARIANT])
+            }, toDisplayString(__props.description), 3)) : createCommentVNode("", true)
+          ], 2)
+        ]),
+        _: 1
+      }, 8, ["class", "href", "type"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=TideCard.vue2.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TideCard.vue2.js","sources":["../../src/components/TideCard.vue"],"sourcesContent":["<script lang=\"ts\">\n  /**\n   * Renders a card component with a heading, description, and optional icon.\n   *\n   * @see the [Storybook interface](https://tide-design-system.netlify.app/?path=/docs/components-tidecard--docs) for TideCard\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 { TYPE_CARD } from '@/types/Card';\n  import { ELEMENT_BROAD } from '@/types/Element';\n  import { SIZE } from '@/types/Size';\n  import { CSS } from '@/types/Styles';\n\n  import type { CardType } from '@/types/Card';\n  import type { ElementBroad } from '@/types/Element';\n  import type { Icon } from '@/types/Icon';\n\n  type Props = {\n    /** Optional description text displayed below the heading */\n    description?: string;\n\n    /** The main heading of the card. */\n    heading: string;\n\n    /** Optional icon displayed on the card. */\n    icon?: Icon;\n\n    /** Determines whether the Card is selected (for selectable cards). */\n    selected?: boolean;\n\n    /** Type of the card */\n    type?: CardType;\n\n    /** URL to navigate to on click. */\n    href?: string;\n  };\n\n  const props = withDefaults(defineProps<Props>(), {\n    description: undefined,\n    href: undefined,\n    icon: undefined,\n    selected: undefined,\n    type: TYPE_CARD.INFORMATIONAL,\n  });\n\n  const rootElement = computed<ElementBroad | typeof InternalBaseLink>(() =>\n    props.href ? InternalBaseLink : props.type === TYPE_CARD.INFORMATIONAL ? ELEMENT_BROAD.DIV : ELEMENT_BROAD.BUTTON\n  );\n</script>\n\n<template>\n  <component\n    :class=\"[\n      'tide-card',\n      CSS.BORDER.COLOR.LOW,\n      CSS.BORDER.FULL.ONE,\n      CSS.BORDER.RADIUS.HALF,\n      CSS.DISPLAY.FLEX,\n      CSS.GAP.QUARTER,\n      CSS.PADDING.FULL.ONE,\n      CSS.WIDTH.FULL,\n      CSS.ALIGN.X.LEFT,\n      CSS.FLEX.DIRECTION.COLUMN,\n      type !== TYPE_CARD.INFORMATIONAL && 'hoverable',\n      type === TYPE_CARD.SELECTABLE && selected && 'selected',\n    ]\"\n    :href=\"href\"\n    :type=\"rootElement === ELEMENT_BROAD.BUTTON ? ELEMENT_BROAD.BUTTON : undefined\"\n    :is=\"rootElement\"\n  >\n    <TideIcon\n      :class=\"[CSS.FLEX.GROW.OFF, CSS.FLEX.SHRINK.OFF]\"\n      :icon=\"icon\"\n      :size=\"SIZE.SMALL\"\n      v-if=\"icon\"\n    />\n\n    <div :class=\"[CSS.AXIS2.START, CSS.DISPLAY.FLEX, CSS.FLEX.DIRECTION.COLUMN, CSS.GAP.QUARTER]\">\n      <div :class=\"[CSS.FONT.ROLE.LABEL_1_SEMIBOLD, CSS.FONT.COLOR.SURFACE.DEFAULT]\">\n        {{ heading }}\n      </div>\n\n      <div\n        :class=\"[CSS.FONT.ROLE.LABEL_2, CSS.FONT.COLOR.SURFACE.VARIANT]\"\n        v-if=\"description\"\n      >\n        {{ description }}\n      </div>\n    </div>\n  </component>\n</template>\n\n<style scoped>\n  .tide-card.hoverable:not(.selected):hover {\n    border-color: var(--tide-border-rest);\n  }\n  .tide-card.selected {\n    outline: 2px solid var(--tide-border-high);\n    outline-offset: -2px;\n  }\n</style>\n"],"names":["InternalBaseLink","_openBlock","_createBlock","_resolveDynamicComponent","_normalizeClass","_unref","TideIcon","_createElementVNode","_createElementBlock"],"mappings":";;;;;;;;AAME,MAAA,cAAe,CAAA;;;;;;;;;;;;;AAqCf,UAAM,QAAQ;AAQd,UAAM,cAAc;AAAA,MAAiD,MACnE,MAAM,OAAOA,cAAmB,MAAM,SAAS,UAAU,gBAAgB,cAAc,MAAM,cAAc;AAAA,IAAA;;AAK7G,aAAAC,aAAAC,YAsCYC,wBArBL,YAAA,KAAW,GAAA;AAAA,QAhBf,OAAKC,eAAA;AAAA;UAA6BC,MAAA,GAAA,EAAI,OAAO,MAAM;AAAA,UAAWA,MAAA,GAAA,EAAI,OAAO,KAAK;AAAA,UAAWA,MAAA,GAAA,EAAI,OAAO,OAAO;AAAA,UAAYA,MAAA,GAAA,EAAI,QAAQ;AAAA,UAAYA,MAAA,GAAA,EAAI,IAAI;AAAA,UAAeA,MAAA,GAAA,EAAI,QAAQ,KAAK;AAAA,UAAWA,MAAA,GAAA,EAAI,MAAM;AAAA,UAAYA,MAAA,GAAA,EAAI,MAAM,EAAE;AAAA,UAAYA,MAAA,GAAA,EAAI,KAAK,UAAU;AAAA,UAAc,QAAA,SAASA,MAAA,SAAA,EAAU,iBAAa;AAAA,UAAuB,QAAA,SAASA,MAAA,SAAA,EAAU,cAAc,QAAA,YAAQ;AAAA,QAAA;QAcjX,MAAM,QAAA;AAAA,QACN,MAAM,YAAA,UAAgBA,MAAA,aAAA,EAAc,SAASA,MAAA,aAAA,EAAc,SAAS;AAAA,MAAA;yBAGrE,MAKE;AAAA,UADM,QAAA,qBAJRH,YAKEI,aAAA;AAAA;YAJC,OAAKF,eAAA,CAAGC,MAAA,GAAA,EAAI,KAAK,KAAK,KAAKA,WAAI,KAAK,OAAO,GAAG,CAAA;AAAA,YAC9C,MAAM,QAAA;AAAA,YACN,MAAMA,MAAA,IAAA,EAAK;AAAA,UAAA;UAIdE,mBAWM,OAAA;AAAA,YAXA,OAAKH,eAAA,CAAGC,MAAA,GAAA,EAAI,MAAM,OAAOA,MAAA,GAAA,EAAI,QAAQ,MAAMA,MAAA,GAAA,EAAI,KAAK,UAAU,QAAQA,MAAA,GAAA,EAAI,IAAI,OAAO,CAAA;AAAA,UAAA;YACzFE,mBAEM,OAAA;AAAA,cAFA,uBAAQF,MAAA,GAAA,EAAI,KAAK,KAAK,kBAAkBA,MAAA,GAAA,EAAI,KAAK,MAAM,QAAQ,OAAO,CAAA;AAAA,YAAA,mBACvE,QAAA,OAAO,GAAA,CAAA;AAAA,YAKJ,QAAA,4BAFRG,mBAKM,OAAA;AAAA;cAJH,uBAAQH,MAAA,GAAA,EAAI,KAAK,KAAK,SAASA,MAAA,GAAA,EAAI,KAAK,MAAM,QAAQ,OAAO,CAAA;AAAA,YAAA,mBAG3D,QAAA,WAAW,GAAA,CAAA;;;;;;;;"}

package/dist/components/TideCarousel.vue.js

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

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

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