@innovaccer/design-system 2.19.0 → 2.20.0

package/css/gulpfile.js

@@ -1,7 +1,7 @@
 const postcss = require('gulp-postcss');
 const gulp = require('gulp');
-const autoprefixer = require('autoprefixer')
-const sourcemaps = require('gulp-sourcemaps')
+const autoprefixer = require('autoprefixer');
+const sourcemaps = require('gulp-sourcemaps');
 const concat = require('gulp-concat');
 const postcssColorMod = require('postcss-color-mod-function');
 const cleaner = require('gulp-clean');
@@ -18,10 +18,8 @@ const sources = [
   './src/utils/*.css',
 ];
 
-function clean () {
-  return gulp
-    .src('./dist/*', { allowEmpty: true })
-    .pipe(cleaner());
+function clean() {
+  return gulp.src('./dist/*', { allowEmpty: true }).pipe(cleaner());
 }
 
 function css() {
@@ -36,9 +34,7 @@ function css() {
 }
 
 function font() {
-  return gulp
-    .src(materialFont)
-    .pipe(gulp.dest('./dist'));
+  return gulp.src([materialFont]).pipe(gulp.dest('./dist'));
 }
 
 exports.build = gulp.series(clean, gulp.parallel(css, font));
@@ -46,5 +42,5 @@ exports.build = gulp.series(clean, gulp.parallel(css, font));
 exports.clean = clean;
 
 gulp.task('watch', () => {
-  gulp.watch(sources, gulp.series(css))
-});
+  gulp.watch(sources, gulp.series(css));
+});

package/css/material-design-icons/iconfont/material-icons.css

@@ -1,37 +1,13 @@
-/* fallback */
 @font-face {
-  font-family: 'Material Icons';
-  font-style: normal;
-  font-weight: 400;
-  src: url(MaterialIcons-Regular.ttf);
-}
-/* fallback */
-@font-face {
-  font-family: 'Material Icons Outlined';
-  font-style: normal;
-  font-weight: 400;
-  src: url(MaterialIconsOutlined-Regular.otf);
-}
-/* fallback */
-@font-face {
-  font-family: 'Material Icons Round';
-  font-style: normal;
-  font-weight: 400;
-  src: url(MaterialIconsRound-Regular.otf);
-}
-/* fallback */
-@font-face {
-  font-family: 'Material Icons Sharp';
+  font-family: 'Material Symbols Outlined';
   font-style: normal;
-  font-weight: 400;
-  src: url(MaterialIconsSharp-Regular.otf);
+  src: url(MaterialSymbolsOutlined.ttf);
 }
-/* fallback */
+
 @font-face {
-  font-family: 'Material Icons Two Tone';
+  font-family: 'Material Symbols Rounded';
   font-style: normal;
-  font-weight: 400;
-  src: url(MaterialIconsTwoTone-Regular.otf);
+  src: url(MaterialSymbolsRounded.ttf);
 }
 
 .material-icons {
@@ -51,65 +27,11 @@
 }
 
 .material-icons-outlined {
-  font-family: 'Material Icons Outlined';
-  font-weight: normal;
-  font-style: normal;
-  font-size: 16px;    /* preferred icon size */
-  line-height: 1;
-  letter-spacing: normal;
-  text-transform: none;
-  display: inline-block;
-  white-space: nowrap;
-  word-wrap: normal;
-  direction: ltr;
-  -webkit-font-feature-settings: 'liga';
-  -webkit-font-smoothing: antialiased;
-}
-
-.material-icons-round {
-  font-family: 'Material Icons Round';
-  font-weight: normal;
-  font-style: normal;
-  font-size: 16px;    /* preferred icon size */
-  line-height: 1;
-  letter-spacing: normal;
-  text-transform: none;
-  display: inline-block;
-  white-space: nowrap;
-  word-wrap: normal;
-  direction: ltr;
-  -webkit-font-feature-settings: 'liga';
-  -webkit-font-smoothing: antialiased;
+  font-family: 'Material Symbols Outlined';
+  font-size: 24px; /* Preferred icon size */
 }
 
