@evance/evance-ui 1.0.29 → 1.0.30

package/dist/cjs/defaults-Depv25SK.cjs

@@ -0,0 +1,134 @@
+"use strict";
+/*! Evance UI v1.0.30 | MIT License */
+const vue = require("vue");
+const components = require("./components-DxdySsf6.cjs");
+const helpers = require("./helpers-WIsEVU3s.cjs");
+const strings = require("./strings-yO4PXNfu.cjs");
+function injectSelf(key, component = components.getCurrentComponent("injectSelf")) {
+  const { provides } = component;
+  if (provides && key in provides) {
+    return provides[key];
+  }
+  return void 0;
+}
+const DefaultsSymbol = Symbol.for("ev:defaults");
+function createDefaults(options) {
+  return vue.ref(options);
+}
+function injectDefaults() {
+  const defaults = vue.inject(DefaultsSymbol);
+  if (!defaults) {
+    throw new Error("Evance UI: Could not find defaults instance");
+  }
+  return defaults;
+}
+function provideDefaults(defaults, options) {
+  const injectedDefaults = injectDefaults();
+  const providedDefaults = vue.ref(defaults);
+  const newDefaults = vue.computed(() => {
+    const disabled = vue.unref(options == null ? void 0 : options.disabled);
+    if (disabled) {
+      return injectedDefaults.value;
+    }
+    const scoped = vue.unref(options == null ? void 0 : options.scoped);
+    const reset = vue.unref(options == null ? void 0 : options.reset);
+    const root = vue.unref(options == null ? void 0 : options.root);
+    if (providedDefaults.value == null && !(scoped || reset || root)) {
+      return injectedDefaults.value;
+    }
+    let properties = helpers.mergeDeep(providedDefaults.value, {
+      previous: injectedDefaults.value
+    });
+    if (scoped) {
+      return properties;
+    }
+    if (reset || root) {
+      const len = Number(reset || Infinity);
+      for (let i = 0; i <= len; i++) {
+        if (!properties || !("previous" in properties)) {
+          break;
+        }
+        properties = properties.previous;
+      }
+      if (properties && typeof root === "string" && root in properties) {
+        properties = helpers.mergeDeep(
+          helpers.mergeDeep(properties, { previous: properties }),
+          properties[root]
+        );
+      }
+      return properties;
+    }
+    return properties.previous ? helpers.mergeDeep(properties.previous, properties) : properties;
+  });
+  vue.provide(DefaultsSymbol, newDefaults);
+  return newDefaults;
+}
+function propIsDefined(vnode, prop) {
+  var _a, _b;
+  return typeof ((_a = vnode.props) == null ? void 0 : _a[prop]) !== "undefined" || typeof ((_b = vnode.props) == null ? void 0 : _b[strings.toKebabCase(prop)]) !== "undefined";
+}
+function internalUseDefaults(props = {}, name, defaults = injectDefaults()) {
+  const component = components.getCurrentComponent("useDefaults");
+  name = name ?? component.type.name ?? component.type.__name;
+  if (!name) {
+    throw new Error("Evance UI: Could not determine component name");
+  }
+  const componentDefaults = vue.computed(
+    () => {
+      var _a;
+      return (_a = defaults.value) == null ? void 0 : _a[props._as ?? name];
+    }
+  );
+  const internalProps = new Proxy(props, {
+    get(target, prop) {
+      var _a, _b, _c, _d;
+      const propValue = Reflect.get(target, prop);
+      if (prop === "class" || prop === "style") {
+        return [(_a = componentDefaults.value) == null ? void 0 : _a[prop], propValue].filter(
+          (v) => v != null
+        );
+      } else if (typeof prop === "string" && !propIsDefined(component.vnode, prop)) {
+        return ((_b = componentDefaults.value) == null ? void 0 : _b[prop]) ?? ((_d = (_c = defaults.value) == null ? void 0 : _c.global) == null ? void 0 : _d[prop]) ?? propValue;
+      }
+      return propValue;
+    }
+  });
+  const subcomponentDefaults = vue.shallowRef();
+  vue.watchEffect(() => {
+    if (componentDefaults.value) {
+      const subComponents = Object.entries(
+        componentDefaults.value
+      ).filter(([key]) => key.startsWith(key[0].toUpperCase()));
+      subcomponentDefaults.value = subComponents.length ? Object.fromEntries(subComponents) : void 0;
+    } else {
+      subcomponentDefaults.value = void 0;
+    }
+  });
+  function provideSubDefaults() {
+    const injected = injectSelf(DefaultsSymbol, component);
+    vue.provide(
+      DefaultsSymbol,
+      vue.computed(() => {
+        return subcomponentDefaults.value ? helpers.mergeDeep(
+          (injected == null ? void 0 : injected.value) ?? {},
+          subcomponentDefaults.value
+        ) : injected == null ? void 0 : injected.value;
+      })
+    );
+  }
+  return { props: internalProps, provideSubDefaults };
+}
+function useDefaults(props = {}, name) {
+  const { props: _props, provideSubDefaults } = internalUseDefaults(
+    props,
+    name
+  );
+  provideSubDefaults();
+  return _props;
+}
+exports.DefaultsSymbol = DefaultsSymbol;
+exports.createDefaults = createDefaults;
+exports.injectSelf = injectSelf;
+exports.provideDefaults = provideDefaults;
+exports.useDefaults = useDefaults;
+//# sourceMappingURL=defaults-Depv25SK.cjs.map

