@nova-design-system/nova-base 3.0.0-beta.34 → 3.0.0-beta.36

package/dist/js/spark_light.d.ts

@@ -2,30 +2,41 @@
  * Do not edit directly, this file was auto-generated.
  */
 
-export const ColorInteractionContainerBrandedLowBackground : string;
-export const ColorInteractionContainerBrandedLowBackgroundHover : string;
-export const ColorInteractionContainerBrandedLowText : string;
-export const ColorInteractionContainerBrandedLowTextHover : string;
-export const ColorInteractionContainerBrandedLowIcon : string;
-export const ColorInteractionContainerBrandedLowIconHover : string;
-export const ColorInteractionContainerBrandedLowBorder : string;
-export const ColorInteractionContainerBrandedLowBorderHover : string;
+export const ColorInteractionContainerBrandedHighBorder : string;
+export const ColorInteractionContainerBrandedHighBorderActive : string;
+export const ColorInteractionContainerBrandedHighBorderHover : string;
 export const ColorInteractionContainerBrandedHighBackground : string;
+export const ColorInteractionContainerBrandedHighBackgroundActive : string;
 export const ColorInteractionContainerBrandedHighBackgroundHover : string;
-export const ColorInteractionContainerBrandedHighText : string;
-export const ColorInteractionContainerBrandedHighTextHover : string;
 export const ColorInteractionContainerBrandedHighIcon : string;
+export const ColorInteractionContainerBrandedHighIconActive : string;
 export const ColorInteractionContainerBrandedHighIconHover : string;
-export const ColorInteractionContainerBrandedHighBorder : string;
-export const ColorInteractionContainerBrandedHighBorderHover : string;
+export const ColorInteractionContainerBrandedHighText : string;
+export const ColorInteractionContainerBrandedHighTextActive : string;
+export const ColorInteractionContainerBrandedHighTextHover : string;
+export const ColorInteractionContainerBrandedLowBackground : string;
+export const ColorInteractionContainerBrandedLowBackgroundActive : string;
+export const ColorInteractionContainerBrandedLowBackgroundHover : string;
+export const ColorInteractionContainerBrandedLowBorder : string;
+export const ColorInteractionContainerBrandedLowBorderActive : string;
+export const ColorInteractionContainerBrandedLowBorderHover : string;
+export const ColorInteractionContainerBrandedLowIcon : string;
+export const ColorInteractionContainerBrandedLowIconActive : string;
+export const ColorInteractionContainerBrandedLowIconHover : string;
+export const ColorInteractionContainerBrandedLowText : string;
+export const ColorInteractionContainerBrandedLowTextActive : string;
+export const ColorInteractionContainerBrandedLowTextHover : string;
 export const ColorInteractionContainerNeutralBackground : string;
 export const ColorInteractionContainerNeutralBackgroundHover : string;
-export const ColorInteractionContainerNeutralText : string;
-export const ColorInteractionContainerNeutralTextHover : string;
-export const ColorInteractionContainerNeutralIcon : string;
-export const ColorInteractionContainerNeutralIconHover : string;
+export const ColorInteractionContainerNeutralBackgroundActive : string;
 export const ColorInteractionContainerNeutralBorder : string;
 export const ColorInteractionContainerNeutralBorderHover : string;
+export const ColorInteractionContainerNeutralIcon : string;
+export const ColorInteractionContainerNeutralIconActive : string;
+export const ColorInteractionContainerNeutralIconHover : string;
+export const ColorInteractionContainerNeutralText : string;
+export const ColorInteractionContainerNeutralTextActive : string;
+export const ColorInteractionContainerNeutralTextHover : string;
 export const ColorInteractionLinkHighText : string;
 export const ColorInteractionLinkHighTextHover : string;
 export const ColorInteractionLinkHighIcon : string;