-.material-icons-sharp {
-  font-family: 'Material Icons Sharp';
-  font-weight: normal;
-  font-style: normal;
-  font-size: 16px;    /* preferred icon size */
-  line-height: 1;
-  letter-spacing: normal;
-  text-transform: none;
-  display: inline-block;
-  white-space: nowrap;
-  word-wrap: normal;
-  direction: ltr;
-  -webkit-font-feature-settings: 'liga';
-  -webkit-font-smoothing: antialiased;
+.material-icons-rounded {
+  font-family: 'Material Symbols Rounded';
+  font-size: 24px; /* Preferred icon size */
 }
-
-.material-icons-two-tone {
-  font-family: 'Material Icons Two Tone';
-  font-weight: normal;
-  font-style: normal;
-  font-size: 16px;    /* preferred icon size */
-  line-height: 1;
-  letter-spacing: normal;
-  text-transform: none;
-  display: inline-block;
-  white-space: nowrap;
-  word-wrap: normal;
-  direction: ltr;
-  -webkit-font-feature-settings: 'liga';
-  -webkit-font-smoothing: antialiased;
-}

package/css/src/components/actionCard.css

@@ -0,0 +1,40 @@
+.ActionCard {
+  cursor: pointer;
+  border-radius: var(--spacing-m);
+  width: 100%;
+  border: var(--spacing-xs) solid var(--secondary-dark);
+}
+
+.ActionCard:hover {
+  box-shadow: var(--shadow-m);
+  transition: var(--duration--fast-01) var(--standard-productive-curve);
+}
+
+.ActionCard:focus,
+.ActionCard:focus-visible {
+  outline: none;
+  border: var(--spacing-xs) solid var(--secondary-light);
+  box-shadow: var(--shadow-spread) var(--secondary-shadow);
+}
+
+.ActionCard:active {
+  box-shadow: var(--shadow-l);
+  transition: var(--duration--fast-01) var(--standard-productive-curve);
+}
+
+.ActionCard--disabled {
+  pointer-events: none;
+  position: relative;
+  border: var(--spacing-xs) solid var(--secondary-lighter);
+}
+
+.ActionCard-overlay--disabled {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 2;
+  opacity: 50%;
+  background: var(--secondary-light);
+}

package/css/src/components/calendar.css

@@ -142,6 +142,11 @@
   border-radius: 0 var(--spacing-m) var(--spacing-m) 0;
 }
 
+.Calendar-valueWrapper--hoverDate {
+  background: linear-gradient(90deg, var(--primary-lightest) 10%, white 50%);
+  border-radius: 0 var(--spacing-m) var(--spacing-m) 0;
+}
+
 .Calendar-valueWrapper--endError {
   background: linear-gradient(90deg, var(--alert-lightest) 50%, white 50%);
 }
@@ -169,6 +174,10 @@
   background: var(--secondary);
 }
 
+.Calendar-value:active .Calendar-value--currDate {
+  color: var(--primary-dark);
+}
+
 .Calendar-value--start:hover,
 .Calendar-value--end:hover {
   background: var(--primary-lightest);
@@ -201,6 +210,10 @@
   background: var(--primary-lighter);
 }
 
+.Calendar-value--currDate:active {
+  color: var(--primary-dark);
+}
+
 .Calendar-value--active {
   background: var(--primary);
   font-weight: var(--font-weight-bold);
@@ -277,3 +290,23 @@
 .Calendar-eventsIndicator--active {
   background-color: var(--white);
 }
+
+.Calendar-valueWrapper--inStartRange {
+  background: linear-gradient(90deg, white 50%, var(--primary-lightest) 50%);
+}
+
+.Calendar-valueWrapper--inEndRange {
+  background: linear-gradient(90deg, var(--primary-lightest) 50%, white 50%);
+}
+
+.Calendar-valueWrapper--inEdgeRange .Calendar-inRangeValue {
+  background: var(--primary-lightest);
+}
+
+.Calendar-valueWrapper--inEdgeRange .Calendar-inRangeValue:hover {
+  background: var(--primary-lighter);
+}
+
+.Calendar-valueWrapper--inEdgeRange .Calendar-inRangeValue:active {
+  background: var(--primary-light);
+}

package/css/src/components/chipInput.css

@@ -34,6 +34,11 @@
   padding-right: var(--spacing);
 }
 