package/dist/cjs/defaults-Depv25SK.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaults-Depv25SK.cjs","sources":["../../src/util/injectSelf.ts","../../src/composables/defaults.ts"],"sourcesContent":["// Utilities\n\n// Types\nimport type { ComponentInternalInstance, InjectionKey } from \"vue\";\nimport { getCurrentComponent } from \"@/util/components\";\n\nexport function injectSelf<T>(\n    key: InjectionKey<T> | string,\n    vm?: ComponentInternalInstance,\n): T | undefined;\nexport function injectSelf(\n    key: InjectionKey<any> | string,\n    component = getCurrentComponent(\"injectSelf\"),\n) {\n    const { provides } = component as { provides?: any };\n\n    if (provides && (key as string | symbol) in provides) {\n        // TS doesn't allow symbol as index type\n        return provides[key as string];\n    }\n    return undefined;\n}\n","import {\n    computed,\n    ComputedRef,\n    inject,\n    InjectionKey,\n    MaybeRef,\n    provide,\n    ref,\n    Ref,\n    shallowRef,\n    unref,\n    VNode,\n    watchEffect,\n} from \"vue\";\nimport {\n    getCurrentComponent,\n    injectSelf,\n    mergeDeep,\n    toKebabCase,\n} from \"@/util\";\n\nexport type DefaultsInstance =\n    | undefined\n    | {\n          [key: string]: undefined | Record<string, unknown>;\n          global?: Record<string, unknown>;\n      };\n\nexport type DefaultsOptions = Partial<DefaultsInstance>;\n\nexport const DefaultsSymbol: InjectionKey<Ref<DefaultsInstance>> =\n    Symbol.for(\"ev:defaults\");\n\n/**\n * # createDefaults\n * @param options\n */\nexport function createDefaults(\n    options?: DefaultsInstance,\n): Ref<DefaultsInstance> {\n    return ref(options);\n}\n\n/**\n * # injectDefaults\n */\nexport function injectDefaults() {\n    const defaults = inject(DefaultsSymbol);\n    if (!defaults) {\n        throw new Error(\"Evance UI: Could not find defaults instance\");\n    }\n    return defaults;\n}\n\n/**\n * # provideDefaults\n * @param defaults\n * @param options\n */\nexport function provideDefaults(\n    defaults?: MaybeRef<DefaultsInstance | undefined>,\n    options?: {\n        disabled?: MaybeRef<boolean | undefined>;\n        reset?: MaybeRef<number | string | undefined>;\n        root?: MaybeRef<boolean | string | undefined>;\n        scoped?: MaybeRef<boolean | undefined>;\n    },\n) {\n    const injectedDefaults = injectDefaults();\n    const providedDefaults = ref(defaults);\n\n    const newDefaults = computed(() => {\n        const disabled = unref(options?.disabled);\n        if (disabled) {\n            return injectedDefaults.value;\n        }\n\n        const scoped = unref(options?.scoped);\n        const reset = unref(options?.reset);\n        const root = unref(options?.root);\n\n        if (providedDefaults.value == null && !(scoped || reset || root)) {\n            return injectedDefaults.value;\n        }\n\n        let properties = mergeDeep(providedDefaults.value, {\n            previous: injectedDefaults.value,\n        });\n\n        if (scoped) {\n            return properties;\n        }\n\n        if (reset || root) {\n            const len = Number(reset || Infinity);\n\n            for (let i = 0; i <= len; i++) {\n                if (!properties || !(\"previous\" in properties)) {\n                    break;\n                }\n                properties = properties.previous;\n            }\n\n            if (properties && typeof root === \"string\" && root in properties) {\n                properties = mergeDeep(\n                    mergeDeep(properties, { previous: properties }),\n                    properties[root],\n                );\n            }\n\n            return properties;\n        }\n\n        return properties.previous\n            ? mergeDeep(properties.previous, properties)\n            : properties;\n    }) as ComputedRef<DefaultsInstance>;\n\n    provide(DefaultsSymbol, newDefaults);\n    return newDefaults;\n}\n\n/**\n * # propIsDefined\n * @param vnode\n * @param prop\n */\nfunction propIsDefined(vnode: VNode, prop: string) {\n    return (\n        typeof vnode.props?.[prop] !== \"undefined\" ||\n        typeof vnode.props?.[toKebabCase(prop)] !== \"undefined\"\n    );\n}\n\n/**\n * # internalUseDefaults\n * @param props\n * @param name\n * @param defaults\n */\nexport function internalUseDefaults(\n    props: Record<string, any> = {},\n    name?: string,\n    defaults = injectDefaults(),\n) {\n    const component = getCurrentComponent(\"useDefaults\");\n\n    name = name ?? component.type.name ?? component.type.__name;\n    if (!name) {\n        throw new Error(\"Evance UI: Could not determine component name\");\n    }\n\n    const componentDefaults = computed(\n        () => defaults.value?.[props._as ?? name],\n    );\n    const internalProps = new Proxy(props, {\n        get(target, prop) {\n            const propValue = Reflect.get(target, prop);\n            if (prop === \"class\" || prop === \"style\") {\n                return [componentDefaults.value?.[prop], propValue].filter(\n                    (v) => v != null,\n                );\n            } else if (\n                typeof prop === \"string\" &&\n                !propIsDefined(component.vnode, prop)\n            ) {\n                return (\n                    componentDefaults.value?.[prop] ??\n                    defaults.value?.global?.[prop] ??\n                    propValue\n                );\n            }\n            return propValue;\n        },\n    });\n\n    const subcomponentDefaults = shallowRef();\n    watchEffect(() => {\n        if (componentDefaults.value) {\n            const subComponents = Object.entries(\n                componentDefaults.value,\n            ).filter(([key]) => key.startsWith(key[0].toUpperCase()));\n            subcomponentDefaults.value = subComponents.length\n                ? Object.fromEntries(subComponents)\n                : undefined;\n        } else {\n            subcomponentDefaults.value = undefined;\n        }\n    });\n\n    function provideSubDefaults() {\n        const injected = injectSelf(DefaultsSymbol, component);\n        provide(\n            DefaultsSymbol,\n            computed(() => {\n                return subcomponentDefaults.value\n                    ? mergeDeep(\n                          injected?.value ?? {},\n                          subcomponentDefaults.value,\n                      )\n                    : injected?.value;\n            }),\n        );\n    }\n\n    return { props: internalProps, provideSubDefaults };\n}\n\n/**\n * # useDefaults\n *\n * @param props\n * @param name\n */\nexport function useDefaults<T extends Record<string, any>>(\n    props: T,\n    name?: string,\n): T;\nexport function useDefaults(\n    props?: undefined,\n    name?: string,\n): Record<string, any>;\nexport function useDefaults(props: Record<string, any> = {}, name?: string) {\n    const { props: _props, provideSubDefaults } = internalUseDefaults(\n        props,\n        name,\n    );\n    provideSubDefaults();\n    return _props;\n}\n"],"names":["getCurrentComponent","ref","inject","computed","unref","mergeDeep","provide","toKebabCase","shallowRef","watchEffect"],"mappings":"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"}

