@pingux/astro 2.142.1-alpha.1 → 2.143.0-alpha.1

package/lib/cjs/hooks/useCircularLoader/useCircularLoader.test.js

@@ -0,0 +1,136 @@
+"use strict";
+
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+var _react = require("@testing-library/react");
+var _useCircularLoader = _interopRequireWildcard(require("./useCircularLoader"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+var nonCircleProps = {
+  isAstro: true,
+  defaultLoaderSize: 20
+};
+var circleProps = {
+  isAstro: false,
+  defaultLoaderSize: 20
+};
+var defaultProps = {
+  isAstro: false,
+  defaultLoaderSize: 20
+};
+test('astro theme returns isCircle = false ', function () {
+  var _renderHook = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread({}, nonCircleProps));
+    }),
+    result = _renderHook.result;
+  expect(result.current.isCircle).toEqual(false);
+});
+test('mode = "dots" returns  returns isCircle = false ', function () {
+  var _renderHook2 = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread(_objectSpread({}, circleProps), {}, {
+        mode: 'dots'
+      }));
+    }),
+    result = _renderHook2.result;
+  expect(result.current.isCircle).toEqual(false);
+});
+test('numeric calcuations are correct', function () {
+  var _renderHook3 = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread(_objectSpread({}, circleProps), {}, {
+        size: 120
+      }));
+    }),
+    result = _renderHook3.result;
+  var current = result.current;
+  var radius = current.radius,
+    strokeWidth = current.strokeWidth,
+    center = current.center,
+    size = current.size;
+  expect(radius).toEqual(45);
+  expect(center).toEqual(50);
+  expect(strokeWidth).toEqual(10);
+  expect(size).toEqual(100);
+});
+test('returns isCircle = false when mode is "dots"', function () {
+  var _renderHook4 = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread(_objectSpread({}, defaultProps), {}, {
+        mode: 'dots'
+      }));
+    }),
+    result = _renderHook4.result;
+  expect(result.current.isCircle).toBe(false);
+});
+test('returns isCircle = false when isAstro is true', function () {
+  var _renderHook5 = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread(_objectSpread({}, defaultProps), {}, {
+        isAstro: true
+      }));
+    }),
+    result = _renderHook5.result;
+  expect(result.current.isCircle).toBe(false);
+});
+test('calculates correct values for circular loader with size "sm"', function () {
+  var _renderHook6 = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread(_objectSpread({}, defaultProps), {}, {
+        size: 'sm'
+      }));
+    }),
+    result = _renderHook6.result;
+  var size = result.current.size;
+  expect(size).toBeCloseTo(_useCircularLoader.circularSizes.sm * (10 / 12)); // Adjust based on actual calculation
+});
+
+test('calculates correct values for circular loader with size "lg"', function () {
+  var _renderHook7 = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread(_objectSpread({}, defaultProps), {}, {
+        size: 'lg'
+      }));
+    }),
+    result = _renderHook7.result;
+  var size = result.current.size;
+  expect(size).toBeCloseTo(_useCircularLoader.circularSizes.lg * (10 / 12)); // Adjust based on actual calculation
+});
+
+test('uses defaultLoaderSize when size is not provided', function () {
+  var _renderHook8 = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread({}, defaultProps));
+    }),
+    result = _renderHook8.result;
+  expect(result.current.size).toBe(defaultProps.defaultLoaderSize * (10 / 12));
+});
+test('calculates correct values for custom progress', function () {
+  var _renderHook9 = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread(_objectSpread({}, defaultProps), {}, {
+        size: 120,
+        progress: 50
+      }));
+    }),
+    result = _renderHook9.result;
+  var _result$current = result.current,
+    dashLength = _result$current.dashLength,
+    gapLength = _result$current.gapLength,
+    radius = _result$current.radius;
+  expect(dashLength).toBeCloseTo(50 / 100 * 2 * Math.PI * radius); // Progress = 50%
+  expect(gapLength).toBeCloseTo(2 * Math.PI * radius);
+});
+test('returns correct size when size is a custom number', function () {
+  var _renderHook10 = (0, _react.renderHook)(function () {
+      return (0, _useCircularLoader["default"])(_objectSpread(_objectSpread({}, defaultProps), {}, {
+        size: 100
+      }));
+    }),
+    result = _renderHook10.result;
+  expect(result.current.size).toBeCloseTo(100 * (10 / 12)); // Adjust based on actual calculation
+});

package/lib/cjs/hooks/useField/useField.d.ts

