@bikdotai/bik-component-library 0.0.23-tag.3 → 0.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/stepper/WorkingStepper.d.ts +0 -1
- package/dist/cjs/components/tag/Tag.d.ts +1 -1
- package/dist/cjs/components/tag/Tag.js +1 -1
- package/dist/cjs/components/tag/Tag.styled.js +5 -7
- package/dist/cjs/components/tag/model.d.ts +4 -23
- package/dist/cjs/components/tag/themes.js +1 -1
- package/dist/esm/components/stepper/WorkingStepper.d.ts +0 -1
- package/dist/esm/components/tag/Tag.d.ts +1 -1
- package/dist/esm/components/tag/Tag.js +1 -1
- package/dist/esm/components/tag/Tag.styled.js +9 -11
- package/dist/esm/components/tag/model.d.ts +4 -23
- package/dist/esm/components/tag/themes.js +1 -1
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { TagProps } from './model';
|
|
3
3
|
export declare const Tag: {
|
|
4
|
-
({ tagText, LeadingIcon, TrailingIcon,
|
|
4
|
+
({ tagText, LeadingIcon, TrailingIcon, theme, type, variant, }: TagProps): JSX.Element;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("../TypographyStyle.js"),r=require("./model.js"),i=require("./Tag.styled.js"),s=require("./themes.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=n(t);const c=t=>{let{tagText:n,LeadingIcon:c,TrailingIcon:o,theme:d="light",type:g="neutral",variant:u="regular"}=t,j=n,p=d,y=g;r.ValidTagTypeMap[u][g]||(y="neutral"),"circle"===u&&(p="dark","number"==typeof j&&j>99&&(j="99+"));const h={height:16,width:16,color:s.getTagIconColor(d,y),style:{display:"block"}};return e.jsx(i.Tag,Object.assign({theme:p,type:g,variant:u},{children:e.jsxs("div",Object.assign({className:"container"},{children:[c&&e.jsx("div",Object.assign({className:"icon-trailing"},{children:l.default.createElement(c,h)})),e.jsx(a.BodyCaption,Object.assign({className:"text"},{children:j})),o&&e.jsx("div",Object.assign({className:"icon-leading"},{children:l.default.createElement(o,h)}))]}))}))};c.displayName="Tag",exports.Tag=c;
|
|
@@ -1,28 +1,26 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("./themes.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const a=t(e).default.div`
|
|
2
2
|
cursor: default;
|
|
3
3
|
${e=>"regular"===e.variant?"display: block;":""}
|
|
4
4
|
${e=>"circle"===e.variant&&"height: 20px;"}
|
|
5
5
|
.container {
|
|
6
6
|
display: flex;
|
|
7
7
|
gap: 6px;
|
|
8
|
-
padding: ${e=>
|
|
8
|
+
padding: ${e=>r.getPadding(e.variant)};
|
|
9
9
|
|
|
10
|
-
background-color: ${e=>
|
|
10
|
+
background-color: ${e=>r.getBackgroundColor(e.theme,e.type)};
|
|
11
11
|
|
|
12
12
|
border-radius: ${e=>"regular"===e.variant?"4px":"12px"};
|
|
13
13
|
|
|
14
|
-
${e=>"light"===e.theme&&`border: 1px solid ${
|
|
14
|
+
${e=>"light"===e.theme&&`border: 1px solid ${r.generateBorder(e.type)};`}
|
|
15
15
|
|
|
16
16
|
.text {
|
|
17
|
-
color: ${e=>
|
|
17
|
+
color: ${e=>r.getTextColor(e.theme,e.type)};
|
|
18
18
|
}
|
|
19
19
|
|
|
20
20
|
.icon-trailing {
|
|
21
|
-
all: unset;
|
|
22
21
|
}
|
|
23
22
|
|
|
24
23
|
.icon-leading {
|
|
25
|
-
all: unset;
|
|
26
24
|
}
|
|
27
25
|
}
|
|
28
26
|
`;exports.Tag=a;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
import { MouseEventHandler } from 'react';
|
|
1
|
+
/// <reference types="react" />
|
|
3
2
|
export type TagTheme = 'light' | 'dark';
|
|
4
3
|
export type TagVariant = 'regular' | 'circle';
|
|
5
4
|
export type TagType = 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey';
|
|
@@ -22,7 +21,7 @@ export declare const ValidTagTypeMap: {
|
|
|
22
21
|
grey: boolean;
|
|
23
22
|
};
|
|
24
23
|
};
|
|
25
|
-
export interface TagProps
|
|
24
|
+
export interface TagProps {
|
|
26
25
|
/**
|
|
27
26
|
* Set the theme of the Tag
|
|
28
27
|
* @default default light
|
|
@@ -39,34 +38,16 @@ export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
|
|
|
39
38
|
*/
|
|
40
39
|
variant?: TagVariant;
|
|
41
40
|
/**
|
|
42
|
-
* The icon component that is the
|
|
41
|
+
* The icon component that is the left of the text
|
|
43
42
|
* Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
|
|
44
43
|
* @default undefined
|
|
45
44
|
*/
|
|
46
45
|
TrailingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
|
|
47
46
|
/**
|
|
48
|
-
* The right
|
|
49
|
-
* @default trailing-icon
|
|
50
|
-
*/
|
|
51
|
-
trailingIconId?: string;
|
|
52
|
-
/**
|
|
53
|
-
* The left icon on click event, defaults to () => {}
|
|
54
|
-
*/
|
|
55
|
-
onTrailingIconClicked?: MouseEventHandler<HTMLButtonElement>;
|
|
56
|
-
/**
|
|
57
|
-
* The icon component that is to the left of the text
|
|
47
|
+
* The icon component that is to the right of the text
|
|
58
48
|
* Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
|
|
59
49
|
* @default undefined
|
|
60
50
|
*/
|
|
61
51
|
LeadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
|
|
62
|
-
/**
|
|
63
|
-
* The right icon on click event, defaults to () => {}
|
|
64
|
-
*/
|
|
65
|
-
onLeadingIconClicked?: MouseEventHandler<HTMLButtonElement>;
|
|
66
|
-
/**
|
|
67
|
-
* The left icon id,
|
|
68
|
-
* @default leading-icon
|
|
69
|
-
*/
|
|
70
|
-
leadingIconId?: string;
|
|
71
52
|
tagText: string | number;
|
|
72
53
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("../../constants/Theme.js");const e={blue:{iconColor:{light:r.COLORS.content.blue,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.blue,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.blue.lightAlt,backgroundColor:{light:r.COLORS.background.blue.light,dark:r.COLORS.content.blue,circle:r.COLORS.content.blue}},purple:{iconColor:{light:r.COLORS.background.inverseLight,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.background.inverseLight,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.brandLightAlt,backgroundColor:{light:r.COLORS.background.brandLight,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverse}},negative:{iconColor:{light:r.COLORS.content.negative,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.negative,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.negative.lightAlt,backgroundColor:{light:r.COLORS.background.negative.light,dark:r.COLORS.background.negative.vibrant,circle:r.COLORS.background.negative.vibrant}},positive:{iconColor:{light:r.COLORS.content.positive,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.positive,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.positive.lightAlt,backgroundColor:{light:r.COLORS.background.positive.light,dark:r.COLORS.background.positive.vibrant,circle:r.COLORS.background.positive.vibrant}},warning:{iconColor:{light:r.COLORS.content.warning,dark:r.COLORS.content.primary},textColor:{light:r.COLORS.content.warning,dark:r.COLORS.content.primary},border:r.COLORS.stroke.warning.lightAlt,backgroundColor:{light:r.COLORS.background.warning.light,dark:r.COLORS.background.warning.vibrant,circle:r.COLORS.background.warning.vibrant}},neutral:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.subdued,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverseLight}},white:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("../../constants/Theme.js");const e={blue:{iconColor:{light:r.COLORS.content.blue,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.blue,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.blue.lightAlt,backgroundColor:{light:r.COLORS.background.blue.light,dark:r.COLORS.content.blue,circle:r.COLORS.content.blue}},purple:{iconColor:{light:r.COLORS.background.inverseLight,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.background.inverseLight,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.brandLightAlt,backgroundColor:{light:r.COLORS.background.brandLight,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverse}},negative:{iconColor:{light:r.COLORS.content.negative,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.negative,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.negative.lightAlt,backgroundColor:{light:r.COLORS.background.negative.light,dark:r.COLORS.background.negative.vibrant,circle:r.COLORS.background.negative.vibrant}},positive:{iconColor:{light:r.COLORS.content.positive,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.positive,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.positive.lightAlt,backgroundColor:{light:r.COLORS.background.positive.light,dark:r.COLORS.background.positive.vibrant,circle:r.COLORS.background.positive.vibrant}},warning:{iconColor:{light:r.COLORS.content.warning,dark:r.COLORS.content.primary},textColor:{light:r.COLORS.content.warning,dark:r.COLORS.content.primary},border:r.COLORS.stroke.warning.lightAlt,backgroundColor:{light:r.COLORS.background.warning.light,dark:r.COLORS.background.warning.vibrant,circle:r.COLORS.background.warning.vibrant}},neutral:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.subdued,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverseLight}},white:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.subdued,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverseLight}},grey:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.subdued,dark:r.COLORS.content.secondary,circle:r.COLORS.content.secondary}}};exports.generateBorder=r=>e[r].border,exports.getBackgroundColor=(r,t)=>e[t].backgroundColor[r],exports.getPadding=r=>"regular"===r?"4px 8px":"2px 6px",exports.getTagIconColor=(r,t)=>e[t].iconColor[r],exports.getTextColor=(r,t)=>e[t].textColor[r];
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { TagProps } from './model';
|
|
3
3
|
export declare const Tag: {
|
|
4
|
-
({ tagText, LeadingIcon, TrailingIcon,
|
|
4
|
+
({ tagText, LeadingIcon, TrailingIcon, theme, type, variant, }: TagProps): JSX.Element;
|
|
5
5
|
displayName: string;
|
|
6
6
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import a from"react";import{BodyCaption as r}from"../TypographyStyle.js";import{ValidTagTypeMap as i}from"./model.js";import{Tag as n}from"./Tag.styled.js";import{getTagIconColor as s}from"./themes.js";const c=c=>{let{tagText:l,LeadingIcon:o,TrailingIcon:m,theme:g="light",type:d="neutral",variant:p="regular"}=c,h=l,j=g,y=d;i[p][d]||(y="neutral"),"circle"===p&&(j="dark","number"==typeof h&&h>99&&(h="99+"));const b={height:16,width:16,color:s(g,y),style:{display:"block"}};return e(n,Object.assign({theme:j,type:d,variant:p},{children:t("div",Object.assign({className:"container"},{children:[o&&e("div",Object.assign({className:"icon-trailing"},{children:a.createElement(o,b)})),e(r,Object.assign({className:"text"},{children:h})),m&&e("div",Object.assign({className:"icon-leading"},{children:a.createElement(m,b)}))]}))}))};c.displayName="Tag";export{c as Tag};
|
|
@@ -1,28 +1,26 @@
|
|
|
1
|
-
import
|
|
1
|
+
import r from"styled-components";import{getPadding as e,getBackgroundColor as t,generateBorder as i,getTextColor as o}from"./themes.js";const a=r.div`
|
|
2
2
|
cursor: default;
|
|
3
|
-
${
|
|
4
|
-
${
|
|
3
|
+
${r=>"regular"===r.variant?"display: block;":""}
|
|
4
|
+
${r=>"circle"===r.variant&&"height: 20px;"}
|
|
5
5
|
.container {
|
|
6
6
|
display: flex;
|
|
7
7
|
gap: 6px;
|
|
8
|
-
padding: ${e
|
|
8
|
+
padding: ${r=>e(r.variant)};
|
|
9
9
|
|
|
10
|
-
background-color: ${
|
|
10
|
+
background-color: ${r=>t(r.theme,r.type)};
|
|
11
11
|
|
|
12
|
-
border-radius: ${
|
|
12
|
+
border-radius: ${r=>"regular"===r.variant?"4px":"12px"};
|
|
13
13
|
|
|
14
|
-
${
|
|
14
|
+
${r=>"light"===r.theme&&`border: 1px solid ${i(r.type)};`}
|
|
15
15
|
|
|
16
16
|
.text {
|
|
17
|
-
color: ${
|
|
17
|
+
color: ${r=>o(r.theme,r.type)};
|
|
18
18
|
}
|
|
19
19
|
|
|
20
20
|
.icon-trailing {
|
|
21
|
-
all: unset;
|
|
22
21
|
}
|
|
23
22
|
|
|
24
23
|
.icon-leading {
|
|
25
|
-
all: unset;
|
|
26
24
|
}
|
|
27
25
|
}
|
|
28
|
-
`;export{
|
|
26
|
+
`;export{a as Tag};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
import { MouseEventHandler } from 'react';
|
|
1
|
+
/// <reference types="react" />
|
|
3
2
|
export type TagTheme = 'light' | 'dark';
|
|
4
3
|
export type TagVariant = 'regular' | 'circle';
|
|
5
4
|
export type TagType = 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey';
|
|
@@ -22,7 +21,7 @@ export declare const ValidTagTypeMap: {
|
|
|
22
21
|
grey: boolean;
|
|
23
22
|
};
|
|
24
23
|
};
|
|
25
|
-
export interface TagProps
|
|
24
|
+
export interface TagProps {
|
|
26
25
|
/**
|
|
27
26
|
* Set the theme of the Tag
|
|
28
27
|
* @default default light
|
|
@@ -39,34 +38,16 @@ export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
|
|
|
39
38
|
*/
|
|
40
39
|
variant?: TagVariant;
|
|
41
40
|
/**
|
|
42
|
-
* The icon component that is the
|
|
41
|
+
* The icon component that is the left of the text
|
|
43
42
|
* Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
|
|
44
43
|
* @default undefined
|
|
45
44
|
*/
|
|
46
45
|
TrailingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
|
|
47
46
|
/**
|
|
48
|
-
* The right
|
|
49
|
-
* @default trailing-icon
|
|
50
|
-
*/
|
|
51
|
-
trailingIconId?: string;
|
|
52
|
-
/**
|
|
53
|
-
* The left icon on click event, defaults to () => {}
|
|
54
|
-
*/
|
|
55
|
-
onTrailingIconClicked?: MouseEventHandler<HTMLButtonElement>;
|
|
56
|
-
/**
|
|
57
|
-
* The icon component that is to the left of the text
|
|
47
|
+
* The icon component that is to the right of the text
|
|
58
48
|
* Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
|
|
59
49
|
* @default undefined
|
|
60
50
|
*/
|
|
61
51
|
LeadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
|
|
62
|
-
/**
|
|
63
|
-
* The right icon on click event, defaults to () => {}
|
|
64
|
-
*/
|
|
65
|
-
onLeadingIconClicked?: MouseEventHandler<HTMLButtonElement>;
|
|
66
|
-
/**
|
|
67
|
-
* The left icon id,
|
|
68
|
-
* @default leading-icon
|
|
69
|
-
*/
|
|
70
|
-
leadingIconId?: string;
|
|
71
52
|
tagText: string | number;
|
|
72
53
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{COLORS as r}from"../../constants/Theme.js";const n={blue:{iconColor:{light:r.content.blue,dark:r.content.primaryInverse},textColor:{light:r.content.blue,dark:r.content.primaryInverse},border:r.stroke.blue.lightAlt,backgroundColor:{light:r.background.blue.light,dark:r.content.blue,circle:r.content.blue}},purple:{iconColor:{light:r.background.inverseLight,dark:r.content.primaryInverse},textColor:{light:r.background.inverseLight,dark:r.content.primaryInverse},border:r.stroke.brandLightAlt,backgroundColor:{light:r.background.brandLight,dark:r.background.inverse,circle:r.background.inverse}},negative:{iconColor:{light:r.content.negative,dark:r.content.primaryInverse},textColor:{light:r.content.negative,dark:r.content.primaryInverse},border:r.stroke.negative.lightAlt,backgroundColor:{light:r.background.negative.light,dark:r.background.negative.vibrant,circle:r.background.negative.vibrant}},positive:{iconColor:{light:r.content.positive,dark:r.content.primaryInverse},textColor:{light:r.content.positive,dark:r.content.primaryInverse},border:r.stroke.positive.lightAlt,backgroundColor:{light:r.background.positive.light,dark:r.background.positive.vibrant,circle:r.background.positive.vibrant}},warning:{iconColor:{light:r.content.warning,dark:r.content.primary},textColor:{light:r.content.warning,dark:r.content.primary},border:r.stroke.warning.lightAlt,backgroundColor:{light:r.background.warning.light,dark:r.background.warning.vibrant,circle:r.background.warning.vibrant}},neutral:{iconColor:{light:r.content.secondary,dark:r.content.primaryInverse},textColor:{light:r.content.secondary,dark:r.content.primaryInverse},border:r.stroke.primary,backgroundColor:{light:r.surface.subdued,dark:r.background.inverse,circle:r.background.inverseLight}},white:{iconColor:{light:r.content.secondary,dark:r.content.primaryInverse},textColor:{light:r.content.secondary,dark:r.content.primaryInverse},border:r.stroke.primary,backgroundColor:{light:r.surface.
|
|
1
|
+
import{COLORS as r}from"../../constants/Theme.js";const n={blue:{iconColor:{light:r.content.blue,dark:r.content.primaryInverse},textColor:{light:r.content.blue,dark:r.content.primaryInverse},border:r.stroke.blue.lightAlt,backgroundColor:{light:r.background.blue.light,dark:r.content.blue,circle:r.content.blue}},purple:{iconColor:{light:r.background.inverseLight,dark:r.content.primaryInverse},textColor:{light:r.background.inverseLight,dark:r.content.primaryInverse},border:r.stroke.brandLightAlt,backgroundColor:{light:r.background.brandLight,dark:r.background.inverse,circle:r.background.inverse}},negative:{iconColor:{light:r.content.negative,dark:r.content.primaryInverse},textColor:{light:r.content.negative,dark:r.content.primaryInverse},border:r.stroke.negative.lightAlt,backgroundColor:{light:r.background.negative.light,dark:r.background.negative.vibrant,circle:r.background.negative.vibrant}},positive:{iconColor:{light:r.content.positive,dark:r.content.primaryInverse},textColor:{light:r.content.positive,dark:r.content.primaryInverse},border:r.stroke.positive.lightAlt,backgroundColor:{light:r.background.positive.light,dark:r.background.positive.vibrant,circle:r.background.positive.vibrant}},warning:{iconColor:{light:r.content.warning,dark:r.content.primary},textColor:{light:r.content.warning,dark:r.content.primary},border:r.stroke.warning.lightAlt,backgroundColor:{light:r.background.warning.light,dark:r.background.warning.vibrant,circle:r.background.warning.vibrant}},neutral:{iconColor:{light:r.content.secondary,dark:r.content.primaryInverse},textColor:{light:r.content.secondary,dark:r.content.primaryInverse},border:r.stroke.primary,backgroundColor:{light:r.surface.subdued,dark:r.background.inverse,circle:r.background.inverseLight}},white:{iconColor:{light:r.content.secondary,dark:r.content.primaryInverse},textColor:{light:r.content.secondary,dark:r.content.primaryInverse},border:r.stroke.primary,backgroundColor:{light:r.surface.subdued,dark:r.background.inverse,circle:r.background.inverseLight}},grey:{iconColor:{light:r.content.secondary,dark:r.content.primaryInverse},textColor:{light:r.content.secondary,dark:r.content.primaryInverse},border:r.stroke.primary,backgroundColor:{light:r.surface.subdued,dark:r.content.secondary,circle:r.content.secondary}}},t=(r,t)=>n[t].iconColor[r],e=(r,t)=>n[t].textColor[r],o=r=>n[r].border,i=(r,t)=>n[t].backgroundColor[r],a=r=>"regular"===r?"4px 8px":"2px 6px";export{o as generateBorder,i as getBackgroundColor,a as getPadding,t as getTagIconColor,e as getTextColor};
|