@feedmepos/ui-library 0.0.26 → 1.0.0

package/dist/tailwind-plugin.js

@@ -155,6 +155,9 @@ module.exports = plugin(
           xxl: '128px',
           xxxl: '360px',
         },
+        aspectRatio: {
+          '4/3': '4 / 3',
+        },
       },
     },
   }

package/dist/utils/fuzzy.d.ts

@@ -0,0 +1,10 @@
+export interface HighlightableResultSegment {
+    segment: string;
+    isMatch: boolean;
+}
+export interface HighlightableResult {
+    label: string;
+    segments: HighlightableResultSegment[];
+    matched: boolean;
+}
+export declare function getHighlightableLetters(needle: string, haystack: string): HighlightableResult;

package/dist/utils/number.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Returns a finite number or null if not a finite number
+ * @param numOrStr number or string or undefined
+ */
+export declare function coerceToNumber(numOrStr?: number | string): number | null;

package/dist/utils/provider-keys.d.ts

@@ -3,10 +3,14 @@ import type { RadioGroupProvider } from '@/components/form/radio-group/FmRadioGr
 import { type StepperProvider } from '@/components/stepper/stepper';
 import type { DialogProvider } from '@/plugin/dialog-plugin';
 import type { MenuProvider, MenuToItemProvider } from '@/components/menu/menu-component/FmMenu.vue';
+import type { CardProvider } from '@/components/card/FmCard.vue';
 import type { InjectionKey } from 'vue';
+import type { SnackbarService } from '@/plugin/snackbar-plugin';
 export declare const FormProviderSymbol: InjectionKey<FormParentProvider>;
 export declare const RadioGroupProviderSymbol: InjectionKey<RadioGroupProvider>;
 export declare const StepperProviderSymbol: InjectionKey<StepperProvider>;
 export declare const DialogProviderSymbol: InjectionKey<DialogProvider>;
 export declare const MenuProviderSymbol: InjectionKey<MenuProvider>;
 export declare const MenuToItemProviderSymbol: InjectionKey<MenuToItemProvider>;
+export declare const SnackbarProviderSymbol: InjectionKey<SnackbarService>;
+export declare const CardProviderSymbol: InjectionKey<CardProvider>;

package/dist/utils/util-color.d.ts

@@ -1,4 +1,6 @@
 export declare function isColorCode(color: string): boolean;
 export declare function extractColorHex(color: string): RegExpExecArray | null;
 export declare function colorHexToRgb(color: string, alpha?: string | undefined): string;
+export declare function colorCodeToRgba(color: string, opacity: number): string;
+export declare function getColorCode(color: string): string | null;
 export declare function calculateColorBrightness(color: string): number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@feedmepos/ui-library",
-  "version": "0.0.26",
+  "version": "1.0.0",
   "type": "module",
   "files": [
     "dist"
@@ -9,9 +9,6 @@
     "type": "git",
     "url": "git+https://github.com/feedmepos/ui-library.git"
   },
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org"
-  },
   "bugs": "https://feedmepos.atlassian.net/browse/CT-3",
   "homepage": "ui.feedme.ai",
   "main": "./dist/feedmepos-ui-library.umd.cjs",
