@aveonline/ui-react 0.0.2-alpha.0 → 1.0.0

package/dist/tokens.css

@@ -1,47 +1,51 @@
 /**
  * Do not edit directly
- * Generated on Fri, 28 Oct 2022 14:53:49 GMT
+ * Generated on Tue, 22 Nov 2022 13:34:50 GMT
  */
 
 :root {
-  --box-shadow-pressed: 0px 6px 8px 0px #3434341A;
-  --box-shadow-depressed: 0px 1px 12px rgba(0, 0, 0, 0.08), 0px 2px 5px rgba(63, 63, 68, 0.15);
-  --box-shadow-base: 0px 1px 3px rgba(63, 63, 68, 0.15),  0px 0px 0px 1px rgba(63, 63, 68, 0.05);
-  --box-shadow-popup: 0px 0px 1px rgba(0, 0, 0, 0.2), 0px 3px 50px rgba(0, 0, 0, 0.2);
-  --box-shadow-popover: 0px 0px 2px rgba(0, 0, 0, 0.2), 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);
-  --screens-desktop: 1280px;
-  --screens-laptop: 1024px;
-  --screens-tablet: 640px;
-  --font-family-sans: 'Circular Std';
-  --border-radius-lg: 20px;
-  --border-radius-md: 10px;
-  --border-radius-sm: 8px;
-  --border-radius-xs: 5px;
+  --spacing-1xl: 117px;
+  --spacing-xxl: 56px;
   --spacing-xl: 32px;
-  --spacing-xxl: 40px;
   --spacing-lg: 24px;
-  --spacing-md: 16px;
-  --spacing-sm: 8px;
-  --spacing-xs: 0px;
+  --spacing-md: 18px;
+  --spacing-sm: 16px;
+  --spacing-xs: 8px;
+  --spacing-xxs: 0px;
+  --box-shadow-pressed: 0px 6px 8px 0px #3434341a;
+  --box-shadow-popup: 0px 0px 1px rgba(0, 0, 0, 0.2),
+    0px 3px 50px rgba(0, 0, 0, 0.2);
+  --box-shadow-popover: 0px 0px 2px rgba(0, 0, 0, 0.2),
+    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';
+  --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-xxl: 44px;
-  --line-height-xl: 36px;
-  --line-height-lg: 32;
+  --line-height-xl: 44px;
+  --line-height-lg: 32px;
   --line-height-md: 28px;
   --line-height-sm: 24px;
   --line-height-xs: 20px;
   --line-height-xxs: 16px;
-  --font-size-1xl: 40px;
-  --font-size-xxl: 32px;
-  --font-size-xl: 24px;
-  --font-size-lg: 20px;
-  --font-size-md: 18px;
-  --font-size-sm: 16px;
-  --font-size-xs: 14px;
-  --font-size-xxs: 12px;
+  --font-size-xl: 40px;
+  --font-size-lg: 32px;
+  --font-size-md: 28px;
+  --font-size-sm: 24px;
+  --font-size-xs: 16px;
+  --font-size-xxs: 14px;
+  --colors-special-four-back: rgba(156, 255, 147, 0.25);
+  --colors-special-four: #72d69a;
+  --colors-special-three-back: rgba(179, 215, 255, 0.25);
+  --colors-special-three: #3eadfe;
+  --colors-special-two-back: rgba(240, 166, 98, 0.25);
+  --colors-special-two: #f0a662;
+  --colors-special-one-back: rgba(182, 147, 255, 0.25);
+  --colors-special-one: #bc72d6;
   --colors-base-success: #16ab49ff;
   --colors-base-warning: #ffa826ff;
   --colors-base-critical: #f56270ff;
@@ -60,36 +64,37 @@
   --colors-radial-30: #f28c1bff;
   --colors-radial-20: #e15b24ff;
   --colors-radial-10: #b21a1bff;
+  --colors-background-modal: rgba(66, 72, 78, 0.25);
   --colors-background-selected: #edeeefff;
-  --colors-background-pressed: #edeeefff;
+  --colors-background-active: #edeeefff;
   --colors-background-hovered: #f1f2f3ff;
   --colors-background-default: #f6f6f7ff;
-  --colors-surface-neutral-disabled: #edededff;
-  --colors-surface-neutral-pressed: #d6d6d6ff;
-  --colors-surface-neutral-hovered: #e2e2e2ff;
-  --colors-surface-neutral-subdued: #e8e8e8ff;
-  --colors-surface-neutral-default: #c4c4c4ff;
+  --colors-surface-neutral-disabled: #f6f6f6;
+  --colors-surface-neutral-active: #bdbdbd;
+  --colors-surface-neutral-hovered: #cecece;
+  --colors-surface-neutral-subdued: #e8e8e8;
+  --colors-surface-neutral-default: #dddddd;
   --colors-surface-critical-disabled: #fde7eaff;
-  --colors-surface-critical-pressed: #e49b9bff;
+  --colors-surface-critical-active: #e49b9bff;
   --colors-surface-critical-hovered: #ebb3b3ff;
-  --colors-surface-critical-subdued: #eedbdbff;
-  --colors-surface-critical-default: #efc0c0ff;
-  --colors-surface-success-pressed: #ade2bfff;
+  --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: #8bd5a4ff;
-  --colors-surface-warning-pressed: #ffd393ff;
+  --colors-surface-success-default: #e3fcef;
+  --colors-surface-warning-active: #ffd393ff;
   --colors-surface-warning-hovered: #ffe9c9ff;
   --colors-surface-warning-subdued: #ffeed4ff;