+.ChipInput--error,
+.ChipInput--error:focus-within {
+  box-shadow: inset 0 0 0 var(--spacing-xs) var(--alert);
+}
+
 .ChipInput-wrapper {
   display: flex;
   flex: 100%;
@@ -46,6 +51,10 @@
   box-shadow: var(--shadow-spread) var(--primary-shadow);
 }
 
+.ChipInput-border--error:focus-within {
+  box-shadow: var(--shadow-spread) var(--alert-shadow);
+}
+
 .ChipInput-input {
   border: none;
   outline: none;

package/dist/.lib/tsconfig.type.tsbuildinfo

@@ -317,8 +317,8 @@
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/button/Button.tsx": {
-        "version": "302fa227eb055b331514ceea1a003da166d1bc6659950b623b73cf1e85f7cc67",
-        "signature": "e2253dae9047bea737c1083d4f13c5df26dd260b3e658412891754e3ed200c53",
+        "version": "cbd3a7de427feb4d69686a50b4835f7b048079eba02176e8795ae86bb1e76155",
+        "signature": "532969f075bc72a567f0cb4bda2d3868ae099e40d506d7737bc2dc6ba99ff772",
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/button/index.tsx": {
@@ -337,12 +337,12 @@
         "affectsGlobalScope": false
       },
       "../../core/components/organisms/calendar/utility.ts": {
-        "version": "a7c75dd78dc87927b0cdcee7cb98779d4dae68718fb918c359163ecaf90f0fc6",
-        "signature": "66548d1940273e8b7118d339d92651d75e367037e871f7fbc81cd0282b52d9b0",
+        "version": "758a7aa8211b63c084efa394c68eae7965c568c4a19e7964c35ef3d953d19c29",
+        "signature": "42d2e48374c5c68300d54e14339e5cd5ba8af61edbe9a8da9d64e5ca826ec225",
         "affectsGlobalScope": false
       },
       "../../core/components/organisms/calendar/Calendar.tsx": {
-        "version": "c40dcaa5e32d6eec5f2efa74c396e8cbbb25ca42ac13149d479a94043658fd59",
+        "version": "165e8ac85f507625b0876165cd074d67f4e5eec9b0c02be6fd081b17db8040d9",
         "signature": "bd837ccd1ca55becef710a181dd2030665fc6a9d889f420e743d9bca9358e48e",
         "affectsGlobalScope": false
       },
@@ -421,9 +421,14 @@
         "signature": "6427aee725c0b2c594f724f86482fe933cc3711d7ecf0bc86bd742cbf768877b",
         "affectsGlobalScope": false
       },