package/dist/cjs/dimensions-DPfEc_qz.cjs

@@ -0,0 +1,29 @@
+"use strict";
+/*! Evance UI v1.0.30 | MIT License */
+const vue = require("vue");
+const props = require("./props-DfUVzIEU.cjs");
+const units = require("./units-Cwhf_jKp.cjs");
+const makeDimensionsProps = props.propsFactory(
+  {
+    height: [Number, String],
+    maxHeight: [Number, String],
+    maxWidth: [Number, String],
+    minHeight: [Number, String],
+    minWidth: [Number, String],
+    width: [Number, String]
+  },
+  "dimensions"
+);
+function useDimensions(props2) {
+  return vue.computed(() => ({
+    height: units.toWebUnit(props2.height),
+    maxHeight: units.toWebUnit(props2.maxHeight),
+    maxWidth: units.toWebUnit(props2.maxWidth),
+    minHeight: units.toWebUnit(props2.minHeight),
+    minWidth: units.toWebUnit(props2.minWidth),
+    width: units.toWebUnit(props2.width)
+  }));
+}
+exports.makeDimensionsProps = makeDimensionsProps;
+exports.useDimensions = useDimensions;
+//# sourceMappingURL=dimensions-DPfEc_qz.cjs.map

package/dist/cjs/dimensions-DPfEc_qz.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dimensions-DPfEc_qz.cjs","sources":["../../src/composables/dimensions.ts"],"sourcesContent":["import { propsFactory, toWebUnit } from \"../util\";\nimport { computed } from \"vue\";\n\n/**\n * # Dimensions Props\n */\nexport interface DimensionsProps {\n    height?: number | string;\n    maxHeight?: number | string;\n    maxWidth?: number | string;\n    minHeight?: number | string;\n    minWidth?: number | string;\n    width?: number | string;\n}\n\n/**\n * # Make Dimensions Props\n */\nexport const makeDimensionsProps = propsFactory(\n    {\n        height: [Number, String],\n        maxHeight: [Number, String],\n        maxWidth: [Number, String],\n        minHeight: [Number, String],\n        minWidth: [Number, String],\n        width: [Number, String],\n    },\n    \"dimensions\",\n);\n\n/**\n * # Use Dimensions\n * @param props\n */\nexport function useDimensions(props: DimensionsProps) {\n    return computed(() => ({\n        height: toWebUnit(props.height),\n        maxHeight: toWebUnit(props.maxHeight),\n        maxWidth: toWebUnit(props.maxWidth),\n        minHeight: toWebUnit(props.minHeight),\n        minWidth: toWebUnit(props.minWidth),\n        width: toWebUnit(props.width),\n    }));\n}\n"],"names":["propsFactory","props","computed","toWebUnit"],"mappings":";;;;;AAkBO,MAAM,sBAAsBA,MAAA;AAAA,EAC/B;AAAA,IACI,QAAQ,CAAC,QAAQ,MAAM;AAAA,IACvB,WAAW,CAAC,QAAQ,MAAM;AAAA,IAC1B,UAAU,CAAC,QAAQ,MAAM;AAAA,IACzB,WAAW,CAAC,QAAQ,MAAM;AAAA,IAC1B,UAAU,CAAC,QAAQ,MAAM;AAAA,IACzB,OAAO,CAAC,QAAQ,MAAM;AAAA,EAC1B;AAAA,EACA;AACJ;AAMO,SAAS,cAAcC,QAAwB;AAClD,SAAOC,aAAS,OAAO;AAAA,IACnB,QAAQC,MAAAA,UAAUF,OAAM,MAAM;AAAA,IAC9B,WAAWE,MAAAA,UAAUF,OAAM,SAAS;AAAA,IACpC,UAAUE,MAAAA,UAAUF,OAAM,QAAQ;AAAA,IAClC,WAAWE,MAAAA,UAAUF,OAAM,SAAS;AAAA,IACpC,UAAUE,MAAAA,UAAUF,OAAM,QAAQ;AAAA,IAClC,OAAOE,MAAAA,UAAUF,OAAM,KAAK;AAAA,EAAA,EAC9B;AACN;;;"}

package/dist/cjs/display-DhpuAKXx.cjs