@@ -34,13 +45,25 @@ export const ColorInteractionLinkLowText : string;
 export const ColorInteractionLinkLowTextHover : string;
 export const ColorInteractionLinkLowIcon : string;
 export const ColorInteractionLinkLowIconHover : string;
+export const ColorInteractionLinkInvertedText : string;
+export const ColorInteractionLinkInvertedTextHover : string;
+export const ColorInteractionLinkInvertedIcon : string;
+export const ColorInteractionLinkInvertedIconHover : string;
 export const ColorBlack : string;
 export const ColorLevel10Background : string;
+export const ColorLevel15Background : string;
 export const ColorLevel20Background : string;
 export const ColorLevel30Background : string;
 export const ColorLevel40Background : string;
 export const ColorLevel00Background : string;
 export const ColorLevel05Background : string;
+export const ColorLevelInverted10Background : string;
+export const ColorLevelInverted15Background : string;
+export const ColorLevelInverted20Background : string;
+export const ColorLevelInverted30Background : string;
+export const ColorLevelInverted40Background : string;
+export const ColorLevelInverted00Background : string;
+export const ColorLevelInverted05Background : string;
 export const ColorContentHighBorder : string;
 export const ColorContentHighText : string;
 export const ColorContentHighIcon : string;
@@ -191,31 +214,43 @@ export const ShadowYAxisXl2 : string;
 export const ShadowYAxis2xl : string;
 export const ComponentsWpfComponents2 : string;
 export const ComponentsButtonHighBorder : string;
-export const ComponentsButtonHighBorderHover : string;
 export const ComponentsButtonHighBackground : string;
+export const ComponentsButtonHighBackgroundActive : string;
 export const ComponentsButtonHighBackgroundHover : string;
+export const ComponentsButtonHighBorderHover : string;
+export const ComponentsButtonHighBorderActive : string;
 export const ComponentsButtonHighText : string;
+export const ComponentsButtonHighTextActive : string;
 export const ComponentsButtonHighTextHover : string;
 export const ComponentsButtonHighIcon : string;
+export const ComponentsButtonHighIconActive : string;
 export const ComponentsButtonHighIconHover : string;
 export const ComponentsButtonLowBackground : string;
 export const ComponentsButtonLowBorder : string;
+export const ComponentsButtonLowBorderActive : string;
 export const ComponentsButtonLowBorderHover : string;
+export const ComponentsButtonLowBackgroundActive : string;
 export const ComponentsButtonLowBackgroundHover : string;
-export const ComponentsButtonLowText : string;
-export const ComponentsButtonLowTextHover : string;
 export const ComponentsButtonLowIcon : string;
+export const ComponentsButtonLowIconActive : string;
 export const ComponentsButtonLowIconHover : string;
-export const ComponentsButtonLowerBackground : string;
+export const ComponentsButtonLowText : string;
+export const ComponentsButtonLowTextActive : string;
+export const ComponentsButtonLowTextHover : string;
 export const ComponentsButtonLowerBorder : string;
+export const ComponentsButtonLowerBorderActive : string;
 export const ComponentsButtonLowerBorderHover : string;
 export const ComponentsButtonLowerBorder2 : string;
 export const ComponentsButtonLowerBorderHover2 : string;
+export const ComponentsButtonLowerBackground : string;
+export const ComponentsButtonLowerBackgroundActive : string;
 export const ComponentsButtonLowerBackgroundHover : string;
-export const ComponentsButtonLowerText : string;
-export const ComponentsButtonLowerTextHover : string;
 export const ComponentsButtonLowerIcon : string;
+export const ComponentsButtonLowerIconActive : string;
 export const ComponentsButtonLowerIconHover : string;
+export const ComponentsButtonLowerText : string;
+export const ComponentsButtonLowerTextActive : string;
+export const ComponentsButtonLowerTextHover : string;
 export const ComponentsButtonGrAsComplementaryBorder : string;
 export const ComponentsButtonGrAsComplementaryBorderHover : string;
 export const ComponentsButtonGrAsComplementaryBackground : string;