+      "../../core/components/atoms/icon/utils.tsx": {
+        "version": "a5829212bb9353c1c67b4cd3e5d333248b10c777d64e4514ae87778829e4d033",
+        "signature": "68ebf8993b600a8745eb160a6af8b5a9a1576fffd6bef2f7a3d5534babb47a52",
+        "affectsGlobalScope": false
+      },
       "../../core/components/atoms/icon/Icon.tsx": {
-        "version": "b338fa3c6308db54a6aa6fef8badfae54faf14abd23476c0a2e8943736124fba",
-        "signature": "6e38c578d63e87920c2be85e89210227f76b482f68501f520f74ec154d8683a6",
+        "version": "1d9a92a76069887d29a386ee202872d7ec9a02d7ffd31888a5bd7d852e60e587",
+        "signature": "4ec0e5666dff4fe9b96ebefe3cfd09d56ffeea07b633ef501071ec7e558a043b",
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/icon/index.tsx": {
@@ -647,8 +652,8 @@
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/input/actionButton/ActionButton.tsx": {
-        "version": "ed37fcb75de96cf68a64d7a811d1ef58620d5e789f06c3bf76d64da34e75b964",
-        "signature": "c84dea7847d5f62d0068f1ad3ceab496392a393168a3cd7d47db59209c54be8f",
+        "version": "6f30e85be6d0d6971bf313d388941fd0c07548e9eba326b2634e3e05cf370a5d",
+        "signature": "32aaf80dc9d52ecab613c6b87c0acb82de9da2c0793086a207055820f938bba2",
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/input/actionButton/index.tsx": {
@@ -1092,8 +1097,8 @@
         "affectsGlobalScope": false
       },
       "../../core/components/molecules/chipInput/ChipInput.tsx": {
-        "version": "80cdf7bb7037dfb381134b93db3f9f61a0b6cbfd1cf2878f641ef967bb2f4410",
-        "signature": "7e03f5815331aceb4dcdde07a2a73a891636dae43f459ee8d91a4ecd78d6cb09",
+        "version": "fa096c1a3dcb30064b5d48f0aae807884a80b2afde3857e7cc106f7fdade2d7e",
+        "signature": "b1fbc619ea7cbc8805de67df594032d7f1747b1dd8b0d6abb611325c205ec0d5",
         "affectsGlobalScope": false
       },
       "../../core/components/molecules/chipInput/index.tsx": {
@@ -1173,7 +1178,7 @@
       },
       "../../core/components/atoms/popperWrapper/PopperWrapper.tsx": {
         "version": "4bdc8aa961b2247499d2937c5d836e5680c2bc6c531bb77feae0a14f4a08fcc3",
-        "signature": "9dc2a4c9ca629318fe53d75cc372617d2a050c5df43c051ac95ed7e755431d86",
+        "signature": "786615f97cc26af74b87459c50cf92427fe10f4a007cbfab1bc0bb472acf4ccb",
         "affectsGlobalScope": false
       },
       "../../core/components/atoms/popperWrapper/index.tsx": {
@@ -1541,9 +1546,19 @@
         "signature": "838cceafb096677703d2d3aeca19c33295def833e0798273c9123d44fa50d115",
         "affectsGlobalScope": false
       },
+      "../../core/components/atoms/actionCard/ActionCard.tsx": {
+        "version": "c6faa704d990236e814822af97051664ad91e5aed9c59ac8dec0627042aa30b9",
+        "signature": "9a25f22c0c0c76eaaa779f1956315fb660a9642462f0fe6983c34de5b57afc8c",
+        "affectsGlobalScope": false
+      },
+      "../../core/components/atoms/actionCard/index.tsx": {
+        "version": "7c4b2e4cd033b90e478d985166dddf129a67d868a2716624b48c6384ee5acc99",
+        "signature": "496c1995d6c2836e353783730b0b6fda96d81ddc669254265414e40339b0d4ce",
+        "affectsGlobalScope": false
+      },
       "../../core/index.type.tsx": {
-        "version": "bb76a29dea832aef6e896660e9915d70288d0431f9f628c634c9f6a12c194df8",
-        "signature": "652f6595f4d4c393a2269e26fec765ee9254eeb99608d7c85142d208c8330bf0",
+        "version": "19ebf2ffaeddba2d0a0549f9150ee510a1616d6f3d0c368b13e87eeef6e1d439",
+        "signature": "075741cabe17b922d69f3d27d11b9220ae959096170ea644cabb89e9b14129ea",
         "affectsGlobalScope": false
       },
       "../../core/components/organisms/timePicker/TimePickerWithInput.tsx": {
@@ -1572,8 +1587,8 @@
         "affectsGlobalScope": false
       },
       "../../core/index.tsx": {
-        "version": "ccd6df2ffcc9afc5af17d1b8d017f4a4f5783ef15b01f39af7f077999e9a58af",
-        "signature": "04c4c4de70794da2c36534856e0931d93d1691e4538527dfc47ddab11e288a32",
+        "version": "51b1ef49d53c08397a476d2666043148168ff7c3ea04ba0f79916d29891cb9c7",
+        "signature": "519243eda020548d41bbe6b549d5a3f8c66e5c09209c211c6faf683042261588",
         "affectsGlobalScope": false
       },
       "../../core/components/molecules/overlayFooter/OverlayFooter.tsx": {
@@ -1587,8 +1602,8 @@
         "affectsGlobalScope": false
       },
       "../../core/common.type.tsx": {
-        "version": "19a1cad1e4b5585b5414e1cf95d819d4faf715017c6404e7b996322adf9e7002",
-        "signature": "209f276faa4987f4e04260886f92238156e1720a211c4c25d59c56d56f3ba42b",
+        "version": "047c28cbf1b4263accf142253212266a24cf2ac5174a8c4bb41245b0a425507a",
+        "signature": "5692e64aa77f460848d5f832ec24321ef7d890ebaf825c1a905577c8f19488c4",
         "affectsGlobalScope": false
       },
       "../../core/global.d.ts": {
@@ -2747,7 +2762,7 @@
         "affectsGlobalScope": false
       },
       "../../core/utils/docPage/index.tsx": {
-        "version": "3cfc5385a71bc3e2988775f420ca1a3d6479d8f8731c419ba5cf276dba6ec307",
+        "version": "ef1324a911b4d142c8ca5d94c5c9a6e4e28b55eaef4d1cb6b188c288fa39327f",
         "signature": "d793df693e1f566f2a7fd586a5ba76f93009c359e9795372d49bb1dafa1d2c00",
         "affectsGlobalScope": false
       },