@@ -0,0 +1,291 @@
+"use strict";
+/*! Evance UI v1.0.30 | MIT License */
+const vue = require("vue");
+const console = require("./console-CWUokMWq.cjs");
+const isFunctions = require("./is-functions-B0IUIiUP.cjs");
+const units = require("./units-Cwhf_jKp.cjs");
+const strings = require("./strings-yO4PXNfu.cjs");
+const helpers = require("./helpers-WIsEVU3s.cjs");
+const breakpoints = ["sm", "md", "lg", "xl", "xxl"];
+const parseDisplayOptions = (options = defaultDisplayOptions) => {
+  return helpers.mergeDeep(defaultDisplayOptions, options);
+};
+function getClientWidth(ssr) {
+  return helpers.Browser.hasWindow && !ssr ? window.innerWidth : isFunctions.isObject(ssr) && ssr.clientWidth || 0;
+}
+function getClientHeight(ssr) {
+  return helpers.Browser.hasWindow && !ssr ? window.innerHeight : isFunctions.isObject(ssr) && ssr.clientHeight || 0;
+}
+function getPlatform(ssr) {
+  const userAgent = helpers.Browser.hasWindow && !ssr ? window.navigator.userAgent : "ssr";
+  function isUserAgent(regexp) {
+    return Boolean(userAgent.match(regexp));
+  }
+  return {
+    android: isUserAgent(/android/i),
+    ios: isUserAgent(/iphone|ipad|ipod/i),
+    cordova: isUserAgent(/cordova/i),
+    electron: isUserAgent(/electron/i),
+    chrome: isUserAgent(/chrome/i),
+    edge: isUserAgent(/edge/i),
+    firefox: isUserAgent(/firefox/i),
+    opera: isUserAgent(/opera/i),
+    win: isUserAgent(/win/i),
+    mac: isUserAgent(/mac/i),
+    linux: isUserAgent(/linux/i),
+    touch: helpers.Browser.supportsTouch,
+    ssr: userAgent === "ssr"
+  };
+}
+const DisplaySymbol = Symbol.for("ev:display");
+const defaultDisplayOptions = {
+  mobileBreakpoint: "lg",
+  thresholds: {
+    xs: 0,
+    sm: 600,
+    md: 960,
+    lg: 1200,
+    xl: 1600,
+    xxl: 2400
+  }
+};
+function createDisplay(options, ssr) {
+  const { thresholds, mobileBreakpoint } = parseDisplayOptions(options);
+  const height = vue.shallowRef(getClientHeight(ssr));
+  const platform = vue.shallowRef(getPlatform(ssr));
+  const state = vue.reactive({});
+  const width = vue.shallowRef(getClientWidth(ssr));
+  function updateSize() {
+    height.value = getClientHeight();
+    width.value = getClientWidth();
+  }
+  function update() {
+    updateSize();
+    platform.value = getPlatform();
+  }
+  function hasActiveRule(rules) {
+    const rulesInternal = toDisplayRuleArray(rules);
+    for (const rule of rulesInternal) {
+      if (!isFunctions.isString(rule)) {
+        continue;
+      }
+      if (!isDisplayRule(rule)) {
+        console.consoleWarn(
+          `The display rule '${rule}' is not valid and will be ignored.`
+        );
+        continue;
+      }
+      const displayKey = toDisplayStateKey(rule);
+      const displayState = state[displayKey];
+      if (displayState) {
+        return true;
+      }
+    }
+    return false;
+  }
+  vue.watchEffect(() => {
+    const xs = width.value < thresholds.sm;
+    const sm = width.value < thresholds.md && !xs;
+    const md = width.value < thresholds.lg && !(sm || xs);
+    const lg = width.value < thresholds.xl && !(md || sm || xs);
+    const xl = width.value < thresholds.xxl && !(lg || md || sm || xs);
+    const xxl = width.value >= thresholds.xxl;
+    const name = xs ? "xs" : sm ? "sm" : md ? "md" : lg ? "lg" : xl ? "xl" : "xxl";
+    const breakpointValue = typeof mobileBreakpoint === "number" ? mobileBreakpoint : thresholds[mobileBreakpoint];
+    const mobile = width.value < breakpointValue;
+    state.xs = xs;
+    state.sm = sm;
+    state.md = md;
+    state.lg = lg;
+    state.xl = xl;
+    state.xxl = xxl;
+    state.xsUp = true;
+    state.smUp = !xs;
+    state.mdUp = !(xs || sm);
+    state.lgUp = !(xs || sm || md);
+    state.xlUp = !(xs || sm || md || lg);
+    state.xxlUp = !(xs || sm || md || lg || xl);
+    state.smDown = !(md || lg || xl || xxl);
+    state.mdDown = !(lg || xl || xxl);
+    state.lgDown = !(xl || xxl);
+    state.xlDown = !xxl;
+    state.name = name;
+    state.height = height.value;
+    state.width = width.value;
+    state.mobile = mobile;
+    state.mobileBreakpoint = mobileBreakpoint;
+    state.platform = platform.value;
+    state.thresholds = thresholds;
+  });
+  if (helpers.Browser.hasWindow) {
+    window.addEventListener("resize", updateSize, { passive: true });
+  }
+  return {
+    ...vue.toRefs(state),
+    update,
+    hasActiveRule,
+    ssr: !!ssr
+  };
+}
+function useDisplay() {
+  const display = vue.inject(DisplaySymbol);
+  if (!display) {
+    throw new Error(
+      "Evance UI: Could not find `ev:display` injection symbol"
+    );
+  }
+  return display;
+}
+const displayRules = [
+  "xxl",
+  "xl",
+  "lg",
+  "md",
+  "sm",
+  "xs",
+  "xxlOnly",
+  "xlOnly",
+  "lgOnly",
+  "mdOnly",
+  "smOnly",
+  "xsOnly",
+  "xxlUp",
+  "xlUp",
+  "lgUp",
+  "mdUp",
+  "smUp",
+  "xsUp",
+  "smDown",
+  "mdDown",
+  "lgDown",
+  "xlDown"
+];
+const displayRulesKebab = [
+  "xxl-only",
+  "xl-only",
+  "lg-only",
+  "md-only",
+  "sm-only",
+  "xs-only",
+  "xxl-up",
+  "xl-up",
+  "lg-up",
+  "md-up",
+  "sm-up",
+  "xs-up",
+  "sm-down",
+  "md-down",
+  "lg-down",
+  "xl-down"
+];
+function calculateDisplayRuleValue(rules) {
+  const display = useDisplay();
+  if (!isFunctions.isObject(rules)) {
+    return units.toWebUnit(rules);
+  }
+  for (const ruleKey of displayRules) {
+    const displayKey = toDisplayStateKey(ruleKey);
+    const displayState = display[displayKey];
+    if (vue.isRef(displayState) && displayState.value && !!rules[ruleKey]) {
+      return units.toWebUnit(rules[ruleKey]);
+    }
+  }
+  return void 0;
+}
+function toDisplayStateKey(displayRule) {
+  if (toDisplayStateKey.cache.has(displayRule)) {
+    return toDisplayStateKey.cache.get(displayRule);
+  }
+  let value = strings.toCamelCase(displayRule);
+  if (isDisplayBreakpoint(value)) {
+    value = `${value}Up`;
+  }
+  value = strings.trimEnd(value, "Only");
+  strings.toKebabCase.cache.set(displayRule, value);
+  return value;
+}
+toDisplayStateKey.cache = /* @__PURE__ */ new Map();
+function toDisplayRuleKebab(displayRule) {
+  if (toDisplayRuleKebab.cache.has(displayRule)) {
+    return toDisplayRuleKebab.cache.get(displayRule);
+  }
+  let value = strings.toKebabCase(displayRule);
+  if (isDisplayBreakpoint(value)) {
+    value = `${value}-up`;
+  }
+  toDisplayRuleKebab.cache.set(displayRule, value);
+  return value;
+}
+toDisplayRuleKebab.cache = /* @__PURE__ */ new Map();
+function isDisplayRule(value, acceptKebabs = true) {
+  return displayRules.includes(value) || acceptKebabs && displayRulesKebab.includes(value);
+}
+function isDisplayBreakpoint(value) {
+  return ["xs", ...breakpoints].includes(value);
+}
+function useBreakpointClasses(props, propName, prefix = void 0, useXs = false) {
+  return vue.computed(() => {
+    const prop = props[propName];
+    if (!prop) {
+      return [];
+    }
+    const classes = [];
+    const values = typeof prop !== "object" ? { xs: prop } : prop;
+    for (const [breakpoint, value] of Object.entries(values)) {
+      const className = [];
+      if (prefix) {
+        className.push(prefix);
+      }
+      if (useXs || breakpoint !== "xs") {
+        className.push(breakpoint);
+      }
+      className.push(value);
+      classes.push(className.join("-"));
+    }
+    return classes;
+  });
+}
+function useDisplayRuleClasses(props, propName, prefix = void 0) {
+  return vue.computed(() => {
+    const classes = [];
+    const rules = toDisplayRuleArray(props[propName]);
+    for (const rule of rules) {
+      if (!isFunctions.isString(rule)) {
+        continue;
+      }
+      if (!isDisplayRule(rule)) {
+        console.consoleWarn(
+          `The display rule '${rule}' is not valid and will be ignored.`
+        );
+        continue;
+      }
+      const suffix = toDisplayRuleKebab(rule);
+      classes.push(`${prefix}-${suffix}`);
+    }
+    return classes;
+  });
+}
+function toDisplayRuleArray(prop) {
+  if (Array.isArray(prop)) {
+    return prop;
+  }
+  if (isFunctions.isString(prop)) {
+    return strings.spaceSeparatedValues(prop);
+  }
+  if (isFunctions.isObject(prop)) {
+    return Object.entries(prop).map(([key, value]) => {
+      if (isFunctions.isBoolean(value)) {
+        return value ? key : void 0;
+      }
+      return isFunctions.isString(value) ? `${key}-${value.toLowerCase()}` : void 0;
+    }).filter((value) => value !== void 0);
+  }
+  return [];
+}
+exports.DisplaySymbol = DisplaySymbol;
+exports.calculateDisplayRuleValue = calculateDisplayRuleValue;
+exports.createDisplay = createDisplay;
+exports.useBreakpointClasses = useBreakpointClasses;
+exports.useDisplay = useDisplay;
+exports.useDisplayRuleClasses = useDisplayRuleClasses;
+//# sourceMappingURL=display-DhpuAKXx.cjs.map