@@ -28,44 +25,37 @@
   "dependencies": {
     "@floating-ui/vue": "^1.0.2",
     "@tanstack/vue-table": "^8.11.2",
-    "chart.js": "^4.4.0",
+    "chart.js": "^4.4.1",
     "dayjs": "^1.11.10",
+    "debounce": "^2.0.0",
+    "fuzzy": "^0.1.3",
+    "libphonenumber-js": "^1.10.54",
     "tailwindcss": "^3.3.3",
     "v-wave": "^1.5.1",
     "vue": "^3.3.4",
-    "vue-router": "^4.2.5"
+    "vue-router": "^4.2.5",
+    "vue-virtual-scroller": "2.0.0-beta.8"
   },
   "devDependencies": {
     "@originjs/vite-plugin-federation": "^1.3.2",
     "@rushstack/eslint-patch": "^1.3.3",
-    "@storybook/addon-essentials": "7.5.3",
-    "@storybook/addon-interactions": "7.5.3",
-    "@storybook/addon-links": "7.5.3",
-    "@storybook/blocks": "7.5.3",
-    "@storybook/manager-api": "^7.5.3",
-    "@storybook/testing-library": "0.2.2",
-    "@storybook/theming": "^7.5.3",
-    "@storybook/vue3": "7.5.3",
-    "@storybook/vue3-vite": "7.5.3",
     "@tsconfig/node18": "^18.2.2",
     "@types/chart.js": "^2.9.38",
+    "@types/debounce": "^1.2.4",
     "@types/node": "^18.17.17",
     "@vitejs/plugin-vue": "^4.3.4",
     "@vitejs/plugin-vue-jsx": "^3.0.2",
     "@vue/eslint-config-typescript": "^12.0.0",
     "@vue/tsconfig": "^0.4.0",
     "autoprefixer": "^10.4.16",
-    "chromatic": "^10.2.0",
     "eslint": "^8.49.0",
     "eslint-config-prettier": "^9.0.0",
-    "eslint-plugin-storybook": "^0.6.15",
     "eslint-plugin-vue": "^9.17.0",
     "npm-run-all2": "^6.0.6",
     "postcss": "^8.4.31",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "sass": "^1.69.1",
-    "storybook": "7.5.3",
     "typescript": "~5.2.0",
     "vite": "^4.4.9",
     "vite-plugin-static-copy": "^0.17.0",
@@ -90,9 +80,6 @@
     "type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false",
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
     "deploy": "pnpm run build:lib && pnpm publish --no-git-checks .",
-    "register-components": "node ./register-components.js && pnpm lint",
-    "storybook": "storybook dev -p 6006 --no-open",
-    "build-storybook": "storybook build",
-    "chromatic": "npx chromatic"
+    "register-components": "node ./register-components.js && pnpm lint"
   }
 }

package/README.md

