@onereach/ui-components 6.4.3 → 6.4.4

package/dist/bundled/v2/components/OrCardV3/OrCard.js

@@ -1,15 +1,29 @@
 import { defineComponent, ref, computed } from 'vue-demi';
-import { CardRoot } from './styles.js';
+import { CardPadding } from './props.js';
+import { CardRoot, CardPaddings, CardInteractive } from './styles.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
 
 var script = defineComponent({
-  name: 'OrCard',
+  props: {
+    selected: {
+      type: Boolean,
+      default: false
+    },
+    padding: {
+      type: String,
+      default: CardPadding.M
+    },
+    interactive: {
+      type: Boolean,
+      default: false
+    }
+  },
   expose: ['root'],
-  setup() {
+  setup(props) {
     // Refs
     const root = ref();
     // Styles
-    const rootStyles = computed(() => ['or-card-v3', ...CardRoot]);
+    const rootStyles = computed(() => ['or-card-v3', ...CardRoot, ...CardPaddings[props.padding], ...(props.interactive ? CardInteractive : [])]);
     return {
       root,
       rootStyles
@@ -27,7 +41,10 @@ var __vue_render__ = function () {
   var _c = _vm._self._c || _h;
   return _c('div', {
     ref: "root",
-    class: _vm.rootStyles
+    class: _vm.rootStyles,
+    attrs: {
+      "selected": _vm.selected ? '' : null
+    }
   }, [_vm._t("default")], 2);
 };
 var __vue_staticRenderFns__ = [];

package/dist/bundled/v2/components/OrCardV3/OrCard.vue.d.ts

@@ -1,8 +1,48 @@
+import { PropType } from 'vue-demi';
+import { CardPadding } from './props';
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
-}> & import("@vue/composition-api").Data, {}, {}, {}, import("@vue/composition-api").ExtractPropTypes<{}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<{
+}> & import("@vue/composition-api").Data, {}, {}, {
+    selected: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    padding: {
+        type: PropType<"none" | "m" | "l">;
+        default: CardPadding;
+    };
+    interactive: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, import("@vue/composition-api").ExtractPropTypes<{
+    selected: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    padding: {
+        type: PropType<"none" | "m" | "l">;
+        default: CardPadding;
+    };
+    interactive: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
+    selected: boolean;
+    padding: "none" | "m" | "l";
+    interactive: boolean;
+} & {}, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
-}>, import("@vue/composition-api").Data, {}, {}, {}, {}, {}, {} & {}, {}, true>);
+}>, import("@vue/composition-api").Data, {}, {}, {}, {}, {}, {
+    selected: boolean;
+    padding: "none" | "m" | "l";
+    interactive: boolean;
+} & {}, {
+    selected: boolean;
+    padding: "none" | "m" | "l";
+    interactive: boolean;
+}, true>);
 export default _default;

package/dist/bundled/v2/components/OrCardV3/index.d.ts

@@ -1 +1,2 @@
 export { default as OrCardV3 } from './OrCard.vue';
+export * from './props';

package/dist/bundled/v2/components/OrCardV3/index.js

@@ -1 +1,2 @@
 export { default as OrCardV3 } from './OrCard.js';
+export { CardPadding } from './props.js';

package/dist/bundled/v2/components/OrCardV3/props.d.ts

@@ -0,0 +1,5 @@
+export declare enum CardPadding {
+    None = "none",
+    M = "m",
+    L = "l"
+}

package/dist/bundled/v2/components/OrCardV3/props.js

@@ -0,0 +1,8 @@
+var CardPadding;
+(function (CardPadding) {
+  CardPadding["None"] = "none";
+  CardPadding["M"] = "m";
+  CardPadding["L"] = "l";
+})(CardPadding || (CardPadding = {}));
+
+export { CardPadding };

package/dist/bundled/v2/components/OrCardV3/styles.d.ts

@@ -1 +1,4 @@
+import { CardPadding } from './props';
 export declare const CardRoot: string[];
+export declare const CardPaddings: Record<CardPadding, string[]>;
+export declare const CardInteractive: string[];

package/dist/bundled/v2/components/OrCardV3/styles.js

@@ -1,15 +1,27 @@
+import { CardPadding } from './props.js';
+
 const CardRoot = [
 // Layout
 'layout-column',
 // Shape
 'rounded-md',
 // Spacing
-'px-md', 'py-md', 'gap-[10px]',
+'gap-[10px]',
 // Typography
 'typography-body-2-regular',
 // Theme
-'theme-background-default', 'dark:theme-background-default-dark', 'theme-foreground-default', 'dark:theme-foreground-default-dark',
-// Elevation
-'shadow-card', 'dark:shadow-card-dark'];
+'theme-background-default dark:theme-background-default-dark', 'shadow-card dark:shadow-card-dark'];
+const CardPaddings = {
+  [CardPadding.None]: [],
+  [CardPadding.L]: ['p-lg'],
+  [CardPadding.M]: ['p-md']
+};
+const CardInteractive = [
+// Hover
+'hover:shadow-contextual hover:dark:shadow-contextual-dark',
+// Selected
+'selected:bg-surface-1 dark:selected:bg-surface-1-dark', 'selected:shadow-card selected:dark:shadow-card-dark',
+// Active
+'active:bg-surface-1 dark:active:bg-surface-1-dark', 'active:shadow-card active:dark:shadow-card-dark'];
 
-export { CardRoot };
+export { CardInteractive, CardPaddings, CardRoot };

package/dist/bundled/v2/components/index.js

@@ -17,6 +17,7 @@ export { default as OrCardCollection } from './OrCardCollection/OrCardCollection
 export { default as OrCardCollectionV3 } from './OrCardCollectionV3/OrCardCollection.js';
 export { CardCollectionView, defaultViewModes, gridView, listView } from './OrCardCollectionV3/props.js';
 export { default as OrCardV3 } from './OrCardV3/OrCard.js';
+export { CardPadding } from './OrCardV3/props.js';
 export { default as OrCheckbox } from './OrCheckbox/OrCheckbox.js';
 export { default as OrCheckboxGroupV3 } from './OrCheckboxGroupV3/OrCheckboxGroup.js';
 export { default as OrCheckboxTreeV3 } from './OrCheckboxTreeV3/OrCheckboxTree.js';