@@ -225,13 +260,17 @@ export const ComponentsButtonGrAsComplementaryTextHover : string;
 export const ComponentsButtonGrAsComplementaryIcon : string;
 export const ComponentsButtonGrAsComplementaryIconHover : string;
 export const ComponentsButtonMediumBackground : string;
+export const ComponentsButtonMediumBackgroundActive : string;
 export const ComponentsButtonMediumBackgroundHover : string;
-export const ComponentsButtonMediumText : string;
-export const ComponentsButtonMediumTextHover : string;
-export const ComponentsButtonMediumIcon : string;
-export const ComponentsButtonMediumIconHover : string;
 export const ComponentsButtonMediumBorder : string;
+export const ComponentsButtonMediumBorderActive : string;
 export const ComponentsButtonMediumBorderHover : string;
+export const ComponentsButtonMediumIcon : string;
+export const ComponentsButtonMediumIconActive : string;
+export const ComponentsButtonMediumIconHover : string;
+export const ComponentsButtonMediumText : string;
+export const ComponentsButtonMediumTextActive : string;
+export const ComponentsButtonMediumTextHover : string;
 export const ComponentsFormOpacityDefault : string;
 export const ComponentsFormOpacityDisabled : string;
 export const ComponentsFormTextRequired : string;
@@ -330,6 +369,8 @@ export const ComponentsButtonDestructiveLowerIcon : string;
 export const ComponentsButtonDestructiveLowerIconHover : string;
 export const ComponentsButtonDestructiveLowerBorder : string;
 export const ComponentsButtonDestructiveLowerBorderHover : string;
+export const ComponentsOverlayOpacity : string;
+export const ComponentsOverlayBackground : string;
 export const ComponentsAlertInformationBackground : string;
 export const ComponentsAlertInformationIcon : string;
 export const ComponentsAlertInformationBorder : string;

package/dist/js/spark_light.js

@@ -2,30 +2,41 @@
  * Do not edit directly, this file was auto-generated.
  */
 
-export const ColorInteractionContainerBrandedLowBackground = "#ffffff";
-export const ColorInteractionContainerBrandedLowBackgroundHover = "#fceae3";
-export const ColorInteractionContainerBrandedLowText = "#e75420";
-export const ColorInteractionContainerBrandedLowTextHover = "#bf451a";
-export const ColorInteractionContainerBrandedLowIcon = "#e75420";
-export const ColorInteractionContainerBrandedLowIconHover = "#bf451a";
-export const ColorInteractionContainerBrandedLowBorder = "#e75420";
-export const ColorInteractionContainerBrandedLowBorderHover = "#bf451a";
+export const ColorInteractionContainerBrandedHighBorder = "#ffffff";
+export const ColorInteractionContainerBrandedHighBorderActive = "#ffffff";
+export const ColorInteractionContainerBrandedHighBorderHover = "#ffffff";
 export const ColorInteractionContainerBrandedHighBackground = "#e75420";
+export const ColorInteractionContainerBrandedHighBackgroundActive = "#bf451a";
 export const ColorInteractionContainerBrandedHighBackgroundHover = "#bf451a";
-export const ColorInteractionContainerBrandedHighText = "#ffffff";
-export const ColorInteractionContainerBrandedHighTextHover = "#ffffff";
 export const ColorInteractionContainerBrandedHighIcon = "#ffffff";
+export const ColorInteractionContainerBrandedHighIconActive = "#ffffff";
 export const ColorInteractionContainerBrandedHighIconHover = "#ffffff";
