@aveonline/ui-react 1.6.1 → 1.6.2

package/dist/components/atoms/Button/IButton.d.ts

@@ -1,4 +1,4 @@
-import { IClassName } from '@/types';
+import { IClassName } from '../../../types';
 import type { ReactNode, MouseEventHandler } from 'react';
 export declare type Variant = 'primary' | 'basic' | 'destructive' | 'plain' | 'plain-monochrome' | 'plain-destructive';
 declare type Size = 'md' | 'sm';

package/dist/components/atoms/Logo/Logo.d.ts

@@ -1,4 +1,4 @@
-import { IClassName } from '@/types';
+import { IClassName } from '../../../types';
 import { ILogo } from './ILogo';
 /**
  * Atom: Logo

package/dist/components/atoms/Typography/Link/Link.d.ts

@@ -1,4 +1,4 @@
-import { IChildren, IClassName } from '@/types';
+import { IChildren, IClassName } from '../../../../types';
 import { ILink } from './ILink';
 /**
  * Atom: Link

package/dist/components/molecules/Dropdown/Dropdown.d.ts

@@ -1,5 +1,5 @@
 import { IPropsDropdown } from './IDropdown';
-import { IClassName } from '@/types';
+import { IClassName } from '../../../types';
 /**
  * Molecule: Dropdown
  * Page actions let merchants take key actions at the bottom of specific pages in the interface. This is important because sometimes the primary call to action is hard to access when merchants are at the bottom of a page, that’s why this component is fixed.

package/dist/components/molecules/Flag/IFlag.d.ts

@@ -1,5 +1,5 @@
 import { IKind as IKindIcon } from '@/components/atoms/Icon';
-import { IChildren } from '@/types';
+import { IChildren } from '../../../types';
 declare type IKindFlag = 'default' | 'success' | 'warning' | 'error';
 interface IPropsFlag extends IChildren {
     icon?: IKindIcon;

package/dist/components/organisms/Navigation/INavigation.d.ts

@@ -1,4 +1,4 @@
-import { IChildren } from '@/types';
+import { IChildren } from '../../../types';
 interface INavigation extends IChildren {
     isSmall?: boolean;
     [rest: string]: any;

package/dist/components/templates/Main/Main.d.ts

@@ -1,4 +1,4 @@
-import { ITemplate } from '@/types';
+import { ITemplate } from '../../../types';
 /**
  * Template: Layout main
  */

package/dist/tokens.css

