@fixefy/fixefy-ui-components 0.0.18 → 0.0.20

package/dist-cjs/Tag/Tag.jsx

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tag = void 0;
+const fixefy_ui_utils_1 = require("@fixefy/fixefy-ui-utils/");
+const material_1 = require("@mui/material");
+const tag_styles_1 = require("./styles/tag.styles");
+const Tag = ({ name, count = 0 }) => (<material_1.Box display="flex" alignItems="center" justifyContent="center" sx={{ maxWidth: 'fit-content', mb: 1 }}>
+      <tag_styles_1.StyledTag name={name}>
+        <tag_styles_1.StyledLabel>{(0, fixefy_ui_utils_1.titleCase)(name)}</tag_styles_1.StyledLabel>
+      </tag_styles_1.StyledTag>
+      <tag_styles_1.StyledCount name={name}>{count}</tag_styles_1.StyledCount>
+    </material_1.Box>);
+exports.Tag = Tag;

package/dist-cjs/Tag/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tag = void 0;
+var Tag_1 = require("./Tag");
+Object.defineProperty(exports, "Tag", { enumerable: true, get: function () { return Tag_1.Tag; } });

package/dist-cjs/Tag/styles/tag.styles.jsx

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledCount = exports.StyledLabel = exports.StyledTag = void 0;
+const styles_1 = require("@mui/material/styles");
+const material_1 = require("@mui/material");
+exports.StyledTag = (0, styles_1.styled)(material_1.Box)(({ theme, name }) => ({
+    background: name === 'in_dispute' ? '#56CCF2' : name === '' ? '#BB6BD9' : theme.palette.reconcilation[name].background,
+    borderRadius: 8,
+    padding: '2px 8px',
+    border: `1px solid ${name === 'in_dispute' ? '#56CCF2' : name === '' ? '#BB6BD9' : theme.palette.reconcilation[name].border}`,
+    display: 'flex',
+    alignItems: 'center',
+    width: 'fit-content',
+}));
+exports.StyledLabel = (0, styles_1.styled)(material_1.Typography)(({ theme }) => (Object.assign(Object.assign({}, theme.typography.body1), { lineHeight: '20px', color: theme.palette.common.white })));
+exports.StyledCount = (0, styles_1.styled)(material_1.Typography)(({ theme, name }) => (Object.assign(Object.assign({}, theme.typography.subtitle2), { lineHeight: '16px', fontWeight: 700, color: name === 'in_dispute' ? '#56CCF2' : name === '' ? '#BB6BD9' : theme.palette.reconcilation[name].background, marginLeft: 8 })));

package/dist-cjs/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tag = void 0;
+var Tag_1 = require("./Tag/");
+Object.defineProperty(exports, "Tag", { enumerable: true, get: function () { return Tag_1.Tag; } });

package/dist-cjs/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "commonjs"
+}

package/dist-es/Tag/Tag.jsx

@@ -0,0 +1,9 @@
+import { titleCase } from '@fixefy/fixefy-ui-utils/';
+import { Box } from '@mui/material';
+import { StyledCount, StyledLabel, StyledTag } from './styles/tag.styles';
+export const Tag = ({ name, count = 0 }) => (<Box display="flex" alignItems="center" justifyContent="center" sx={{ maxWidth: 'fit-content', mb: 1 }}>
+      <StyledTag name={name}>
+        <StyledLabel>{titleCase(name)}</StyledLabel>
+      </StyledTag>
+      <StyledCount name={name}>{count}</StyledCount>
+    </Box>);

package/dist-es/Tag/index.js

@@ -0,0 +1 @@
+export { Tag } from "./Tag";

package/dist-es/Tag/styles/tag.styles.jsx

@@ -0,0 +1,23 @@
+import { styled } from '@mui/material/styles';
+import { Box, Typography } from '@mui/material';
+export const StyledTag = styled(Box)(({ theme, name }) => ({
+    background: name === 'in_dispute' ? '#56CCF2' : name === '' ? '#BB6BD9' : theme.palette.reconcilation[name].background,
+    borderRadius: 8,
+    padding: '2px 8px',
+    border: `1px solid ${name === 'in_dispute' ? '#56CCF2' : name === '' ? '#BB6BD9' : theme.palette.reconcilation[name].border}`,
+    display: 'flex',
+    alignItems: 'center',
+    width: 'fit-content',
+}));
+export const StyledLabel = styled(Typography)(({ theme }) => ({
+    ...theme.typography.body1,
+    lineHeight: '20px',
+    color: theme.palette.common.white,
+}));
+export const StyledCount = styled(Typography)(({ theme, name }) => ({
+    ...theme.typography.subtitle2,
+    lineHeight: '16px',
+    fontWeight: 700,
+    color: name === 'in_dispute' ? '#56CCF2' : name === '' ? '#BB6BD9' : theme.palette.reconcilation[name].background,
+    marginLeft: 8,
+}));

package/dist-es/index.js

@@ -0,0 +1 @@
+export { Tag } from "./Tag/";

package/dist-es/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}

package/dist-types/Tag/Tag.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { TagProps } from './tag_types';
+export declare const Tag: ({ name, count }: TagProps) => import("react").JSX.Element;

package/dist-types/Tag/index.d.ts

@@ -0,0 +1,2 @@
+export { Tag } from "./Tag";
+export type { TagProps } from "./tag_types";

package/dist-types/Tag/styles/tag.styles.d.ts

@@ -0,0 +1,3 @@
+export declare const StyledTag: StyledComponent<ComponentProps & AdditionalProps, SpecificComponentProps, JSXProps>;
+export declare const StyledLabel: StyledComponent<ComponentProps, SpecificComponentProps, JSXProps>;
+export declare const StyledCount: StyledComponent<ComponentProps & AdditionalProps, SpecificComponentProps, JSXProps>;

package/dist-types/index.d.ts

@@ -0,0 +1,2 @@
+export { Tag } from "./Tag/";
+export type { TagProps } from "./Tag/tag_types";

package/package.json

@@ -29,7 +29,7 @@
 		"url": "https://github.com/Fixefy/fixefy-ui-components.git"
 	},
 	"scripts": {
-		"build": "swc src -d dist",
+		"build": "tsc -p ./tsconfig.cjs.json && tsc -p ./tsconfig.es.json && tsc -p ./tsconfig.types.json && yarn build:copy swc src -d dist",
 		"build:copy": "node ../../scripts/copy-files-ex.js",
 		"pre_release": "yarn clean && yarn && yarn build",
 		"pre_release_base": "yarn clean:base && yarn && yarn build",
@@ -62,5 +62,5 @@
 		}
 	},
 	"types": "./dist-types/index.d.ts",
-	"version": "0.0.18"
+	"version": "0.0.20"
 }