-export const ColorInteractionContainerBrandedHighBorder = "#e75420";
-export const ColorInteractionContainerBrandedHighBorderHover = "#bf451a";
+export const ColorInteractionContainerBrandedHighText = "#ffffff";
+export const ColorInteractionContainerBrandedHighTextActive = "#ffffff";
+export const ColorInteractionContainerBrandedHighTextHover = "#ffffff";
+export const ColorInteractionContainerBrandedLowBackground = "#ffffff";
+export const ColorInteractionContainerBrandedLowBackgroundActive = "#fceae3";
+export const ColorInteractionContainerBrandedLowBackgroundHover = "#fceae3";
+export const ColorInteractionContainerBrandedLowBorder = "#e75420";
+export const ColorInteractionContainerBrandedLowBorderActive = "#bf451a";
+export const ColorInteractionContainerBrandedLowBorderHover = "#bf451a";
+export const ColorInteractionContainerBrandedLowIcon = "#e75420";
+export const ColorInteractionContainerBrandedLowIconActive = "#bf451a";
+export const ColorInteractionContainerBrandedLowIconHover = "#bf451a";
+export const ColorInteractionContainerBrandedLowText = "#e75420";
+export const ColorInteractionContainerBrandedLowTextActive = "#bf451a";
+export const ColorInteractionContainerBrandedLowTextHover = "#bf451a";
 export const ColorInteractionContainerNeutralBackground = "#ffffff";
 export const ColorInteractionContainerNeutralBackgroundHover = "#a5a5a5";
-export const ColorInteractionContainerNeutralText = "#6d6d6d";
-export const ColorInteractionContainerNeutralTextHover = "#414141";
-export const ColorInteractionContainerNeutralIcon = "#6d6d6d";
-export const ColorInteractionContainerNeutralIconHover = "#414141";
+export const ColorInteractionContainerNeutralBackgroundActive = "#fceae3";
 export const ColorInteractionContainerNeutralBorder = "#6d6d6d";
 export const ColorInteractionContainerNeutralBorderHover = "#414141";
+export const ColorInteractionContainerNeutralIcon = "#6d6d6d";
+export const ColorInteractionContainerNeutralIconActive = "#bf451a";
+export const ColorInteractionContainerNeutralIconHover = "#414141";
+export const ColorInteractionContainerNeutralText = "#6d6d6d";
+export const ColorInteractionContainerNeutralTextActive = "#bf451a";
+export const ColorInteractionContainerNeutralTextHover = "#414141";
 export const ColorInteractionLinkHighText = "#e75420";
 export const ColorInteractionLinkHighTextHover = "#bf451a";
 export const ColorInteractionLinkHighIcon = "#e75420";
@@ -34,13 +45,25 @@ export const ColorInteractionLinkLowText = "#1d1d1d";
 export const ColorInteractionLinkLowTextHover = "#e75420";
 export const ColorInteractionLinkLowIcon = "#1d1d1d";
 export const ColorInteractionLinkLowIconHover = "#e75420";
+export const ColorInteractionLinkInvertedText = "#919191";
+export const ColorInteractionLinkInvertedTextHover = "#e75420";
+export const ColorInteractionLinkInvertedIcon = "#919191";
+export const ColorInteractionLinkInvertedIconHover = "#e75420";
 export const ColorBlack = "#000000";
 export const ColorLevel10Background = "#f6f6f6";
+export const ColorLevel15Background = "#ededed";
 export const ColorLevel20Background = "#ffffff";
 export const ColorLevel30Background = "#f6f6f6";
 export const ColorLevel40Background = "#ffffff";
 export const ColorLevel00Background = "#ffffff";
 export const ColorLevel05Background = "#fbfbfb";
+export const ColorLevelInverted10Background = "#1d1d1d";
+export const ColorLevelInverted15Background = "#252525";
+export const ColorLevelInverted20Background = "#2b2b2b";
+export const ColorLevelInverted30Background = "#3a3a3a";
+export const ColorLevelInverted40Background = "#484848";
+export const ColorLevelInverted00Background = "#0e0e0e";
+export const ColorLevelInverted05Background = "#161616";
 export const ColorContentHighBorder = "#919191";
 export const ColorContentHighText = "#1d1d1d";
 export const ColorContentHighIcon = "#1d1d1d";