@@ -1,3 +1,47 @@
+/**
+ * Modify directly
+ * --line-height-xl = 36
+ * --line-height-xxl = 56px - new
+ * --font-size-xxl: 50px - new
+ * --colors-letter-default: #4a4f54;
+ * --colors-letter-subdued: #797C81;
+ * --colors-letter-disabled: #c3c5ca;
+ * --colors-surface-subdued: #f3f4f6;
+ * --colors-surface-hovered: #ebedf0;
+ * --colors-surface-active: #dfe1e4;
+ * --colors-surface-pressed: #ccced1;
+ * --colors-surface-disabled: #f6f8fb;
+ * --colors-surface-action-default: #b3d7ff;
+ * --colors-surface-action-subdued: #ddeaf7;
+ * --colors-surface-action-hovered: #a4c8f0;
+ * --colors-surface-action-active: #93b7df;
+ * --colors-surface-action-disabled: #e7f4ff;
+ * --colors-surface-warning-default: #fff2c2;
+ * --colors-surface-warning-subdued: #fff7da;
+ * --colors-surface-warning-hovered: #feeca5;
+ * --colors-surface-warning-active: #ffe78f;
+ * --colors-surface-success-default: #bfe8d3;
+ * --colors-surface-success-subdued: #d0eedb;
+ * --colors-surface-success-hovered: #b3dfc2;
+ * --colors-surface-success-active: #9cd8b1;
+ * --colors-surface-critical-default: #f1c8c8;
+ * --colors-surface-critical-subdued: #fddfdf;
+ * --colors-surface-critical-hovered: #ebb3b3;
+ * --colors-surface-critical-active: #e49b9b;
+ * --colors-surface-critical-disabled: #fde7ea;
+ * --colors-action-secondary-default: #e5e7ea;
+ * --colors-action-secondary-subdued: #f0f2f5; new
+ * --colors-action-secondary-hovered: #d9dce2;  
+ * --colors-action-secondary-active: #c8cbd1;
+ * --colors-action-secondary-pressed: #a8abb1;
+ * --colors-action-secondary-disabled: #f3f5f8;
+ * --colors-border-default: #dcdcdc;
+ * --colors-border-subdued: #e7e7e7;
+ * --colors-border-hovered: #d1d1d1;
+ * --colors-border-active: #c5c5c5;
+ * --colors-border-disabled: #e3e3e3;
+ */
+
 :root {
   --spacing-1xl: 117px;
   --spacing-xxl: 56px;
@@ -14,19 +58,21 @@
     0px 2px 10px rgba(0, 0, 0, 0.1);
   --box-shadow-card: 0px 2px 1px rgba(0, 0, 0, 0.05),
     0px 0px 1px rgba(0, 0, 0, 0.25);
-  --font-family-sans: 'Circular Std';
+  --font-family-sans: 'Circular Std Book';
   --border-radius-md: 20px;
   --border-radius-sm: 10px;
   --border-radius-xs: 8px;
   --font-weight-bold: 700;
   --font-weight-medium: 500;
   --font-weight-book: 450;
-  --line-height-xl: 44px;
+  --line-height-xxl: 56px;
+  --line-height-xl: 36px;
   --line-height-lg: 32px;
   --line-height-md: 28px;
   --line-height-sm: 24px;
   --line-height-xs: 20px;
   --line-height-xxs: 16px;
+  --font-size-xxl: 50px;
   --font-size-xl: 40px;
   --font-size-lg: 32px;
   --font-size-md: 28px;
@@ -69,29 +115,29 @@
   --colors-surface-neutral-hovered: #cecece;
   --colors-surface-neutral-subdued: #e8e8e8;
   --colors-surface-neutral-default: #dddddd;
-  --colors-surface-critical-disabled: #fde7eaff;
-  --colors-surface-critical-active: #e49b9bff;
-  --colors-surface-critical-hovered: #ebb3b3ff;
-  --colors-surface-critical-subdued: #fff0ec;
-  --colors-surface-critical-default: #ffebe6;
-  --colors-surface-success-active: #ade2bfff;
-  --colors-surface-success-hovered: #c5ead1ff;
-  --colors-surface-success-subdued: #d0eedbff;
-  --colors-surface-success-default: #e3fcef;
-  --colors-surface-warning-active: #ffd393ff;
-  --colors-surface-warning-hovered: #ffe9c9ff;
-  --colors-surface-warning-subdued: #ffeed4ff;
-  --colors-surface-warning-default: #fffae6;
-  --colors-surface-action-disabled: #fafcffff;
-  --colors-surface-action-active: #d1deecff;
-  --colors-surface-action-hovered: #f2f8ffff;
-  --colors-surface-action-subdued: #e5f2ffff;
-  --colors-surface-action-default: #b3d7ffff;
-  --colors-surface-disabled: #f4f4f4;
-  --colors-surface-pressed: #d1d1d1;
-  --colors-surface-active: #dedede;
-  --colors-surface-hovered: #ececec;
-  --colors-surface-subdued: #f2f2f2;
+  --colors-surface-critical-disabled: #fde7ea;
+  --colors-surface-critical-active: #e49b9b;
+  --colors-surface-critical-hovered: #ebb3b3;
+  --colors-surface-critical-subdued: #fddfdf;
+  --colors-surface-critical-default: #f1c8c8;
+  --colors-surface-success-active: #9cd8b1;
+  --colors-surface-success-hovered: #b3dfc2;
+  --colors-surface-success-subdued: #d0eedb;
+  --colors-surface-success-default: #bfe8d3;
+  --colors-surface-warning-active: #ffe78f;
+  --colors-surface-warning-hovered: #feeca5;
+  --colors-surface-warning-subdued: #fff7da;
+  --colors-surface-warning-default: #fff2c2;
+  --colors-surface-action-disabled: #e7f4ff;
+  --colors-surface-action-active: #93b7df;
+  --colors-surface-action-hovered: #a4c8f0;
+  --colors-surface-action-subdued: #ddeaf7;
+  --colors-surface-action-default: #b3d7ff;
+  --colors-surface-disabled: #f6f8fb;
+  --colors-surface-pressed: #ccced1;
+  --colors-surface-active: #dfe1e4;
+  --colors-surface-hovered: #ebedf0;
+  --colors-surface-subdued: #f3f4f6;
   --colors-surface-default: #ffffffff;
   --colors-focused-default: #3eadfeff;
   --colors-icon-on: #ffffffff;
@@ -117,11 +163,11 @@
   --colors-border-critical-default: #f56270ff;
   --colors-border-success-subdued: #43da76ff;
   --colors-border-success-default: #16ab49;
-  --colors-border-disabled: #dcdcdc;
-  --colors-border-active: #8f8f8f;
-  --colors-border-hovered: #a1a1a1;
-  --colors-border-subdued: #c9c9c9;
-  --colors-border-default: #b5b5b5;
+  --colors-border-disabled: #e3e3e3;
+  --colors-border-active: #c5c5c5;
+  --colors-border-hovered: #d1d1d1;
+  --colors-border-subdued: #e7e7e7;
+  --colors-border-default: #dcdcdc;
   --colors-action-opacity-disabled: rgba(109, 113, 117, 0.2);
   --colors-action-opacity-active: rgba(109, 113, 117, 0.6);
   --colors-action-opacity-hovered: rgba(109, 113, 117, 0.4);
@@ -131,11 +177,12 @@
   --colors-action-critical-active: #9d2020ff;
   --colors-action-critical-hovered: #c12929ff;
   --colors-action-critical-default: #d82f2fff;
-  --colors-action-secondary-disabled: #e7e7e7;
-  --colors-action-secondary-pressed: #6d7175ff;
-  --colors-action-secondary-active: #cdcdcd;
-  --colors-action-secondary-hovered: #e0e1e2;
-  --colors-action-secondary-default: #f1f2f3;
+  --colors-action-secondary-disabled: #f3f5f8;
+  --colors-action-secondary-pressed: #a8abb1;
+  --colors-action-secondary-active: #c8cbd1;
+  --colors-action-secondary-hovered: #d9dce2;
+  --colors-action-secondary-subdued: #f0f2f5;
+  --colors-action-secondary-default: #e5e7ea;
   --colors-action-primary-disabled: #d6dbe0ff;
   --colors-action-primary-pressed: #072a52ff;
   --colors-action-primary-active: #0c4d95ff;
@@ -145,7 +192,7 @@
   --colors-letter-success: #12953eff;
   --colors-letter-critical: #bd2a2aff;
   --colors-letter-warning: #ce881eff;
-  --colors-letter-disabled: #c2c2c2ff;
-  --colors-letter-subdued: #8a8a8aff;
-  --colors-letter-default: #42484eff;
+  --colors-letter-disabled: #c3c5ca;
+  --colors-letter-subdued: #797c81;
+  --colors-letter-default: #4a4f54;
 }

