@mrshmllw/smores-react 2.6.1 → 2.7.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.
Files changed (82) hide show
  1. package/dist/ConfirmationRadioButtons/Confirmation.d.ts +2 -2
  2. package/dist/ConfirmationRadioButtons/Confirmation.js.map +1 -1
  3. package/dist/ConfirmationRadioButtons/RadioButtonStyled.d.ts +2 -2
  4. package/dist/ConfirmationRadioButtons/RadioButtonStyled.js +1 -3
  5. package/dist/ConfirmationRadioButtons/RadioButtonStyled.js.map +1 -1
  6. package/dist/Dropdown/Dropdown.d.ts +6 -12
  7. package/dist/Dropdown/Dropdown.js +19 -10
  8. package/dist/Dropdown/Dropdown.js.map +1 -1
  9. package/dist/Dropdown/Dropdown.stories.d.ts +2 -7
  10. package/dist/Field/Field.d.ts +1 -2
  11. package/dist/Field/Field.js +20 -8
  12. package/dist/Field/Field.js.map +1 -1
  13. package/dist/Field/types/commonFieldTypes.d.ts +0 -1
  14. package/dist/Fieldset/Fieldset.js +7 -2
  15. package/dist/Fieldset/Fieldset.js.map +1 -1
  16. package/dist/Modal/Modal.js +1 -0
  17. package/dist/Modal/Modal.js.map +1 -1
  18. package/dist/NumberInput/NumberInput.d.ts +5 -4
  19. package/dist/NumberInput/NumberInput.js +4 -6
  20. package/dist/NumberInput/NumberInput.js.map +1 -1
  21. package/dist/RadioGroup/RadioElement.d.ts +13 -0
  22. package/dist/RadioGroup/RadioElement.js +50 -0
  23. package/dist/RadioGroup/RadioElement.js.map +1 -0
  24. package/dist/RadioGroup/RadioGroup.d.ts +14 -0
  25. package/dist/RadioGroup/RadioGroup.js +38 -0
  26. package/dist/RadioGroup/RadioGroup.js.map +1 -0
  27. package/dist/RadioGroup/RadioGroup.stories.d.ts +18 -0
  28. package/dist/RadioGroup/RadioGroup.stories.js +42 -0
  29. package/dist/RadioGroup/RadioGroup.stories.js.map +1 -0
  30. package/dist/RadioGroup/RadioItem.d.ts +14 -0
  31. package/dist/RadioGroup/RadioItem.js +64 -0
  32. package/dist/RadioGroup/RadioItem.js.map +1 -0
  33. package/dist/RadioGroup/constants.d.ts +1 -0
  34. package/dist/RadioGroup/constants.js +2 -0
  35. package/dist/RadioGroup/constants.js.map +1 -0
  36. package/dist/RadioGroup/index.d.ts +1 -0
  37. package/dist/RadioGroup/index.js +2 -0
  38. package/dist/RadioGroup/index.js.map +1 -0
  39. package/dist/RadioGroup/types.d.ts +2 -0
  40. package/dist/RadioGroup/types.js +2 -0
  41. package/dist/RadioGroup/types.js.map +1 -0
  42. package/dist/SearchInput/SearchInput.d.ts +5 -3
  43. package/dist/SearchInput/SearchInput.js +5 -4
  44. package/dist/SearchInput/SearchInput.js.map +1 -1
  45. package/dist/Text/Text.d.ts +1 -1
  46. package/dist/TextInput/TextInput.d.ts +5 -4
  47. package/dist/TextInput/TextInput.js +4 -5
  48. package/dist/TextInput/TextInput.js.map +1 -1
  49. package/dist/Textarea/Textarea.d.ts +4 -4
  50. package/dist/Textarea/Textarea.js +2 -2
  51. package/dist/Textarea/Textarea.js.map +1 -1
  52. package/dist/fields/Field/Field.d.ts +9 -0
  53. package/dist/fields/Field/Field.js +18 -0
  54. package/dist/fields/Field/Field.js.map +1 -0
  55. package/dist/fields/Field/index.d.ts +3 -0
  56. package/dist/fields/Field/index.js +2 -0
  57. package/dist/fields/Field/index.js.map +1 -0
  58. package/dist/fields/Fieldset/Fieldset.d.ts +5 -0
  59. package/dist/fields/Fieldset/Fieldset.js +18 -0
  60. package/dist/fields/Fieldset/Fieldset.js.map +1 -0
  61. package/dist/fields/Fieldset/Fieldset.stories.d.ts +10 -0
  62. package/dist/fields/Fieldset/Fieldset.stories.js +22 -0
  63. package/dist/fields/Fieldset/Fieldset.stories.js.map +1 -0
  64. package/dist/fields/Fieldset/index.d.ts +1 -0
  65. package/dist/fields/Fieldset/index.js +2 -0
  66. package/dist/fields/Fieldset/index.js.map +1 -0
  67. package/dist/fields/commonFieldTypes.d.ts +16 -0
  68. package/dist/fields/commonFieldTypes.js +2 -0
  69. package/dist/fields/commonFieldTypes.js.map +1 -0
  70. package/dist/fields/components/InternalField.d.ts +11 -0
  71. package/dist/fields/components/InternalField.js +36 -0
  72. package/dist/fields/components/InternalField.js.map +1 -0
  73. package/dist/fields/components/Placeholder.d.ts +2 -0
  74. package/dist/fields/components/Placeholder.js +25 -0
  75. package/dist/fields/components/Placeholder.js.map +1 -0
  76. package/dist/index.d.ts +2 -1
  77. package/dist/index.js +2 -1
  78. package/dist/index.js.map +1 -1
  79. package/dist/utils/visuallyHidden.d.ts +5 -0
  80. package/dist/utils/visuallyHidden.js +14 -0
  81. package/dist/utils/visuallyHidden.js.map +1 -0
  82. package/package.json +6 -6
