@mrshmllw/smores-react 2.6.2 → 2.7.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.
- package/dist/Dropdown/Dropdown.d.ts +5 -11
- package/dist/Dropdown/Dropdown.js +18 -7
- package/dist/Dropdown/Dropdown.js.map +1 -1
- package/dist/Dropdown/Dropdown.stories.d.ts +2 -7
- package/dist/Field/Field.d.ts +1 -2
- package/dist/Field/Field.js +20 -8
- package/dist/Field/Field.js.map +1 -1
- package/dist/Field/types/commonFieldTypes.d.ts +0 -1
- package/dist/Fieldset/Fieldset.js +7 -2
- package/dist/Fieldset/Fieldset.js.map +1 -1
- package/dist/NumberInput/NumberInput.d.ts +3 -2
- package/dist/NumberInput/NumberInput.js +2 -2
- package/dist/NumberInput/NumberInput.js.map +1 -1
- package/dist/RadioGroup/RadioElement.d.ts +13 -0
- package/dist/RadioGroup/RadioElement.js +50 -0
- package/dist/RadioGroup/RadioElement.js.map +1 -0
- package/dist/RadioGroup/RadioGroup.d.ts +13 -0
- package/dist/RadioGroup/RadioGroup.js +38 -0
- package/dist/RadioGroup/RadioGroup.js.map +1 -0
- package/dist/RadioGroup/RadioGroup.stories.d.ts +17 -0
- package/dist/RadioGroup/RadioGroup.stories.js +39 -0
- package/dist/RadioGroup/RadioGroup.stories.js.map +1 -0
- package/dist/RadioGroup/RadioItem.d.ts +13 -0
- package/dist/RadioGroup/RadioItem.js +48 -0
- package/dist/RadioGroup/RadioItem.js.map +1 -0
- package/dist/RadioGroup/constants.d.ts +1 -0
- package/dist/RadioGroup/constants.js +2 -0
- package/dist/RadioGroup/constants.js.map +1 -0
- package/dist/RadioGroup/index.d.ts +1 -0
- package/dist/RadioGroup/index.js +2 -0
- package/dist/RadioGroup/index.js.map +1 -0
- package/dist/RadioGroup/types.d.ts +2 -0
- package/dist/RadioGroup/types.js +2 -0
- package/dist/RadioGroup/types.js.map +1 -0
- package/dist/SearchInput/SearchInput.d.ts +3 -2
- package/dist/SearchInput/SearchInput.js +3 -2
- package/dist/SearchInput/SearchInput.js.map +1 -1
- package/dist/Text/Text.d.ts +1 -1
- package/dist/TextInput/TextInput.d.ts +3 -2
- package/dist/TextInput/TextInput.js +3 -2
- package/dist/TextInput/TextInput.js.map +1 -1
- package/dist/Textarea/Textarea.d.ts +2 -2
- package/dist/Textarea/Textarea.js +2 -2
- package/dist/Textarea/Textarea.js.map +1 -1
- package/dist/fields/Field/Field.d.ts +9 -0
- package/dist/fields/Field/Field.js +18 -0
- package/dist/fields/Field/Field.js.map +1 -0
- package/dist/fields/Field/index.d.ts +3 -0
- package/dist/fields/Field/index.js +2 -0
- package/dist/fields/Field/index.js.map +1 -0
- package/dist/fields/Fieldset/Fieldset.d.ts +5 -0
- package/dist/fields/Fieldset/Fieldset.js +18 -0
- package/dist/fields/Fieldset/Fieldset.js.map +1 -0
- package/dist/fields/Fieldset/Fieldset.stories.d.ts +10 -0
- package/dist/fields/Fieldset/Fieldset.stories.js +22 -0
- package/dist/fields/Fieldset/Fieldset.stories.js.map +1 -0
- package/dist/fields/Fieldset/index.d.ts +1 -0
- package/dist/fields/Fieldset/index.js +2 -0
- package/dist/fields/Fieldset/index.js.map +1 -0
- package/dist/fields/commonFieldTypes.d.ts +16 -0
- package/dist/fields/commonFieldTypes.js +2 -0
- package/dist/fields/commonFieldTypes.js.map +1 -0
- package/dist/fields/components/InternalField.d.ts +11 -0
- package/dist/fields/components/InternalField.js +37 -0
- package/dist/fields/components/InternalField.js.map +1 -0
- package/dist/fields/components/Placeholder.d.ts +2 -0
- package/dist/fields/components/Placeholder.js +25 -0
- package/dist/fields/components/Placeholder.js.map +1 -0
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/dist/utils/visuallyHidden.d.ts +5 -0
- package/dist/utils/visuallyHidden.js +14 -0
- package/dist/utils/visuallyHidden.js.map +1 -0
- package/package.json +1 -1
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/RadioGroup/types.ts"],"names":[],"mappings":""}
|
@@ -1,10 +1,10 @@
|
|
1
1
|
import { FC, FocusEvent } from 'react';
|
2
|
-
import {
|
2
|
+
import { CommonFieldProps } from '../fields/Field';
|
3
3
|
export declare type SearchInputItem = {
|
4
4
|
label: string;
|
5
5
|
value: string;
|
6
6
|
};
|
7
|
-
export interface SearchInputProps extends
|
7
|
+
export interface SearchInputProps extends CommonFieldProps {
|
8
8
|
name?: string;
|
9
9
|
placeholder?: string;
|
10
10
|
searchList: SearchInputItem[];
|
@@ -12,5 +12,6 @@ export interface SearchInputProps extends CommonFieldTypes {
|
|
12
12
|
resultsRelativePosition?: boolean;
|
13
13
|
showIcon?: boolean;
|
14
14
|
onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
|
15
|
+
outlined?: boolean;
|
15
16
|
}
|
16
17
|
export declare const SearchInput: FC<SearchInputProps>;
|
@@ -14,7 +14,7 @@ import styled from 'styled-components';
|
|
14
14
|
import { darken } from 'polished';
|
15
15
|
import { theme } from '../theme';
|
16
16
|
import { Icon } from '../Icon';
|
17
|
-
import { Field } from '../Field';
|
17
|
+
import { Field } from '../fields/Field';
|
18
18
|
import { useUniqueId } from '../utils/id';
|
19
19
|
export const SearchInput = (_a) => {
|
20
20
|
var { id: idProp, name = 'search_input', className = '', placeholder, searchList, onFound, resultsRelativePosition = false, outlined = false, showIcon = false, renderAsTitle = false, onBlur } = _a, otherProps = __rest(_a, ["id", "name", "className", "placeholder", "searchList", "onFound", "resultsRelativePosition", "outlined", "showIcon", "renderAsTitle", "onBlur"]);
|
@@ -46,7 +46,7 @@ export const SearchInput = (_a) => {
|
|
46
46
|
onFound(selectedItem.value);
|
47
47
|
setSelected(true);
|
48
48
|
};
|
49
|
-
return (React.createElement(Field, Object.assign({ className: className, renderAsTitle: renderAsTitle, id: id, outlined: outlined
|
49
|
+
return (React.createElement(Field, Object.assign({ className: className, renderAsTitle: renderAsTitle, id: id, outlined: outlined }, otherProps),
|
50
50
|
React.createElement(React.Fragment, null,
|
51
51
|
React.createElement(StyledInputBox, { outlined: outlined, selected: selected },
|
52
52
|
showIcon && React.createElement(SearchIcon, { size: 24, render: "search", color: "subtext" }),
|
@@ -60,6 +60,7 @@ const StyledInputBox = styled.div `
|
|
60
60
|
border-bottom: ${({ outlined }) => outlined ? 'none' : `1px solid ${theme.colors.outline}`};
|
61
61
|
${({ outlined }) => outlined &&
|
62
62
|
`
|
63
|
+
background-color: ${theme.colors.white};
|
63
64
|
border: 2px solid ${theme.colors.outline};
|
64
65
|
border-radius: 8px;
|
65
66
|
height: auto;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../src/SearchInput/SearchInput.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAkB,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvD,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAoB,MAAM,
|
1
|
+
{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../src/SearchInput/SearchInput.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAkB,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvD,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAoB,MAAM,iBAAiB,CAAA;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAkBzC,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,EAajD,EAAE,EAAE;QAb6C,EAChD,EAAE,EAAE,MAAM,EACV,IAAI,GAAG,cAAc,EACrB,SAAS,GAAG,EAAE,EACd,WAAW,EACX,UAAU,EACV,OAAO,EACP,uBAAuB,GAAG,KAAK,EAC/B,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,aAAa,GAAG,KAAK,EACrB,MAAM,OAEP,EADI,UAAU,cAZmC,iJAajD,CADc;IAEb,MAAM,EAAE,GAAG,WAAW,CAAC,MAAM,CAAC,CAAA;IAC9B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC3C,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAoB,EAAE,CAAC,CAAA;IACvD,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAA;IACxD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE/C,MAAM,MAAM,GAAG,CAAC,CAAoC,EAAQ,EAAE;QAC5D,MAAM,KAAK,GAAG,CAAC,CAAC,aAAa,CAAC,KAAK,CAAA;QAEnC,IAAI,KAAK,EAAE;YACT,IAAI,KAAK,CAAC,MAAM,IAAI,CAAC,EAAE;gBACrB,MAAM,YAAY,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,CAC5C,EAAE,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,iBAAiB,EAAE,CAAC,CAC3D,CAAA;gBAED,SAAS,CAAC,IAAI,CAAC,CAAA;gBACf,OAAO,CAAC,YAAY,CAAC,CAAA;aACtB;SACF;aAAM;YACL,SAAS,CAAC,KAAK,CAAC,CAAA;SACjB;IACH,CAAC,CAAA;IAED,MAAM,gBAAgB,GAAG,CAAC,CAAoC,EAAQ,EAAE;QACtE,MAAM,KAAK,GAAG,CAAC,CAAC,aAAa,CAAC,KAAK,CAAA;QACnC,iBAAiB,CAAC,KAAK,CAAC,CAAA;IAC1B,CAAC,CAAA;IAED,MAAM,MAAM,GAAG,CAAC,YAA6B,EAAQ,EAAE;QACrD,SAAS,CAAC,KAAK,CAAC,CAAA;QAChB,iBAAiB,CAAC,YAAY,CAAC,KAAK,CAAC,CAAA;QACrC,OAAO,CAAC,YAAY,CAAC,KAAK,CAAC,CAAA;QAC3B,WAAW,CAAC,IAAI,CAAC,CAAA;IACnB,CAAC,CAAA;IAED,OAAO,CACL,oBAAC,KAAK,kBACJ,SAAS,EAAE,SAAS,EACpB,aAAa,EAAE,aAAa,EAC5B,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,IACd,UAAU;QAEd;YACE,oBAAC,cAAc,IAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ;gBACnD,QAAQ,IAAI,oBAAC,UAAU,IAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAC,QAAQ,EAAC,KAAK,EAAC,SAAS,GAAG;gBACrE,oBAAC,WAAW,IACV,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAC,KAAK,EAClB,KAAK,EAAE,cAAc,EACrB,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,gBAAgB,EAC1B,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,GACd,CACa;YAEjB,oBAAC,sBAAsB,IACrB,IAAI,EAAE,MAAM,EACZ,gBAAgB,EAAE,CAAC,uBAAuB,EAC1C,QAAQ,EAAE,QAAQ;gBAElB,oBAAC,WAAW,IAAC,QAAQ,EAAE,QAAQ,IAC5B,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CACb,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAClB,4BAAI,GAAG,EAAE,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,IAClC,EAAE,CAAC,KAAK,CACN,CACN,CAAC,CACH,CAAC,CAAC,CAAC,CACF,6CAAmB,CACpB,CACW,CACS,CACxB,CACG,CACT,CAAA;AACH,CAAC,CAAA;AAWD,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAU;;;mBAGxB,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAChC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;IACvD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,QAAQ;IACR;wBACoB,KAAK,CAAC,MAAM,CAAC,KAAK;wBAClB,KAAK,CAAC,MAAM,CAAC,OAAO;;;GAGzC;aACU,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC;;;;;oBAKjD,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;;;IAGjD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,QAAQ;IACR;oBACgB,KAAK,CAAC,MAAM,CAAC,OAAO;GACrC;WACQ,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACxB,QAAQ,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,SAAS,EAAE;CACrE,CAAA;AASD,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAO;;;;;;;;;aAS1B,KAAK,CAAC,MAAM,CAAC,OAAO;;;IAG7B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,QAAQ;IACR;;GAED;CACF,CAAA;AAOD,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAkB;;;IAGvD,CAAC,EAAE,gBAAgB,EAAE,EAAE,EAAE,CAAC,gBAAgB,IAAI,qBAAqB;;gBAEvD,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC;IACvD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,QAAQ,IAAI,sBAAsB;;;kBAGtC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;;CAEvD,CAAA;AAED,MAAM,WAAW,GAAG,MAAM,CAAC,EAAE,CAAa;;;;;;sBAMpB,KAAK,CAAC,MAAM,CAAC,KAAK;sBAClB,KAAK,CAAC,MAAM,CAAC,OAAO;;;;;IAKtC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,QAAQ;IACR;wBACoB,KAAK,CAAC,MAAM,CAAC,OAAO;GACzC;;;;;;aAMU,KAAK,CAAC,MAAM,CAAC,SAAS;;;;0BAIT,KAAK,CAAC,MAAM,CAAC,UAAU;;;CAGhD,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;CAE9B,CAAA"}
|
package/dist/Text/Text.d.ts
CHANGED
@@ -8,7 +8,7 @@ export declare type DeprecatedTypo = 'header-large' | 'header-medium' | 'header-
|
|
8
8
|
export declare type Typo = 'hero-alternate' | 'hero' | 'heading-large' | 'heading-medium' | 'heading-small' | 'headline-regular' | 'headline-small' | 'body-standfirst' | 'body-regular' | 'body-small' | 'caption' | 'label';
|
9
9
|
declare type Props = {
|
10
10
|
children: ReactNode;
|
11
|
-
tag
|
11
|
+
tag?: any;
|
12
12
|
className?: string;
|
13
13
|
typo?: Typo | (string & Record<never, never>);
|
14
14
|
align?: string;
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import React, { FocusEvent, FormEvent } from 'react';
|
2
|
-
import {
|
3
|
-
interface Props extends
|
2
|
+
import { CommonFieldProps } from '../fields/Field';
|
3
|
+
interface Props extends CommonFieldProps {
|
4
4
|
type?: 'text' | 'email' | 'password' | 'time' | 'date';
|
5
5
|
placeholder: string;
|
6
6
|
name?: string;
|
@@ -8,6 +8,7 @@ interface Props extends CommonFieldTypes {
|
|
8
8
|
onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
|
9
9
|
trailingIcon?: string;
|
10
10
|
disabled?: boolean;
|
11
|
+
outlined?: boolean;
|
11
12
|
}
|
12
13
|
/** on change or on input required */
|
13
14
|
declare type InputProps = {
|
@@ -13,14 +13,14 @@ import React, { forwardRef } from 'react';
|
|
13
13
|
import styled from 'styled-components';
|
14
14
|
import { darken } from 'polished';
|
15
15
|
import { theme } from '../theme';
|
16
|
-
import { Field } from '../Field';
|
16
|
+
import { Field } from '../fields/Field';
|
17
17
|
import { Box } from '../Box';
|
18
18
|
import { Icon } from '../Icon';
|
19
19
|
import { useUniqueId } from '../utils/id';
|
20
20
|
export const TextInput = forwardRef(function TextInput(_a, ref) {
|
21
21
|
var { id: idProp, type = 'text', placeholder, name, value, outlined = false, error = false, onBlur, onChange, onInputChange, disabled = false, trailingIcon } = _a, fieldProps = __rest(_a, ["id", "type", "placeholder", "name", "value", "outlined", "error", "onBlur", "onChange", "onInputChange", "disabled", "trailingIcon"]);
|
22
22
|
const id = useUniqueId(idProp);
|
23
|
-
return (React.createElement(Field, Object.assign({}, fieldProps, { id: id, error: error, outlined: outlined
|
23
|
+
return (React.createElement(Field, Object.assign({}, fieldProps, { id: id, error: error, outlined: outlined }),
|
24
24
|
React.createElement(Box, { flex: true },
|
25
25
|
React.createElement(StyledInput, { disabled: disabled, type: type, id: id, name: name, ref: ref, placeholder: placeholder, value: value, error: error, outlined: outlined, autoComplete: "off", onChange: (e) => {
|
26
26
|
onChange && onChange(e.currentTarget.value);
|
@@ -47,6 +47,7 @@ const StyledInput = styled.input `
|
|
47
47
|
|
48
48
|
${({ outlined, error }) => outlined &&
|
49
49
|
`
|
50
|
+
background-color: ${theme.colors.white};
|
50
51
|
border: 2px solid ${error ? theme.colors.error : theme.colors.outline};
|
51
52
|
border-radius: 8px;
|
52
53
|
height: auto;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"TextInput.js","sourceRoot":"","sources":["../../src/TextInput/TextInput.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAyB,UAAU,EAAgB,MAAM,OAAO,CAAA;AAC9E,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,KAAK,EAAoB,MAAM,
|
1
|
+
{"version":3,"file":"TextInput.js","sourceRoot":"","sources":["../../src/TextInput/TextInput.tsx"],"names":[],"mappings":"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"}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import React, { FocusEvent, FormEvent } from 'react';
|
2
|
-
import {
|
2
|
+
import { CommonFieldProps } from '../fields/Field';
|
3
3
|
import { MarginProps } from '../utils/space';
|
4
4
|
declare type BaseProps = {
|
5
5
|
id?: string;
|
@@ -13,7 +13,7 @@ declare type BaseProps = {
|
|
13
13
|
maxLength?: number;
|
14
14
|
onBlur?: (e: FocusEvent<HTMLTextAreaElement>) => void;
|
15
15
|
rows?: number;
|
16
|
-
} &
|
16
|
+
} & CommonFieldProps & MarginProps;
|
17
17
|
declare type TruncateProps = {
|
18
18
|
onChange: (e: string) => void;
|
19
19
|
onInputChange?: (e: FormEvent<HTMLTextAreaElement>) => void;
|
@@ -14,11 +14,11 @@ import styled from 'styled-components';
|
|
14
14
|
import { darken } from 'polished';
|
15
15
|
import { theme } from '../theme';
|
16
16
|
import { useUniqueId } from '../utils/id';
|
17
|
-
import { Field } from '../Field';
|
17
|
+
import { Field } from '../fields/Field';
|
18
18
|
export const Textarea = forwardRef(function Textarea(_a, ref) {
|
19
19
|
var { id: idProp, name, value, onChange, onInputChange, resize = 'none', error = false, placeholder, disabled = false, maxLength, onBlur, rows = 4 } = _a, fieldProps = __rest(_a, ["id", "name", "value", "onChange", "onInputChange", "resize", "error", "placeholder", "disabled", "maxLength", "onBlur", "rows"]);
|
20
20
|
const id = useUniqueId(idProp);
|
21
|
-
return (React.createElement(Field, Object.assign({}, fieldProps, { id: id, error: error
|
21
|
+
return (React.createElement(Field, Object.assign({}, fieldProps, { id: id, error: error }),
|
22
22
|
React.createElement(StyledTextArea, { ref: ref, error: error, id: id, name: name, disabled: disabled, resize: resize, placeholder: placeholder, value: value, onChange: (e) => {
|
23
23
|
onChange === null || onChange === void 0 ? void 0 : onChange(e.currentTarget.value);
|
24
24
|
onInputChange === null || onInputChange === void 0 ? void 0 : onInputChange(e);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../src/Textarea/Textarea.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAuC,UAAU,EAAE,MAAM,OAAO,CAAA;AAC9E,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AACzC,OAAO,EAAoB,KAAK,EAAE,MAAM,
|
1
|
+
{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../src/Textarea/Textarea.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAuC,UAAU,EAAE,MAAM,OAAO,CAAA;AAC9E,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AACzC,OAAO,EAAoB,KAAK,EAAE,MAAM,iBAAiB,CAAA;AA8BzD,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAC,SAAS,QAAQ,CAClD,EAcgB,EAChB,GAAsC;QAftC,EACE,EAAE,EAAE,MAAM,EACV,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,aAAa,EACb,MAAM,GAAG,MAAM,EACf,KAAK,GAAG,KAAK,EACb,WAAW,EACX,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,MAAM,EACN,IAAI,GAAG,CAAC,OAEM,EADX,UAAU,cAbf,iIAcC,CADc;IAIf,MAAM,EAAE,GAAG,WAAW,CAAC,MAAM,CAAC,CAAA;IAC9B,OAAO,CACL,oBAAC,KAAK,oBAAK,UAAU,IAAE,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK;QACzC,oBAAC,cAAc,IACb,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAiC,EAAE,EAAE;gBAC9C,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;gBACjC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,CAAC,CAAC,CAAA;YACpB,CAAC,EACD,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,GACV,CACI,CACT,CAAA;AACH,CAAC,CAAC,CAAA;AASF,MAAM,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAU;;;gBAGhC,KAAK,CAAC,MAAM,CAAC,KAAK;sBACZ,KAAK,CAAC,MAAM,CAAC,OAAO;;;;;WAK/B,KAAK,CAAC,MAAM,CAAC,SAAS;YACrB,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM;YACtB,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC;aACpD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC;kBACrC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAC5B,KAAK,CAAC,MAAM,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC;;;;;;oBAM9B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAC5B,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;;;IAGhE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACd,KAAK;IACL,KAAK,IAAI,EAAE;IACX;sBACkB,KAAK,CAAC,MAAM,CAAC,OAAO;KACrC;CACJ,CAAA"}
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import { ReactNode } from 'react';
|
2
|
+
import { CommonFieldProps } from '../commonFieldTypes';
|
3
|
+
interface FieldProps extends CommonFieldProps {
|
4
|
+
children: ReactNode;
|
5
|
+
assistiveText?: string;
|
6
|
+
outlined?: boolean;
|
7
|
+
}
|
8
|
+
export declare const Field: ({ children, ...fieldProps }: FieldProps) => JSX.Element;
|
9
|
+
export {};
|
@@ -0,0 +1,18 @@
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
+
var t = {};
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
+
t[p] = s[p];
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
+
t[p[i]] = s[p[i]];
|
9
|
+
}
|
10
|
+
return t;
|
11
|
+
};
|
12
|
+
import React from 'react';
|
13
|
+
import { InternalField } from '../components/InternalField';
|
14
|
+
export const Field = (_a) => {
|
15
|
+
var { children } = _a, fieldProps = __rest(_a, ["children"]);
|
16
|
+
return React.createElement(InternalField, Object.assign({}, fieldProps), children);
|
17
|
+
};
|
18
|
+
//# sourceMappingURL=Field.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Field.js","sourceRoot":"","sources":["../../../src/fields/Field/Field.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAGxC,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAQ3D,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAuC,EAAE,EAAE;QAA3C,EAAE,QAAQ,OAA6B,EAAxB,UAAU,cAAzB,YAA2B,CAAF;IAC7C,OAAO,oBAAC,aAAa,oBAAK,UAAU,GAAG,QAAQ,CAAiB,CAAA;AAClE,CAAC,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/fields/Field/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA"}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { MarginProps } from '../../utils/space';
|
3
|
+
import { CommonFieldProps } from '../commonFieldTypes';
|
4
|
+
export declare type FieldsetProps = CommonFieldProps & MarginProps;
|
5
|
+
export declare const Fieldset: ({ children, renderAsTitle, ...fieldProps }: FieldsetProps) => JSX.Element;
|
@@ -0,0 +1,18 @@
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
+
var t = {};
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
+
t[p] = s[p];
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
+
t[p[i]] = s[p[i]];
|
9
|
+
}
|
10
|
+
return t;
|
11
|
+
};
|
12
|
+
import React from 'react';
|
13
|
+
import { InternalField } from '../components/InternalField';
|
14
|
+
export const Fieldset = (_a) => {
|
15
|
+
var { children, renderAsTitle = true } = _a, fieldProps = __rest(_a, ["children", "renderAsTitle"]);
|
16
|
+
return (React.createElement(InternalField, Object.assign({ renderAsTitle: renderAsTitle, outlined: true }, fieldProps), children));
|
17
|
+
};
|
18
|
+
//# sourceMappingURL=Fieldset.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Fieldset.js","sourceRoot":"","sources":["../../../src/fields/Fieldset/Fieldset.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAI3D,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAIT,EAAE,EAAE;QAJK,EACvB,QAAQ,EACR,aAAa,GAAG,IAAI,OAEN,EADX,UAAU,cAHU,6BAIxB,CADc;IAEb,OAAO,CACL,oBAAC,aAAa,kBAAC,aAAa,EAAE,aAAa,EAAE,QAAQ,UAAK,UAAU,GACjE,QAAQ,CACK,CACjB,CAAA;AACH,CAAC,CAAA"}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { FieldsetProps } from './Fieldset';
|
3
|
+
declare const _default: {
|
4
|
+
title: string;
|
5
|
+
component: ({ children, renderAsTitle, ...fieldProps }: FieldsetProps) => JSX.Element;
|
6
|
+
};
|
7
|
+
export default _default;
|
8
|
+
export declare const Default: any;
|
9
|
+
export declare const WithError: any;
|
10
|
+
export declare const WithSmallLabel: any;
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { Placeholder } from '../components/Placeholder';
|
3
|
+
import { Fieldset } from './Fieldset';
|
4
|
+
export default {
|
5
|
+
title: 'Fieldset',
|
6
|
+
component: Fieldset,
|
7
|
+
};
|
8
|
+
const defaultArgs = {
|
9
|
+
label: 'Fieldset label',
|
10
|
+
assistiveText: 'Some assistive text to help the user',
|
11
|
+
renderAsTitle: true,
|
12
|
+
required: false,
|
13
|
+
};
|
14
|
+
const Template = (props) => (React.createElement(Fieldset, Object.assign({}, props),
|
15
|
+
React.createElement(Placeholder, null)));
|
16
|
+
export const Default = Template.bind({});
|
17
|
+
Default.args = defaultArgs;
|
18
|
+
export const WithError = Template.bind({});
|
19
|
+
WithError.args = Object.assign(Object.assign({}, defaultArgs), { error: true, errorMsg: 'This is an error message describing what is wrong' });
|
20
|
+
export const WithSmallLabel = Template.bind({});
|
21
|
+
WithSmallLabel.args = Object.assign(Object.assign({}, defaultArgs), { renderAsTitle: false });
|
22
|
+
//# sourceMappingURL=Fieldset.stories.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Fieldset.stories.js","sourceRoot":"","sources":["../../../src/fields/Fieldset/Fieldset.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AACvD,OAAO,EAAE,QAAQ,EAAiB,MAAM,YAAY,CAAA;AAEpD,eAAe;IACb,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,QAAQ;CACpB,CAAA;AAED,MAAM,WAAW,GAAkB;IACjC,KAAK,EAAE,gBAAgB;IACvB,aAAa,EAAE,sCAAsC;IACrD,aAAa,EAAE,IAAI;IACnB,QAAQ,EAAE,KAAK;CAChB,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE,CAAC,CACzC,oBAAC,QAAQ,oBAAK,KAAK;IACjB,oBAAC,WAAW,OAAG,CACN,CACZ,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG,WAAW,CAAA;AAE1B,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE1C,SAAS,CAAC,IAAI,mCACT,WAAW,KACd,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,mDAAmD,GAC9D,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE/C,cAAc,CAAC,IAAI,mCACd,WAAW,KACd,aAAa,EAAE,KAAK,GACrB,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export { Fieldset, FieldsetProps } from './Fieldset';
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/fields/Fieldset/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAiB,MAAM,YAAY,CAAA"}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
import { ReactNode } from 'react';
|
2
|
+
import { MarginProps } from '../utils/space';
|
3
|
+
export interface CommonFieldProps extends MarginProps {
|
4
|
+
id?: string;
|
5
|
+
className?: string;
|
6
|
+
children?: ReactNode;
|
7
|
+
label?: string;
|
8
|
+
renderAsTitle?: boolean;
|
9
|
+
assistiveText?: string;
|
10
|
+
required?: boolean;
|
11
|
+
error?: boolean;
|
12
|
+
errorMsg?: string;
|
13
|
+
}
|
14
|
+
export interface InternalCommonFieldProps extends CommonFieldProps {
|
15
|
+
outlined?: boolean;
|
16
|
+
}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"commonFieldTypes.js","sourceRoot":"","sources":["../../src/fields/commonFieldTypes.ts"],"names":[],"mappings":""}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import { ReactNode } from 'react';
|
2
|
+
import { InternalCommonFieldProps } from '../commonFieldTypes';
|
3
|
+
interface InternalFieldProps extends InternalCommonFieldProps {
|
4
|
+
children: ReactNode;
|
5
|
+
className?: string;
|
6
|
+
assistiveText?: string;
|
7
|
+
htmlFor?: string;
|
8
|
+
fieldType?: 'field' | 'fieldset';
|
9
|
+
}
|
10
|
+
export declare const InternalField: ({ children, fieldType, renderAsTitle, htmlFor, className, label, assistiveText, outlined, error, errorMsg, required, ...marginProps }: InternalFieldProps) => JSX.Element;
|
11
|
+
export {};
|
@@ -0,0 +1,37 @@
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
+
var t = {};
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
+
t[p] = s[p];
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
+
t[p[i]] = s[p[i]];
|
9
|
+
}
|
10
|
+
return t;
|
11
|
+
};
|
12
|
+
import React from 'react';
|
13
|
+
import styled from 'styled-components';
|
14
|
+
import { Text } from '../../Text';
|
15
|
+
import { Box } from '../../Box';
|
16
|
+
export const InternalField = (_a) => {
|
17
|
+
var { children, fieldType, renderAsTitle, htmlFor, className, label, assistiveText, outlined = false, error, errorMsg, required } = _a, marginProps = __rest(_a, ["children", "fieldType", "renderAsTitle", "htmlFor", "className", "label", "assistiveText", "outlined", "error", "errorMsg", "required"]);
|
18
|
+
return (React.createElement(Container, Object.assign({ as: fieldType === 'field' ? 'div' : 'fieldset', className: className }, marginProps),
|
19
|
+
label && (React.createElement(React.Fragment, null, renderAsTitle ? (React.createElement(Box, { mb: "16px" },
|
20
|
+
React.createElement(Text, { tag: fieldType === 'field' ? 'label' : 'legend', typo: "heading-small", htmlFor: htmlFor }, label),
|
21
|
+
assistiveText && (React.createElement(Text, { tag: "p", color: "subtext", mt: { custom: 4 } }, assistiveText)))) : (React.createElement(Box, { mb: { custom: outlined ? 4 : 0 } },
|
22
|
+
React.createElement(Text, { tag: "label", typo: "label", color: "subtext", htmlFor: htmlFor },
|
23
|
+
label,
|
24
|
+
required && (React.createElement(Text, { tag: "span", typo: "body-small", color: "error" }, "*"))))))),
|
25
|
+
React.createElement(Box, null, children),
|
26
|
+
error && (React.createElement(Text, { tag: "span", typo: "caption", color: "error", mt: "8px" }, errorMsg))));
|
27
|
+
};
|
28
|
+
const Container = styled(Box) `
|
29
|
+
display: flex;
|
30
|
+
flex-direction: column;
|
31
|
+
position: relative;
|
32
|
+
width: 100%;
|
33
|
+
|
34
|
+
// In case, the element is a 'fieldset', we remove the border
|
35
|
+
border: 0;
|
36
|
+
`;
|
37
|
+
//# sourceMappingURL=InternalField.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"InternalField.js","sourceRoot":"","sources":["../../../src/fields/components/InternalField.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AACxC,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAA;AAW/B,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAaT,EAAE,EAAE;QAbK,EAC5B,QAAQ,EACR,SAAS,EACT,aAAa,EACb,OAAO,EACP,SAAS,EACT,KAAK,EACL,aAAa,EACb,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,QAAQ,EACR,QAAQ,OAEW,EADhB,WAAW,cAZc,yIAa7B,CADe;IAEd,OAAO,CACL,oBAAC,SAAS,kBACR,EAAE,EAAE,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,EAC9C,SAAS,EAAE,SAAS,IAChB,WAAW;QAEd,KAAK,IAAI,CACR,0CACG,aAAa,CAAC,CAAC,CAAC,CACf,oBAAC,GAAG,IAAC,EAAE,EAAC,MAAM;YACZ,oBAAC,IAAI,IACH,GAAG,EAAE,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,EAC/C,IAAI,EAAC,eAAe,EACpB,OAAO,EAAE,OAAO,IAEf,KAAK,CACD;YAEN,aAAa,IAAI,CAChB,oBAAC,IAAI,IAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,SAAS,EAAC,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,IAC5C,aAAa,CACT,CACR,CACG,CACP,CAAC,CAAC,CAAC,CACF,oBAAC,GAAG,IAAC,EAAE,EAAE,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;YACnC,oBAAC,IAAI,IAAC,GAAG,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,SAAS,EAAC,OAAO,EAAE,OAAO;gBAC5D,KAAK;gBACL,QAAQ,IAAI,CACX,oBAAC,IAAI,IAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,OAAO,QAEzC,CACR,CACI,CACH,CACP,CACA,CACJ;QAED,oBAAC,GAAG,QAAE,QAAQ,CAAO;QAEpB,KAAK,IAAI,CACR,oBAAC,IAAI,IAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,OAAO,EAAC,EAAE,EAAC,KAAK,IACnD,QAAQ,CACJ,CACR,CACS,CACb,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;;;;;;;;CAQ5B,CAAA"}
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import styled from 'styled-components';
|
3
|
+
import { Box } from '../../Box';
|
4
|
+
import { theme } from '../../theme';
|
5
|
+
export const Placeholder = () => {
|
6
|
+
return (React.createElement(Wrapper, null,
|
7
|
+
React.createElement(Svg, { xmlns: "http://www.w3.org/2000/svg" },
|
8
|
+
React.createElement(Line, { x1: "0", y1: "0", x2: "100%", y2: "100%" }),
|
9
|
+
React.createElement(Line, { x1: "100%", y1: "0", x2: "0", y2: "100%" }))));
|
10
|
+
};
|
11
|
+
const Wrapper = styled(Box) `
|
12
|
+
background-color: ${theme.colors.background};
|
13
|
+
border: 2px solid ${theme.colors.outline};
|
14
|
+
height: 40px;
|
15
|
+
width: auto;
|
16
|
+
`;
|
17
|
+
const Svg = styled.svg `
|
18
|
+
width: 100%;
|
19
|
+
height: 100%;
|
20
|
+
`;
|
21
|
+
const Line = styled.line `
|
22
|
+
stroke-width: 2px;
|
23
|
+
stroke: ${theme.colors.outline};
|
24
|
+
`;
|
25
|
+
//# sourceMappingURL=Placeholder.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Placeholder.js","sourceRoot":"","sources":["../../../src/fields/components/Placeholder.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAA;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAEnC,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE;IAC9B,OAAO,CACL,oBAAC,OAAO;QACN,oBAAC,GAAG,IAAC,KAAK,EAAC,4BAA4B;YACrC,oBAAC,IAAI,IAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,MAAM,EAAC,EAAE,EAAC,MAAM,GAAG;YAC1C,oBAAC,IAAI,IAAC,EAAE,EAAC,MAAM,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,MAAM,GAAG,CACtC,CACE,CACX,CAAA;AACH,CAAC,CAAA;AAED,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;sBACL,KAAK,CAAC,MAAM,CAAC,UAAU;sBACvB,KAAK,CAAC,MAAM,CAAC,OAAO;;;CAGzC,CAAA;AAED,MAAM,GAAG,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAGrB,CAAA;AAED,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAA;;YAEZ,KAAK,CAAC,MAAM,CAAC,OAAO;CAC/B,CAAA"}
|
package/dist/index.d.ts
CHANGED
@@ -21,6 +21,7 @@ export * from './Modal';
|
|
21
21
|
export * from './NumberInput';
|
22
22
|
export * from './Pagination';
|
23
23
|
export * from './RadioButton';
|
24
|
+
export * from './RadioGroup';
|
24
25
|
export * from './Row';
|
25
26
|
export * from './SearchInput';
|
26
27
|
export * from './SupportMessage';
|
@@ -30,6 +31,6 @@ export * from './Textarea';
|
|
30
31
|
export * from './TextInput';
|
31
32
|
export * from './theme';
|
32
33
|
export * from './Toggle';
|
33
|
-
export * from './Fieldset';
|
34
|
+
export * from './fields/Fieldset';
|
34
35
|
export * from './fontStyle';
|
35
36
|
export { MarginProps, PaddingProps } from './utils/space';
|
package/dist/index.js
CHANGED
@@ -21,6 +21,7 @@ export * from './Modal';
|
|
21
21
|
export * from './NumberInput';
|
22
22
|
export * from './Pagination';
|
23
23
|
export * from './RadioButton';
|
24
|
+
export * from './RadioGroup';
|
24
25
|
export * from './Row';
|
25
26
|
export * from './SearchInput';
|
26
27
|
export * from './SupportMessage';
|
@@ -30,6 +31,6 @@ export * from './Textarea';
|
|
30
31
|
export * from './TextInput';
|
31
32
|
export * from './theme';
|
32
33
|
export * from './Toggle';
|
33
|
-
export * from './Fieldset';
|
34
|
+
export * from './fields/Fieldset';
|
34
35
|
export * from './fontStyle';
|
35
36
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,OAAO,CAAA;AACrB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,QAAQ,CAAA;AACtB,cAAc,4BAA4B,CAAA;AAC1C,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,OAAO,CAAA;AACrB,cAAc,eAAe,CAAA;AAC7B,cAAc,kBAAkB,CAAA;AAChC,cAAc,OAAO,CAAA;AACrB,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,OAAO,CAAA;AACrB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,QAAQ,CAAA;AACtB,cAAc,4BAA4B,CAAA;AAC1C,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,OAAO,CAAA;AACrB,cAAc,eAAe,CAAA;AAC7B,cAAc,kBAAkB,CAAA;AAChC,cAAc,OAAO,CAAA;AACrB,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,aAAa,CAAA;AAC3B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,mBAAmB,CAAA;AACjC,cAAc,aAAa,CAAA"}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
/**
|
2
|
+
* Hide element visually but still have it accessible for assitive device
|
3
|
+
* @link https://www.a11yproject.com/posts/how-to-hide-content/
|
4
|
+
*/
|
5
|
+
export declare const visuallyHidden = "\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n";
|
@@ -0,0 +1,14 @@
|
|
1
|
+
/**
|
2
|
+
* Hide element visually but still have it accessible for assitive device
|
3
|
+
* @link https://www.a11yproject.com/posts/how-to-hide-content/
|
4
|
+
*/
|
5
|
+
export const visuallyHidden = `
|
6
|
+
clip: rect(0 0 0 0);
|
7
|
+
clip-path: inset(50%);
|
8
|
+
height: 1px;
|
9
|
+
overflow: hidden;
|
10
|
+
position: absolute;
|
11
|
+
white-space: nowrap;
|
12
|
+
width: 1px;
|
13
|
+
`;
|
14
|
+
//# sourceMappingURL=visuallyHidden.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"visuallyHidden.js","sourceRoot":"","sources":["../../src/utils/visuallyHidden.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG;;;;;;;;CAQ7B,CAAA"}
|