package/package.json

@@ -2,7 +2,7 @@
   "name": "@aveonline/ui-react",
   "description": "Home base for Aveonline design system - ecosystem react",
   "private": false,
-  "version": "1.6.1",
+  "version": "1.6.2",
   "types": "./dist/index.d.ts",
   "files": [
     "dist"
@@ -36,13 +36,13 @@
   "license": "MIT",
   "scripts": {
     "dev": "start-storybook -p 6006 --no-manager-cache",
-    "build": "vite build && npm run build:tailwind && npm run cp:tailwind",
+    "build": "vite build && npm run build:tailwind && npm run cp:tailwind-config && npm run cp:tokens",
     "build:storybook": "build-storybook",
     "lint": "eslint --ignore-path .gitignore \"./src/**/*.+(tsx,ts)\" --fix",
     "build:tailwind": "npx tailwindcss -o ./dist/tailwind.css --minify",
     "clean": "rm -rf dist",
-    "cp:tailwind": "cp tailwind.config.js dist/",
-    "cp:postcss": "cp postcss.config.js dist/",
+    "cp:tailwind-config": "cp tailwind.config.js dist/",
+    "cp:tokens": "cp ./src/design-tokens/styles/tokens.css dist/",
     "test": "vitest",
     "coverage": "vitest run --coverage",
     "test:ui": "vitest --ui",