@aboutbits/react-ui - npm Package Compare versions

Comparing version 0.0.16 to 0.0.17

components/content/ContentError/ContentError.js

@@ -7,10 +7,9 @@ "use strict";
 var button_1 = require("../../button");
-var ThemeContext_1 = require("../../../framework/theme/ThemeContext");
-var InternationalizationContext_1 = require("../../../framework/internationalization/InternationalizationContext");
+var framework_1 = require("../../../framework");
 var ContentError = function (_a) {
     var icon = _a.icon, children = _a.children;
-    var content = ThemeContext_1.useTheme().content;
-    var internationalization = InternationalizationContext_1.useInternationalization();
+    var content = framework_1.useTheme().content;
+    var internationalization = framework_1.useInternationalization();
     return (jsx_runtime_1.jsxs("div", tslib_1.__assign({ className: content.error.base }, { children: [jsx_runtime_1.jsx("div", tslib_1.__assign({ className: content.error.icon.base }, { children: icon }), void 0), jsx_runtime_1.jsx("div", tslib_1.__assign({ className: content.error.title.base }, { children: internationalization.translate('shared.error.title') }), void 0), jsx_runtime_1.jsx("div", tslib_1.__assign({ className: content.error.children.base }, { children: children }), void 0), jsx_runtime_1.jsx(button_1.Button, tslib_1.__assign({ onClick: function () { return window.location.reload(); }, className: content.error.button.base }, { children: internationalization.translate('shared.button.reload') }), void 0)] }), void 0));
 };
 exports.ContentError = ContentError;

components/dialog/select/SelectDialog.js

@@ -8,9 +8,9 @@ "use strict";
 var dialog_1 = require("@reach/dialog");
-var ThemeContext_1 = require("../../../framework/theme/ThemeContext");
+var framework_1 = require("../../../framework");
 var SelectDialogHeader_1 = require("./SelectDialogHeader");
 var SelectDialog = function (_a) {
     var title = _a.title, iconLabel = _a.iconLabel, search = _a.search, onDismiss = _a.onDismiss, actions = _a.actions, isOpen = _a.isOpen, children = _a.children, dialogLabel = _a.dialogLabel;
-    var dialog = ThemeContext_1.useTheme().dialog;
+    var dialog = framework_1.useTheme().dialog;
     return (jsx_runtime_1.jsxs(dialog_1.Dialog, tslib_1.__assign({ isOpen: isOpen, onDismiss: onDismiss, "aria-label": dialogLabel, className: classnames_1.default(dialog.select.base, dialog.select.normal) }, { children: [jsx_runtime_1.jsx(SelectDialogHeader_1.SelectDialogHeader, { onDismiss: onDismiss, title: title, iconLabel: iconLabel, search: search, actions: actions }, void 0), children] }), void 0));
 };
 exports.SelectDialog = SelectDialog;

framework/theme/theme.js

@@ -7,6 +7,6 @@ "use strict";
         input: {
-            base: 'block w-full border p-3 focus:ring-0 appearance-none outline-none',
-            normal: 'border-white focus:border-primary-400 bg-transparent text-white placeholder-gray-100',
-            error: 'border-critical focus:border-critical bg-transparent text-white placeholder-gray-100',
-            disabled: 'border-gray text-gray bg-gray-100',
+            base: 'block w-full border p-3 focus:ring-0 appearance-none outline-none rounded-md',
+            normal: 'border-gray-700 focus:border-primary-400 bg-transparent text-black placeholder-gray-700',
+            error: 'border-critical focus:border-critical bg-transparent text-black placeholder-gray-700',
+            disabled: 'border-gray-700 text-gray-700 bg-gray-100',
         },
@@ -18,5 +18,5 @@ inputError: {
             base: 'block pb-1 font-bold text-xs',
-            normal: 'text-white',
+            normal: 'text-black',
             error: 'text-critical',
-            disabled: 'text-gray',
+            disabled: 'text-gray-700',
         },