@@ -0,0 +1,42 @@
1
+ import React, { useState } from 'react';
2
+ import { RadioGroup } from './RadioGroup';
3
+ import visualSvg from './assets/radio-visual.svg';
4
+ export default {
5
+ title: 'RadioGroup',
6
+ component: RadioGroup,
7
+ argTypes: { onChange: { action: 'clicked' } },
8
+ };
9
+ const options = [
10
+ { label: 'Social', value: 'social' },
11
+ { label: 'Social and commuting', value: 'social/commuting' },
12
+ {
13
+ label: 'All the above, and I drive for work',
14
+ value: 'social/commuting/work',
15
+ },
16
+ { label: 'It’s a commercial vehicle', value: 'commercial' },
17
+ ];
18
+ const defaultArgs = {
19
+ label: 'What do you use it for?',
20
+ onChange: (value) => console.log(value),
21
+ value: options[0].value,
22
+ options,
23
+ displayType: 'normal',
24
+ };
25
+ const InteractiveStory = (props) => {
26
+ const [value, setValue] = useState('');
27
+ return (React.createElement(RadioGroup, Object.assign({}, props, { onChange: (nextValue) => setValue(nextValue), value: value })));
28
+ };
29
+ export const Interactive = InteractiveStory.bind({});
30
+ Interactive.args = defaultArgs;
31
+ const Template = (props) => React.createElement(RadioGroup, Object.assign({}, props));
32
+ export const Default = Template.bind({});
33
+ Default.args = defaultArgs;
34
+ export const Vertical = Template.bind({});
35
+ Vertical.args = Object.assign(Object.assign({}, defaultArgs), { displayType: 'vertical-card' });
36
+ export const Horizontal = Template.bind({});
37
+ Horizontal.args = Object.assign(Object.assign({}, defaultArgs), { displayType: 'horizontal-card' });
38
+ export const WithError = Template.bind({});
39
+ WithError.args = Object.assign(Object.assign({}, defaultArgs), { error: true, errorMsg: 'something', displayType: 'horizontal-card' });
40
+ export const WithVisual = Template.bind({});
41
+ WithVisual.args = Object.assign(Object.assign({}, defaultArgs), { options: options.map((option) => (Object.assign(Object.assign({}, option), { visual: visualSvg }))), displayType: 'horizontal-card' });
42
+ //# sourceMappingURL=RadioGroup.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"RadioGroup.stories.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,UAAU,EAAmB,MAAM,cAAc,CAAA;AAC1D,OAAO,SAAS,MAAM,2BAA2B,CAAA;AAEjD,eAAe;IACb,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,UAAU;IACrB,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAA;AAED,MAAM,OAAO,GAAG;IACd,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE;IACpC,EAAE,KAAK,EAAE,sBAAsB,EAAE,KAAK,EAAE,kBAAkB,EAAE;IAC5D;QACE,KAAK,EAAE,qCAAqC;QAC5C,KAAK,EAAE,uBAAuB;KAC/B;IACD,EAAE,KAAK,EAAE,2BAA2B,EAAE,KAAK,EAAE,YAAY,EAAE;CAC5D,CAAA;AAED,MAAM,WAAW,GAAoB;IACnC,KAAK,EAAE,yBAAyB;IAChC,QAAQ,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;IAC/C,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK;IACvB,OAAO;IACP,WAAW,EAAE,QAAQ;CACtB,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,KAA8B,EAAE,EAAE;IAC1D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAA;IAEtC,OAAO,CACL,oBAAC,UAAU,oBACL,KAAK,IACT,QAAQ,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,QAAQ,CAAC,SAAS,CAAC,EAC5C,KAAK,EAAE,KAAK,IACZ,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEpD,WAAW,CAAC,IAAI,GAAG,WAAW,CAAA;AAE9B,MAAM,QAAQ,GAAG,CAAC,KAAsB,EAAE,EAAE,CAAC,oBAAC,UAAU,oBAAK,KAAK,EAAI,CAAA;AAEtE,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG,WAAW,CAAA;AAE1B,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEzC,QAAQ,CAAC,IAAI,mCACR,WAAW,KACd,WAAW,EAAE,eAAe,GAC7B,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE3C,UAAU,CAAC,IAAI,mCACV,WAAW,KACd,WAAW,EAAE,iBAAiB,GAC/B,CAAA;AAED,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,WAAW,EACrB,WAAW,EAAE,iBAAiB,GAC/B,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE3C,UAAU,CAAC,IAAI,mCACV,WAAW,KACd,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,iCAAM,MAAM,KAAE,MAAM,EAAE,SAAS,IAAG,CAAC,EACpE,WAAW,EAAE,iBAAiB,GAC/B,CAAA"}
@@ -0,0 +1,14 @@
1
+ /// <reference types="react" />
2
+ import { BaseValueType, DisplayType } from './types';
3
+ declare type RadioItemProps<Value extends BaseValueType = BaseValueType> = {
4
+ name: string;
5
+ visual?: string;
6
+ value: Value;
7
+ label: string;
8
+ checked: boolean;
9
+ onChange: (value: Value) => void;
10
+ displayType: DisplayType;
11
+ isError: boolean;
12
+ };
13
+ export declare const RadioItem: <Value extends BaseValueType>({ name, visual, label, value, checked, onChange, displayType, isError, }: RadioItemProps<Value>) => JSX.Element;
14
+ export {};
@@ -0,0 +1,64 @@
1
+ import React from 'react';
2
+ import styled, { css } from 'styled-components';
3
+ import { useUniqueId } from '../utils/id';
4
+ import { theme } from '../theme';
5
+ import { RadioElement } from './RadioElement';
6
+ import { ITEM_GAP } from './constants';
7
+ import { Box } from '../Box';
8
+ export const RadioItem = ({ name, visual, label, value, checked, onChange, displayType, isError, }) => {
9
+ const id = useUniqueId();
10
+ return (React.createElement(Wrapper, { htmlFor: id, checked: checked, displayType: displayType },
11
+ visual && (React.createElement(VisualWrapper, null,
12
+ React.createElement(Visual, { visualUrl: visual }))),
13
+ React.createElement(Box, { flex: true, direction: "row", alignItems: "flex-start" },
14
+ React.createElement(RadioElement, { name: name, id: id, value: value, checked: checked, onChange: onChange, isError: isError, mr: "8px" }),
15
+ React.createElement(RadioText, { isError: isError }, label))));
16
+ };
17
+ const VisualWrapper = styled.div `
18
+ width: 100%;
19
+ max-width: 120px;
20
+ margin: 0 auto 8px;
21
+ `;
22
+ const Visual = styled.div `
23
+ width: 100%;
24
+ padding-top: 100%;
25
+ background-image: url('${(p) => p.visualUrl}');
26
+ background-size: contain;
27
+ background-repeat: no-repeat;
28
+ background-position: center;
29
+ `;
30
+ const Wrapper = styled.label `
31
+ display: flex;
32
+ flex-direction: column;
33
+
34
+ ${({ displayType, checked }) => css `
35
+ ${(displayType === 'horizontal-card' ||
36
+ displayType === 'vertical-card') &&
37
+ css `
38
+ border-radius: 8px;
39
+ background-color: ${theme.colors[checked ? 'white' : 'background']};
40
+ padding: ${checked ? '10px' : '12px'};
41
+ ${checked && `border: 2px solid ${theme.colors.secondary};`}
42
+ `}
43
+ ${displayType === 'horizontal-card' &&
44
+ css `
45
+ width: 100%;
46
+
47
+ @media (min-width: 420px) {
48
+ width: calc(50% - ${ITEM_GAP / 2}px);
49
+ }
50
+
51
+ @media (min-width: 768px) {
52
+ width: 240px;
53
+ }
54
+ `}
55
+ `}
56
+ `;
57
+ const RadioText = styled.span `
58
+ line-height: 16px;
59
+ font-size: 16px;
60
+ font-weight: ${theme.font.weight.medium};
61
+ color: ${({ isError }) => isError ? theme.colors.error : theme.colors.secondary};
62
+ margin-top: 4px;
63
+ `;
64
+ //# sourceMappingURL=RadioItem.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"RadioItem.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAE7C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAa5B,MAAM,CAAC,MAAM,SAAS,GAAG,CAA8B,EACrD,IAAI,EACJ,MAAM,EACN,KAAK,EACL,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAW,EACX,OAAO,GACe,EAAE,EAAE;IAC1B,MAAM,EAAE,GAAG,WAAW,EAAE,CAAA;IACxB,OAAO,CACL,oBAAC,OAAO,IAAC,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,WAAW;QAC7D,MAAM,IAAI,CACT,oBAAC,aAAa;YACZ,oBAAC,MAAM,IAAC,SAAS,EAAE,MAAM,GAAI,CACf,CACjB;QACD,oBAAC,GAAG,IAAC,IAAI,QAAC,SAAS,EAAC,KAAK,EAAC,UAAU,EAAC,YAAY;YAC/C,oBAAC,YAAY,IACX,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,EAAE,EAAC,KAAK,GACR;YACF,oBAAC,SAAS,IAAC,OAAO,EAAE,OAAO,IAAG,KAAK,CAAa,CAC5C,CACE,CACX,CAAA;AACH,CAAC,CAAA;AAED,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI/B,CAAA;AAED,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAuB;;;2BAGrB,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS;;;;CAI5C,CAAA;AAED,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,CAAiD;;;;IAIzE,CAAC,EAAE,WAAW,EAAE,OAAO,EAAE,EAAE,EAAE,CAC7B,GAAG,CAAA;QACC,CAAC,WAAW,KAAK,iBAAiB;IAClC,WAAW,KAAK,eAAe,CAAC;IAClC,GAAG,CAAA;;4BAEmB,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;mBACvD,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;UAClC,OAAO,IAAI,qBAAqB,KAAK,CAAC,MAAM,CAAC,SAAS,GAAG;OAC5D;QACC,WAAW,KAAK,iBAAiB;IACnC,GAAG,CAAA;;;;8BAIqB,QAAQ,GAAG,CAAC;;;;;;OAMnC;KACF;CACJ,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAsB;;;iBAGlC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM;WAC9B,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CACvB,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS;;CAExD,CAAA"}
@@ -0,0 +1 @@
1
+ export declare const ITEM_GAP = 12;
@@ -0,0 +1,2 @@
1
+ export const ITEM_GAP = 12;
2
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/RadioGroup/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG,EAAE,CAAA"}
@@ -0,0 +1 @@
1
+ export * from './RadioGroup';
@@ -0,0 +1,2 @@
1
+ export * from './RadioGroup';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/RadioGroup/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
@@ -0,0 +1,2 @@
1
+ export declare type DisplayType = 'normal' | 'vertical-card' | 'horizontal-card';
2
+ export declare type BaseValueType = string | boolean;
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/RadioGroup/types.ts"],"names":[],"mappings":""}
@@ -1,15 +1,17 @@
1
- import { FC } from 'react';
2
- import { CommonFieldTypes } from '../Field';
1
+ import { FC, FocusEvent } from 'react';
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 CommonFieldTypes {
7
+ export interface SearchInputProps extends CommonFieldProps {
8
8
  name?: string;
9
9
  placeholder?: string;
10
10
  searchList: SearchInputItem[];
11
11
  onFound: (element: string) => void;
12
12
  resultsRelativePosition?: boolean;
13
13
  showIcon?: boolean;
14
+ onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
15
+ outlined?: boolean;
14
16
  }
15
17
  export declare const SearchInput: FC<SearchInputProps>;
@@ -14,10 +14,10 @@ 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
- var { id: idProp, name = 'search_input', className = '', placeholder, searchList, onFound, resultsRelativePosition = false, outlined = false, showIcon = false, renderAsTitle = false } = _a, otherProps = __rest(_a, ["id", "name", "className", "placeholder", "searchList", "onFound", "resultsRelativePosition", "outlined", "showIcon", "renderAsTitle"]);
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"]);
21
21
  const id = useUniqueId(idProp);
22
22
  const [active, setActive] = useState(false);
23
23
  const [list, setList] = useState([]);
@@ -46,11 +46,11 @@ 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, value: selectedResult }, otherProps),
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" }),
53
- React.createElement(StyledInput, { id: id, type: "text", name: name, placeholder: placeholder, autoComplete: "off", value: selectedResult, onKeyUp: search, onChange: updateInputState, outlined: outlined, selected: selected })),
53
+ React.createElement(StyledInput, { id: id, type: "text", name: name, placeholder: placeholder, autoComplete: "off", value: selectedResult, onKeyUp: search, onChange: updateInputState, outlined: outlined, selected: selected, onBlur: onBlur })),
54
54
  React.createElement(StyledResultsContainer, { show: active, absolutePosition: !resultsRelativePosition, outlined: outlined },
55
55
  React.createElement(ResultsList, { outlined: outlined }, list.length ? (list.map((el, i) => (React.createElement("li", { key: i, onClick: () => select(el) }, el.label)))) : (React.createElement("li", null, "No results")))))));
