@mrshmllw/smores-react 2.1.26 → 2.2.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.
Files changed (53) hide show
  1. package/dist/CheckBoxGroup/CheckBox.d.ts +9 -0
  2. package/dist/CheckBoxGroup/CheckBox.js +67 -0
  3. package/dist/CheckBoxGroup/CheckBox.js.map +1 -0
  4. package/dist/ConfirmationRadioButtons/Confirmation.js +6 -5
  5. package/dist/ConfirmationRadioButtons/Confirmation.js.map +1 -1
  6. package/dist/ConfirmationRadioButtons/Confirmation.stories.d.ts +1 -0
  7. package/dist/ConfirmationRadioButtons/Confirmation.stories.js +8 -0
  8. package/dist/ConfirmationRadioButtons/Confirmation.stories.js.map +1 -1
  9. package/dist/Dropdown/Dropdown.d.ts +7 -33
  10. package/dist/Dropdown/Dropdown.js +22 -48
  11. package/dist/Dropdown/Dropdown.js.map +1 -1
  12. package/dist/Dropdown/Dropdown.stories.d.ts +3 -39
  13. package/dist/Field/Field.d.ts +12 -0
  14. package/dist/Field/Field.js +68 -0
  15. package/dist/Field/Field.js.map +1 -0
  16. package/dist/Field/index.d.ts +1 -0
  17. package/dist/Field/index.js +2 -0
  18. package/dist/Field/index.js.map +1 -0
  19. package/dist/Field/types/commonFieldTypes.d.ts +10 -0
  20. package/dist/Field/types/commonFieldTypes.js +2 -0
  21. package/dist/Field/types/commonFieldTypes.js.map +1 -0
  22. package/dist/Fieldset/Fieldset.d.ts +8 -0
  23. package/dist/Fieldset/Fieldset.js +15 -0
  24. package/dist/Fieldset/Fieldset.js.map +1 -0
  25. package/dist/Fieldset/index.d.ts +1 -0
  26. package/dist/Fieldset/index.js +2 -0
  27. package/dist/Fieldset/index.js.map +1 -0
  28. package/dist/SearchInput/SearchInput.d.ts +3 -12
  29. package/dist/SearchInput/SearchInput.js +12 -21
  30. package/dist/SearchInput/SearchInput.js.map +1 -1
  31. package/dist/SupportMessage/SupportMessage.d.ts +2 -2
  32. package/dist/SupportMessage/SupportMessage.js.map +1 -1
  33. package/dist/SupportMessage/SupportMessage.stories.d.ts +1 -0
  34. package/dist/SupportMessage/SupportMessage.stories.js +9 -0
  35. package/dist/SupportMessage/SupportMessage.stories.js.map +1 -1
  36. package/dist/SupportMessage/SupportMessage.test.js +8 -0
  37. package/dist/SupportMessage/SupportMessage.test.js.map +1 -1
  38. package/dist/Tag/Tag.d.ts +11 -2
  39. package/dist/Tag/Tag.js +5 -3
  40. package/dist/Tag/Tag.js.map +1 -1
  41. package/dist/Tag/Tag.stories.d.ts +1 -0
  42. package/dist/Tag/Tag.stories.js +6 -0
  43. package/dist/Tag/Tag.stories.js.map +1 -1
  44. package/dist/TextInput/TextInput.d.ts +5 -23
  45. package/dist/TextInput/TextInput.js +19 -49
  46. package/dist/TextInput/TextInput.js.map +1 -1
  47. package/dist/Textarea/Textarea.d.ts +1 -15
  48. package/dist/Textarea/Textarea.js +20 -21
  49. package/dist/Textarea/Textarea.js.map +1 -1
  50. package/dist/index.d.ts +1 -0
  51. package/dist/index.js +1 -0
  52. package/dist/index.js.map +1 -1
  53. package/package.json +2 -2