@@ -1,35 +0,0 @@
-# FeedMe UI Library
-
-This repo included ui components from design system. Built for FeedMe internal projects.
-
-# Getting started
-
-Vite is used for [module federation](https://github.com/originjs/vite-plugin-federation).
-```
-> npm install -D @vitejs/plugin-vue vite
-```
-
-Vue3 required to utilize ui components.
-```
-> npm install vue
-```
-
-This project is heavily depends on [tailwindcss](https://tailwindcss.com) to achieve style sharing.
-
-Install tailwindcss, view more info [here](https://tailwindcss.com/docs/guides/vite)
-```powershell
-> npm install -D tailwindcss postcss autoprefixer
-> npx tailwindcss init -p
-```
-
-Install ui-library
-```powershell
-> npm install @feedmepos/ui-library
-```
-
-## Issues
-For issue/bug report, please open ticket at our Jira backlog under [CT-3 B2B Design Library V1](https://feedmepos.atlassian.net/browse/CT-3).
-
-## Maintainer
-
-Thanks for contribution of **[FeedMe Team](https://github.com/feedmepos)**

package/dist/components/badge/FmBadge.stories.d.ts

@@ -1,11 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmBadge from './FmBadge.vue';
-declare const meta: Meta<typeof FmBadge>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Neutral: Story;
-export declare const Info: Story;
-export declare const Success: Story;
-export declare const Warning: Story;
-export declare const Critical: Story;
-export declare const Numeric: Story;

package/dist/components/breadcrumb/FmBreadcrumb.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmBreadcrumb from './FmBreadcrumb.vue';
-declare const meta: Meta<typeof FmBreadcrumb>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/button/FmButton.stories.d.ts

@@ -1,200 +0,0 @@
-import type { StoryObj } from '@storybook/vue3';
-declare const meta: {
-    title: string;
-    component: import("vue").DefineComponent<{
-        variant: {
-            type: import("vue").PropType<"primary" | "secondary" | "tertiary" | "destructive" | "plain" | "fab">;
-            default: string;
-        };
-        type: {
-            type: import("vue").PropType<"button" | "submit" | "reset">;
-            default: string;
-        };
-        label: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        disabled: {
-            type: import("vue").PropType<boolean>;
-            default: boolean;
-        };
-        size: {
-            type: import("vue").PropType<"md" | "lg">;
-            default: string;
-        };
-        icon: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        iconColor: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        iconPosition: {
-            type: import("vue").PropType<"prepend" | "append">;
-            default: string;
-        };
-        prependIcon: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        appendIcon: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        loading: {
-            type: import("vue").PropType<boolean>;
-            default: boolean;
-        };
-    }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-        variant: {
-            type: import("vue").PropType<"primary" | "secondary" | "tertiary" | "destructive" | "plain" | "fab">;
-            default: string;
-        };
-        type: {
-            type: import("vue").PropType<"button" | "submit" | "reset">;
-            default: string;
-        };
-        label: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        disabled: {
-            type: import("vue").PropType<boolean>;
-            default: boolean;
-        };
-        size: {
-            type: import("vue").PropType<"md" | "lg">;
-            default: string;
-        };
-        icon: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        iconColor: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        iconPosition: {
-            type: import("vue").PropType<"prepend" | "append">;
-            default: string;
-        };
-        prependIcon: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        appendIcon: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        loading: {
-            type: import("vue").PropType<boolean>;
-            default: boolean;
-        };
-    }>>, {
-        variant: "primary" | "secondary" | "tertiary" | "destructive" | "plain" | "fab";
-        type: "button" | "submit" | "reset";
-        label: string;
-        disabled: boolean;
-        size: "md" | "lg";
-        icon: string;
-        iconColor: string;
-        iconPosition: "prepend" | "append";
-        prependIcon: string;
-        appendIcon: string;
-        loading: boolean;
-    }, {}>;
-    tags: string[];
-    argTypes: {
-        variant: {
-            control: string;
-            options: string[];
-            table: {
-                defaultValue: {
-                    summary: string;
-                };
-            };
-        };
-        label: {
-            control: string;
-        };
-        size: {
-            control: string;
-            options: string[];
-            table: {
-                defaultValue: {
-                    summary: string;
-                };
-                type: {
-                    summary: string;
-                };
-            };
-        };
-        disabled: {
-            control: string;
-            table: {
-                defaultValue: {
-                    summary: boolean;
-                };
-            };
-        };
-        type: {
-            control: string;
-            options: string[];
-            description: string;
-            table: {
-                defaultValue: {
-                    summary: string;
-                };
-                type: {
-                    summary: string;
-                };
-            };
-        };
-        prependIcon: {
-            control: string;
-            table: {
-                defaultValue: {
-                    summary: boolean;
-                };
-            };
-        };
-        appendIcon: {
-            control: string;
-            table: {
-                defaultValue: {
-                    summary: boolean;
-                };
-            };
-        };
-        icon: {
-            control: string;
-            description: string;
-        };
-        iconPosition: {
-            control: string;
-            description: string;
-        };
-        iconColor: {
-            control: string;
-            description: string;
-        };
-    };
-    args: {
-        variant: "primary";
-        label: string;
-        size: "md";
-        disabled: false;
-        type: "button";
-        prependIcon: string;
-        appendIcon: string;
-    };
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;
-export declare const Secondary: Story;
-export declare const Tertiary: Story;
-export declare const Destructive: Story;
-export declare const Plain: Story;
-export declare const Fab: Story;

package/dist/components/button-group/FmButtonGroup.stories.d.ts

@@ -1,7 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmButtonGroup from './FmButtonGroup.vue';
-declare const meta: Meta<typeof FmButtonGroup>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;
-export declare const ButtonGroupWithIcons: Story;

package/dist/components/card/FmCard.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmCard from './FmCard.vue';
-declare const meta: Meta<typeof FmCard>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/chart/line/FmLine.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmLine from './FmLine.vue';
-declare const meta: Meta<typeof FmLine>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/chip/FmChip.stories.d.ts

@@ -1,7 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmChip from './FmChip.vue';
-declare const meta: Meta<typeof FmChip>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;
-export declare const Collection: Story;

package/dist/components/chip-group/FmChipGroup.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmChipGroup from './FmChipGroup.vue';
-declare const meta: Meta<typeof FmChipGroup>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/dialog/FmDialog.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmDialog from './FmDialog.vue';
-declare const meta: Meta<typeof FmDialog>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/drop-field/FmDropField.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmDropField from './FmDropField.vue';
-declare const meta: Meta<typeof FmDropField>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/calendar/date-picker/FmDatePicker.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmDatePicker from './FmDatePicker.vue';
-declare const meta: Meta<typeof FmDatePicker>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/calendar/date-range-picker/FmDateRangePicker.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmDateRangePicker from './FmDateRangePicker.vue';
-declare const meta: Meta<typeof FmDateRangePicker>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/checkbox/FmCheckbox.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmCheckbox from './FmCheckbox.vue';
-declare const meta: Meta<typeof FmCheckbox>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/helper-text/FmHelperText.stories.d.ts

@@ -1,129 +0,0 @@
-import type { StoryObj } from '@storybook/vue3';
-declare const meta: {
-    title: string;
-    component: {
-        new (...args: any[]): import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{
-            text: {
-                type: import("vue").PropType<string>;
-                default: string;
-            };
-            disabled: {
-                type: import("vue").PropType<boolean>;
-                default: boolean;
-            };
-            errorMessages: {
-                type: import("vue").PropType<string[]>;
-                default: () => never[];
-            };
-            state: {
-                type: import("vue").PropType<"success" | "warning" | "none" | "error">;
-                default: string;
-            };
-        }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{
-            text: {
-                type: import("vue").PropType<string>;
-                default: string;
-            };
-            disabled: {
-                type: import("vue").PropType<boolean>;
-                default: boolean;
-            };
-            errorMessages: {
-                type: import("vue").PropType<string[]>;
-                default: () => never[];
-            };
-            state: {
-                type: import("vue").PropType<"success" | "warning" | "none" | "error">;
-                default: string;
-            };
-        }>>, {
-            text: string;
-            disabled: boolean;
-            errorMessages: string[];
-            state: "success" | "warning" | "none" | "error";
-        }, true, {}, {}, {
-            P: {};
-            B: {};
-            D: {};
-            C: {};
-            M: {};
-            Defaults: {};
-        }, Readonly<import("vue").ExtractPropTypes<{
-            text: {
-                type: import("vue").PropType<string>;
-                default: string;
-            };
-            disabled: {
-                type: import("vue").PropType<boolean>;
-                default: boolean;
-            };
-            errorMessages: {
-                type: import("vue").PropType<string[]>;
-                default: () => never[];
-            };
-            state: {
-                type: import("vue").PropType<"success" | "warning" | "none" | "error">;
-                default: string;
-            };
-        }>>, {}, {}, {}, {}, {
-            text: string;
-            disabled: boolean;
-            errorMessages: string[];
-            state: "success" | "warning" | "none" | "error";
-        }>;
-        __isFragment?: undefined;
-        __isTeleport?: undefined;
-        __isSuspense?: undefined;
-    } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
-        text: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        disabled: {
-            type: import("vue").PropType<boolean>;
-            default: boolean;
-        };
-        errorMessages: {
-            type: import("vue").PropType<string[]>;
-            default: () => never[];
-        };
-        state: {
-            type: import("vue").PropType<"success" | "warning" | "none" | "error">;
-            default: string;
-        };
-    }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
-        text: string;
-        disabled: boolean;
-        errorMessages: string[];
-        state: "success" | "warning" | "none" | "error";
-    }, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
-        $slots: {
-            default?(_: {}): any;
-        };
-    });
-    tags: string[];
-    argTypes: {
-        text: {
-            control: string;
-        };
-        disabled: {
-            control: string;
-        };
-        state: {
-            control: string;
-            options: string[];
-        };
-        errorMessages: {
-            control: string;
-        };
-    };
-    args: {
-        text: string;
-        disabled: false;
-        state: "none";
-        errorMessages: never[];
-    };
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/label/FmLabel.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmLabel from './FmLabel.vue';
-declare const meta: Meta<typeof FmLabel>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/radio/FmRadio.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmRadio from './FmRadio.vue';
-declare const meta: Meta<typeof FmRadio>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/radio-group/FmRadioGroup.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmRadioGroup from './FmRadioGroup.vue';
-declare const meta: Meta<typeof FmRadioGroup>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/select/FmSelect.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmSelect from './FmSelect.vue';
-declare const meta: Meta<typeof FmSelect>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/stepper-field/FmStepperField.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmStepperField from './FmStepperField.vue';
-declare const meta: Meta<typeof FmStepperField>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/switch/FmSwitch.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmSwitch from './FmSwitch.vue';
-declare const meta: Meta<typeof FmSwitch>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/text-field/FmTextField.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmTextfield from './FmTextField.vue';
-declare const meta: Meta<typeof FmTextfield>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;

package/dist/components/form/textarea/FmTextarea.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/vue3';
-import FmTextarea from './FmTextarea.vue';
-declare const meta: Meta<typeof FmTextarea>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;