@@ -90,3 +90,3 @@ form: {
             base: 'absolute top-1/2 left-1/2 p-5 min-w-dialog max-w-min space-y-4 transform -translate-x-1/2 -translate-y-1/2 outline-none',
-            normal: 'bg-white',
+            normal: 'bg-white rounded',
             title: {
@@ -102,3 +102,3 @@ base: 'text-xl',
             base: 'md:my-20 mx-auto md:w-full md:max-w-3xl',
-            normal: 'bg-white md:bg-transparent',
+            normal: 'bg-white md:bg-transparent rounded-md overflow-hidden',
             header: {
@@ -112,3 +112,3 @@ base: 'p-0 lg:p-4',
         action: {
-            base: 'flex flex-col lg:flex-row space-y-4 lg:space-y-0 lg:space-x-4 mx-4 lg:mx-0',
+            base: 'flex flex-col lg:flex-row space-y-4 lg:space-y-0 lg:space-x-4 mx-0',
             variant: {
@@ -123,3 +123,3 @@ start: 'lg:justify-start',
         section: {
-            base: 'lg:shadow-md',
+            base: '-mx-4 lg:mx-0 lg:shadow-md lg:rounded-md overflow-hidden',
             normal: 'bg-white',
@@ -129,7 +129,7 @@ },
             base: 'pt-5 pb-10 px-4 lg:px-5',
-            normal: 'bg-gray-700',
+            normal: 'bg-white',
         },
         contentList: {
             base: 'space-y-px',
-            normal: 'bg-gray-300',
+            normal: 'bg-gray',
             empty: {
@@ -142,3 +142,3 @@ base: 'justify-center py-4',
                     base: 'fill-current',
-                    normal: 'text-withe',
+                    normal: 'text-white',
                 },
@@ -159,3 +159,3 @@ iconContainer: {
             base: 'flex items-center min-h-14 px-4 lg:px-5',
-            normal: 'bg-gray-700 text-white',
+            normal: 'bg-white text-black',
         },
@@ -169,3 +169,3 @@ listItemWithAction: {
         descriptionItem: {
-            base: 'flex flex-col pb-2 space-y-1 text-white border-b border-gray-300',
+            base: 'flex flex-col pb-2 space-y-1 text-black border-b border-gray',
             title: {
@@ -177,9 +177,12 @@ base: 'text-sm',
             base: 'justify-between space-x-4',
-            normal: 'hover:bg-gray-600',
+            normal: 'hover:bg-primary-50',
         },
         listItemLink: {
             base: 'justify-between space-x-4',
-            normal: 'hover:bg-gray-600 active:bg-gray-600',
+            normal: 'hover:bg-primary-50 active:bg-primary-50',
         },
-        header: { base: 'px-4 lg:px-5 pt-5 pb-3 bg-white', normal: 'bg-white' },
+        header: {
+            base: 'px-4 lg:px-5 pt-5 pb-3',
+            normal: 'bg-gray-300 border-b border-gray',
+        },
         title: { base: 'text-xs font-bold uppercase', normal: 'text-black' },
@@ -267,4 +270,4 @@ headerWithAction: {
             size: {
-                sm: 'border px-2 py-1',
-                md: 'border-2 px-4 py-3 text-lg leading-normal',
+                sm: 'border px-2 py-1 rounded',
+                md: 'border-2 px-4 py-3 text-lg leading-normal rounded-md',
             },
@@ -290,4 +293,4 @@ variantTone: {
                     critical: 'text-critical hover:text-critical-700 underline',
-                    secondary: 'text-secondary hover:text-secondary-100 ',
-                    disabled: ' background-gray-50 text-gray',
+                    secondary: 'text-secondary hover:text-secondary-100',
+                    disabled: 'background-gray-50 text-gray',
                 },
@@ -294,0 +297,0 @@ },

package.json

 {
   "name": "@aboutbits/react-ui",
-  "version": "0.0.16",
+  "version": "0.0.17",
   "main": "index.js",
@@ -5,0 +5,0 @@ "types": "index.d.ts",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

3555

increased by0.06%

Worsened metrics

Total package byte prevSize

162952

decreased by-0.02%

No dependency changes