@@ -4591,6 +4606,15 @@
           "*",
           "*",
           "*",
+          "*",
+          "*",
+          "*",
+          "*",
+          "*",
+          "*",
+          "*",
+          "*",
+          "*",
           "*"
         ]
       },
@@ -4653,6 +4677,16 @@
         "../../node_modules/@types/node/util.d.ts",
         "../../node_modules/@types/react/index.d.ts"
       ],
+      "../../core/components/atoms/actionCard/ActionCard.tsx": [
+        "../../core/utils/types.tsx",
+        "../../node_modules/@types/node/util.d.ts",
+        "../../node_modules/@types/react/index.d.ts",
+        "../../node_modules/classnames/index.d.ts"
+      ],
+      "../../core/components/atoms/actionCard/index.tsx": [
+        "../../core/components/atoms/actionCard/ActionCard.tsx",
+        "../../node_modules/@types/node/util.d.ts"
+      ],
       "../../core/components/atoms/avatar/Avatar.tsx": [
         "../../core/common.type.tsx",
         "../../core/index.tsx",
@@ -4734,6 +4768,7 @@
         "../../node_modules/@types/node/util.d.ts"
       ],
       "../../core/components/atoms/button/Button.tsx": [
+        "../../core/common.type.tsx",
         "../../core/index.tsx",
         "../../core/utils/types.tsx",
         "../../node_modules/@types/node/util.d.ts",
@@ -5002,6 +5037,7 @@
       ],
       "../../core/components/atoms/icon/Icon.tsx": [
         "../../core/accessibility/utils/index.ts",
+        "../../core/components/atoms/icon/utils.tsx",
         "../../core/utils/types.tsx",
         "../../node_modules/@types/node/util.d.ts",
         "../../node_modules/@types/react/index.d.ts",
@@ -5011,6 +5047,10 @@
         "../../core/components/atoms/icon/Icon.tsx",
         "../../node_modules/@types/node/util.d.ts"
       ],