@@ -191,31 +214,43 @@ export const ShadowYAxisXl2 = "20px";
 export const ShadowYAxis2xl = "25px";
 export const ComponentsWpfComponents2 = "#ffffff";
 export const ComponentsButtonHighBorder = "#ffffff";
-export const ComponentsButtonHighBorderHover = "#ffffff";
 export const ComponentsButtonHighBackground = "#e75420";
+export const ComponentsButtonHighBackgroundActive = "#bf451a";
 export const ComponentsButtonHighBackgroundHover = "#bf451a";
+export const ComponentsButtonHighBorderHover = "#ffffff";
+export const ComponentsButtonHighBorderActive = "#ffffff";
 export const ComponentsButtonHighText = "#ffffff";
+export const ComponentsButtonHighTextActive = "#ffffff";
 export const ComponentsButtonHighTextHover = "#ffffff";
 export const ComponentsButtonHighIcon = "#ffffff";
+export const ComponentsButtonHighIconActive = "#ffffff";
 export const ComponentsButtonHighIconHover = "#ffffff";
 export const ComponentsButtonLowBackground = "#ffffff";
 export const ComponentsButtonLowBorder = "#ffffff";
+export const ComponentsButtonLowBorderActive = "#ffffff";
 export const ComponentsButtonLowBorderHover = "#ffffff";
+export const ComponentsButtonLowBackgroundActive = "#fceae3";
 export const ComponentsButtonLowBackgroundHover = "#fceae3";
-export const ComponentsButtonLowText = "#e75420";
-export const ComponentsButtonLowTextHover = "#bf451a";
 export const ComponentsButtonLowIcon = "#e75420";
+export const ComponentsButtonLowIconActive = "#bf451a";
 export const ComponentsButtonLowIconHover = "#bf451a";
-export const ComponentsButtonLowerBackground = "#ffffff";
+export const ComponentsButtonLowText = "#e75420";
+export const ComponentsButtonLowTextActive = "#bf451a";
+export const ComponentsButtonLowTextHover = "#bf451a";
 export const ComponentsButtonLowerBorder = "#ffffff";
+export const ComponentsButtonLowerBorderActive = "#ffffff";
 export const ComponentsButtonLowerBorderHover = "#ffffff";
 export const ComponentsButtonLowerBorder2 = "#ffffff";
 export const ComponentsButtonLowerBorderHover2 = "#ffffff";
+export const ComponentsButtonLowerBackground = "#ffffff";
+export const ComponentsButtonLowerBackgroundActive = "#fceae3";
 export const ComponentsButtonLowerBackgroundHover = "#a5a5a5";
-export const ComponentsButtonLowerText = "#414141";
-export const ComponentsButtonLowerTextHover = "#1d1d1d";
-export const ComponentsButtonLowerIcon = "#414141";
-export const ComponentsButtonLowerIconHover = "#1d1d1d";
+export const ComponentsButtonLowerIcon = "#6d6d6d";
+export const ComponentsButtonLowerIconActive = "#bf451a";
+export const ComponentsButtonLowerIconHover = "#414141";
+export const ComponentsButtonLowerText = "#6d6d6d";
+export const ComponentsButtonLowerTextActive = "#bf451a";
+export const ComponentsButtonLowerTextHover = "#414141";
 export const ComponentsButtonGrAsComplementaryBorder = "#ffffff";
 export const ComponentsButtonGrAsComplementaryBorderHover = "#ffffff";
 export const ComponentsButtonGrAsComplementaryBackground = "#bfbfbf";
@@ -225,13 +260,17 @@ export const ComponentsButtonGrAsComplementaryTextHover = "#000000";
 export const ComponentsButtonGrAsComplementaryIcon = "#000000";
 export const ComponentsButtonGrAsComplementaryIconHover = "#000000";
 export const ComponentsButtonMediumBackground = "#ffffff";