@@ -1165,9 +1165,6 @@ declare const useField: <T>(props: UseFieldProps<T>) => {
         style?: React.CSSProperties | undefined;
         slot?: string | undefined;
         title?: string | undefined;
-        id?: string | undefined;
-        tabIndex?: number | undefined;
-        hidden?: boolean | undefined;
         key?: React.Key | null | undefined;
         defaultChecked?: boolean | undefined;
         defaultValue?: string | number | readonly string[] | undefined;
@@ -1179,10 +1176,13 @@ declare const useField: <T>(props: UseFieldProps<T>) => {
         contextMenu?: string | undefined;
         dir?: string | undefined;
         draggable?: (boolean | "false" | "true") | undefined;
+        hidden?: boolean | undefined;
+        id?: string | undefined;
         lang?: string | undefined;
         nonce?: string | undefined;
         placeholder?: string | undefined;
         spellCheck?: (boolean | "false" | "true") | undefined;
+        tabIndex?: number | undefined;
         radioGroup?: string | undefined;
         about?: string | undefined;
         datatype?: string | undefined;
@@ -1484,9 +1484,6 @@ declare const useField: <T>(props: UseFieldProps<T>) => {
         style?: React.CSSProperties | undefined;
         slot?: string | undefined;
         title?: string | undefined;
-        id?: string | undefined;
-        tabIndex?: number | undefined;
-        hidden?: boolean | undefined;
         key?: React.Key | null | undefined;
         defaultChecked?: boolean | undefined;
         defaultValue?: string | number | readonly string[] | undefined;
@@ -1498,10 +1495,13 @@ declare const useField: <T>(props: UseFieldProps<T>) => {
         contextMenu?: string | undefined;
         dir?: string | undefined;
         draggable?: (boolean | "false" | "true") | undefined;
+        hidden?: boolean | undefined;
+        id?: string | undefined;
         lang?: string | undefined;
         nonce?: string | undefined;
         placeholder?: string | undefined;
         spellCheck?: (boolean | "false" | "true") | undefined;
+        tabIndex?: number | undefined;
         radioGroup?: string | undefined;
         about?: string | undefined;
         datatype?: string | undefined;

package/lib/cjs/hooks/useGetTheme/useGetTheme.d.ts

@@ -6,10 +6,76 @@ export declare const baseState: {
     isCustom: boolean;
 };
 declare const useGetTheme: () => {
+    copyButtonSize: import("../..").IconSize;
+    breadcrumbIconSize: import("../..").IconSize;
+    breadcrumbIconMargin: string;
+    accordionItemMarginLeft: string;
+    pageHeaderTitleMargin: string;
+    defaultLoaderSize: number;
+    activeColor: string;
+    backgroundBaseColor: string;
+    styles: {
+        navButtonEstHeight: number;
+    };
+    icons: {
+        [x: number]: import("@pingux/mdi-react").MdiReactIconComponentType;
+        ErrorCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+        WarningIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
+        DefaultCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+        SuccessCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+        CreateIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
+        MenuDown: import("@pingux/mdi-react").MdiReactIconComponentType;
+        MenuUp: import("@pingux/mdi-react").MdiReactIconComponentType;
+        pingLogoHorizontalSmall: React.JSX.Element;
+        listViewMenu: import("@pingux/mdi-react").MdiReactIconComponentType;
+        Ascending: import("@pingux/mdi-react").MdiReactIconComponentType;
+        Descending: import("@pingux/mdi-react").MdiReactIconComponentType;
+    };
+    tShirtSizes: {
+        xxs: string;
+        'icon-100': string;
+        xs: string;
+        'icon-200': string;
+        sm: string;
+        'icon-300': string;
+        md: string;
+        'icon-400': string;
+        'icon-500': string;
+        'icon-600': string;
+        'icon-700': string;
+        'icon-800': string;
+        'icon-900': string;
+    };
+    iconBadgeCircleColor: string;
+    iconWrapperSizes: {
+        sm: number;
+        md: number;
+        lg: number;
+    };
+    defaultIconColor: string;
+    accordionItemDefaultLabelTag: string;
+    iFrameContentDivBackgroundColor: string;
+    rockerButtonGap: string;
+    themeState: {
+        isOnyx: boolean;
+        isAstro: boolean;
+        isOnyxDark: boolean;
+        isCustom: boolean;
+    };
+    name: string;
+} | {
+    accordionItemDefaultLabelTag: string;
+    activeColor: string;
+    backgroundBaseColor: string;
     icons: {
         [x: number]: import("@pingux/mdi-react").MdiReactIconComponentType;
+        ErrorCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+        WarningIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
+        DefaultCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+        SuccessCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
         MenuDown: import("@pingux/mdi-react").MdiReactIconComponentType;
         MenuUp: import("@pingux/mdi-react").MdiReactIconComponentType;
+        CreateIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
         pingLogoHorizontalSmall: React.JSX.Element;
         listViewMenu: import("@pingux/mdi-react").MdiReactIconComponentType;
         Ascending: import("@pingux/mdi-react").MdiReactIconComponentType;
@@ -24,12 +90,21 @@ declare const useGetTheme: () => {
         sm: string;
         md: string;
     };
+    iconBadgeCircleColor: string;
     iconWrapperSizes: {
         sm: number;
         md: number;
         lg: number;
     };
+    iFrameContentDivBackgroundColor: string;
+    copyButtonSize: import("../..").IconSize;
+    pageHeaderTitleMargin: string;
+    breadcrumbIconSize: import("../..").IconSize;
+    breadcrumbIconMargin: number;
     rockerButtonGap: string;
+    accordionItemMarginLeft: string;
+    defaultLoaderSize: number;
+    defaultIconColor: string;
     name: string;
     themeState: {
         isAstro: boolean;

package/lib/cjs/hooks/usePagination/usePagination.d.ts

@@ -91,8 +91,6 @@ declare const usePagination: (props: PaginationProps) => {
         style?: import("react").CSSProperties | undefined;
         slot?: string | undefined;
         title?: string | undefined;
-        id?: string | undefined;
-        hidden?: boolean | undefined;
         key?: import("react").Key | null | undefined;
         disabled?: boolean | undefined;
         formAction?: string | undefined;
@@ -113,6 +111,8 @@ declare const usePagination: (props: PaginationProps) => {
         contextMenu?: string | undefined;
         dir?: string | undefined;
         draggable?: (boolean | "false" | "true") | undefined;
+        hidden?: boolean | undefined;
+        id?: string | undefined;
         lang?: string | undefined;
         nonce?: string | undefined;
         placeholder?: string | undefined;
@@ -420,8 +420,6 @@ declare const usePagination: (props: PaginationProps) => {
         style?: import("react").CSSProperties | undefined;
         slot?: string | undefined;
         title?: string | undefined;
-        id?: string | undefined;
-        hidden?: boolean | undefined;
         key?: import("react").Key | null | undefined;
         disabled?: boolean | undefined;
         formAction?: string | undefined;
@@ -442,6 +440,8 @@ declare const usePagination: (props: PaginationProps) => {
         contextMenu?: string | undefined;
         dir?: string | undefined;
         draggable?: (boolean | "false" | "true") | undefined;
+        hidden?: boolean | undefined;
+        id?: string | undefined;
         lang?: string | undefined;
         nonce?: string | undefined;
         placeholder?: string | undefined;

package/lib/cjs/styles/colors.d.ts

@@ -103,6 +103,9 @@ declare const allColors: {
     badge: {
         textColor: string;
         background: string;
+        readOnly: string;
+        iconBadge: string;
+        iconBadgeFill: string;
     };
     white: string;
     neutral: {
@@ -213,6 +216,9 @@ export declare const getBaseHexColor: (colorName: string) => string | {
     badge: {
         textColor: string;
         background: string;
+        readOnly: string;
+        iconBadge: string;
+        iconBadgeFill: string;
     };
     white: string;
     neutral: {

package/lib/cjs/styles/colors.js

@@ -144,7 +144,10 @@ var shadow = (0, _chromaJs["default"])(neutral[10]).alpha(0.25).hex();
 exports.shadow = shadow;
 var badge = {
   textColor: 'white',
-  background: neutral[10]
+  background: neutral[10],
+  readOnly: 'white',
+  iconBadge: 'white',
+  iconBadgeFill: accent[40]
 };
 var tooltip = accent[20];
 var allColors = {

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/colors.d.ts

@@ -5,6 +5,42 @@ export declare const overrides: {
     disabled: string;
 };
 export declare const colors: {
+    twoTone: {
+        bg: {
+            orange: string;
+            cyan: string;
+            green: string;
+            purple: string;
+            pink: string;
+            red: string;
+            yellow: string;
+            teal: string;
+            blue: string;
+            indigo: string;
+            lightBlue: string;
+            lightPink: string;
+            lightGreen: string;
+            lightYellow: string;
+            lightIndigo: string;
+        };
+        text: {
+            orange: string;
+            cyan: string;
+            green: string;
+            purple: string;
+            pink: string;
+            red: string;
+            yellow: string;
+            teal: string;
+            blue: string;
+            indigo: string;
+            lightBlue: string;
+            lightPink: string;
+            lightGreen: string;
+            lightYellow: string;
+            lightIndigo: string;
+        };
+    };
     light: string;
     secondary: string;
     dark: string;

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/colors.js

@@ -41,8 +41,8 @@ var badge = {
   background: _colorTokens.nextGenColors['gray-800'],
   textColor: _colorTokens.nextGenColors['gray-100']
 };
-var iconWrapper = {
-  wrapper: {
+var twoTone = {
+  bg: {
     orange: _colorTokens.nextGenColors['orange-500'],
     cyan: _colorTokens.nextGenColors['cyan-500'],
     green: _colorTokens.nextGenColors['green-500'],
@@ -59,6 +59,26 @@ var iconWrapper = {
     lightYellow: _colorTokens.nextGenColors['yellow-800'],
     lightIndigo: _colorTokens.nextGenColors['indigo-700']
   },
+  text: {
+    orange: 'black',
+    cyan: 'black',
+    green: 'black',
+    purple: 'black',
+    pink: 'black',
+    red: 'black',
+    yellow: 'black',
+    teal: 'black',
+    blue: 'black',
+    indigo: 'black',
+    lightBlue: 'black',
+    lightPink: 'black',
+    lightGreen: 'black',
+    lightYellow: 'black',
+    lightIndigo: 'black'
+  }
+};
+var iconWrapper = {
+  wrapper: _objectSpread({}, twoTone.bg),
   icon: {
     orange: 'black',
     cyan: 'black',
@@ -81,6 +101,7 @@ var colors = _objectSpread(_objectSpread({
   border: border,
   iconWrapper: iconWrapper
 }, overrides), {}, {
+  twoTone: twoTone,
   light: _colorTokens.nextGenColors['gray-900'],
   secondary: _colorTokens.nextGenColors['gray-400'],
   dark: _colorTokens.nextGenColors['gray-400'],

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/customProperties/icons.d.ts

@@ -1,6 +1,11 @@
 /// <reference types="react" />
 declare const _default: {
     pingLogoHorizontalSmall: import("react").JSX.Element;
+    ErrorCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+    WarningIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
+    DefaultCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+    SuccessCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+    CreateIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
     MenuDown: import("@pingux/mdi-react").MdiReactIconComponentType;
     MenuUp: import("@pingux/mdi-react").MdiReactIconComponentType;
     listViewMenu: import("@pingux/mdi-react").MdiReactIconComponentType;

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/customProperties/index.d.ts

@@ -1,13 +1,28 @@
 /// <reference types="react" />
 export declare const nextGenDarkThemeValues: {
+    backgroundBaseColor: string;
+    iFrameContentDivBackgroundColor: string;
     icons: {
         pingLogoHorizontalSmall: import("react").JSX.Element;
+        ErrorCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+        WarningIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
+        DefaultCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+        SuccessCircle: import("@pingux/mdi-react").MdiReactIconComponentType;
+        CreateIcon: import("@pingux/mdi-react").MdiReactIconComponentType;
         MenuDown: import("@pingux/mdi-react").MdiReactIconComponentType;
         MenuUp: import("@pingux/mdi-react").MdiReactIconComponentType;
         listViewMenu: import("@pingux/mdi-react").MdiReactIconComponentType;
         Ascending: import("@pingux/mdi-react").MdiReactIconComponentType;
         Descending: import("@pingux/mdi-react").MdiReactIconComponentType;
     };
+    defaultIconColor: string;
+    copyButtonSize: import("../../../..").IconSize;
+    breadcrumbIconSize: import("../../../..").IconSize;
+    breadcrumbIconMargin: string;
+    accordionItemMarginLeft: string;
+    pageHeaderTitleMargin: string;
+    defaultLoaderSize: number;
+    activeColor: string;
     styles: {
         navButtonEstHeight: number;
     };
@@ -26,10 +41,12 @@ export declare const nextGenDarkThemeValues: {
         'icon-800': string;
         'icon-900': string;
     };
+    iconBadgeCircleColor: string;
     iconWrapperSizes: {
         sm: number;
         md: number;
         lg: number;
     };
+    accordionItemDefaultLabelTag: string;
     rockerButtonGap: string;
 };

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/customProperties/index.js

@@ -18,7 +18,13 @@ var _customProperties = require("../../../themes/next-gen/customProperties");
 var _icons = _interopRequireDefault(require("./icons"));
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+var backgroundBaseColor = '#23282e';
+var defaultIconColor = 'gray-400';
+var iFrameContentDivBackgroundColor = backgroundBaseColor;
 var nextGenDarkThemeValues = _objectSpread(_objectSpread({}, _customProperties.nextGenThemeValues), {}, {
-  icons: _icons["default"]
+  backgroundBaseColor: backgroundBaseColor,
+  iFrameContentDivBackgroundColor: iFrameContentDivBackgroundColor,
+  icons: _icons["default"],
+  defaultIconColor: defaultIconColor
 });
 exports.nextGenDarkThemeValues = nextGenDarkThemeValues;

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/variants/buttons.d.ts

@@ -213,6 +213,49 @@ declare const buttons: {
                 };
             };
         };
+        inverted: {
+            borderColor: string;
+            path: {
+                fill: string;
+            };
+            '&.is-pressed': {
+                backgroundColor: string;
+                borderColor: string;
+            };
+            '&.is-hovered': {
+                border: string;
+                borderColor: string;
+                backgroundColor: string;
+            };
+            '&.is-focused': {
+                outline: string;
+                outlineColor: string;
+                outlineOffset: string;
+            };
+        };
+        hintButton: {
+            path: {
+                fill: string;
+            };
+            '&.is-focused': {
+                outline: string;
+                outlineColor: string;
+                outlineOffset: string;
+            };
+            '&.is-hovered': {
+                path: {
+                    fill: string;
+                };
+                backgroundColor: string;
+            };
+            '&.is-pressed': {
+                backgroundColor: string;
+                borderColor: string;
+                path: {
+                    fill: string;
+                };
+            };
+        };
         nextGen: {
             '&.is-hovered': {
                 path: {
@@ -252,6 +295,29 @@ declare const buttons: {
                 };
             };
         };
+        modalCloseButton: {
+            path: {
+                fill: string;
+            };
+            '&.is-focused': {
+                outline: string;
+                outlineColor: string;
+                outlineOffset: string;
+            };
+            '&.is-hovered': {
+                path: {
+                    fill: string;
+                };
+                backgroundColor: string;
+            };
+            '&.is-pressed': {
+                backgroundColor: string;
+                borderColor: string;
+                path: {
+                    fill: string;
+                };
+            };
+        };
         messageCloseButton: {
             '&.is-hovered': {
                 backgroundColor: string;

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/variants/buttons.js

@@ -41,8 +41,25 @@ var baseIconButton = {
     }
   }
 };
+var hintButton = _objectSpread({}, baseIconButton);
 var iconButtons = {
   base: _objectSpread({}, baseIconButton),
+  inverted: _objectSpread(_objectSpread({}, baseIconButton), {}, {
+    borderColor: 'transparent !important',
+    path: {
+      fill: 'black'
+    },
+    '&.is-pressed': {
+      backgroundColor: _chromaJs["default"].mix('white', 'black', 0.125, 'rgb').hex(),
+      borderColor: _chromaJs["default"].mix('white', 'black', 0.125, 'rgb').hex()
+    },
+    '&.is-hovered': {
+      border: 'none !important',
+      borderColor: 'none !important',
+      backgroundColor: 'white'
+    }
+  }),
+  hintButton: hintButton,
   nextGen: {
     '&.is-hovered': {
       path: {
@@ -67,6 +84,7 @@ var iconButtons = {
       backgroundColor: 'gray-700'
     }
   }),
+  modalCloseButton: _objectSpread({}, baseIconButton),
   messageCloseButton: _objectSpread(_objectSpread({}, baseIconButton), {}, {
     '&.is-hovered': {
       backgroundColor: '#455469'

package/lib/cjs/styles/themeOverrides/nextGenDarkMode/variants/forms.d.ts

@@ -32,6 +32,14 @@ declare const _default: {
             color: string;
         };
     };
+    label: {
+        radioGroup: {
+            color: string;
+        };
+        radio: {
+            color: string;
+        };
+    };
     select: {
         option: {
             backgroundColor: string;
@@ -64,5 +72,12 @@ declare const _default: {
             color: string;
         };
     };
+    switch: {
+        thumb: {
+            '&.is-selected': {
+                bg: string;
+            };
+        };
+    };
 };
 export default _default;