package/dist/cjs/display-DhpuAKXx.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"display-DhpuAKXx.cjs","sources":["../../src/composables/display.ts"],"sourcesContent":["import {\n    computed,\n    inject,\n    InjectionKey,\n    isRef,\n    reactive,\n    Ref,\n    shallowRef,\n    toRefs,\n    watchEffect,\n} from \"vue\";\nimport {\n    Browser,\n    consoleWarn,\n    isBoolean,\n    isObject,\n    isString,\n    mergeDeep,\n    spaceSeparatedValues,\n    toCamelCase,\n    toKebabCase,\n    toWebUnit,\n    trimEnd,\n} from \"@/util\";\nimport { ResponsiveProp, ResponsivePropObject } from \"@/components\";\n\n/**\n * # Breakpoints\n * Excludes `xs` as this is the smallest size - not really a breakpoint.\n */\nexport const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"xxl\"] as const;\n\nexport type Breakpoint = (typeof breakpoints)[number];\n\nexport type DisplayBreakpoint = \"xs\" | Breakpoint;\n\nexport type DisplayThresholds = {\n    [key in DisplayBreakpoint]: number;\n};\n\nexport interface DisplayOptions {\n    mobileBreakpoint?: number | DisplayBreakpoint;\n    thresholds?: Partial<DisplayThresholds>;\n}\n\nexport interface InternalDisplayOptions {\n    mobileBreakpoint: number | DisplayBreakpoint;\n    thresholds: DisplayThresholds;\n}\n\nexport type SSROptions =\n    | boolean\n    | {\n          clientWidth: number;\n          clientHeight?: number;\n      };\n\nexport interface DisplayPlatform {\n    android: boolean;\n    ios: boolean;\n    cordova: boolean;\n    electron: boolean;\n    chrome: boolean;\n    edge: boolean;\n    firefox: boolean;\n    opera: boolean;\n    win: boolean;\n    mac: boolean;\n    linux: boolean;\n    touch: boolean;\n    ssr: boolean;\n}\n\nexport interface DisplayInstance {\n    xs: Ref<boolean>;\n    sm: Ref<boolean>;\n    md: Ref<boolean>;\n    lg: Ref<boolean>;\n    xl: Ref<boolean>;\n    xxl: Ref<boolean>;\n    xsUp: Ref<boolean>;\n    smUp: Ref<boolean>;\n    mdUp: Ref<boolean>;\n    lgUp: Ref<boolean>;\n    xlUp: Ref<boolean>;\n    xxlUp: Ref<boolean>;\n    smDown: Ref<boolean>;\n    mdDown: Ref<boolean>;\n    lgDown: Ref<boolean>;\n    xlDown: Ref<boolean>;\n    name: Ref<DisplayBreakpoint>;\n    height: Ref<number>;\n    width: Ref<number>;\n    mobile: Ref<boolean>;\n    mobileBreakpoint: Ref<number | DisplayBreakpoint>;\n    platform: Ref<DisplayPlatform>;\n    thresholds: Ref<DisplayThresholds>;\n\n    /** @internal */\n    ssr: boolean;\n\n    hasActiveRule(rules: DisplayRuleListProp): boolean;\n\n    update(): void;\n}\n\nconst parseDisplayOptions = (\n    options: DisplayOptions = defaultDisplayOptions,\n) => {\n    return mergeDeep(defaultDisplayOptions, options) as InternalDisplayOptions;\n};\n\nfunction getClientWidth(ssr?: SSROptions) {\n    return Browser.hasWindow && !ssr\n        ? window.innerWidth\n        : (isObject(ssr) && ssr.clientWidth) || 0;\n}\n\nfunction getClientHeight(ssr?: SSROptions) {\n    return Browser.hasWindow && !ssr\n        ? window.innerHeight\n        : (isObject(ssr) && ssr.clientHeight) || 0;\n}\n\nfunction getPlatform(ssr?: SSROptions): DisplayPlatform {\n    const userAgent =\n        Browser.hasWindow && !ssr ? window.navigator.userAgent : \"ssr\";\n\n    function isUserAgent(regexp: RegExp) {\n        return Boolean(userAgent.match(regexp));\n    }\n\n    return {\n        android: isUserAgent(/android/i),\n        ios: isUserAgent(/iphone|ipad|ipod/i),\n        cordova: isUserAgent(/cordova/i),\n        electron: isUserAgent(/electron/i),\n        chrome: isUserAgent(/chrome/i),\n        edge: isUserAgent(/edge/i),\n        firefox: isUserAgent(/firefox/i),\n        opera: isUserAgent(/opera/i),\n        win: isUserAgent(/win/i),\n        mac: isUserAgent(/mac/i),\n        linux: isUserAgent(/linux/i),\n        touch: Browser.supportsTouch,\n        ssr: userAgent === \"ssr\",\n    };\n}\n\nexport const DisplaySymbol: InjectionKey<DisplayInstance> =\n    Symbol.for(\"ev:display\");\n\nexport const defaultDisplayOptions: DisplayOptions = {\n    mobileBreakpoint: \"lg\",\n    thresholds: {\n        xs: 0,\n        sm: 600,\n        md: 960,\n        lg: 1200,\n        xl: 1600,\n        xxl: 2400,\n    },\n};\n\n/**\n * # Create Display\n * @param options\n * @param ssr\n */\nexport function createDisplay(\n    options?: DisplayOptions,\n    ssr?: SSROptions,\n): DisplayInstance {\n    const { thresholds, mobileBreakpoint } = parseDisplayOptions(options);\n\n    const height = shallowRef(getClientHeight(ssr));\n    const platform = shallowRef(getPlatform(ssr));\n    const state = reactive({} as DisplayInstance);\n    const width = shallowRef(getClientWidth(ssr));\n\n    function updateSize() {\n        height.value = getClientHeight();\n        width.value = getClientWidth();\n    }\n\n    function update() {\n        updateSize();\n        platform.value = getPlatform();\n    }\n\n    function hasActiveRule(rules: DisplayRuleListProp): boolean\n    {\n        const rulesInternal = toDisplayRuleArray(rules);\n        for (const rule of rulesInternal) {\n            if (!isString(rule)) {\n                continue;\n            }\n            if (!isDisplayRule(rule)) {\n                consoleWarn(\n                    `The display rule '${rule}' is not valid and will be ignored.`,\n                );\n                continue;\n            }\n            const displayKey = toDisplayStateKey(rule);\n            const displayState = state[displayKey as keyof DisplayInstance];\n            if (displayState) {\n                return true;\n            }\n        }\n        return false;\n    }\n\n    // eslint-disable-next-line max-statements\n    watchEffect(() => {\n        const xs = width.value < thresholds.sm;\n        const sm = width.value < thresholds.md && !xs;\n        const md = width.value < thresholds.lg && !(sm || xs);\n        const lg = width.value < thresholds.xl && !(md || sm || xs);\n        const xl = width.value < thresholds.xxl && !(lg || md || sm || xs);\n        const xxl = width.value >= thresholds.xxl;\n        const name = xs\n            ? \"xs\"\n            : sm\n              ? \"sm\"\n              : md\n                ? \"md\"\n                : lg\n                  ? \"lg\"\n                  : xl\n                    ? \"xl\"\n                    : \"xxl\";\n        const breakpointValue =\n            typeof mobileBreakpoint === \"number\"\n                ? mobileBreakpoint\n                : thresholds[mobileBreakpoint];\n        const mobile = width.value < breakpointValue;\n\n        state.xs = xs;\n        state.sm = sm;\n        state.md = md;\n        state.lg = lg;\n        state.xl = xl;\n        state.xxl = xxl;\n        state.xsUp = true;\n        state.smUp = !xs;\n        state.mdUp = !(xs || sm);\n        state.lgUp = !(xs || sm || md);\n        state.xlUp = !(xs || sm || md || lg);\n        state.xxlUp = !(xs || sm || md || lg || xl);\n        state.smDown = !(md || lg || xl || xxl);\n        state.mdDown = !(lg || xl || xxl);\n        state.lgDown = !(xl || xxl);\n        state.xlDown = !xxl;\n        state.name = name;\n        state.height = height.value;\n        state.width = width.value;\n        state.mobile = mobile;\n        state.mobileBreakpoint = mobileBreakpoint;\n        state.platform = platform.value;\n        state.thresholds = thresholds;\n    });\n\n    if (Browser.hasWindow) {\n        window.addEventListener(\"resize\", updateSize, { passive: true });\n    }\n\n    return {\n        ...toRefs(state),\n        update,\n        hasActiveRule,\n        ssr: !!ssr,\n    };\n}\n\n/**\n * # Use Display (from Symbol);\n */\nexport function useDisplay() {\n    const display = inject(DisplaySymbol);\n    if (!display) {\n        throw new Error(\n            \"Evance UI: Could not find `ev:display` injection symbol\",\n        );\n    }\n    return display;\n}\n\n/**\n * # Display Point Options\n *\n * These are listed in order of calculation priority.\n */\nexport const displayRules = [\n    \"xxl\",\n    \"xl\",\n    \"lg\",\n    \"md\",\n    \"sm\",\n    \"xs\",\n    \"xxlOnly\",\n    \"xlOnly\",\n    \"lgOnly\",\n    \"mdOnly\",\n    \"smOnly\",\n    \"xsOnly\",\n    \"xxlUp\",\n    \"xlUp\",\n    \"lgUp\",\n    \"mdUp\",\n    \"smUp\",\n    \"xsUp\",\n    \"smDown\",\n    \"mdDown\",\n    \"lgDown\",\n    \"xlDown\",\n] as const;\nexport const displayRulesKebab = [\n    \"xxl-only\",\n    \"xl-only\",\n    \"lg-only\",\n    \"md-only\",\n    \"sm-only\",\n    \"xs-only\",\n    \"xxl-up\",\n    \"xl-up\",\n    \"lg-up\",\n    \"md-up\",\n    \"sm-up\",\n    \"xs-up\",\n    \"sm-down\",\n    \"md-down\",\n    \"lg-down\",\n    \"xl-down\",\n] as const;\n\nexport type DisplayRuleSuffix = \"only\" | \"up\" | \"down\";\nexport type DisplayRuleKey = (typeof displayRules)[number];\nexport type DisplayRuleKebab = (typeof displayRulesKebab)[number];\nexport type DisplayRuleValue = number | string;\nexport type DisplayRuleObject = {\n    [key in DisplayRuleKey]?: DisplayRuleValue;\n};\nexport type DisplayRuleProp = DisplayRuleValue | DisplayRuleObject;\nexport type DisplayRuleListProp =\n    | DisplayRuleKey\n    | DisplayRuleKey[]\n    | DisplayRuleKebab\n    | DisplayRuleKebab[]\n    | { [key in DisplayRuleKey]?: DisplayRuleSuffix };\n\n/** Visibility props */\nexport type VisibilityRuleProp = DisplayRuleListProp | boolean;\n\n/**\n * # calculateDisplayRuleValue\n *\n * @param rules\n */\nexport function calculateDisplayRuleValue(\n    rules?: DisplayRuleObject | DisplayRuleValue,\n) {\n    const display = useDisplay();\n    if (!isObject(rules)) {\n        return toWebUnit(rules);\n    }\n    for (const ruleKey of displayRules) {\n        const displayKey = toDisplayStateKey(ruleKey);\n        const displayState = display[displayKey as keyof DisplayInstance];\n        if (isRef(displayState) && displayState.value && !!rules[ruleKey]) {\n            return toWebUnit(rules[ruleKey]);\n        }\n    }\n    return undefined;\n}\n\n/**\n * # To Display Key\n *\n * @param displayRule\n */\nexport function toDisplayStateKey(displayRule: string): string {\n    if (toDisplayStateKey.cache.has(displayRule)) {\n        return toDisplayStateKey.cache.get(displayRule)!;\n    }\n    let value = toCamelCase(displayRule);\n    if (isDisplayBreakpoint(value)) {\n        value = `${value}Up`;\n    }\n    value = trimEnd(value, \"Only\");\n    toKebabCase.cache.set(displayRule, value);\n    return value;\n}\ntoDisplayStateKey.cache = new Map<string, string>();\n\n/**\n * # To Display Rule Kebab\n *\n * @param displayRule\n */\nexport function toDisplayRuleKebab(displayRule: string): string {\n    if (toDisplayRuleKebab.cache.has(displayRule)) {\n        return toDisplayRuleKebab.cache.get(displayRule)!;\n    }\n    let value = toKebabCase(displayRule);\n    if (isDisplayBreakpoint(value)) {\n        value = `${value}-up`;\n    }\n    toDisplayRuleKebab.cache.set(displayRule, value);\n    return value;\n}\ntoDisplayRuleKebab.cache = new Map<string, string>();\n\n/**\n * # isDisplayRule\n *\n * @param value\n * @param acceptKebabs\n */\nexport function isDisplayRule(\n    value: unknown,\n    acceptKebabs: boolean = true,\n): value is DisplayRuleKey | DisplayRuleKebab {\n    return (\n        displayRules.includes(value as DisplayRuleKey) ||\n        (acceptKebabs && displayRulesKebab.includes(value as DisplayRuleKebab))\n    );\n}\n\n/**\n * # isDisplayBreakpoint\n *\n * @param value\n */\nexport function isDisplayBreakpoint(\n    value: unknown,\n): value is DisplayBreakpoint {\n    return [\"xs\", ...breakpoints].includes(value as DisplayBreakpoint);\n}\n\n/**\n * # createBreakpointClasses\n *\n * @param props\n * @param propName\n * @param prefix\n * @param useXs\n */\nexport function useBreakpointClasses<\n    PropsObject extends object,\n    PropName extends Extract<keyof PropsObject, string>,\n    Prefix extends string | undefined,\n    UseXs extends boolean,\n>(\n    props: PropsObject,\n    propName: PropName,\n    prefix: Prefix = undefined as Prefix,\n    useXs: UseXs = false as UseXs,\n) {\n    return computed(() => {\n        const prop = props[propName] as ResponsiveProp;\n        if (!prop) {\n            return [];\n        }\n        const classes = [];\n        const values =\n            typeof prop !== \"object\"\n                ? ({ xs: prop } as ResponsivePropObject)\n                : prop;\n        for (const [breakpoint, value] of Object.entries(values)) {\n            const className = [];\n            if (prefix) {\n                className.push(prefix);\n            }\n            if (useXs || breakpoint !== \"xs\") {\n                className.push(breakpoint);\n            }\n            className.push(value);\n            classes.push(className.join(\"-\"));\n        }\n        return classes;\n    });\n}\n\n/**\n * # useDisplayRuleClasses\n *\n * @param props\n * @param propName\n * @param prefix\n */\nexport function useDisplayRuleClasses<\n    PropsObject extends object,\n    PropName extends Extract<keyof PropsObject, string>,\n    Prefix extends string | undefined,\n>(\n    props: PropsObject,\n    propName: PropName,\n    prefix: Prefix = undefined as Prefix,\n) {\n    return computed(() => {\n        const classes = [];\n        const rules = toDisplayRuleArray(props[propName]);\n        for (const rule of rules) {\n            if (!isString(rule)) {\n                // Gracefully ignore anything that is not a string.\n                continue;\n            }\n            if (!isDisplayRule(rule)) {\n                consoleWarn(\n                    `The display rule '${rule}' is not valid and will be ignored.`,\n                );\n                continue;\n            }\n            const suffix = toDisplayRuleKebab(rule);\n            classes.push(`${prefix}-${suffix}`);\n        }\n        return classes;\n    });\n}\n\n/**\n * # toDisplayRuleArray\n *\n * @param prop\n */\nexport function toDisplayRuleArray(prop: unknown): string[] {\n    if (Array.isArray(prop)) {\n        return prop;\n    }\n    if (isString(prop)) {\n        return spaceSeparatedValues(prop as string);\n    }\n    if (isObject(prop)) {\n        return <string[]>Object.entries(prop)\n            .map(([key, value]) => {\n                if (isBoolean(value)) {\n                    return value ? key : undefined;\n                }\n                return isString(value)\n                    ? `${key}-${value.toLowerCase()}`\n                    : undefined;\n            })\n            .filter((value) => value !== undefined);\n    }\n    return [];\n}"],"names":["mergeDeep","Browser","isObject","shallowRef","reactive","isString","consoleWarn","watchEffect","toRefs","inject","toWebUnit","isRef","toCamelCase","trimEnd","toKebabCase","computed","spaceSeparatedValues","isBoolean"],"mappings":"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"}