-  --colors-surface-warning-default: #ffe1b3ff;
+  --colors-surface-warning-default: #fffae6;
   --colors-surface-action-disabled: #fafcffff;
-  --colors-surface-action-pressed: #d1deecff;
+  --colors-surface-action-active: #d1deecff;
   --colors-surface-action-hovered: #f2f8ffff;
   --colors-surface-action-subdued: #e5f2ffff;
   --colors-surface-action-default: #b3d7ffff;
-  --colors-surface-disabled: #fafbfbff;
-  --colors-surface-depressed: #edeeefff;
-  --colors-surface-pressed: #f1f2f3ff;
+  --colors-surface-disabled: #f6f6f6;
+  --colors-surface-pressed: #edeeefff;
+  --colors-surface-active: #f1f2f3ff;
   --colors-surface-hovered: #f6f6f7ff;
   --colors-surface-subdued: #fafbfbff;
   --colors-surface-default: #ffffffff;
@@ -99,42 +104,46 @@
   --colors-icon-warning: #c18f00ff;
   --colors-icon-critical: #bd2a2aff;
   --colors-icon-disabled: #d6d6d6ff;
-  --colors-icon-pressed: #636b74ff;
+  --colors-icon-active: #636b74ff;
   --colors-icon-hovered: #42484eff;
   --colors-icon-subdued: #a1a1a1ff;
   --colors-icon-default: #61666bff;
   --colors-interactive-critical-disabled: #ce9ea2ff;
-  --colors-interactive-critical-depressed: #6c0f00ff;
+  --colors-interactive-critical-active: #6c0f00ff;
   --colors-interactive-critical-hovered: #c12929ff;
   --colors-interactive-critical-default: #d82f2fff;
   --colors-interactive-disabled: #d6dbe0ff;
-  --colors-interactive-depressed: #004289ff;
+  --colors-interactive-active: #004289ff;
   --colors-interactive-hovered: #0068daff;
-  --colors-interactive-default: #007affff;
-  --colors-border-shadow-subdued: #EBEBEB;
+  --colors-interactive-default: #007aff;
+  --colors-border-shadow-subdued: #ebebeb;
   --colors-border-critical-disabled: #ffc9c6ff;
   --colors-border-critical-subdued: #e05563ff;
   --colors-border-critical-default: #f56270ff;
   --colors-border-success-subdued: #43da76ff;
-  --colors-border-success-default: #16ab49ff;
-  --colors-border-disabled: #f0f0f0ff;
-  --colors-border-depressed: #8c8c8cff;
-  --colors-border-hovered: #c9c9c9ff;
-  --colors-border-subdued: #e0e0e0ff;
-  --colors-border-default: #c2c2c2ff;
+  --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-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);
+  --colors-action-opacity-default: rgba(109, 113, 117, 0.3);
   --colors-action-critical-disabled: #e4dfe0ff;
-  --colors-action-critical-depressed: #6c0f00ff;
-  --colors-action-critical-pressed: #9d2020ff;
+  --colors-action-critical-pressed: #6c0f00ff;
+  --colors-action-critical-active: #9d2020ff;
   --colors-action-critical-hovered: #c12929ff;
   --colors-action-critical-default: #d82f2fff;
-  --colors-action-secondary-disabled: #ffffffff;
-  --colors-action-secondary-depressed: #6d7175ff;
-  --colors-action-secondary-pressed: #eaeaeaff;
-  --colors-action-secondary-hovered: #f3f3f3ff;
-  --colors-action-secondary-default: #ffffffff;
+  --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-primary-disabled: #d6dbe0ff;
-  --colors-action-primary-depressed: #072a52ff;
-  --colors-action-primary-pressed: #0c4d95ff;
+  --colors-action-primary-pressed: #072a52ff;
+  --colors-action-primary-active: #0c4d95ff;
   --colors-action-primary-hovered: #126dd0ff;
   --colors-action-primary-default: #007affff;
   --colors-letter-on: #ffffffff;

package/dist/types/Template.d.ts

@@ -0,0 +1,5 @@
+import { IChildren, IClassName } from './Tokens';
+interface ITemplate extends IChildren, IClassName {
+    [rest: string]: any;
+}
+export type { ITemplate };

package/dist/types/Tokens.d.ts

@@ -0,0 +1,26 @@
+import type { ReactNode } from 'react';
+interface IWeight {
+    weight?: 'bold' | 'book' | 'medium';
+}
+interface ILineHeightHeading {
+    lineHeight?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+}
+interface ILineHeightText {
+    lineHeight?: Extract<ILineHeightHeading, 'xxs' | 'xs'>;
+}
+interface IColorText {
+    color?: 'on' | 'success' | 'critical' | 'warning' | 'disabled' | 'subdued' | 'default' | 'primary';
+}
+interface IFontSizeHeading {
+    size?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+}
+interface IFontSizeText {
+    size?: Extract<IFontSizeHeading, 'xxs' | 'xs'>;
+}
+interface IClassName {
+    className?: string;
+}
+interface IChildren {
+    children?: ReactNode;
+}
+export type { IWeight, ILineHeightHeading, ILineHeightText, IColorText, IFontSizeHeading, IFontSizeText, IClassName, IChildren };

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Tokens';
+export * from './Template';