56
56
  };
@@ -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":"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"}
1
+ {"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../src/SearchInput/SearchInput.tsx"],"names":[],"mappings":"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"}
@@ -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: any;
11
+ tag?: any;
12
12
  className?: string;
13
13
  typo?: Typo | (string & Record<never, never>);
14
14
  align?: string;
@@ -1,13 +1,14 @@
1
- import React, { FormEvent } from 'react';
2
- import { CommonFieldTypes } from '../Field';
3
- interface Props extends CommonFieldTypes {
1
+ import React, { FocusEvent, FormEvent } from 'react';
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;
7
7
  value: string;
8
- onBlur?: (e: FormEvent<HTMLInputElement>) => void;
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,21 +13,19 @@ 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, value: value }),
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);
27
27
  onInputChange && onInputChange(e);
28
- }, onBlur: (e) => {
29
- onBlur && onBlur(e);
30
- } }),
28
+ }, onBlur: onBlur }),
31
29
  trailingIcon && React.createElement(StyledIcon, { render: trailingIcon, color: "subtext" }))));
32
30
  });
33
31
  const StyledInput = styled.input `
@@ -49,6 +47,7 @@ const StyledInput = styled.input `
49
47
 
50
48
  ${({ outlined, error }) => outlined &&
51
49
  `
50
+ background-color: ${theme.colors.white};
52
51
  border: 2px solid ${error ? theme.colors.error : theme.colors.outline};
53
52
  border-radius: 8px;
54
53
  height: auto;
@@ -1 +1 @@
1
- {"version":3,"file":"TextInput.js","sourceRoot":"","sources":["../../src/TextInput/TextInput.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"TextInput.js","sourceRoot":"","sources":["../../src/TextInput/TextInput.tsx"],"names":[],"mappings":"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"}
@@ -1,5 +1,5 @@
1
- import React, { FormEvent } from 'react';
2
- import { CommonFieldTypes } from '../Field';
1
+ import React, { FocusEvent, FormEvent } from 'react';
2
+ import { CommonFieldProps } from '../fields/Field';
3
3
  import { MarginProps } from '../utils/space';
4
4
  declare type BaseProps = {
5
5
  id?: string;
@@ -11,9 +11,9 @@ declare type BaseProps = {
11
11
  resize?: 'none' | 'both';
12
12
  disabled?: boolean;
13
13
  maxLength?: number;
14
- onBlur?: (e: FormEvent<HTMLTextAreaElement>) => void;
14
+ onBlur?: (e: FocusEvent<HTMLTextAreaElement>) => void;
15
15
  rows?: number;
16
- } & CommonFieldTypes & MarginProps;
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, value: value, fullHeight: true }),
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,EAA2B,UAAU,EAAE,MAAM,OAAO,CAAA;AAClE,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,UAAU,CAAA;AA8BlD,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,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU;QACnE,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"}
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,3 @@
1
+ import { CommonFieldProps } from '../commonFieldTypes';
2
+ export { Field } from './Field';
3
+ export type { CommonFieldProps };
@@ -0,0 +1,2 @@
1
+ export { Field } from './Field';
2
+ //# sourceMappingURL=index.js.map
@@ -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,2 @@
1
+ export { Fieldset } from './Fieldset';
2
+ //# sourceMappingURL=index.js.map
@@ -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,2 @@
1
+ export {};
2
+ //# sourceMappingURL=commonFieldTypes.js.map
@@ -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,36 @@
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(Text, { tag: "label", typo: "label", color: "subtext", htmlFor: htmlFor, mb: { custom: outlined ? 4 : 0 } },
22
+ label,
23
+ required && (React.createElement(Text, { tag: "span", typo: "body-small", color: "error" }, "*")))))),
24
+ React.createElement(Box, null, children),
25
+ error && (React.createElement(Text, { tag: "span", typo: "caption", color: "error", mt: "8px" }, errorMsg))));
26
+ };
27
+ const Container = styled(Box) `
28
+ display: flex;
29
+ flex-direction: column;
30
+ position: relative;
31
+ width: 100%;
32
+
33
+ // In case, the element is a 'fieldset', we remove the border
34
+ border: 0;
35
+ `;
36
+ //# 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,IAAI,IACH,GAAG,EAAC,OAAO,EACX,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;YAE/B,KAAK;YACL,QAAQ,IAAI,CACX,oBAAC,IAAI,IAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,OAAO,QAEzC,CACR,CACI,CACR,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,2 @@
1
+ /// <reference types="react" />
2
+ export declare const Placeholder: () => JSX.Element;