+      "../../core/components/atoms/icon/utils.tsx": [
+        "../../core/components/atoms/icon/Icon.tsx",
+        "../../node_modules/@types/node/util.d.ts"
+      ],
       "../../core/components/atoms/input/Input.tsx": [
         "../../core/common.type.tsx",
         "../../core/components/atoms/input/actionButton/index.tsx",
@@ -5022,7 +5062,8 @@
         "../../node_modules/classnames/index.d.ts"
       ],
       "../../core/components/atoms/input/actionButton/ActionButton.tsx": [
-        "../../core/accessibility/utils/index.ts",
+        "../../core/common.type.tsx",
+        "../../core/index.tsx",
         "../../core/utils/types.tsx",
         "../../node_modules/@types/node/util.d.ts",
         "../../node_modules/@types/react/index.d.ts",
@@ -6243,6 +6284,7 @@
         "../../node_modules/@types/node/util.d.ts"
       ],
       "../../core/index.tsx": [
+        "../../core/components/atoms/actionCard/index.tsx",
         "../../core/components/atoms/avatar/index.tsx",
         "../../core/components/atoms/avatarGroup/index.tsx",
         "../../core/components/atoms/backdrop/index.tsx",
@@ -6333,6 +6375,7 @@
         "../../node_modules/@types/node/util.d.ts"
       ],
       "../../core/index.type.tsx": [
+        "../../core/components/atoms/actionCard/index.tsx",
         "../../core/components/atoms/avatar/index.tsx",
         "../../core/components/atoms/avatarGroup/index.tsx",
         "../../core/components/atoms/backdrop/index.tsx",
@@ -11588,6 +11631,8 @@
       "../../core/common.type.tsx",
       "../../core/components/atoms/_chip/index.tsx",
       "../../core/components/atoms/_text/index.tsx",
+      "../../core/components/atoms/actionCard/ActionCard.tsx",
+      "../../core/components/atoms/actionCard/index.tsx",
       "../../core/components/atoms/avatar/Avatar.tsx",
       "../../core/components/atoms/avatar/index.tsx",
       "../../core/components/atoms/avatarGroup/AvatarCount.tsx",
@@ -11648,6 +11693,7 @@
       "../../core/components/atoms/helpText/index.tsx",
       "../../core/components/atoms/icon/Icon.tsx",
       "../../core/components/atoms/icon/index.tsx",
+      "../../core/components/atoms/icon/utils.tsx",
       "../../core/components/atoms/input/Input.tsx",
       "../../core/components/atoms/input/actionButton/ActionButton.tsx",
       "../../core/components/atoms/input/actionButton/index.tsx",

package/dist/core/common.type.d.ts

@@ -12,3 +12,9 @@ export declare type NumberRange = [number, number];
 export declare type ChangeEvent = React.ChangeEvent<HTMLInputElement>;
 export declare type TextColor = 'white' | 'primary' | 'secondary' | 'success' | 'alert' | 'warning' | 'accent1' | 'accent2' | 'accent3' | 'accent4' | 'inverse' | 'primary-dark' | 'secondary-dark' | 'success-dark' | 'alert-dark' | 'warning-dark' | 'accent1-dark' | 'accent2-dark' | 'accent3-dark' | 'accent4-dark' | 'primary-darker' | 'success-darker' | 'alert-darker' | 'warning-darker' | 'accent1-darker' | 'accent2-darker' | 'accent3-darker' | 'accent4-darker' | 'primary-light' | 'secondary-light' | 'success-light' | 'alert-light' | 'warning-light' | 'accent1-light' | 'accent2-light' | 'accent3-light' | 'accent4-light' | 'inverse-light' | 'primary-lighter' | 'secondary-lighter' | 'success-lighter' | 'alert-lighter' | 'warning-lighter' | 'accent1-lighter' | 'accent2-lighter' | 'accent3-lighter' | 'accent4-lighter' | 'inverse-lighter' | 'primary-lightest' | 'secondary-lightest' | 'success-lightest' | 'alert-lightest' | 'warning-lightest' | 'accent1-lightest' | 'accent2-lightest' | 'accent3-lightest' | 'accent4-lightest' | 'inverse-lightest' | 'primary-shadow' | 'secondary-shadow' | 'success-shadow' | 'alert-shadow' | 'warning-shadow' | 'accent1-shadow' | 'accent2-shadow' | 'accent3-shadow' | 'accent4-shadow' | 'inverse-shadow';
 export declare type AvatarSize = 'regular' | 'tiny';
+export declare type FontVariationType = {
+    fill?: number;
+    weight?: number;
+    grade?: number;
+    opticalSize?: number;
+};

package/dist/core/components/atoms/actionCard/ActionCard.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { BaseHtmlProps, BaseProps } from "../../../utils/types";
+export interface ActionCardProps extends BaseProps, BaseHtmlProps<HTMLDivElement> {
+    children: React.ReactNode;
+    disabled?: boolean;
+    zIndex?: number;
+    onClick?: (e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent) => void;
+}
+export declare const ActionCard: {
+    (props: ActionCardProps): JSX.Element;
+    displayName: string;
+};
+export default ActionCard;

package/dist/core/components/atoms/actionCard/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./ActionCard";
+export * from "./ActionCard";

package/dist/core/components/atoms/button/Button.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { BaseProps, BaseHtmlProps } from "../../../utils/types";
+import { FontVariationType } from "../../../common.type";
 export declare type ButtonType = 'button' | 'submit' | 'reset';
 export declare type ButtonAppearance = 'basic' | 'primary' | 'success' | 'alert' | 'transparent';
 export declare type ButtonSize = 'tiny' | 'regular' | 'large';
@@ -12,10 +13,11 @@ export interface ButtonProps extends BaseProps, BaseHtmlProps<HTMLButtonElement>
     expanded?: boolean;
     selected?: boolean;
     loading?: boolean;
-    icon?: string;
     tooltip?: string;
+    icon?: string;
     iconAlign?: ButtonAlignment;
     largeIcon?: boolean;
+    iconVariations?: FontVariationType;
     children?: React.ReactText;
     tabIndex?: number;
     autoFocus?: boolean;

package/dist/core/components/atoms/icon/Icon.d.ts

@@ -2,11 +2,18 @@ import * as React from 'react';
 import { BaseProps } from "../../../utils/types";
 export declare type IconAppearance = 'default' | 'destructive' | 'white' | 'subtle' | 'disabled' | 'info' | 'alert' | 'warning' | 'success' | 'primary_lighter' | 'primary' | 'primary_dark' | 'alert_lighter' | 'alert_dark' | 'warning_lighter' | 'warning_dark' | 'success_lighter' | 'success_dark' | 'accent1' | 'accent1_lighter' | 'accent1_dark' | 'accent2' | 'accent2_lighter' | 'accent2_dark' | 'accent3' | 'accent3_lighter' | 'accent3_dark' | 'accent4' | 'accent4_lighter' | 'accent4_dark' | 'inverse';
 export declare type IconType = 'filled' | 'outlined' | 'outline' | 'rounded' | 'round' | 'two-tone' | 'sharp';
+export declare type FontVariationType = {
+    fill?: number;
+    weight?: number;
+    grade?: number;
+    opticalSize?: number;
+};
 export interface IconProps extends BaseProps {
     name?: string;
     size: number;
     type?: IconType;
     appearance?: IconAppearance;
+    variations?: FontVariationType;
     onClick?: (e: React.MouseEvent<HTMLElement>) => void;
     onKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => void;
     children?: React.ReactNode;

package/dist/core/components/atoms/icon/utils.d.ts

@@ -0,0 +1,7 @@
+import { FontVariationType } from "./Icon";
+export declare const getFontVariation: (iconName: string, variations?: FontVariationType | undefined, type?: string | undefined, size?: number | undefined) => {
+    fill: number;
+    weight: number;
+    grade: number;
+    opticalSize: number | undefined;
+};

package/dist/core/components/atoms/input/actionButton/ActionButton.d.ts

@@ -1,10 +1,12 @@
 import * as React from 'react';
 import { BaseProps } from "../../../../utils/types";
-export declare type ActionButtonType = 'filled' | 'outlined' | 'round' | 'two-tone' | 'sharp';
+import { FontVariationType } from "../../../../common.type";
+export declare type ActionButtonType = 'outlined' | 'rounded';
 export interface ActionButtonProps extends BaseProps {
     name?: string;
     size: number;
     type?: ActionButtonType;
+    iconVariations?: FontVariationType;
     onClick?: (e: React.MouseEvent<HTMLElement>) => void;
     onKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => void;
     children?: React.ReactNode;