+export const ComponentsButtonMediumBackgroundActive = "#fceae3";
 export const ComponentsButtonMediumBackgroundHover = "#fceae3";
-export const ComponentsButtonMediumText = "#e75420";
-export const ComponentsButtonMediumTextHover = "#bf451a";
-export const ComponentsButtonMediumIcon = "#e75420";
-export const ComponentsButtonMediumIconHover = "#bf451a";
 export const ComponentsButtonMediumBorder = "#e75420";
+export const ComponentsButtonMediumBorderActive = "#bf451a";
 export const ComponentsButtonMediumBorderHover = "#bf451a";
+export const ComponentsButtonMediumIcon = "#e75420";
+export const ComponentsButtonMediumIconActive = "#bf451a";
+export const ComponentsButtonMediumIconHover = "#bf451a";
+export const ComponentsButtonMediumText = "#e75420";
+export const ComponentsButtonMediumTextActive = "#bf451a";
+export const ComponentsButtonMediumTextHover = "#bf451a";
 export const ComponentsFormOpacityDefault = "100px";
 export const ComponentsFormOpacityDisabled = "50px";
 export const ComponentsFormTextRequired = "#da2424";
@@ -330,6 +369,8 @@ export const ComponentsButtonDestructiveLowerIcon = "#e3e3e3";
 export const ComponentsButtonDestructiveLowerIconHover = "#e3e3e3";
 export const ComponentsButtonDestructiveLowerBorder = "#e3e3e3";
 export const ComponentsButtonDestructiveLowerBorderHover = "#e3e3e3";
+export const ComponentsOverlayOpacity = "55px";
+export const ComponentsOverlayBackground = "#161616";
 export const ComponentsAlertInformationBackground = "#f0f6ff";
 export const ComponentsAlertInformationIcon = "#2660c2";
 export const ComponentsAlertInformationBorder = "#2660c2";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nova-design-system/nova-base",
-  "version": "3.0.0-beta.34",
+  "version": "3.0.0-beta.36",
   "description": "Nova is a design system created by Elia Group to empower creators to efficiently build solutions that people love to use.",
   "author": "Elia Group",
   "homepage": "https://nova.eliagroup.io",
@@ -12,10 +12,10 @@
   },
   "scripts": {
     "generate-tokens": "tsx scripts/extract-tokens.ts && tsx scripts/generate-token-files.ts",
-    "generate-css-utils": "tailwindcss -i ./lib/tailwind.css -o ./dist/css/nova-utils.css",
+    "generate-css-utils": "tailwindcss -i ./plugin/tailwind.css -o ./dist/css/nova-utils.css",
     "generate-tailwind-tokens": "tsx scripts/generate-tailwind-tokens.ts",
     "generate-tailwind-components": "tsx scripts/generate-tailwind-components.ts",
-    "build-lib": "tsc && tsc --module CommonJS --moduleResolution Node --declaration false --outDir ./dist/lib/cjs",
+    "build-lib": "tsc && tsc --module CommonJS --moduleResolution Node --declaration false --outDir ./dist/cjs",
     "merge-css": "tsx scripts/merge-css.ts",
     "build": "npm run clean && tsx scripts/generate-tokens.ts && npm run generate-tailwind-components && npm run merge-css && npm run generate-tailwind-tokens && npm run generate-css-utils && npm run build-lib",
     "clean": "rimraf dist",
@@ -37,9 +37,9 @@
     "./dist/*": "./dist/*",
     "./assets/*": "./assets/*",
     "./theme": {
-      "import": "./dist/lib/index.js",
-      "require": "./dist/lib/cjs/index.js",
-      "types": "./dist/lib/index.d.ts"
+      "import": "./dist/plugin/index.js",
+      "require": "./dist/cjs/plugin/index.js",
+      "types": "./dist/plugin/index.d.ts"
     }
   }
 }