@coveord/plasma-mantine 48.7.0 → 48.9.1
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/.turbo/turbo-build.log +3 -3
- package/.turbo/turbo-test.log +7 -7
- package/dist/.tsbuildinfo +1 -1
- package/dist/cjs/theme/Theme.js +0 -6
- package/dist/cjs/theme/Theme.js.map +1 -1
- package/dist/definitions/theme/Theme.d.ts.map +1 -1
- package/dist/esm/theme/Theme.js +0 -6
- package/dist/esm/theme/Theme.js.map +1 -1
- package/package.json +1 -1
- package/src/theme/Theme.tsx +0 -6
- package/dist/cjs/components/collection/Collection.example.js +0 -64
- package/dist/cjs/components/collection/Collection.example.js.map +0 -1
- package/dist/definitions/components/collection/Collection.example.d.ts +0 -4
- package/dist/definitions/components/collection/Collection.example.d.ts.map +0 -1
- package/dist/esm/components/collection/Collection.example.js +0 -54
- package/dist/esm/components/collection/Collection.example.js.map +0 -1
- package/src/components/collection/Collection.example.tsx +0 -37
package/dist/cjs/theme/Theme.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/theme/Theme.tsx"],"sourcesContent":["import {ArrowHeadRightSize24Px, InfoSize24Px} from '@coveord/plasma-react-icons';\nimport {color} from '@coveord/plasma-tokens';\nimport {ButtonStylesParams, MantineThemeOverride, ModalStylesParams} from '@mantine/core';\n\nimport {PlasmaColors} from './PlasmaColors';\n\nexport const plasmaTheme: MantineThemeOverride = {\n colorScheme: 'light',\n fontFamily: 'canada-type-gibson, sans-serif',\n black: color.primary.gray[9],\n defaultRadius: 8,\n spacing: {\n xs: 8,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n },\n primaryColor: 'action',\n headings: {\n fontFamily: 'canada-type-gibson, sans-serif',\n fontWeight: 500,\n sizes: {\n h1: {fontSize: 48, lineHeight: '56px', fontWeight: undefined},\n h2: {fontSize: 32, lineHeight: '40px', fontWeight: undefined},\n h3: {fontSize: 28, lineHeight: '40px', fontWeight: undefined},\n h4: {fontSize: 24, lineHeight: '32px', fontWeight: undefined},\n h5: {fontSize: 18, lineHeight: '28px', fontWeight: undefined},\n h6: {fontSize: 16, lineHeight: '24px', fontWeight: undefined},\n },\n },\n shadows: {\n xs: '0px 1px 0px rgba(4, 8, 31, 0.08)',\n sm: '0px 2px 4px rgba(4, 8, 31, 0.12)',\n md: '0px 4px 8px rgba(4, 8, 31, 0.08)',\n lg: '0px 8px 16px rgba(7, 12, 41, 0.06)',\n xl: '0px 16px 24px rgba(4, 8, 31, 0.06)',\n },\n colors: PlasmaColors,\n components: {\n Alert: {\n defaultProps: {\n icon: <InfoSize24Px height={24} />,\n color: 'navy',\n },\n styles: {\n title: {\n fontWeight: 500,\n },\n },\n },\n Title: {\n styles: (theme) => ({\n root: {\n '&:is(h1,h2,h3,h4,h5,h6)': {letterSpacing: '0.011em', color: theme.colors.gray[9]},\n },\n }),\n },\n Button: {\n styles: (theme, params: ButtonStylesParams) => ({\n root: {\n '&': {fontWeight: 400},\n backgroundColor: params.variant === 'outline' ? 'white' : undefined,\n },\n }),\n },\n Modal: {\n styles: (theme, {size, fullScreen}: ModalStylesParams) => ({\n modal: {\n width: fullScreen\n ? undefined\n : theme.fn.size({size, sizes: {xs: 320, sm: 440, md: '45%', lg: 1334, xl: '85%'}}),\n },\n }),\n defaultProps: {\n overlayColor: color.primary.navy[9],\n overlayOpacity: 0.9,\n },\n },\n InputWrapper: {\n defaultProps: {\n withAsterisk: false,\n },\n },\n TextInput: {\n defaultProps: {\n radius: 8,\n },\n styles: (theme) => ({\n description: {\n fontSize: 'inherit',\n paddingBottom: theme.spacing.xs,\n },\n }),\n },\n Tooltip: {\n defaultProps: {\n color: 'navy',\n withArrow: true,\n withinPortal: true,\n },\n },\n Breadcrumbs: {\n defaultProps: {\n separator: <ArrowHeadRightSize24Px height={24} />,\n },\n },\n Loader: {\n defaultProps: {\n variant: 'dots',\n color: 'action',\n },\n },\n DateRangePicker: {\n styles: {\n cell: {\n textAlign: 'center',\n },\n },\n },\n Anchor: {\n defaultProps: {\n color: 'action',\n },\n styles: (theme) => ({\n root: {\n ...theme.fn.hover({\n textDecoration: 'underline',\n color: theme.colors.action[8],\n }),\n },\n }),\n },\n Checkbox: {\n defaultProps: {\n radius: 'sm',\n },\n
|
|
1
|
+
{"version":3,"sources":["../../../src/theme/Theme.tsx"],"sourcesContent":["import {ArrowHeadRightSize24Px, InfoSize24Px} from '@coveord/plasma-react-icons';\nimport {color} from '@coveord/plasma-tokens';\nimport {ButtonStylesParams, MantineThemeOverride, ModalStylesParams} from '@mantine/core';\n\nimport {PlasmaColors} from './PlasmaColors';\n\nexport const plasmaTheme: MantineThemeOverride = {\n colorScheme: 'light',\n fontFamily: 'canada-type-gibson, sans-serif',\n black: color.primary.gray[9],\n defaultRadius: 8,\n spacing: {\n xs: 8,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n },\n primaryColor: 'action',\n headings: {\n fontFamily: 'canada-type-gibson, sans-serif',\n fontWeight: 500,\n sizes: {\n h1: {fontSize: 48, lineHeight: '56px', fontWeight: undefined},\n h2: {fontSize: 32, lineHeight: '40px', fontWeight: undefined},\n h3: {fontSize: 28, lineHeight: '40px', fontWeight: undefined},\n h4: {fontSize: 24, lineHeight: '32px', fontWeight: undefined},\n h5: {fontSize: 18, lineHeight: '28px', fontWeight: undefined},\n h6: {fontSize: 16, lineHeight: '24px', fontWeight: undefined},\n },\n },\n shadows: {\n xs: '0px 1px 0px rgba(4, 8, 31, 0.08)',\n sm: '0px 2px 4px rgba(4, 8, 31, 0.12)',\n md: '0px 4px 8px rgba(4, 8, 31, 0.08)',\n lg: '0px 8px 16px rgba(7, 12, 41, 0.06)',\n xl: '0px 16px 24px rgba(4, 8, 31, 0.06)',\n },\n colors: PlasmaColors,\n components: {\n Alert: {\n defaultProps: {\n icon: <InfoSize24Px height={24} />,\n color: 'navy',\n },\n styles: {\n title: {\n fontWeight: 500,\n },\n },\n },\n Title: {\n styles: (theme) => ({\n root: {\n '&:is(h1,h2,h3,h4,h5,h6)': {letterSpacing: '0.011em', color: theme.colors.gray[9]},\n },\n }),\n },\n Button: {\n styles: (theme, params: ButtonStylesParams) => ({\n root: {\n '&': {fontWeight: 400},\n backgroundColor: params.variant === 'outline' ? 'white' : undefined,\n },\n }),\n },\n Modal: {\n styles: (theme, {size, fullScreen}: ModalStylesParams) => ({\n modal: {\n width: fullScreen\n ? undefined\n : theme.fn.size({size, sizes: {xs: 320, sm: 440, md: '45%', lg: 1334, xl: '85%'}}),\n },\n }),\n defaultProps: {\n overlayColor: color.primary.navy[9],\n overlayOpacity: 0.9,\n },\n },\n InputWrapper: {\n defaultProps: {\n withAsterisk: false,\n },\n },\n TextInput: {\n defaultProps: {\n radius: 8,\n },\n styles: (theme) => ({\n description: {\n fontSize: 'inherit',\n paddingBottom: theme.spacing.xs,\n },\n }),\n },\n Tooltip: {\n defaultProps: {\n color: 'navy',\n withArrow: true,\n withinPortal: true,\n },\n },\n Breadcrumbs: {\n defaultProps: {\n separator: <ArrowHeadRightSize24Px height={24} />,\n },\n },\n Loader: {\n defaultProps: {\n variant: 'dots',\n color: 'action',\n },\n },\n DateRangePicker: {\n styles: {\n cell: {\n textAlign: 'center',\n },\n },\n },\n Anchor: {\n defaultProps: {\n color: 'action',\n },\n styles: (theme) => ({\n root: {\n ...theme.fn.hover({\n textDecoration: 'underline',\n color: theme.colors.action[8],\n }),\n },\n }),\n },\n Checkbox: {\n defaultProps: {\n radius: 'sm',\n },\n },\n List: {\n styles: () => ({\n root: {\n listStyleType: 'disc',\n },\n }),\n },\n Radio: {\n styles: {\n labelWrapper: {\n display: 'flex',\n alignItems: 'flex-start',\n },\n },\n },\n },\n};\n"],"names":["plasmaTheme","colorScheme","fontFamily","black","color","primary","gray","defaultRadius","spacing","xs","sm","md","lg","xl","primaryColor","headings","fontWeight","sizes","h1","fontSize","lineHeight","undefined","h2","h3","h4","h5","h6","shadows","colors","PlasmaColors","components","Alert","defaultProps","icon","InfoSize24Px","height","styles","title","Title","theme","root","letterSpacing","Button","params","backgroundColor","variant","Modal","size","fullScreen","modal","width","fn","overlayColor","navy","overlayOpacity","InputWrapper","withAsterisk","TextInput","radius","description","paddingBottom","Tooltip","withArrow","withinPortal","Breadcrumbs","separator","ArrowHeadRightSize24Px","Loader","DateRangePicker","cell","textAlign","Anchor","hover","textDecoration","action","Checkbox","List","listStyleType","Radio","labelWrapper","display","alignItems"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../../src/theme/Theme.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAqB,oBAAoB,EAAoB,MAAM,eAAe,CAAC;AAI1F,eAAO,MAAM,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../../src/theme/Theme.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAqB,oBAAoB,EAAoB,MAAM,eAAe,CAAC;AAI1F,eAAO,MAAM,WAAW,EAAE,oBAoJzB,CAAC"}
|
package/dist/esm/theme/Theme.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/theme/Theme.tsx"],"sourcesContent":["import {ArrowHeadRightSize24Px, InfoSize24Px} from '@coveord/plasma-react-icons';\nimport {color} from '@coveord/plasma-tokens';\nimport {ButtonStylesParams, MantineThemeOverride, ModalStylesParams} from '@mantine/core';\n\nimport {PlasmaColors} from './PlasmaColors';\n\nexport const plasmaTheme: MantineThemeOverride = {\n colorScheme: 'light',\n fontFamily: 'canada-type-gibson, sans-serif',\n black: color.primary.gray[9],\n defaultRadius: 8,\n spacing: {\n xs: 8,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n },\n primaryColor: 'action',\n headings: {\n fontFamily: 'canada-type-gibson, sans-serif',\n fontWeight: 500,\n sizes: {\n h1: {fontSize: 48, lineHeight: '56px', fontWeight: undefined},\n h2: {fontSize: 32, lineHeight: '40px', fontWeight: undefined},\n h3: {fontSize: 28, lineHeight: '40px', fontWeight: undefined},\n h4: {fontSize: 24, lineHeight: '32px', fontWeight: undefined},\n h5: {fontSize: 18, lineHeight: '28px', fontWeight: undefined},\n h6: {fontSize: 16, lineHeight: '24px', fontWeight: undefined},\n },\n },\n shadows: {\n xs: '0px 1px 0px rgba(4, 8, 31, 0.08)',\n sm: '0px 2px 4px rgba(4, 8, 31, 0.12)',\n md: '0px 4px 8px rgba(4, 8, 31, 0.08)',\n lg: '0px 8px 16px rgba(7, 12, 41, 0.06)',\n xl: '0px 16px 24px rgba(4, 8, 31, 0.06)',\n },\n colors: PlasmaColors,\n components: {\n Alert: {\n defaultProps: {\n icon: <InfoSize24Px height={24} />,\n color: 'navy',\n },\n styles: {\n title: {\n fontWeight: 500,\n },\n },\n },\n Title: {\n styles: (theme) => ({\n root: {\n '&:is(h1,h2,h3,h4,h5,h6)': {letterSpacing: '0.011em', color: theme.colors.gray[9]},\n },\n }),\n },\n Button: {\n styles: (theme, params: ButtonStylesParams) => ({\n root: {\n '&': {fontWeight: 400},\n backgroundColor: params.variant === 'outline' ? 'white' : undefined,\n },\n }),\n },\n Modal: {\n styles: (theme, {size, fullScreen}: ModalStylesParams) => ({\n modal: {\n width: fullScreen\n ? undefined\n : theme.fn.size({size, sizes: {xs: 320, sm: 440, md: '45%', lg: 1334, xl: '85%'}}),\n },\n }),\n defaultProps: {\n overlayColor: color.primary.navy[9],\n overlayOpacity: 0.9,\n },\n },\n InputWrapper: {\n defaultProps: {\n withAsterisk: false,\n },\n },\n TextInput: {\n defaultProps: {\n radius: 8,\n },\n styles: (theme) => ({\n description: {\n fontSize: 'inherit',\n paddingBottom: theme.spacing.xs,\n },\n }),\n },\n Tooltip: {\n defaultProps: {\n color: 'navy',\n withArrow: true,\n withinPortal: true,\n },\n },\n Breadcrumbs: {\n defaultProps: {\n separator: <ArrowHeadRightSize24Px height={24} />,\n },\n },\n Loader: {\n defaultProps: {\n variant: 'dots',\n color: 'action',\n },\n },\n DateRangePicker: {\n styles: {\n cell: {\n textAlign: 'center',\n },\n },\n },\n Anchor: {\n defaultProps: {\n color: 'action',\n },\n styles: (theme) => ({\n root: {\n ...theme.fn.hover({\n textDecoration: 'underline',\n color: theme.colors.action[8],\n }),\n },\n }),\n },\n Checkbox: {\n defaultProps: {\n radius: 'sm',\n },\n
|
|
1
|
+
{"version":3,"sources":["../../../src/theme/Theme.tsx"],"sourcesContent":["import {ArrowHeadRightSize24Px, InfoSize24Px} from '@coveord/plasma-react-icons';\nimport {color} from '@coveord/plasma-tokens';\nimport {ButtonStylesParams, MantineThemeOverride, ModalStylesParams} from '@mantine/core';\n\nimport {PlasmaColors} from './PlasmaColors';\n\nexport const plasmaTheme: MantineThemeOverride = {\n colorScheme: 'light',\n fontFamily: 'canada-type-gibson, sans-serif',\n black: color.primary.gray[9],\n defaultRadius: 8,\n spacing: {\n xs: 8,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n },\n primaryColor: 'action',\n headings: {\n fontFamily: 'canada-type-gibson, sans-serif',\n fontWeight: 500,\n sizes: {\n h1: {fontSize: 48, lineHeight: '56px', fontWeight: undefined},\n h2: {fontSize: 32, lineHeight: '40px', fontWeight: undefined},\n h3: {fontSize: 28, lineHeight: '40px', fontWeight: undefined},\n h4: {fontSize: 24, lineHeight: '32px', fontWeight: undefined},\n h5: {fontSize: 18, lineHeight: '28px', fontWeight: undefined},\n h6: {fontSize: 16, lineHeight: '24px', fontWeight: undefined},\n },\n },\n shadows: {\n xs: '0px 1px 0px rgba(4, 8, 31, 0.08)',\n sm: '0px 2px 4px rgba(4, 8, 31, 0.12)',\n md: '0px 4px 8px rgba(4, 8, 31, 0.08)',\n lg: '0px 8px 16px rgba(7, 12, 41, 0.06)',\n xl: '0px 16px 24px rgba(4, 8, 31, 0.06)',\n },\n colors: PlasmaColors,\n components: {\n Alert: {\n defaultProps: {\n icon: <InfoSize24Px height={24} />,\n color: 'navy',\n },\n styles: {\n title: {\n fontWeight: 500,\n },\n },\n },\n Title: {\n styles: (theme) => ({\n root: {\n '&:is(h1,h2,h3,h4,h5,h6)': {letterSpacing: '0.011em', color: theme.colors.gray[9]},\n },\n }),\n },\n Button: {\n styles: (theme, params: ButtonStylesParams) => ({\n root: {\n '&': {fontWeight: 400},\n backgroundColor: params.variant === 'outline' ? 'white' : undefined,\n },\n }),\n },\n Modal: {\n styles: (theme, {size, fullScreen}: ModalStylesParams) => ({\n modal: {\n width: fullScreen\n ? undefined\n : theme.fn.size({size, sizes: {xs: 320, sm: 440, md: '45%', lg: 1334, xl: '85%'}}),\n },\n }),\n defaultProps: {\n overlayColor: color.primary.navy[9],\n overlayOpacity: 0.9,\n },\n },\n InputWrapper: {\n defaultProps: {\n withAsterisk: false,\n },\n },\n TextInput: {\n defaultProps: {\n radius: 8,\n },\n styles: (theme) => ({\n description: {\n fontSize: 'inherit',\n paddingBottom: theme.spacing.xs,\n },\n }),\n },\n Tooltip: {\n defaultProps: {\n color: 'navy',\n withArrow: true,\n withinPortal: true,\n },\n },\n Breadcrumbs: {\n defaultProps: {\n separator: <ArrowHeadRightSize24Px height={24} />,\n },\n },\n Loader: {\n defaultProps: {\n variant: 'dots',\n color: 'action',\n },\n },\n DateRangePicker: {\n styles: {\n cell: {\n textAlign: 'center',\n },\n },\n },\n Anchor: {\n defaultProps: {\n color: 'action',\n },\n styles: (theme) => ({\n root: {\n ...theme.fn.hover({\n textDecoration: 'underline',\n color: theme.colors.action[8],\n }),\n },\n }),\n },\n Checkbox: {\n defaultProps: {\n radius: 'sm',\n },\n },\n List: {\n styles: () => ({\n root: {\n listStyleType: 'disc',\n },\n }),\n },\n Radio: {\n styles: {\n labelWrapper: {\n display: 'flex',\n alignItems: 'flex-start',\n },\n },\n },\n },\n};\n"],"names":["ArrowHeadRightSize24Px","InfoSize24Px","color","PlasmaColors","plasmaTheme","colorScheme","fontFamily","black","primary","gray","defaultRadius","spacing","xs","sm","md","lg","xl","primaryColor","headings","fontWeight","sizes","h1","fontSize","lineHeight","undefined","h2","h3","h4","h5","h6","shadows","colors","components","Alert","defaultProps","icon","height","styles","title","Title","theme","root","letterSpacing","Button","params","backgroundColor","variant","Modal","size","fullScreen","modal","width","fn","overlayColor","navy","overlayOpacity","InputWrapper","withAsterisk","TextInput","radius","description","paddingBottom","Tooltip","withArrow","withinPortal","Breadcrumbs","separator","Loader","DateRangePicker","cell","textAlign","Anchor","hover","textDecoration","action","Checkbox","List","listStyleType","Radio","labelWrapper","display","alignItems"],"mappings":"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"}
|
package/package.json
CHANGED
package/src/theme/Theme.tsx
CHANGED
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", {
|
|
3
|
-
value: true
|
|
4
|
-
});
|
|
5
|
-
Object.defineProperty(exports, "default", {
|
|
6
|
-
enumerable: true,
|
|
7
|
-
get: function() {
|
|
8
|
-
return _default;
|
|
9
|
-
}
|
|
10
|
-
});
|
|
11
|
-
var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
|
|
12
|
-
var _objectSpreadProps = require("@swc/helpers/lib/_object_spread_props.js").default;
|
|
13
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
|
-
var _core = require("@mantine/core");
|
|
15
|
-
var _form = require("@mantine/form");
|
|
16
|
-
var _collection = require("./Collection");
|
|
17
|
-
var _default = function() {
|
|
18
|
-
var form = (0, _form.useForm)({
|
|
19
|
-
initialValues: {
|
|
20
|
-
todoList: [
|
|
21
|
-
{
|
|
22
|
-
name: "wash the dishes",
|
|
23
|
-
done: true
|
|
24
|
-
},
|
|
25
|
-
{
|
|
26
|
-
name: "take out the trash",
|
|
27
|
-
done: false
|
|
28
|
-
},
|
|
29
|
-
{
|
|
30
|
-
name: "vacuum the floors",
|
|
31
|
-
done: true
|
|
32
|
-
}
|
|
33
|
-
]
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_collection.Collection, _objectSpreadProps(_objectSpread({
|
|
37
|
-
draggable: true,
|
|
38
|
-
addLabel: "Add task",
|
|
39
|
-
newItem: {
|
|
40
|
-
name: "",
|
|
41
|
-
done: false
|
|
42
|
-
}
|
|
43
|
-
}, form.getInputProps("todoList")), {
|
|
44
|
-
children: function(task, index) {
|
|
45
|
-
return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
46
|
-
children: [
|
|
47
|
-
/*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.TextInput, _objectSpreadProps(_objectSpread({
|
|
48
|
-
autoFocus: true,
|
|
49
|
-
placeholder: "Do something ..."
|
|
50
|
-
}, form.getInputProps("todoList.".concat(index, ".name"))), {
|
|
51
|
-
styles: {
|
|
52
|
-
flex: 1
|
|
53
|
-
}
|
|
54
|
-
})),
|
|
55
|
-
/*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Checkbox, _objectSpread({}, form.getInputProps("todoList.".concat(index, ".done"), {
|
|
56
|
-
type: "checkbox"
|
|
57
|
-
})))
|
|
58
|
-
]
|
|
59
|
-
});
|
|
60
|
-
}
|
|
61
|
-
}));
|
|
62
|
-
};
|
|
63
|
-
|
|
64
|
-
//# sourceMappingURL=Collection.example.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/collection/Collection.example.tsx"],"sourcesContent":["import {Checkbox, TextInput} from '@mantine/core';\nimport {useForm} from '@mantine/form';\n\nimport {Collection} from './Collection';\n\nexport default () => {\n const form = useForm({\n initialValues: {\n todoList: [\n {name: 'wash the dishes', done: true},\n {name: 'take out the trash', done: false},\n {name: 'vacuum the floors', done: true},\n ],\n },\n });\n\n return (\n <Collection<{name: string; done: boolean}>\n draggable\n addLabel=\"Add task\"\n newItem={{name: '', done: false}}\n {...form.getInputProps('todoList')}\n >\n {(task, index) => (\n <>\n <TextInput\n autoFocus\n placeholder=\"Do something ...\"\n {...form.getInputProps(`todoList.${index}.name`)}\n styles={{flex: 1}}\n />\n <Checkbox {...form.getInputProps(`todoList.${index}.done`, {type: 'checkbox'})} />\n </>\n )}\n </Collection>\n );\n};\n"],"names":["form","useForm","initialValues","todoList","name","done","Collection","draggable","addLabel","newItem","getInputProps","task","index","TextInput","autoFocus","placeholder","styles","flex","Checkbox","type"],"mappings":"AAAA;;;;+BAKA,SA+BE;;;eA/BF,QA+BE;;;;;;oBApCgC,eAAe;oBAC3B,eAAe;0BAEZ,cAAc;IAEvC,QA+BE,GA/Ba,WAAM;IACjB,IAAMA,IAAI,GAAGC,IAAAA,KAAO,QAAA,EAAC;QACjBC,aAAa,EAAE;YACXC,QAAQ,EAAE;gBACN;oBAACC,IAAI,EAAE,iBAAiB;oBAAEC,IAAI,EAAE,IAAI;iBAAC;gBACrC;oBAACD,IAAI,EAAE,oBAAoB;oBAAEC,IAAI,EAAE,KAAK;iBAAC;gBACzC;oBAACD,IAAI,EAAE,mBAAmB;oBAAEC,IAAI,EAAE,IAAI;iBAAC;aAC1C;SACJ;KACJ,CAAC,AAAC;IAEH,qBACI,qBAACC,WAAU,WAAA;QACPC,SAAS;QACTC,QAAQ,EAAC,UAAU;QACnBC,OAAO,EAAE;YAACL,IAAI,EAAE,EAAE;YAAEC,IAAI,EAAE,KAAK;SAAC;OAC5BL,IAAI,CAACU,aAAa,CAAC,UAAU,CAAC;kBAEjC,SAACC,IAAI,EAAEC,KAAK;iCACT;;kCACI,qBAACC,KAAS,UAAA;wBACNC,SAAS;wBACTC,WAAW,EAAC,kBAAkB;uBAC1Bf,IAAI,CAACU,aAAa,CAAC,AAAC,WAAS,CAAQ,MAAK,CAAXE,KAAK,EAAC,OAAK,CAAC,CAAC;wBAChDI,MAAM,EAAE;4BAACC,IAAI,EAAE,CAAC;yBAAC;uBACnB;kCACF,qBAACC,KAAQ,SAAA,oBAAKlB,IAAI,CAACU,aAAa,CAAC,AAAC,WAAS,CAAQ,MAAK,CAAXE,KAAK,EAAC,OAAK,CAAC,EAAE;wBAACO,IAAI,EAAE,UAAU;qBAAC,CAAC,EAAI;;cACnF;SACN;OACQ,CACf;AACN,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Collection.example.d.ts","sourceRoot":"","sources":["../../../../src/components/collection/Collection.example.tsx"],"names":[],"mappings":";;AAKA,wBA+BE"}
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import _object_spread from "@swc/helpers/src/_object_spread.mjs";
|
|
2
|
-
import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
|
|
3
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
4
|
-
import { Checkbox, TextInput } from "@mantine/core";
|
|
5
|
-
import { useForm } from "@mantine/form";
|
|
6
|
-
import { Collection } from "./Collection";
|
|
7
|
-
export default function() {
|
|
8
|
-
var form = useForm({
|
|
9
|
-
initialValues: {
|
|
10
|
-
todoList: [
|
|
11
|
-
{
|
|
12
|
-
name: "wash the dishes",
|
|
13
|
-
done: true
|
|
14
|
-
},
|
|
15
|
-
{
|
|
16
|
-
name: "take out the trash",
|
|
17
|
-
done: false
|
|
18
|
-
},
|
|
19
|
-
{
|
|
20
|
-
name: "vacuum the floors",
|
|
21
|
-
done: true
|
|
22
|
-
}
|
|
23
|
-
]
|
|
24
|
-
}
|
|
25
|
-
});
|
|
26
|
-
return /*#__PURE__*/ _jsx(Collection, _object_spread_props(_object_spread({
|
|
27
|
-
draggable: true,
|
|
28
|
-
addLabel: "Add task",
|
|
29
|
-
newItem: {
|
|
30
|
-
name: "",
|
|
31
|
-
done: false
|
|
32
|
-
}
|
|
33
|
-
}, form.getInputProps("todoList")), {
|
|
34
|
-
children: function(task, index) {
|
|
35
|
-
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
36
|
-
children: [
|
|
37
|
-
/*#__PURE__*/ _jsx(TextInput, _object_spread_props(_object_spread({
|
|
38
|
-
autoFocus: true,
|
|
39
|
-
placeholder: "Do something ..."
|
|
40
|
-
}, form.getInputProps("todoList.".concat(index, ".name"))), {
|
|
41
|
-
styles: {
|
|
42
|
-
flex: 1
|
|
43
|
-
}
|
|
44
|
-
})),
|
|
45
|
-
/*#__PURE__*/ _jsx(Checkbox, _object_spread({}, form.getInputProps("todoList.".concat(index, ".done"), {
|
|
46
|
-
type: "checkbox"
|
|
47
|
-
})))
|
|
48
|
-
]
|
|
49
|
-
});
|
|
50
|
-
}
|
|
51
|
-
}));
|
|
52
|
-
};
|
|
53
|
-
|
|
54
|
-
//# sourceMappingURL=Collection.example.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/collection/Collection.example.tsx"],"sourcesContent":["import {Checkbox, TextInput} from '@mantine/core';\nimport {useForm} from '@mantine/form';\n\nimport {Collection} from './Collection';\n\nexport default () => {\n const form = useForm({\n initialValues: {\n todoList: [\n {name: 'wash the dishes', done: true},\n {name: 'take out the trash', done: false},\n {name: 'vacuum the floors', done: true},\n ],\n },\n });\n\n return (\n <Collection<{name: string; done: boolean}>\n draggable\n addLabel=\"Add task\"\n newItem={{name: '', done: false}}\n {...form.getInputProps('todoList')}\n >\n {(task, index) => (\n <>\n <TextInput\n autoFocus\n placeholder=\"Do something ...\"\n {...form.getInputProps(`todoList.${index}.name`)}\n styles={{flex: 1}}\n />\n <Checkbox {...form.getInputProps(`todoList.${index}.done`, {type: 'checkbox'})} />\n </>\n )}\n </Collection>\n );\n};\n"],"names":["Checkbox","TextInput","useForm","Collection","form","initialValues","todoList","name","done","draggable","addLabel","newItem","getInputProps","task","index","autoFocus","placeholder","styles","flex","type"],"mappings":"AAAA;;;AAAA,SAAQA,QAAQ,EAAEC,SAAS,QAAO,eAAe,CAAC;AAClD,SAAQC,OAAO,QAAO,eAAe,CAAC;AAEtC,SAAQC,UAAU,QAAO,cAAc,CAAC;AAExC,eAAe,WAAM;IACjB,IAAMC,IAAI,GAAGF,OAAO,CAAC;QACjBG,aAAa,EAAE;YACXC,QAAQ,EAAE;gBACN;oBAACC,IAAI,EAAE,iBAAiB;oBAAEC,IAAI,EAAE,IAAI;iBAAC;gBACrC;oBAACD,IAAI,EAAE,oBAAoB;oBAAEC,IAAI,EAAE,KAAK;iBAAC;gBACzC;oBAACD,IAAI,EAAE,mBAAmB;oBAAEC,IAAI,EAAE,IAAI;iBAAC;aAC1C;SACJ;KACJ,CAAC,AAAC;IAEH,qBACI,KAACL,UAAU;QACPM,SAAS;QACTC,QAAQ,EAAC,UAAU;QACnBC,OAAO,EAAE;YAACJ,IAAI,EAAE,EAAE;YAAEC,IAAI,EAAE,KAAK;SAAC;OAC5BJ,IAAI,CAACQ,aAAa,CAAC,UAAU,CAAC;kBAEjC,SAACC,IAAI,EAAEC,KAAK;iCACT;;kCACI,KAACb,SAAS;wBACNc,SAAS;wBACTC,WAAW,EAAC,kBAAkB;uBAC1BZ,IAAI,CAACQ,aAAa,CAAC,AAAC,WAAS,CAAQ,MAAK,CAAXE,KAAK,EAAC,OAAK,CAAC,CAAC;wBAChDG,MAAM,EAAE;4BAACC,IAAI,EAAE,CAAC;yBAAC;uBACnB;kCACF,KAAClB,QAAQ,qBAAKI,IAAI,CAACQ,aAAa,CAAC,AAAC,WAAS,CAAQ,MAAK,CAAXE,KAAK,EAAC,OAAK,CAAC,EAAE;wBAACK,IAAI,EAAE,UAAU;qBAAC,CAAC,EAAI;;cACnF;SACN;OACQ,CACf;AACN,CAAC,CAAC"}
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import {Checkbox, TextInput} from '@mantine/core';
|
|
2
|
-
import {useForm} from '@mantine/form';
|
|
3
|
-
|
|
4
|
-
import {Collection} from './Collection';
|
|
5
|
-
|
|
6
|
-
export default () => {
|
|
7
|
-
const form = useForm({
|
|
8
|
-
initialValues: {
|
|
9
|
-
todoList: [
|
|
10
|
-
{name: 'wash the dishes', done: true},
|
|
11
|
-
{name: 'take out the trash', done: false},
|
|
12
|
-
{name: 'vacuum the floors', done: true},
|
|
13
|
-
],
|
|
14
|
-
},
|
|
15
|
-
});
|
|
16
|
-
|
|
17
|
-
return (
|
|
18
|
-
<Collection<{name: string; done: boolean}>
|
|
19
|
-
draggable
|
|
20
|
-
addLabel="Add task"
|
|
21
|
-
newItem={{name: '', done: false}}
|
|
22
|
-
{...form.getInputProps('todoList')}
|
|
23
|
-
>
|
|
24
|
-
{(task, index) => (
|
|
25
|
-
<>
|
|
26
|
-
<TextInput
|
|
27
|
-
autoFocus
|
|
28
|
-
placeholder="Do something ..."
|
|
29
|
-
{...form.getInputProps(`todoList.${index}.name`)}
|
|
30
|
-
styles={{flex: 1}}
|
|
31
|
-
/>
|
|
32
|
-
<Checkbox {...form.getInputProps(`todoList.${index}.done`, {type: 'checkbox'})} />
|
|
33
|
-
</>
|
|
34
|
-
)}
|
|
35
|
-
</Collection>
|
|
36
|
-
);
|
|
37
|
-
};
|