@@ -0,0 +1,9 @@
1
+ import { FC, ReactNode } from 'react';
2
+ declare type Props = {
3
+ id: string;
4
+ checked: boolean;
5
+ children: ReactNode;
6
+ toggle: () => void;
7
+ };
8
+ export declare const CheckBox: FC<Props>;
9
+ export {};
@@ -0,0 +1,67 @@
1
+ import React from 'react';
2
+ import styled from 'styled-components';
3
+ import { Text } from '../Text';
4
+ import { theme } from '../theme';
5
+ export const CheckBox = ({ id, checked, children, toggle }) => (React.createElement(BoxContainer, { id: id },
6
+ React.createElement(Text, { tag: "span", typo: "base" }, children),
7
+ React.createElement("input", { type: "checkbox", checked: checked, onChange: toggle }),
8
+ React.createElement(Checkmark, null)));
9
+ const Checkmark = styled.span `
10
+ position: absolute;
11
+ left: 0;
12
+ width: 24px;
13
+ height: 24px;
14
+ border: solid 1px ${theme.colors.secondary};
15
+ box-sizing: border-box;
16
+ border-radius: 1px;
17
+
18
+ &:after {
19
+ content: '';
20
+ position: absolute;
21
+ display: none;
22
+ top: 3px;
23
+ left: 7px;
24
+ width: 5px;
25
+ height: 12px;
26
+ border: solid white;
27
+ border-width: 0 2px 2px 0;
28
+ -webkit-transform: rotate(45deg);
29
+ -ms-transform: rotate(45deg);
30
+ transform: rotate(45deg);
31
+ }
32
+ `;
33
+ const BoxContainer = styled.label `
34
+ position: relative;
35
+ display: flex;
36
+ align-items: center;
37
+ padding-left: 32px;
38
+ user-select: none;
39
+ cursor: pointer;
40
+
41
+ input {
42
+ position: absolute;
43
+ opacity: 0;
44
+ cursor: pointer;
45
+
46
+ &:checked ~ ${Checkmark} {
47
+ background-color: ${theme.colors.secondary};
48
+ border: solid 1px ${theme.colors.secondary};
49
+ }
50
+
51
+ &:checked ~ ${Checkmark}:after {
52
+ display: block;
53
+ }
54
+ }
55
+
56
+ &:hover {
57
+ ${Checkmark} {
58
+ background-color: ${theme.colors.background};
59
+ border: solid 1px ${theme.colors.secondary};
60
+ }
61
+ }
62
+
63
+ @media (min-width: 768px) {
64
+ padding-left: 32px;
65
+ }
66
+ `;
67
+ //# sourceMappingURL=CheckBox.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CheckBox.js","sourceRoot":"","sources":["../../src/CheckBoxGroup/CheckBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAShC,MAAM,CAAC,MAAM,QAAQ,GAAc,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CACxE,oBAAC,YAAY,IAAC,EAAE,EAAE,EAAE;IAClB,oBAAC,IAAI,IAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,IACzB,QAAQ,CACJ;IAEP,+BAAO,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAI;IAC7D,oBAAC,SAAS,OAAG,CACA,CAChB,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;sBAKP,KAAK,CAAC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;CAkB3C,CAAA;AAED,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;;;;;;;;;kBAaf,SAAS;0BACD,KAAK,CAAC,MAAM,CAAC,SAAS;0BACtB,KAAK,CAAC,MAAM,CAAC,SAAS;;;kBAG9B,SAAS;;;;;;MAMrB,SAAS;0BACW,KAAK,CAAC,MAAM,CAAC,UAAU;0BACvB,KAAK,CAAC,MAAM,CAAC,SAAS;;;;;;;CAO/C,CAAA"}
@@ -9,9 +9,9 @@ export const Confirmation = ({ checked, onChange, id: idProp, error = false, err
9
9
  const id = useUniqueId(idProp);
10
10
  return (React.createElement(ConfirmationWrapper, null,
11
11
  (label || sublabel) && (React.createElement(TextWrapper, null,
12
- React.createElement(LabelWrapper, null,
13
- label && React.createElement(SectionHeadingText, { tag: "h3" }, label),
14
- required && (React.createElement(Text, { tag: "p", typo: "base-small", color: "error" }, "*"))),
12
+ label && (React.createElement(SectionHeadingText, { tag: "h3" },
13
+ label,
14
+ required && React.createElement(Asterisk, null, "*"))),
15
15
  sublabel && (React.createElement(Text, { tag: "p", typo: "base-small", color: "subtext" }, sublabel)))),
16
16
  React.createElement(RadioButtonGroupWrapper, null,
17
17
  React.createElement(RadioButtonGroup, null,
@@ -70,7 +70,8 @@ const TextWrapper = styled.div `
70
70
  display: flex;
71
71
  flex-direction: column;
72
72
  `;
73
- const LabelWrapper = styled.div `
74
- display: flex;
73
+ const Asterisk = styled.span `
74
+ font-size: 14px;
75
+ color: ${theme.colors.error};
75
76
  `;
76
77
  //# sourceMappingURL=Confirmation.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Confirmation.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Confirmation.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.tsx"],"names":[],"mappings":"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"}
@@ -17,3 +17,4 @@ export declare const WorkingExample: any;
17
17
  export declare const WithCustomLabel: any;
18
18
  export declare const WithNoLabel: any;
19
19
  export declare const Required: any;
20
+ export declare const RequiredWithLongLabel: any;
@@ -57,4 +57,12 @@ Required.args = {
57
57
  checked: undefined,
58
58
  required: true,
59
59
  };
60
+ export const RequiredWithLongLabel = Template.bind({});
61
+ RequiredWithLongLabel.args = {
62
+ id: 'radioButton',
63
+ label: 'This is a really long label to test the placement of the required asterisk. Do you like ice cream, pie, marshmallows, smores, cupcakes, cookies, and muffins?',
64
+ onChange: noop,
65
+ checked: undefined,
66
+ required: true,
67
+ };
60
68
  //# sourceMappingURL=Confirmation.stories.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Confirmation.stories.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AACpC,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAA;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAEvC,eAAe;IACb,KAAK,EAAE,2BAA2B;IAClC,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAwB,EAAE,EAAE,CAAC,oBAAC,YAAY,oBAAK,KAAK,EAAI,CAAA;AAE1E,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,KAAK;IACd,KAAK,EAAE,2BAA2B;CACnC,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE1C,SAAS,CAAC,IAAI,GAAG;IACf,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,2BAA2B;IAClC,KAAK,EAAE,IAAI;IACX,QAAQ,EAAE,yBAAyB;CACpC,CAAA;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE7C,YAAY,CAAC,IAAI,GAAG;IAClB,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,2BAA2B;IAClC,QAAQ,EAAE,kEAAkE;CAC7E,CAAA;AAED,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,oBAAC,SAAS,OAAG,CAAA;AAE7C,MAAM,CAAC,MAAM,cAAc,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExD,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEhD,eAAe,CAAC,IAAI,GAAG;IACrB,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,2BAA2B;IAClC,QAAQ,EAAE,SAAS;CACpB,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE5C,WAAW,CAAC,IAAI,GAAG;IACjB,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,KAAK;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEzC,QAAQ,CAAC,IAAI,GAAG;IACd,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,wBAAwB;IAC/B,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,IAAI;CACf,CAAA"}
1
+ {"version":3,"file":"Confirmation.stories.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AACpC,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAA;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAEvC,eAAe;IACb,KAAK,EAAE,2BAA2B;IAClC,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAwB,EAAE,EAAE,CAAC,oBAAC,YAAY,oBAAK,KAAK,EAAI,CAAA;AAE1E,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,KAAK;IACd,KAAK,EAAE,2BAA2B;CACnC,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE1C,SAAS,CAAC,IAAI,GAAG;IACf,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,2BAA2B;IAClC,KAAK,EAAE,IAAI;IACX,QAAQ,EAAE,yBAAyB;CACpC,CAAA;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE7C,YAAY,CAAC,IAAI,GAAG;IAClB,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,2BAA2B;IAClC,QAAQ,EAAE,kEAAkE;CAC7E,CAAA;AAED,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,oBAAC,SAAS,OAAG,CAAA;AAE7C,MAAM,CAAC,MAAM,cAAc,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExD,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEhD,eAAe,CAAC,IAAI,GAAG;IACrB,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,2BAA2B;IAClC,QAAQ,EAAE,SAAS;CACpB,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE5C,WAAW,CAAC,IAAI,GAAG;IACjB,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,KAAK;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEzC,QAAQ,CAAC,IAAI,GAAG;IACd,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,wBAAwB;IAC/B,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,IAAI;CACf,CAAA;AAED,MAAM,CAAC,MAAM,qBAAqB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEtD,qBAAqB,CAAC,IAAI,GAAG;IAC3B,EAAE,EAAE,aAAa;IACjB,KAAK,EACH,+JAA+J;IACjK,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,IAAI;CACf,CAAA"}
@@ -1,61 +1,35 @@
1
1
  import React, { FormEvent, RefObject } from 'react';
2
+ import { CommonFieldTypes } from 'Field/types/commonFieldTypes';
2
3
  export declare type DropdownItem = {
3
4
  optionGroupLabel?: string;
4
5
  label: string;
5
6
  value: string;
6
7
  };
7
- declare type DefaultProps = {
8
- id?: string;
9
- className?: string;
10
- /** ref attribute for select input */
8
+ export interface Props extends CommonFieldTypes {
11
9
  ref?: RefObject<HTMLSelectElement>;
12
- /** Placeholder (initial state) */
13
10
  placeholder?: string;
14
- /** label displayed above the dropdown */
15
- label?: string;
16
- /** used for label - input connection */
17
11
  name?: string;
18
- /** input value */
19
12
  value?: string;
20
- /** Default value */
21
13
  defaultValue?: string;
22
- /** conditionally renders error message below dropdown */
23
- error?: boolean;
24
- /** error message to be displayed */
25
- errorMsg?: string;
26
- /** Disabled flag */
27
14
  disabled?: boolean;
28
- /** list of items for the dropdown list */
29
15
  list: DropdownItem[];
30
- /** onSelect handler */
31
16
  onSelect: (element: string) => void;
32
- /** Displays border */
33
- outlined?: boolean;
34
- /** onBlur listener */
35
17
  onBlur?: (e: FormEvent<HTMLSelectElement>) => void;
36
- /** required item */
37
- required?: boolean;
38
- /** set required asterisk */
39
18
  showRequiredAsterisk?: boolean;
40
- };
41
- /** on change or on input required */
19
+ }
42
20
  declare type TruncateProps = {
43
- /** on change is required and on input optional */
44
21
  onSelect: (e: string) => void;
45
22
  onInputChange?: (e: FormEvent<HTMLSelectElement>) => void;
46
23
  } | {
47
- /** on input is required and on change optional */
48
24
  onSelect?: (e: string) => void;
49
25
  onInputChange: (e: FormEvent<HTMLSelectElement>) => void;
50
26
  };
51
- export declare type DropdownProps = DefaultProps & TruncateProps;
52
- export declare const Dropdown: React.ForwardRefExoticComponent<(Pick<DefaultProps & {
53
- /** on change is required and on input optional */
27
+ export declare type DropdownProps = Props & TruncateProps;
28
+ export declare const Dropdown: React.ForwardRefExoticComponent<(Pick<Props & {
54
29
  onSelect: (e: string) => void;
55
30
  onInputChange?: ((e: FormEvent<HTMLSelectElement>) => void) | undefined;
56
- }, "required" | "error" | "id" | "name" | "value" | "label" | "className" | "disabled" | "list" | "defaultValue" | "placeholder" | "onBlur" | "onSelect" | "outlined" | "errorMsg" | "onInputChange" | "showRequiredAsterisk"> | Pick<DefaultProps & {
57
- /** on input is required and on change optional */
31
+ }, "required" | "error" | "id" | "name" | "value" | "label" | "className" | "disabled" | "list" | "defaultValue" | "placeholder" | "onBlur" | "onSelect" | "outlined" | "errorMsg" | "renderAsTitle" | "showRequiredAsterisk" | "onInputChange"> | Pick<Props & {
58
32
  onSelect?: ((e: string) => void) | undefined;
59
33
  onInputChange: (e: FormEvent<HTMLSelectElement>) => void;
60
- }, "required" | "error" | "id" | "name" | "value" | "label" | "className" | "disabled" | "list" | "defaultValue" | "placeholder" | "onBlur" | "onSelect" | "outlined" | "errorMsg" | "onInputChange" | "showRequiredAsterisk">) & React.RefAttributes<HTMLSelectElement>>;
34
+ }, "required" | "error" | "id" | "name" | "value" | "label" | "className" | "disabled" | "list" | "defaultValue" | "placeholder" | "onBlur" | "onSelect" | "outlined" | "errorMsg" | "renderAsTitle" | "showRequiredAsterisk" | "onInputChange">) & React.RefAttributes<HTMLSelectElement>>;
61
35
  export {};
@@ -1,12 +1,22 @@
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
+ };
1
12
  import React, { useEffect, useState, forwardRef, } from 'react';
2
- import styled from 'styled-components';
3
13
  import { darken } from 'polished';
4
- import { Text } from '../Text';
5
- import { Icon } from '../Icon';
6
- import { Box } from '../Box';
14
+ import styled from 'styled-components';
7
15
  import { theme } from '../theme';
16
+ import { Field } from '../Field';
8
17
  import { useUniqueId } from '../utils/id';
9
- export const Dropdown = forwardRef(function Dropdown({ id: idProp, className = '', label, placeholder, name, value, defaultValue, disabled = false, list, onSelect, outlined = false, error = false, errorMsg = '', onInputChange, onBlur, required = true, showRequiredAsterisk = false, }, ref) {
18
+ export const Dropdown = forwardRef(function Dropdown(_a, ref) {
19
+ var { id: idProp, placeholder, name, value, defaultValue, disabled = false, list, onSelect, outlined = false, error = false, onInputChange, onBlur, required = true } = _a, fieldProps = __rest(_a, ["id", "placeholder", "name", "value", "defaultValue", "disabled", "list", "onSelect", "outlined", "error", "onInputChange", "onBlur", "required"]);
10
20
  const id = useUniqueId(idProp);
11
21
  const [key, setKey] = useState('');
12
22
  const [hasOptGroups, setHasOptGroups] = useState(false);
@@ -28,12 +38,9 @@ export const Dropdown = forwardRef(function Dropdown({ id: idProp, className = '
28
38
  });
29
39
  setDropdownItemsGroups(Array.from(itemsPerGroupLabel.values()));
30
40
  }, [list]);
31
- return (React.createElement(Container, { className: className },
32
- label && (React.createElement(Box, { mb: outlined ? '4px' : '0px' },
33
- React.createElement(Text, { tag: "label", color: "subtext", typo: "label", htmlFor: id }, label),
34
- showRequiredAsterisk && (React.createElement(Text, { tag: "label", color: "error", typo: "label" }, "*")))),
35
- React.createElement(Content, { outlined: outlined, key: key },
36
- React.createElement(Select, { id: id, defaultValue: list.length === 1
41
+ return (React.createElement(Field, Object.assign({}, fieldProps, { showCaret: true, dropdownKey: key, id: id, error: error, outlined: outlined, value: value }),
42
+ React.createElement(React.Fragment, null,
43
+ React.createElement(StyledSelect, { id: id, defaultValue: list.length === 1
37
44
  ? String(list[0].value)
38
45
  : defaultValue
39
46
  ? defaultValue
@@ -48,23 +55,8 @@ export const Dropdown = forwardRef(function Dropdown({ id: idProp, className = '
48
55
  dropdownItemsGroups.map((groupItems, i) => {
49
56
  var _a;
50
57
  return hasOptGroups ? (React.createElement("optgroup", { key: i, label: (_a = groupItems[0].optionGroupLabel) !== null && _a !== void 0 ? _a : 'Other' }, groupItems.map((el, j) => (React.createElement("option", { key: `${i}-${j}`, value: el.value }, el.label))))) : (groupItems.map((el, j) => (React.createElement("option", { key: j, value: el.value }, el.label))));
51
- })),
52
- React.createElement(Caret, { outlined: outlined },
53
- React.createElement(Icon, { render: "caret", color: "subtext", size: 24 }))),
54
- error && React.createElement(ErrorBox, null, errorMsg)));
58
+ })))));
55
59
  });
56
- const Container = styled.div `
57
- display: flex;
58
- flex-direction: column;
59
- height: 44px;
60
- width: 100%;
61
- margin: 0;
62
- padding: 0;
63
- `;
64
- const Content = styled.div `
65
- width: 100%;
66
- position: relative;
67
- `;
68
60
  const getErrorOutline = (outlined, error) => {
69
61
  if (error && outlined) {
70
62
  return `border: 2px solid ${theme.colors.error}`;
@@ -76,7 +68,7 @@ const getErrorOutline = (outlined, error) => {
76
68
  return;
77
69
  }
78
70
  };
79
- const Select = styled.select `
71
+ const StyledSelect = styled.select `
80
72
  width: 100%;
81
73
  height: 32px;
82
74
  padding-right: 24px;
@@ -87,16 +79,13 @@ const Select = styled.select `
87
79
  font-size: 16px;
88
80
  cursor: pointer;
89
81
  appearance: none; /* remove default arrow */
90
-
91
82
  &:disabled {
92
83
  cursor: not-allowed;
93
84
  opacity: 0.5;
94
85
  }
95
-
96
86
  &:not(:focus):invalid {
97
87
  color: ${theme.colors.outline};
98
88
  }
99
-
100
89
  &:hover,
101
90
  &:focus,
102
91
  &:focus-visible,
@@ -104,7 +93,6 @@ const Select = styled.select `
104
93
  outline: none;
105
94
  border-color: ${darken(0.1, theme.colors.outline)};
106
95
  }
107
-
108
96
  ${({ outlined }) => outlined &&
109
97
  `
110
98
  border: 2px solid ${theme.colors.outline};
@@ -117,26 +105,12 @@ const Select = styled.select `
117
105
  border: 2px solid ${theme.colors.outline};
118
106
  }
119
107
  `}
120
-
121
108
  ${({ value }) => value &&
122
109
  value != '' &&
123
110
  `
124
111
  border: 2px solid ${theme.colors.outline};
125
- `}
112
+ `}}
126
113
 
127
- ${({ error, outlined }) => getErrorOutline(outlined, error)};
128
- `;
129
- const Caret = styled.div `
130
- position: absolute;
131
- top: 50%;
132
- z-index: 1;
133
- right: ${({ outlined }) => (outlined ? '15px' : '0')};
134
- pointer-events: none;
135
- transform: translateY(-50%);
136
- `;
137
- const ErrorBox = styled.span `
138
- margin-top: 7px;
139
- font-size: 12px;
140
- color: ${theme.colors.error};
114
+ ${({ error, outlined }) => getErrorOutline(outlined, error)};
141
115
  `;
142
116
  //# sourceMappingURL=Dropdown.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.js","sourceRoot":"","sources":["../../src/Dropdown/Dropdown.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Dropdown.js","sourceRoot":"","sources":["../../src/Dropdown/Dropdown.tsx"],"names":[],"mappings":"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"}
@@ -1,49 +1,13 @@
1
1
  import React from 'react';
2
2
  declare const _default: {
3
3
  title: string;
4
- component: React.ForwardRefExoticComponent<(Pick<{
5
- id?: string | undefined;
6
- className?: string | undefined;
7
- ref?: React.RefObject<HTMLSelectElement> | undefined;
8
- placeholder?: string | undefined;
9
- label?: string | undefined;
10
- name?: string | undefined;
11
- value?: string | undefined;
12
- defaultValue?: string | undefined;
13
- error?: boolean | undefined;
14
- errorMsg?: string | undefined;
15
- disabled?: boolean | undefined;
16
- list: import("./Dropdown").DropdownItem[];
17
- onSelect: (element: string) => void;
18
- outlined?: boolean | undefined;
19
- onBlur?: ((e: React.FormEvent<HTMLSelectElement>) => void) | undefined;
20
- required?: boolean | undefined;
21
- showRequiredAsterisk?: boolean | undefined;
22
- } & {
4
+ component: React.ForwardRefExoticComponent<(Pick<import("./Dropdown").Props & {
23
5
  onSelect: (e: string) => void;
24
6
  onInputChange?: ((e: React.FormEvent<HTMLSelectElement>) => void) | undefined;
25
- }, "required" | "error" | "id" | "name" | "value" | "label" | "className" | "disabled" | "list" | "defaultValue" | "placeholder" | "onBlur" | "onSelect" | "outlined" | "errorMsg" | "onInputChange" | "showRequiredAsterisk"> | Pick<{
26
- id?: string | undefined;
27
- className?: string | undefined;
28
- ref?: React.RefObject<HTMLSelectElement> | undefined;
29
- placeholder?: string | undefined;
30
- label?: string | undefined;
31
- name?: string | undefined;
32
- value?: string | undefined;
33
- defaultValue?: string | undefined;
34
- error?: boolean | undefined;
35
- errorMsg?: string | undefined;
36
- disabled?: boolean | undefined;
37
- list: import("./Dropdown").DropdownItem[];
38
- onSelect: (element: string) => void;
39
- outlined?: boolean | undefined;
40
- onBlur?: ((e: React.FormEvent<HTMLSelectElement>) => void) | undefined;
41
- required?: boolean | undefined;
42
- showRequiredAsterisk?: boolean | undefined;
43
- } & {
7
+ }, "required" | "error" | "id" | "name" | "value" | "label" | "className" | "disabled" | "list" | "defaultValue" | "placeholder" | "onBlur" | "onSelect" | "outlined" | "errorMsg" | "renderAsTitle" | "showRequiredAsterisk" | "onInputChange"> | Pick<import("./Dropdown").Props & {
44
8
  onSelect?: ((e: string) => void) | undefined;
45
9
  onInputChange: (e: React.FormEvent<HTMLSelectElement>) => void;
46
- }, "required" | "error" | "id" | "name" | "value" | "label" | "className" | "disabled" | "list" | "defaultValue" | "placeholder" | "onBlur" | "onSelect" | "outlined" | "errorMsg" | "onInputChange" | "showRequiredAsterisk">) & React.RefAttributes<HTMLSelectElement>>;
10
+ }, "required" | "error" | "id" | "name" | "value" | "label" | "className" | "disabled" | "list" | "defaultValue" | "placeholder" | "onBlur" | "onSelect" | "outlined" | "errorMsg" | "renderAsTitle" | "showRequiredAsterisk" | "onInputChange">) & React.RefAttributes<HTMLSelectElement>>;
47
11
  argTypes: {
48
12
  onSelect: {
49
13
  action: string;
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import { CommonFieldTypes } from './types/commonFieldTypes';
3
+ interface FieldProps extends CommonFieldTypes {
4
+ children: React.ReactElement;
5
+ showCaret?: boolean;
6
+ value: string;
7
+ trailingIcon?: string;
8
+ dropdownKey?: string;
9
+ fullHeight?: boolean;
10
+ }
11
+ export declare const Field: ({ children, renderAsTitle, className, error, id, label, outlined, value, trailingIcon, errorMsg, dropdownKey, required, showCaret, fullHeight, }: FieldProps) => JSX.Element;
12
+ export {};
@@ -0,0 +1,68 @@
1
+ import React from 'react';
2
+ import styled from 'styled-components';
3
+ import { darken } from 'polished';
4
+ import { Icon } from '../Icon';
5
+ import { Text } from '../Text';
6
+ import { Box } from '../Box';
7
+ import { theme } from '../theme';
8
+ export const Field = ({ children, renderAsTitle, className = '', error, id, label, outlined = false, value, trailingIcon, errorMsg, dropdownKey, required, showCaret, fullHeight = false, }) => {
9
+ return (React.createElement(Container, { className: className },
10
+ label && (React.createElement(Box, { mb: outlined ? '4px' : '0px' },
11
+ renderAsTitle ? (React.createElement(Title, null, label)) : (React.createElement(Text, { tag: "label", color: "subtext", typo: "label", htmlFor: id }, label)),
12
+ required && (React.createElement(Text, { tag: "label", color: "error", typo: "base" },
13
+ ' ',
14
+ "*")))),
15
+ React.createElement(Content, { fullHeight: fullHeight, value: value, outlined: outlined, error: error, key: dropdownKey !== null && dropdownKey !== void 0 ? dropdownKey : null },
16
+ children,
17
+ showCaret && (React.createElement(Caret, { outlined: outlined },
18
+ React.createElement(Icon, { render: "caret", color: "subtext", size: 24 })))),
19
+ trailingIcon && React.createElement(Icon, { render: trailingIcon, color: "subtext" }),
20
+ error && React.createElement(ErrorBox, null, errorMsg)));
21
+ };
22
+ const Container = styled(Box) `
23
+ display: flex;
24
+ flex-direction: column;
25
+ position: relative;
26
+ `;
27
+ const Content = styled.div `
28
+ position: relative;
29
+ border-color: ${({ error }) => theme.colors[`${error ? 'error' : 'outline'}`]};
30
+ background-color: ${({ outlined }) => !outlined ? 'transparent' : theme.colors['white']};
31
+ display: flex;
32
+ height: ${({ fullHeight }) => (fullHeight ? `100%` : `32px`)};
33
+
34
+ &:hover,
35
+ &:focus-within {
36
+ border-color: ${({ error }) => error ? theme.colors.error : darken(0.1, theme.colors.outline)};
37
+ }
38
+
39
+ ${({ outlined }) => outlined &&
40
+ `
41
+ border-radius: 8px;
42
+ height: auto;
43
+ `}
44
+
45
+ ${({ value }) => value &&
46
+ value != '' &&
47
+ `
48
+ border-color: ${theme.colors.outline};
49
+ `}
50
+ `;
51
+ const ErrorBox = styled.span `
52
+ margin-top: 7px;
53
+ color: ${theme.colors.error};
54
+ font-size: 12px;
55
+ `;
56
+ const Title = styled.h3 `
57
+ font-weight: bold;
58
+ padding-bottom: 8px;
59
+ `;
60
+ const Caret = styled.div `
61
+ position: absolute;
62
+ top: 50%;
63
+ z-index: 1;
64
+ right: ${({ outlined }) => (outlined ? '15px' : '0')};
65
+ pointer-events: none;
66
+ transform: translateY(-50%);
67
+ `;
68
+ //# sourceMappingURL=Field.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Field.js","sourceRoot":"","sources":["../../src/Field/Field.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1 @@
1
+ export { Field } from './Field';
@@ -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/Field/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA"}
@@ -0,0 +1,10 @@
1
+ export interface CommonFieldTypes {
2
+ label?: string;
3
+ id?: string;
4
+ error?: boolean;
5
+ errorMsg?: string;
6
+ required?: boolean;
7
+ renderAsTitle?: boolean;
8
+ className?: string;
9
+ outlined?: boolean;
10
+ }
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=commonFieldTypes.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"commonFieldTypes.js","sourceRoot":"","sources":["../../../src/Field/types/commonFieldTypes.ts"],"names":[],"mappings":""}
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ declare type FieldSetProps = {
3
+ children: React.ReactChildren;
4
+ label: string;
5
+ outlined?: boolean;
6
+ };
7
+ export declare const Fieldset: ({ children, label, outlined, }: FieldSetProps) => JSX.Element;
8
+ export {};
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ import styled from 'styled-components';
3
+ import { Box } from '../Box';
4
+ export const Fieldset = ({ children, label, outlined = false, }) => {
5
+ return (React.createElement("fieldset", null,
6
+ React.createElement(Box, { mb: outlined ? '4px' : '0px' },
7
+ React.createElement(Legend, null, label)),
8
+ children));
9
+ };
10
+ const Legend = styled.legend `
11
+ font-size: 16px;
12
+ font-weight: bold;
13
+ padding-bottom: 8px;
14
+ `;
15
+ //# sourceMappingURL=Fieldset.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Fieldset.js","sourceRoot":"","sources":["../../src/Fieldset/Fieldset.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAQ5B,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EACvB,QAAQ,EACR,KAAK,EACL,QAAQ,GAAG,KAAK,GACF,EAAE,EAAE;IAClB,OAAO,CACL;QACE,oBAAC,GAAG,IAAC,EAAE,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;YAC/B,oBAAC,MAAM,QAAE,KAAK,CAAU,CACpB;QAEL,QAAQ,CACA,CACZ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAA;;;;CAI3B,CAAA"}
@@ -0,0 +1 @@
1
+ export { Fieldset } 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/Fieldset/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA"}
@@ -1,25 +1,16 @@
1
1
  import { FC } from 'react';
2
+ import { CommonFieldTypes } from 'Field/types/commonFieldTypes';
2
3
  export declare type SearchInputItem = {
3
4
  label: string;
4
5
  value: string;
5
6
  };
6
- export declare type SearchInputProps = {
7
- id?: string;
8
- /** Name of the form control */
7
+ export interface SearchInputProps extends CommonFieldTypes {
9
8
  name?: string;
10
- /** label displayed above the input */
11
9
  label?: string;
12
- /** Placeholder (initial state) */
13
10
  placeholder?: string;
14
- /** list of items for the search list */
15
11
  searchList: SearchInputItem[];
16
- /** onFound listener */
17
12
  onFound: (element: string) => void;
18
- /** Displays search results in a relative position to other elements */
19
13
  resultsRelativePosition?: boolean;
20
- /** Displays border */
21
- outlined?: boolean;
22
- /** Displays search icon */
23
14
  showIcon?: boolean;
24
- };
15
+ }
25
16
  export declare const SearchInput: FC<SearchInputProps>;