npm - @fiscozen/card - Versions diffs - 1.0.1 → 1.0.2 - Mend

@fiscozen/card 1.0.1 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

package/CHANGELOG.md +18 -0
package/dist/card.js +1106 -0
package/dist/card.umd.cjs +1 -0
package/dist/index.d.ts +1 -0
package/dist/src/FzCard.vue.d.ts +48 -0
package/dist/src/index.d.ts +2 -0
package/dist/src/types.d.ts +119 -0
package/dist/style.css +1 -0
package/package.json +7 -7
package/src/__tests__/FzCard.spec.ts +890 -0
package/src/__tests__/__snapshots__/FzCard.spec.ts.snap +126 -0
package/tsconfig.tsbuildinfo +1 -0
package/vitest.config.ts +9 -1
package/src/__test__/FzCard.test.ts +0 -576
package/src/__test__/__snapshots__/FzCard.test.ts.snap +0 -19

package/dist/card.umd.cjs ADDED Viewed

@@ -0,0 +1 @@

package/dist/index.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export * from './src/index'

package/dist/src/FzCard.vue.d.ts ADDED Viewed

@@ -0,0 +1,48 @@
+import { FzCardProps, FzCardSlots } from './types';
+declare function toggleOpen(): void;
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<FzCardProps>, {
+    environment: string;
+}>>, {
+    /**
+     * Method to toggle the card open/closed state
+     */
+    toggleOpen: typeof toggleOpen;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "fzprimary:click": () => void;
+    "fzsecondary:click": () => void;
+    "fztertiary:click": () => void;
+    "fzcard:click-info": () => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<FzCardProps>, {
+    environment: string;
+}>>> & Readonly<{
+    "onFzprimary:click"?: (() => any) | undefined;
+    "onFzsecondary:click"?: (() => any) | undefined;
+    "onFztertiary:click"?: (() => any) | undefined;
+    "onFzcard:click-info"?: (() => any) | undefined;
+}>, {
+    environment: import('./types').FzCardEnvironment;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, Readonly<FzCardSlots> & FzCardSlots>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/index.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export { default as FzCard } from './FzCard.vue';
2	+ export * from './types';

package/dist/src/types.d.ts ADDED Viewed

@@ -0,0 +1,119 @@
+export type FzCardProps = {
+    /**
+     * The title of the card
+     */
+    title?: string;
+    /**
+     * The background color of the card
+     */
+    color?: FzCardColor;
+    /**
+     * The primary action button
+     */
+    primaryAction?: FzCardButton;
+    /**
+     * The secondary action button
+     */
+    secondaryAction?: FzCardButton;
+    /**
+     * The tertiary action button
+     */
+    tertiaryAction?: FzCardIconButton;
+    /**
+     * Custom css class to apply to the content
+     */
+    contentClass?: string;
+    /**
+     * Whether the card is collapsible
+     */
+    collapsible?: boolean;
+    /**
+     * Whether the card is expanded by default (only if collapsible)
+     */
+    defaultExpanded?: boolean;
+    /**
+     * Whether the card content is always alive (never destroyed) when collapsed
+     */
+    alwaysAlive?: boolean;
+    /**
+     * Whether to show an info icon in the header
+     * @default false
+     */
+    hasInfoIcon?: boolean;
+    /**
+     * The environment context for the card buttons
+     * @default 'frontoffice'
+     */
+    environment?: FzCardEnvironment;
+};
+type FzCardButton = {
+    label: string;
+    disabled?: boolean;
+};
+type FzCardIconButton = {
+    icon: string;
+    disabled?: boolean;
+};
+/**
+ * Card background color variants.
+ *
+ * @remarks
+ * - 'default' renders a white background
+ * - 'blue' renders an alice-blue background
+ * - 'orange' renders a seashell background
+ * - 'purple' renders a pale-purple background
+ * - 'grey' renders a white-smoke background
+ *
+ * @deprecated 'aliceblue' is deprecated and will be removed in a future version. Use 'blue' instead.
+ */
+export type FzCardColor = "default" | "blue" | "orange" | "purple" | "grey" | "aliceblue";
+/**
+ * Card environment context for buttons
+ *
+ * @remarks
+ * Determines the visual style context for all buttons within the card
+ * - 'backoffice' for internal/admin interfaces
+ * - 'frontoffice' for public-facing interfaces
+ */
+export type FzCardEnvironment = "backoffice" | "frontoffice";
+export interface FzCardEvents {
+    /**
+     * Event emitted when the primary action is clicked
+     * @type {() => void}
+     */
+    (event: "fzprimary:click"): void;
+    /**
+     * Event emitted when the secondary action is clicked
+     * @type {() => void}
+     */
+    (event: "fzsecondary:click"): void;
+    /**
+     * Event emitted when the tertiary action is clicked
+     * @type {() => void}
+     */
+    (event: "fztertiary:click"): void;
+    /**
+     * Event emitted when the info icon is clicked
+     * @type {() => void}
+     */
+    (event: "fzcard:click-info"): void;
+}
+export interface FzCardSlots {
+    /**
+     * Slot for the content of the card
+     */
+    default(props: {}): any;
+    /**
+     * Slot for the header, it will be displayed on the left of the title
+     */
+    header(props: {}): any;
+    /**
+     * Slot for the header content, it will be displayed below the title
+     */
+    "header-content"(props: {}): any;
+    /**
+     * Slot for the footer of the card
+     */
+    footer(props: {}): any;
+}
+export {};

package/dist/style.css ADDED Viewed

@@ -0,0 +1 @@

+ .fz-container[data-v-8c40daeb]{display:flex}.fz-container--vertical[data-v-8c40daeb]{flex-direction:column}.fz-container--horizontal[data-v-8c40daeb]{flex-direction:row;flex-wrap:nowrap}.fz-container.align-items-start[data-v-8c40daeb]{align-items:flex-start}.fz-container.align-items-center[data-v-8c40daeb]{align-items:center}.fz-container.align-items-end[data-v-8c40daeb]{align-items:flex-end}.fz-container.align-items-stretch[data-v-8c40daeb]{align-items:stretch}.fz-container.align-items-baseline[data-v-8c40daeb]{align-items:baseline}.fz-container--horizontal.layout-expand-first[data-v-8c40daeb]>*:first-child{flex-grow:1}.fz-container--horizontal.layout-expand-all[data-v-8c40daeb]>*{flex-grow:1}.fz-container--horizontal.layout-space-between[data-v-8c40daeb]{justify-content:space-between}.fz-container--horizontal.layout-expand-last[data-v-8c40daeb]>*:last-child{flex-grow:1}.fz-container--vertical.gap-main-content-sm[data-v-8c40daeb]>p+p{margin-top:calc((0px - var(--main-content-sm, 32px)) + var(--paragraph-gap, 8px))}.fz-container--vertical.gap-main-content-base[data-v-8c40daeb]>p+p{margin-top:calc((0px - var(--main-content-base, 48px)) + var(--paragraph-gap, 8px))}.fz-container--vertical.gap-main-content-lg[data-v-8c40daeb]>p+p{margin-top:calc((0px - var(--main-content-lg, 64px)) + var(--paragraph-gap, 8px))}.fz-container--vertical.gap-section-content-none[data-v-8c40daeb]>p+p{margin-top:calc((0px - var(--section-content-none, 0px)) + var(--paragraph-gap, 8px))}.fz-container--vertical.gap-section-content-xs[data-v-8c40daeb]>p+p{margin-top:calc((0px - var(--section-content-xs, 8px)) + var(--paragraph-gap, 8px))}.fz-container--vertical.gap-section-content-sm[data-v-8c40daeb]>p+p{margin-top:calc((0px - var(--section-content-sm, 16px)) + var(--paragraph-gap, 8px))}.fz-container--vertical.gap-section-content-base[data-v-8c40daeb]>p+p{margin-top:calc((0px - var(--section-content-base, 24px)) + var(--paragraph-gap, 8px))}.fz-container--vertical.gap-section-content-lg[data-v-8c40daeb]>p+p{margin-top:calc((0px - var(--section-content-lg, 32px)) + var(--paragraph-gap, 8px))}.fz-container--horizontal[data-v-8c40daeb]>p+p{margin-top:0}

package/package.json CHANGED Viewed

@@ -1,17 +1,17 @@
 {
   "name": "@fiscozen/card",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Design System Card component",
   "main": "src/index.ts",
   "type": "module",
   "keywords": [],
   "author": "Cristian Barraco",
   "dependencies": {
-    "@fiscozen/button": "^1.0.1-next.1",
-    "@fiscozen/style": "^0.1.8-next.0",
-    "@fiscozen/icons": "^0.1.36",
-    "@fiscozen/composables": "^1.0.0",
-    "@fiscozen/container": "^0.3.1"
+    "@fiscozen/container": "0.4.1",
+    "@fiscozen/button": "1.0.1",
+    "@fiscozen/composables": "1.0.1",
+    "@fiscozen/icons": "0.1.36",
+    "@fiscozen/style": "0.2.0"
   },
   "peerDependencies": {
     "tailwindcss": "^3.4.1",
@@ -33,8 +33,8 @@
     "vite-plugin-dts": "^3.8.3",
     "vitest": "^1.2.0",
     "vue-tsc": "^1.8.25",
-    "@fiscozen/eslint-config": "^0.1.0",
     "@fiscozen/tsconfig": "^0.1.0",
+    "@fiscozen/eslint-config": "^0.1.0",
     "@fiscozen/prettier-config": "^0.1.0"
   },
   "license": "MIT",