@junyiacademy/ui-test 1.5.3 → 1.5.7

package/declarations/libs/ui/src/utils/Capitalize.d.ts

@@ -0,0 +1 @@
+export default function capitalize(string: any): any;

package/dist/libs/ui/src/lib/button/Button.js

@@ -6,19 +6,21 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const Button_1 = require("@mui/material/Button");
+const Capitalize_1 = tslib_1.__importDefault(require("../../utils/Capitalize"));
 const StyledButton = styles_1.styled(material_1.Button, {
     shouldForwardProp: (prop) => prop !== 'active',
-})(({ active, theme }) => ({
-    [`&.${Button_1.buttonClasses.outlinedPrimary}`]: {
+})(({ active, color = 'primary', theme }) => ({
+    // For variant: outlined
+    [`&.${Button_1.buttonClasses.outlined}${Capitalize_1.default(color)}`]: {
         backgroundColor: active
-            ? theme.palette.primary.main
+            ? theme.palette[color].main
             : theme.palette.common.white,
-        color: active ? theme.palette.common.white : theme.palette.primary.main,
-        borderColor: theme.palette.primary.main,
+        color: active ? theme.palette.common.white : theme.palette[color].main,
+        borderColor: theme.palette[color].main,
         '&:hover': {
             backgroundColor: active
-                ? theme.palette.primary.main
-                : styles_1.alpha(theme.palette.primary.main, 0.1),
+                ? theme.palette[color].main
+                : styles_1.alpha(theme.palette[color].main, 0.1),
         },
         [`&.${Button_1.buttonClasses.disabled}`]: {
             backgroundColor: theme.palette.common.white,
@@ -26,31 +28,15 @@ const StyledButton = styles_1.styled(material_1.Button, {
             color: theme.palette.action.disabled,
         },
     },
-    [`&.${Button_1.buttonClasses.outlinedSecondary}`]: {
-        backgroundColor: active
-            ? theme.palette.secondary.main
-            : theme.palette.common.white,
-        color: active ? theme.palette.common.white : theme.palette.secondary.main,
-        borderColor: theme.palette.secondary.main,
-        '&:hover': {
-            backgroundColor: active
-                ? theme.palette.secondary.main
-                : styles_1.alpha(theme.palette.secondary.main, 0.1),
-        },
-        [`&.${Button_1.buttonClasses.disabled}`]: {
-            backgroundColor: theme.palette.common.white,
-            borderColor: theme.palette.action.disabledBackground,
-            color: theme.palette.action.disabled,
-        },
-    },
-    [`&.${Button_1.buttonClasses.textPrimary}`]: {
+    // For variant: text
+    [`&.${Button_1.buttonClasses.text}${Capitalize_1.default(color)}`]: {
         '&:hover': {
-            backgroundColor: styles_1.alpha(theme.palette.primary.main, 0.1),
+            backgroundColor: styles_1.alpha(theme.palette[color].main, 0.1),
         },
     },
-    [`&.${Button_1.buttonClasses.textSecondary}`]: {
+    [`&.${Button_1.buttonClasses.text}${Capitalize_1.default(color)}`]: {
         '&:hover': {
-            backgroundColor: styles_1.alpha(theme.palette.secondary.main, 0.1),
+            backgroundColor: styles_1.alpha(theme.palette[color].main, 0.1),
         },
     },
 }));

package/dist/libs/ui/src/lib/button-group/ButtonGroup.js

@@ -6,6 +6,8 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const ButtonGroup_1 = require("@mui/material/ButtonGroup");
+//utils
+// self-defined-components
 const StyledButtonGroup = styles_1.styled(material_1.ButtonGroup)(({ theme }) => ({
     [`& .${ButtonGroup_1.buttonGroupClasses.groupedOutlinedPrimary}.${ButtonGroup_1.buttonGroupClasses.grouped}.${ButtonGroup_1.buttonGroupClasses.disabled}`]: {
         borderColor: styles_1.alpha(theme.palette.primary.main, 0.5),

package/dist/libs/ui/src/lib/radio/Radio.js

@@ -7,6 +7,7 @@ const styles_1 = require("@mui/material/styles");
 const material_1 = require("@mui/material");
 const FormControlLabel_1 = require("@mui/material/FormControlLabel");
 const Radio_1 = require("@mui/material/Radio");
+// self-defined-components
 const StyledFormControlLabel = styles_1.styled(material_1.FormControlLabel)(({ theme }) => ({
     [`& .${FormControlLabel_1.formControlLabelClasses.label}`]: {
         color: theme.palette.text.secondary,

package/dist/libs/ui/src/lib/select/OutlinedSelect.js

@@ -52,7 +52,7 @@ const StyledOutlinedInput = styles_1.styled(material_1.OutlinedInput)(({ theme }
     },
     [`& .${OutlinedInput_1.outlinedInputClasses.input}`]: {
         color: theme.palette.text.primary,
-        ['&:focus']: {
+        '&:focus': {
             background: 'rgba(0,0,0,0)',
         },
     },
@@ -60,8 +60,8 @@ const StyledOutlinedInput = styles_1.styled(material_1.OutlinedInput)(({ theme }
 const OutlinedSelect = ({ label, helperText, InputProps, SelectProps, className, children, color = 'primary', size = 'small', paperMaxHeight = 'auto', error = false, hasLabel = true, hasShrink = false, value = '', disabled = false, }) => {
     const hasHelperText = !!helperText;
     return (react_1.default.createElement(StyledFormControl, { size: size, disabled: disabled, error: error, color: color, className: className },
-        hasLabel && (react_1.default.createElement(StyledInputLabel, { color: color, variant: 'outlined', shrink: hasShrink ? true : undefined }, label)),
-        react_1.default.createElement(material_1.Select, Object.assign({ label: label, value: value, MenuProps: {
+        hasLabel && (react_1.default.createElement(StyledInputLabel, { color: color, shrink: hasShrink ? true : undefined }, label)),
+        react_1.default.createElement(material_1.Select, Object.assign({ value: value, label: hasLabel ? label : undefined, MenuProps: {
                 PaperProps: {
                     sx: {
                         maxHeight: paperMaxHeight,
@@ -76,7 +76,7 @@ const OutlinedSelect = ({ label, helperText, InputProps, SelectProps, className,
                     vertical: 'top',
                     horizontal: 'left',
                 },
-            }, input: react_1.default.createElement(StyledOutlinedInput, Object.assign({ color: color, label: hasLabel ? label : '', disabled: disabled }, InputProps)) }, SelectProps), children),
+            }, input: react_1.default.createElement(StyledOutlinedInput, Object.assign({ color: color, label: hasLabel ? label : undefined, disabled: disabled }, InputProps)) }, SelectProps), children),
         hasHelperText && react_1.default.createElement(material_1.FormHelperText, null, helperText)));
 };
 exports.OutlinedSelect = OutlinedSelect;

package/dist/libs/ui/src/lib/select/StandardSelect.js

@@ -48,7 +48,6 @@ function StandardSelect({ label, helperText, InputProps, SelectProps, className,
                 PaperProps: {
                     sx: {
                         maxHeight: paperMaxHeight,
-                        top: '30px !important',
                     },
                 },
                 anchorOrigin: {

package/dist/libs/ui/src/lib/topic-filter/TopicFilter.js

@@ -107,7 +107,7 @@ const TopicFilter = ({ topicTree, onTopicSelected, isLastLayer, hasArrow, initSe
                         });
                     },
                 } },
-                react_1.default.createElement(SelectMenuItem_1.default, { disabled: true }, LABEL),
+                react_1.default.createElement(SelectMenuItem_1.default, { disabled: true, value: '' }, LABEL),
                 layeredTopic.childTopics.map((childTopic) => (react_1.default.createElement(SelectMenuItem_1.default, { key: childTopic.id, value: childTopic.id, "data-testid": `layered-menuitem-${layerNumber}`, "data-is-content-topic": childTopic.isContentTopic }, childTopic.title)))),
             hasArrow && layerNumber !== layeredTopicList.length - 1 && (react_1.default.createElement(ArrowRightRounded_1.default, { sx: (theme) => ({
                     margin: theme.spacing(-1, -1.5),

package/dist/libs/ui/src/utils/Capitalize.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function capitalize(string) {
+    return string.charAt(0).toUpperCase() + string.slice(1);
+}
+exports.default = capitalize;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@junyiacademy/ui-test",
-  "version": "1.5.3",
+  "version": "1.5.7",
   "description": "junyiacademy ui library",
   "main": "./dist/libs/ui/src/index.js",
   "typings": "./declarations/libs/ui/src/index.d.ts",