@mrshmllw/smores-react 2.1.26 → 2.1.27

package/dist/Tag/Tag.d.ts

@@ -1,11 +1,20 @@
 import { FC } from 'react';
 import { Color } from '../theme';
-export declare type TagProps = {
+export declare type DefaultProps = {
     label: string;
     className?: string;
     color: Color;
+    typo?: string;
+};
+declare type GradientProps = {
     bgColor: Color;
     borderColor: Color;
-    typo?: string;
+    bgGradient?: boolean;
+} | {
+    bgColor?: Color;
+    borderColor?: Color;
+    bgGradient: boolean;
 };
+export declare type TagProps = DefaultProps & GradientProps;
 export declare const Tag: FC<TagProps>;
+export {};

package/dist/Tag/Tag.js

@@ -2,15 +2,17 @@ import React from 'react';
 import styled from 'styled-components';
 import { Text } from '../Text';
 import { theme } from '../theme';
-export const Tag = ({ label, color, borderColor, bgColor, className, typo, }) => (React.createElement(Wrapper, { bgColor: bgColor, className: className, borderColor: borderColor },
+export const Tag = ({ label, color, borderColor, bgColor, className, typo, bgGradient = false, }) => (React.createElement(Wrapper, { bgColor: bgColor, className: className, borderColor: borderColor, bgGradient: bgGradient },
     React.createElement(TagText, { tag: "span", typo: typo !== null && typo !== void 0 ? typo : 'label', color: color }, label)));
 const Wrapper = styled.div `
-  background-color: ${({ bgColor }) => theme.colors[bgColor]};
+  background-color: ${({ bgColor }) => bgColor && theme.colors[bgColor]};
+  background: ${({ bgGradient }) => bgGradient &&
+    `linear-gradient(90deg, rgba(247, 46, 73, 1) 0%, rgba(246, 148, 210, 1) 100%)`};
   border-radius: 8px;
-  border: 1px solid ${({ borderColor }) => theme.colors[borderColor]};
+  border: ${({ borderColor }) => borderColor && `1px solid ${theme.colors[borderColor]}`};
   box-sizing: border-box;
   display: inline-flex;
-  height: 23px;
+  height: ${({ borderColor }) => (borderColor ? '23px' : '25px')};
   padding: 5px 12px;
 `;
 const TagText = styled(Text) `

package/dist/Tag/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sourceRoot":"","sources":["../../src/Tag/Tag.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAS,KAAK,EAAE,MAAM,UAAU,CAAA;AAWvC,MAAM,CAAC,MAAM,GAAG,GAAiB,CAAC,EAChC,KAAK,EACL,KAAK,EACL,WAAW,EACX,OAAO,EACP,SAAS,EACT,IAAI,GACL,EAAE,EAAE,CAAC,CACJ,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,WAAW;IACvE,oBAAC,OAAO,IAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAE,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,OAAO,EAAE,KAAK,EAAE,KAAK,IACpD,KAAK,CACE,CACF,CACX,CAAA;AAID,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAc;sBAClB,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;;sBAEtC,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC;;;;;CAKnE,CAAA;AAED,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;CAK3B,CAAA"}
+{"version":3,"file":"Tag.js","sourceRoot":"","sources":["../../src/Tag/Tag.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAS,KAAK,EAAE,MAAM,UAAU,CAAA;AAyBvC,MAAM,CAAC,MAAM,GAAG,GAAiB,CAAC,EAChC,KAAK,EACL,KAAK,EACL,WAAW,EACX,OAAO,EACP,SAAS,EACT,IAAI,EACJ,UAAU,GAAG,KAAK,GACnB,EAAE,EAAE,CAAC,CACJ,oBAAC,OAAO,IACN,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU;IAEtB,oBAAC,OAAO,IAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAE,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,OAAO,EAAE,KAAK,EAAE,KAAK,IACpD,KAAK,CACE,CACF,CACX,CAAA;AAID,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAc;sBAClB,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,OAAO,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;gBACvD,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAC/B,UAAU;IACV,8EAA8E;;YAEtE,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAC5B,WAAW,IAAI,aAAa,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE;;;YAG/C,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC;;CAE/D,CAAA;AAED,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;CAK3B,CAAA"}

package/dist/Tag/Tag.stories.d.ts

@@ -6,3 +6,4 @@ declare const _default: {
 };
 export default _default;
 export declare const Default: any;
+export declare const BgGradient: any;

package/dist/Tag/Tag.stories.js

@@ -17,4 +17,10 @@ Default.argTypes = {
     as: { table: { disable: true } },
     forwardedAs: { table: { disable: true } },
 };
+export const BgGradient = Template.bind({});
+BgGradient.args = {
+    label: 'This is a gradient background tag',
+    bgGradient: true,
+    color: 'white',
+};
 //# sourceMappingURL=Tag.stories.js.map

package/dist/Tag/Tag.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.stories.js","sourceRoot":"","sources":["../../src/Tag/Tag.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,GAAG,EAAY,MAAM,OAAO,CAAA;AAErC,eAAe;IACb,KAAK,EAAE,KAAK;IACZ,SAAS,EAAE,GAAG;CACf,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAe,EAAE,EAAE,CAAC,oBAAC,GAAG,oBAAK,KAAK,EAAI,CAAA;AAExD,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,KAAK,EAAE,eAAe;IACtB,OAAO,EAAE,SAAS;IAClB,WAAW,EAAE,SAAS;IACtB,KAAK,EAAE,OAAO;CACf,CAAA;AAED,OAAO,CAAC,QAAQ,GAAG;IACjB,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACnC,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IAChC,WAAW,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;CAC1C,CAAA"}
+{"version":3,"file":"Tag.stories.js","sourceRoot":"","sources":["../../src/Tag/Tag.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,GAAG,EAAY,MAAM,OAAO,CAAA;AAErC,eAAe;IACb,KAAK,EAAE,KAAK;IACZ,SAAS,EAAE,GAAG;CACf,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAe,EAAE,EAAE,CAAC,oBAAC,GAAG,oBAAK,KAAK,EAAI,CAAA;AAExD,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,KAAK,EAAE,eAAe;IACtB,OAAO,EAAE,SAAS;IAClB,WAAW,EAAE,SAAS;IACtB,KAAK,EAAE,OAAO;CACf,CAAA;AAED,OAAO,CAAC,QAAQ,GAAG;IACjB,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACnC,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IAChC,WAAW,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;CAC1C,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE3C,UAAU,CAAC,IAAI,GAAG;IAChB,KAAK,EAAE,mCAAmC;IAC1C,UAAU,EAAE,IAAI;IAChB,KAAK,EAAE,OAAO;CACf,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mrshmllw/smores-react",
-  "version": "2.1.26",
+  "version": "2.1.27",
   "main": "./dist/index.js",
   "description": "Collection of React components used by Marshmallow Technology",
   "keywords": [
@@ -41,7 +41,7 @@
     "@testing-library/react": "^12.0.0",
     "@testing-library/react-hooks": "^8.0.0",
     "@types/jest": "^28.1.1",
-    "@types/node": "^17.0.35",
+    "@types/node": "^18.0.0",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.9",
     "@types/styled-components": "^5.1.3",