package/dist/cjs/evance-ui.css

@@ -1820,17 +1820,60 @@
   font-weight: normal;
 }.ev-data-table-cell {
   padding: var(--spacer-150);
-}.ev-data-table-row {
+}
+
+/**
+    # Checkbox
+
+    The width of the checkbox should be the width of the checkbox control
+    plus twice the padding-inline of `.ev-data-table-search`.
+    The resulting value should match the height of `.ev-data-table-search`.
+ */
+.ev-data-table-cell--checkbox {
+  padding-block: 0 !important;
+  padding-inline: 6px !important;
+  width: 56px;
+}.ev-data-table-row > td {
   transition: background 0.25s var(--easing-standard);
+  background: transparent;
 }
-.ev-data-table-row:hover {
+.ev-data-table-row > td:first-child {
+  border-top-left-radius: var(--input-radius);
+  border-bottom-left-radius: var(--input-radius);
+}
+.ev-data-table-row > td:last-child {
+  border-top-right-radius: var(--input-radius);
+  border-bottom-right-radius: var(--input-radius);
+}
+.ev-data-table-row:hover > td {
   background: var(--fill-neutral-subtle-hovered);
 }
-.ev-data-table-row.is-selected {
+.ev-data-table-row.is-selected > td {
   background: var(--fill-selected);
 }
-.ev-data-table-row.is-selected:hover {
+.ev-data-table-row.is-selected:hover > td {
   background: var(--fill-selected-hovered);
+}
+
+.ev-data-table-row.is-indicated > td:first-child {
+  position: relative;
+}
+.ev-data-table-row.is-indicated > td:first-child:before {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 0;
+  height: 100%;
+  width: 3px;
+  transition: opacity 0.25s ease-in-out;
+  opacity: 0;
+  will-change: opacity;
+  background: var(--text-selected);
+  border-top-left-radius: var(--input-radius);
+  border-bottom-left-radius: var(--input-radius);
+}
+.ev-data-table-row.is-indicated.is-selected > td:first-child:before {
+  opacity: 1;
 }/**
     # EvDivider
  */
@@ -2509,9 +2552,12 @@ html.ev-overlay-scroll-blocked {
   overflow: auto;
   flex: 1;
 }
-.ev-data-table--wrapper > table {
+
+.ev-data-table--native {
   width: 100%;
-  border-collapse: collapse;
+  border-spacing: 0 2px;
+  border-collapse: separate;
+  padding: 2px;
 }
 
 .ev-data-table--empty {
@@ -2530,19 +2576,6 @@ html.ev-overlay-scroll-blocked {
 .ev-data-table--thead th {
   box-shadow: inset 0 -1px 0 var(--stroke);
   background-color: var(--current-surface-fill);
-}
-
-/**
-    # Checkbox
-
-    The width of the checkbox should be the width of the checkbox control
-    plus twice the padding-inline of `.ev-data-table-search`.
-    The resulting value should match the height of `.ev-data-table-search`.
- */
-.ev-data-table-cell--checkbox {
-  padding-block: 0 !important;
-  padding-inline: var(--spacer-100) !important;
-  width: 56px;
 }.ev-date-picker-month--days {
   display: grid;
   grid-template-columns: min-content min-content min-content min-content min-content min-content min-content;
@@ -4238,7 +4271,7 @@ html.ev-overlay-scroll-blocked {
 .ev-textarea--errors {
   margin-top: 0.5rem;
 }.ev-window {
-  --window-transition: 1s cubic-bezier(.25, .8, .50, 1);
+  --window-transition: .3s cubic-bezier(.25, .8, .50, 1);
   overflow: hidden;
 }
 .ev-window--container {