@mrshmllw/smores-react 15.1.30 → 16.0.0
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.
|
@@ -6,9 +6,9 @@ import { Text } from '../../Text';
|
|
|
6
6
|
export const InternalField = ({ children, fieldType, renderAsTitle, htmlFor, className, label, assistiveText, error, errorMsg, required, completed, ...marginProps }) => {
|
|
7
7
|
const labelTag = fieldType === 'field' ? 'label' : 'legend';
|
|
8
8
|
const textColor = error ? 'color.feedback.negative.200' : 'color.text.subtle';
|
|
9
|
-
return (_jsxs(Container, { forwardedAs: fieldType === 'field' ? 'div' : 'fieldset', className: className, ...marginProps, children: [label && (_jsx(_Fragment, { children: renderAsTitle ? (_jsxs(Box, { mb: "
|
|
9
|
+
return (_jsxs(Container, { forwardedAs: fieldType === 'field' ? 'div' : 'fieldset', className: className, ...marginProps, children: [label && (_jsx(_Fragment, { children: renderAsTitle ? (_jsxs(Box, { mb: "space.200", children: [_jsx(Text, { tag: labelTag, typo: "heading-small", htmlFor: htmlFor, children: label }), assistiveText && (_jsx(Text, { tag: "p", color: "sesame", mt: "space.050", children: assistiveText }))] })) : (_jsxs(Text, { tag: labelTag, typo: "label", color: textColor, htmlFor: htmlFor, mb: "space.050", children: [label, required && (_jsx(Text, { tag: "span", typo: "body-small", color: "color.feedback.negative.200", children: "*" }))] })) })), _jsx(Box, { children: children }), fieldType === 'field' && assistiveText && !renderAsTitle && (_jsx(Text, { tag: labelTag, typo: "caption", color: textColor, mt: "space.050", children: assistiveText })), error &&
|
|
10
10
|
errorMsg &&
|
|
11
|
-
(typeof errorMsg === 'string' ? (_jsxs(Box, { flex: true, alignItems: "center", mt: "
|
|
11
|
+
(typeof errorMsg === 'string' ? (_jsxs(Box, { flex: true, alignItems: "center", mt: "space.100", gap: "space.050", children: [_jsx(Icon, { render: "warning", size: 16, color: "color.feedback.negative.200" }), _jsx(Text, { tag: "span", typo: "caption", color: "color.feedback.negative.200", children: errorMsg })] })) : (_jsx(Box, { mt: "space.100", children: errorMsg }))), completed !== undefined && (_jsx(AnimationWrapper, { "$displayStatus": completed, "$isError": !!(error && errorMsg), children: _jsxs(StatusWrapper, { mt: 'space.100', children: [_jsx(Icon, { render: "included", size: 16, color: "color.feedback.positive.200" }), _jsx(Text, { typo: "caption", color: "color.feedback.positive.200", children: "Complete" })] }) }))] }));
|
|
12
12
|
};
|
|
13
13
|
const AnimationWrapper = styled(Box) `
|
|
14
14
|
width: 0;
|
|
@@ -29,7 +29,7 @@ const AnimationWrapper = styled(Box) `
|
|
|
29
29
|
const StatusWrapper = styled(Box) `
|
|
30
30
|
display: flex;
|
|
31
31
|
align-items: center;
|
|
32
|
-
gap:
|
|
32
|
+
gap: ${({ theme }) => theme.space['050']};
|
|
33
33
|
`;
|
|
34
34
|
const Container = styled(Box) `
|
|
35
35
|
display: flex;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InternalField.js","sourceRoot":"","sources":["../../../src/fields/components/InternalField.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAA;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAUjC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,QAAQ,EACR,SAAS,EACT,aAAa,EACb,OAAO,EACP,SAAS,EACT,KAAK,EACL,aAAa,EACb,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,GAAG,WAAW,EACK,EAAE,EAAE;IACvB,MAAM,QAAQ,GAAG,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAA;IAE3D,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,mBAAmB,CAAA;IAC7E,OAAO,CACL,MAAC,SAAS,IACR,WAAW,EAAE,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,EACvD,SAAS,EAAE,SAAS,KAChB,WAAW,aAEd,KAAK,IAAI,CACR,4BACG,aAAa,CAAC,CAAC,CAAC,CACf,MAAC,GAAG,IAAC,EAAE,EAAC,
|
|
1
|
+
{"version":3,"file":"InternalField.js","sourceRoot":"","sources":["../../../src/fields/components/InternalField.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAA;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAUjC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,QAAQ,EACR,SAAS,EACT,aAAa,EACb,OAAO,EACP,SAAS,EACT,KAAK,EACL,aAAa,EACb,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,GAAG,WAAW,EACK,EAAE,EAAE;IACvB,MAAM,QAAQ,GAAG,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAA;IAE3D,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,mBAAmB,CAAA;IAC7E,OAAO,CACL,MAAC,SAAS,IACR,WAAW,EAAE,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,EACvD,SAAS,EAAE,SAAS,KAChB,WAAW,aAEd,KAAK,IAAI,CACR,4BACG,aAAa,CAAC,CAAC,CAAC,CACf,MAAC,GAAG,IAAC,EAAE,EAAC,WAAW,aACjB,KAAC,IAAI,IAAC,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAC,eAAe,EAAC,OAAO,EAAE,OAAO,YACvD,KAAK,GACD,EAEN,aAAa,IAAI,CAChB,KAAC,IAAI,IAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,QAAQ,EAAC,EAAE,EAAC,WAAW,YACxC,aAAa,GACT,CACR,IACG,CACP,CAAC,CAAC,CAAC,CACF,MAAC,IAAI,IACH,GAAG,EAAE,QAAQ,EACb,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,OAAO,EAChB,EAAE,EAAC,WAAW,aAEb,KAAK,EACL,QAAQ,IAAI,CACX,KAAC,IAAI,IACH,GAAG,EAAC,MAAM,EACV,IAAI,EAAC,YAAY,EACjB,KAAK,EAAC,6BAA6B,kBAG9B,CACR,IACI,CACR,GACA,CACJ,EAED,KAAC,GAAG,cAAE,QAAQ,GAAO,EACpB,SAAS,KAAK,OAAO,IAAI,aAAa,IAAI,CAAC,aAAa,IAAI,CAC3D,KAAC,IAAI,IACH,GAAG,EAAE,QAAQ,EACb,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,SAAS,EAChB,EAAE,EAAC,WAAW,YAEb,aAAa,GACT,CACR,EAEA,KAAK;gBACJ,QAAQ;gBACR,CAAC,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC9B,MAAC,GAAG,IAAC,IAAI,QAAC,UAAU,EAAC,QAAQ,EAAC,EAAE,EAAC,WAAW,EAAC,GAAG,EAAC,WAAW,aAC1D,KAAC,IAAI,IACH,MAAM,EAAC,SAAS,EAChB,IAAI,EAAE,EAAE,EACR,KAAK,EAAC,6BAA6B,GACnC,EACF,KAAC,IAAI,IAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,6BAA6B,YAChE,QAAQ,GACJ,IACH,CACP,CAAC,CAAC,CAAC,CACF,KAAC,GAAG,IAAC,EAAE,EAAC,WAAW,YAAE,QAAQ,GAAO,CACrC,CAAC,EAGH,SAAS,KAAK,SAAS,IAAI,CAC1B,KAAC,gBAAgB,sBACC,SAAS,cACf,CAAC,CAAC,CAAC,KAAK,IAAI,QAAQ,CAAC,YAE/B,MAAC,aAAa,IAAC,EAAE,EAAE,WAAW,aAC5B,KAAC,IAAI,IACH,MAAM,EAAC,UAAU,EACjB,IAAI,EAAE,EAAE,EACR,KAAK,EAAC,6BAA6B,GACnC,EACF,KAAC,IAAI,IAAC,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,6BAA6B,yBAEjD,IACO,GACC,CACpB,IACS,CACb,CAAA;AACH,CAAC,CAAA;AAED,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAC,CAGlC;;;;IAIE,CAAC,EAAE,cAAc,EAAE,EAAE,EAAE,CACvB,cAAc;IACd,GAAG,CAAA;;;KAGF;;;IAGD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,QAAQ;IACR,GAAG,CAAA;;KAEF;CACJ,CAAA;AAED,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;;;SAGxB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;CACzC,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;;;;;;;;CAQ5B,CAAA","sourcesContent":["import { ReactNode } from 'react'\nimport styled, { css } from 'styled-components'\n\nimport { Box } from '../../Box'\nimport { Icon } from '../../Icon'\nimport { Text } from '../../Text'\nimport { CommonFieldProps } from '../commonFieldTypes'\n\ninterface InternalFieldProps extends CommonFieldProps {\n children: ReactNode\n className?: string\n htmlFor?: string\n fieldType: 'field' | 'fieldset'\n}\n\nexport const InternalField = ({\n children,\n fieldType,\n renderAsTitle,\n htmlFor,\n className,\n label,\n assistiveText,\n error,\n errorMsg,\n required,\n completed,\n ...marginProps\n}: InternalFieldProps) => {\n const labelTag = fieldType === 'field' ? 'label' : 'legend'\n\n const textColor = error ? 'color.feedback.negative.200' : 'color.text.subtle'\n return (\n <Container\n forwardedAs={fieldType === 'field' ? 'div' : 'fieldset'}\n className={className}\n {...marginProps}\n >\n {label && (\n <>\n {renderAsTitle ? (\n <Box mb=\"space.200\">\n <Text tag={labelTag} typo=\"heading-small\" htmlFor={htmlFor}>\n {label}\n </Text>\n\n {assistiveText && (\n <Text tag=\"p\" color=\"sesame\" mt=\"space.050\">\n {assistiveText}\n </Text>\n )}\n </Box>\n ) : (\n <Text\n tag={labelTag}\n typo=\"label\"\n color={textColor}\n htmlFor={htmlFor}\n mb=\"space.050\"\n >\n {label}\n {required && (\n <Text\n tag=\"span\"\n typo=\"body-small\"\n color=\"color.feedback.negative.200\"\n >\n *\n </Text>\n )}\n </Text>\n )}\n </>\n )}\n\n <Box>{children}</Box>\n {fieldType === 'field' && assistiveText && !renderAsTitle && (\n <Text\n tag={labelTag}\n typo=\"caption\"\n color={textColor}\n mt=\"space.050\"\n >\n {assistiveText}\n </Text>\n )}\n\n {error &&\n errorMsg &&\n (typeof errorMsg === 'string' ? (\n <Box flex alignItems=\"center\" mt=\"space.100\" gap=\"space.050\">\n <Icon\n render=\"warning\"\n size={16}\n color=\"color.feedback.negative.200\"\n />\n <Text tag=\"span\" typo=\"caption\" color=\"color.feedback.negative.200\">\n {errorMsg}\n </Text>\n </Box>\n ) : (\n <Box mt=\"space.100\">{errorMsg}</Box>\n ))}\n\n {/* When completed is false, whitespace is rendered */}\n {completed !== undefined && (\n <AnimationWrapper\n $displayStatus={completed}\n $isError={!!(error && errorMsg)}\n >\n <StatusWrapper mt={'space.100'}>\n <Icon\n render=\"included\"\n size={16}\n color=\"color.feedback.positive.200\"\n />\n <Text typo=\"caption\" color=\"color.feedback.positive.200\">\n Complete\n </Text>\n </StatusWrapper>\n </AnimationWrapper>\n )}\n </Container>\n )\n}\n\nconst AnimationWrapper = styled(Box)<{\n $displayStatus: boolean\n $isError: boolean\n}>`\n width: 0;\n overflow: hidden;\n\n ${({ $displayStatus }) =>\n $displayStatus &&\n css`\n transition: width 0.6s ease-in;\n width: 100%;\n `}\n\n /* This enables animation to appear when previous state is error */\n ${({ $isError }) =>\n $isError &&\n css`\n height: 0;\n `}\n`\n\nconst StatusWrapper = styled(Box)`\n display: flex;\n align-items: center;\n gap: ${({ theme }) => theme.space['050']};\n`\n\nconst Container = styled(Box)`\n display: flex;\n flex-direction: column;\n position: relative;\n width: 100%;\n\n // In case, the element is a 'fieldset', we remove the border\n border: 0;\n`\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mrshmllw/smores-react",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "16.0.0",
|
|
4
4
|
"description": "Collection of React components used by Marshmallow Technology",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"type": "module",
|
|
@@ -47,32 +47,32 @@
|
|
|
47
47
|
},
|
|
48
48
|
"dependencies": {
|
|
49
49
|
"@awesome.me/kit-46ca99185c": "^1.0.22",
|
|
50
|
-
"@floating-ui/react": "0.27.
|
|
50
|
+
"@floating-ui/react": "0.27.19",
|
|
51
51
|
"@fortawesome/fontawesome-svg-core": "^7.1.0",
|
|
52
52
|
"@fortawesome/react-fontawesome": "^3.1.1",
|
|
53
|
-
"@lexical/react": "^0.
|
|
53
|
+
"@lexical/react": "^0.41.0",
|
|
54
54
|
"@mrshmllw/smores-foundations": "^1.1.0",
|
|
55
55
|
"body-scroll-lock": "^4.0.0-beta.0",
|
|
56
56
|
"date-fns": "^4.1.0",
|
|
57
|
-
"dompurify": "^3.3.
|
|
57
|
+
"dompurify": "^3.3.2",
|
|
58
58
|
"fuse.js": "^7.1.0",
|
|
59
|
-
"lexical": "^0.
|
|
59
|
+
"lexical": "^0.41.0",
|
|
60
60
|
"polished": "^4.3.1"
|
|
61
61
|
},
|
|
62
62
|
"devDependencies": {
|
|
63
|
-
"@commitlint/cli": "^20.4.
|
|
64
|
-
"@mrshmllw/campfire": "^3.0
|
|
65
|
-
"@snyk/protect": "^1.
|
|
66
|
-
"@storybook/addon-a11y": "^10.2.
|
|
63
|
+
"@commitlint/cli": "^20.4.3",
|
|
64
|
+
"@mrshmllw/campfire": "^3.1.0",
|
|
65
|
+
"@snyk/protect": "^1.1303.1",
|
|
66
|
+
"@storybook/addon-a11y": "^10.2.15",
|
|
67
67
|
"@storybook/addon-coverage": "^3.0.0",
|
|
68
|
-
"@storybook/addon-docs": "^10.2.
|
|
69
|
-
"@storybook/addon-links": "^10.2.
|
|
70
|
-
"@storybook/react-vite": "^10.2.
|
|
68
|
+
"@storybook/addon-docs": "^10.2.15",
|
|
69
|
+
"@storybook/addon-links": "^10.2.15",
|
|
70
|
+
"@storybook/react-vite": "^10.2.15",
|
|
71
71
|
"@storybook/test-runner": "^0.24.2",
|
|
72
72
|
"@testing-library/jest-dom": "^6.9.1",
|
|
73
73
|
"@testing-library/react": "^16.3.2",
|
|
74
74
|
"@types/body-scroll-lock": "^3.1.2",
|
|
75
|
-
"@types/node": "^25.3.
|
|
75
|
+
"@types/node": "^25.3.3",
|
|
76
76
|
"@types/react": "^19.2.14",
|
|
77
77
|
"@types/react-dom": "^19.2.3",
|
|
78
78
|
"@typescript-eslint/eslint-plugin": "^8.56.1",
|
|
@@ -83,11 +83,11 @@
|
|
|
83
83
|
"eslint-plugin-prettier": "^5.5.5",
|
|
84
84
|
"eslint-plugin-react": "^7.37.5",
|
|
85
85
|
"eslint-plugin-react-hooks": "^7.0.1",
|
|
86
|
-
"eslint-plugin-storybook": "^10.2.
|
|
86
|
+
"eslint-plugin-storybook": "^10.2.15",
|
|
87
87
|
"husky": "^9.1.7",
|
|
88
88
|
"jest-styled-components": "^7.2.0",
|
|
89
89
|
"jsdom": "^28.1.0",
|
|
90
|
-
"lint-staged": "^16.2
|
|
90
|
+
"lint-staged": "^16.3.2",
|
|
91
91
|
"playwright": "^1.58.2",
|
|
92
92
|
"prettier": "^3.8.1",
|
|
93
93
|
"react": "^19.2.4",
|