@decisiv/ui-components 2.0.1-alpha.73 → 2.0.1-alpha.82

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 (55) hide show
  1. package/lib/atoms/InputField/Containers.d.ts +6 -2
  2. package/lib/atoms/InputField/Containers.d.ts.map +1 -1
  3. package/lib/atoms/InputField/Containers.js +5 -5
  4. package/lib/atoms/InputField/InputLabel.d.ts +1 -0
  5. package/lib/atoms/InputField/InputLabel.d.ts.map +1 -1
  6. package/lib/atoms/InputField/InputLabel.js +2 -1
  7. package/lib/atoms/InputField/index.d.ts +2 -0
  8. package/lib/atoms/InputField/index.d.ts.map +1 -1
  9. package/lib/atoms/InputField/index.js +14 -4
  10. package/lib/atoms/InputField/schema.d.ts.map +1 -1
  11. package/lib/atoms/InputField/schema.js +1 -0
  12. package/lib/components/Combobox/Target.d.ts.map +1 -1
  13. package/lib/components/Combobox/Target.js +3 -4
  14. package/lib/components/Combobox/index.test.js +122 -98
  15. package/lib/components/Filter/IconWrapper/index.d.ts +197 -0
  16. package/lib/components/Filter/IconWrapper/index.d.ts.map +1 -0
  17. package/lib/components/Filter/IconWrapper/index.js +35 -0
  18. package/lib/components/Filter/SimplePrimary/index.d.ts +31 -0
  19. package/lib/components/Filter/SimplePrimary/index.d.ts.map +1 -0
  20. package/lib/components/Filter/SimplePrimary/index.js +58 -0
  21. package/lib/components/Filter/SimplePrimary/index.test.js +34 -0
  22. package/lib/components/Filter/StyledFilter.d.ts +4 -0
  23. package/lib/components/Filter/StyledFilter.d.ts.map +1 -0
  24. package/lib/components/Filter/StyledFilter.js +39 -0
  25. package/lib/components/Filter/StyledLabel/index.d.ts +8 -0
  26. package/lib/components/Filter/StyledLabel/index.d.ts.map +1 -0
  27. package/lib/components/Filter/StyledLabel/index.js +30 -0
  28. package/lib/components/Filter/index.d.ts +27 -0
  29. package/lib/components/Filter/index.d.ts.map +1 -0
  30. package/lib/components/Filter/index.js +95 -0
  31. package/lib/components/Filter/index.test.js +41 -0
  32. package/lib/components/Filter/kind.d.ts +6 -0
  33. package/lib/components/Filter/kind.d.ts.map +1 -0
  34. package/lib/components/Filter/kind.js +45 -0
  35. package/lib/components/Filter/schema.d.ts +9 -0
  36. package/lib/components/Filter/schema.d.ts.map +1 -0
  37. package/lib/components/Filter/schema.js +32 -0
  38. package/lib/components/Filter/types.d.ts +17 -0
  39. package/lib/components/Filter/types.d.ts.map +1 -0
  40. package/lib/components/Filter/types.js +1 -0
  41. package/lib/components/Select/Target.js +1 -1
  42. package/lib/components/Select/index.test.js +31 -9
  43. package/lib/components/SelectDate/Target.js +1 -1
  44. package/lib/components/SelectDate/index.test.js +71 -51
  45. package/lib/components/SelectDateRange/index.test.js +78 -58
  46. package/lib/components/TextArea/index.js +1 -0
  47. package/lib/components/TextArea/index.test.js +5 -0
  48. package/lib/components/TextField/Input.js +1 -1
  49. package/lib/components/TextField/index.test.js +5 -0
  50. package/lib/components/index.d.ts +1 -0
  51. package/lib/components/index.d.ts.map +1 -1
  52. package/lib/components/index.js +9 -0
  53. package/lib/providers/ConfigProvider/index.d.ts.map +1 -1
  54. package/lib/providers/ConfigProvider/index.js +5 -1
  55. package/package.json +2 -2
@@ -205,6 +205,8 @@ interface InputContainerProps extends FlexComponentProps {
205
205
  hasWarning?: boolean;
206
206
  isFocused?: boolean;
207
207
  readOnly?: boolean;
208
+ hiddenLabel: boolean;
209
+ isTextArea: boolean;
208
210
  }
209
211
  export declare const InputContainer: import("styled-components").StyledComponent<"div", any, Partial<{
210
212
  readonly alignContent?: string | import("../../utils/dynamicModifiers").DynamicResponsiveModifiersProp<string, {
@@ -594,6 +596,8 @@ export declare const IconContainer: import("styled-components").StyledComponent<
594
596
  }> & {
595
597
  alignItems: string;
596
598
  justifyContent: string;
599
+ } & {
600
+ hiddenLabel: boolean;
597
601
  }, "alignItems" | "justifyContent">;
598
602
  export declare const InputInnerContainer: import("styled-components").StyledComponent<"div", any, Partial<{
599
603
  readonly alignContent?: string | import("../../utils/dynamicModifiers").DynamicResponsiveModifiersProp<string, {
@@ -790,9 +794,9 @@ export declare const InputInnerContainer: import("styled-components").StyledComp
790
794
  }> & {
791
795
  flex: number;
792
796
  flexWrap: string;
793
- paddingLeft: number;
794
797
  } & {
795
798
  hasIcon?: boolean | undefined;
796
- }, "flexWrap" | "paddingLeft" | "flex">;
799
+ hiddenLabel: boolean;
800
+ }, "flexWrap" | "flex">;
797
801
  export {};
798
802
  //# sourceMappingURL=Containers.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Containers.d.ts","sourceRoot":"","sources":["../../../src/atoms/InputField/Containers.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAUtC,OAAa,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEjE,UAAU,wBAAyB,SAAQ,kBAAkB;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yCAa/B,CAAC;AAEF,UAAU,mBAAoB,SAAQ,kBAAkB;IACtD,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA6BD,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCA0C1B,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mCAOzB,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uCAa/B,CAAC"}
1
+ {"version":3,"file":"Containers.d.ts","sourceRoot":"","sources":["../../../src/atoms/InputField/Containers.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAUtC,OAAa,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEjE,UAAU,wBAAyB,SAAQ,kBAAkB;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yCAa/B,CAAC;AAEF,UAAU,mBAAoB,SAAQ,kBAAkB;IACtD,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;CACrB;AAiCD,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCAkD1B,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mCAazB,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBA4B/B,CAAC"}
@@ -32,6 +32,7 @@ var InputFieldContainer = (0, _styledComponents.default)(_Flex.default).attrs({
32
32
  componentId: "me30fz-0"
33
33
  })(["flex:1;max-width:100%;", ";"], (0, _styleModifiers.when)('overflow', 'auto', (0, _styledComponents.css)(["overflow:auto;"])));
34
34
  exports.InputFieldContainer = InputFieldContainer;
35
+ var hiddenLabelStyles = (0, _styledComponents.css)(["min-height:32px;"]);
35
36
  var inactiveStyles = (0, _styledComponents.css)(["background:", ";border-color:", ";cursor:not-allowed;position:relative;&:active,&:hover{background:", ";border-color:", ";", ";}*{cursor:not-allowed;}"], (0, _toColorString.default)(_color.default.opacity.fullMoon50), (0, _toColorString.default)(_color.default.base.quarterMoon), (0, _toColorString.default)(_color.default.opacity.fullMoon50), (0, _toColorString.default)(_color.default.base.quarterMoon), (0, _focusRingWithColor.default)({
36
37
  red: 0,
37
38
  green: 0,
@@ -42,7 +43,7 @@ var onFocusStyles = (0, _styledComponents.css)(["border-color:", ";", ";&:hover{
42
43
  var InputContainer = (0, _styledComponents.default)(_Flex.default).withConfig({
43
44
  displayName: "Containers__InputContainer",
44
45
  componentId: "me30fz-1"
45
- })(["background:", ";border:1px solid ", ";box-sizing:border-box;min-height:50px;position:relative;width:100%;", ";& ~ *{cursor:default;margin-top:", "px;width:100%;}&:hover{border-color:", ";}&:active{border-color:", ";", ";}", ";", ";", ";", ";"], (0, _toColorString.default)(_color.default.base.snowWhite), (0, _toColorString.default)(_color.default.base.quarterMoon), (0, _dynamicModifiers.applyDynamicModifiers)('cursor'), _spacing.default.base * 0.5, (0, _toColorString.default)(_color.default.interaction.indianOcean), (0, _toColorString.default)(_color.default.interaction.pacificOcean), (0, _focusRingWithColor.default)(_color.default.interaction.pacificOcean40), (0, _styleModifiers.when)('isFocused', onFocusStyles), (0, _styleModifiers.when)('hasWarning', (0, _styledComponents.css)(["border-color:", ";&:active,&:hover{border-color:", ";}"], (0, _toColorString.default)(_color.default.status.warning.medium), (0, _toColorString.default)(_color.default.status.warning.medium))), (0, _styleModifiers.when)('disabled', inactiveStyles), (0, _styleModifiers.when)('readOnly', inactiveStyles));
46
+ })(["background:", ";border:1px solid ", ";box-sizing:border-box;min-height:50px;position:relative;width:100%;", ";& ~ *{cursor:default;margin-top:", "px;width:100%;}&:hover{border-color:", ";}&:active{border-color:", ";", ";}", ";", ";", ";", ";", ";", ""], (0, _toColorString.default)(_color.default.base.snowWhite), (0, _toColorString.default)(_color.default.base.quarterMoon), (0, _dynamicModifiers.applyDynamicModifiers)('cursor'), _spacing.default.base * 0.5, (0, _toColorString.default)(_color.default.interaction.indianOcean), (0, _toColorString.default)(_color.default.interaction.pacificOcean), (0, _focusRingWithColor.default)(_color.default.interaction.pacificOcean40), (0, _styleModifiers.when)('isFocused', onFocusStyles), (0, _styleModifiers.when)('hasWarning', (0, _styledComponents.css)(["border-color:", ";&:active,&:hover{border-color:", ";}"], (0, _toColorString.default)(_color.default.status.warning.medium), (0, _toColorString.default)(_color.default.status.warning.medium))), (0, _styleModifiers.when)('disabled', inactiveStyles), (0, _styleModifiers.when)('readOnly', inactiveStyles), (0, _styleModifiers.when)('hiddenLabel', hiddenLabelStyles), (0, _styleModifiers.whenNot)('isTextArea', (0, _styledComponents.css)(["height:32px;"])));
46
47
  exports.InputContainer = InputContainer;
47
48
  var IconContainer = (0, _styledComponents.default)(_Flex.default).attrs({
48
49
  alignItems: 'flex-start',
@@ -50,14 +51,13 @@ var IconContainer = (0, _styledComponents.default)(_Flex.default).attrs({
50
51
  }).withConfig({
51
52
  displayName: "Containers__IconContainer",
52
53
  componentId: "me30fz-2"
53
- })(["color:", ";margin:16px 0 6px 10px;width:30px;"], (0, _toColorString.default)(_color.default.base.alaskanHusky));
54
+ })(["color:", ";margin:16px 0 6px 15px;", ""], (0, _toColorString.default)(_color.default.base.alaskanHusky), (0, _styleModifiers.when)('hiddenLabel', (0, _styledComponents.css)(["margin:8px 0 8px 10px;"])));
54
55
  exports.IconContainer = IconContainer;
55
56
  var InputInnerContainer = (0, _styledComponents.default)(_Flex.default).attrs({
56
57
  flex: 1,
57
- flexWrap: 'wrap',
58
- paddingLeft: 1
58
+ flexWrap: 'wrap'
59
59
  }).withConfig({
60
60
  displayName: "Containers__InputInnerContainer",
61
61
  componentId: "me30fz-3"
62
- })(["max-width:100%;", ";"], (0, _styleModifiers.when)('hasIcon', (0, _styledComponents.css)(["max-width:calc(100% - 40px);"])));
62
+ })(["max-width:100%;padding-top:6px;padding-left:15px;", ";", ";", ";"], (0, _styleModifiers.when)('hasIcon', (0, _styledComponents.css)(["max-width:calc(100% - 10px);"])), (0, _styleModifiers.whenNot)('hasIcon', (0, _styledComponents.css)(["padding-left:10px;"])), (0, _styleModifiers.whenAll)([['hasIcon', true], ['hiddenLabel', true]], (0, _styledComponents.css)(["padding-left:10px;"])));
63
63
  exports.InputInnerContainer = InputInnerContainer;
@@ -4,6 +4,7 @@ interface InputLabelProps extends PProps, React.LabelHTMLAttributes<HTMLLabelEle
4
4
  color?: PProps['color'];
5
5
  disabled?: boolean;
6
6
  readOnly?: boolean;
7
+ hidden?: boolean;
7
8
  }
8
9
  declare const InputLabel: import("styled-components").StyledComponent<"p", any, PProps & {
9
10
  as: string;
@@ -1 +1 @@
1
- {"version":3,"file":"InputLabel.d.ts","sourceRoot":"","sources":["../../../src/atoms/InputField/InputLabel.ts"],"names":[],"mappings":";AAIA,OAAO,EAAK,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAExD,UAAU,eACR,SAAQ,MAAM,EACZ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAUD,QAAA,MAAM,UAAU;;;;6CAmBf,CAAC;AAEF,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"InputLabel.d.ts","sourceRoot":"","sources":["../../../src/atoms/InputField/InputLabel.ts"],"names":[],"mappings":";AAIA,OAAO,EAAK,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAExD,UAAU,eACR,SAAQ,MAAM,EACZ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAqBD,QAAA,MAAM,UAAU;;;;6CAoBf,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -14,6 +14,7 @@ var _Typography = require("../../components/Typography");
14
14
  function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
15
15
 
16
16
  var inactiveStyles = (0, _styledComponents.css)(["cursor:not-allowed;*{cursor:not-allowed;}"]);
17
+ var visuallyHiddenStyles = (0, _styledComponents.css)(["border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;"]);
17
18
  var InputLabel = (0, _styledComponents.default)(_Typography.P).attrs({
18
19
  as: 'label',
19
20
  color: 'alaskanHusky',
@@ -21,6 +22,6 @@ var InputLabel = (0, _styledComponents.default)(_Typography.P).attrs({
21
22
  }).withConfig({
22
23
  displayName: "InputLabel",
23
24
  componentId: "ldhs58-0"
24
- })(["display:block;padding-top:6px;padding-right:10px;text-align:left;width:100%;cursor:inherit;*{cursor:inherit;}", ";", ";"], (0, _styleModifiers.when)('disabled', inactiveStyles), (0, _styleModifiers.when)('readOnly', inactiveStyles));
25
+ })(["display:block;padding-right:10px;text-align:left;width:100%;cursor:inherit;*{cursor:inherit;}", ";", ";", ";"], (0, _styleModifiers.when)('disabled', inactiveStyles), (0, _styleModifiers.when)('readOnly', inactiveStyles), (0, _styleModifiers.when)('hidden', visuallyHiddenStyles));
25
26
  var _default = InputLabel;
26
27
  exports.default = _default;
@@ -39,9 +39,11 @@ export interface BaseInputFieldProps {
39
39
  required?: boolean;
40
40
  requiredMessage?: string;
41
41
  showCharacterCount?: boolean;
42
+ hideLabel?: boolean;
42
43
  style?: React.CSSProperties;
43
44
  value: string;
44
45
  warningMessage?: string;
46
+ isTextArea?: boolean;
45
47
  }
46
48
  declare const InputFieldWithRef: RefForwardingComponent<Ref<any>, BaseInputFieldProps>;
47
49
  export default InputFieldWithRef;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atoms/InputField/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EACZ,aAAa,EAEb,GAAG,EACH,sBAAsB,EAGvB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAoB5C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAE7C,MAAM,WAAW,mBAAmB;IAClC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAChC,QAAQ,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC;IACpC,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,OAAO,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,CAAC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,GAAG,CAAC,OAAO,CAAC;IACtD,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,GAAG,CAAC,OAAO,CAAC;IACzC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,iBAAiB,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,SAAS,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAgKD,QAAA,MAAM,iBAAiB,EAAE,sBAAsB,CAC7C,GAAG,CAAC,GAAG,CAAC,EACR,mBAAmB,CACK,CAAC;AAQ3B,eAAe,iBAAiB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atoms/InputField/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EACZ,aAAa,EAEb,GAAG,EACH,sBAAsB,EAGvB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAoB5C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAE7C,MAAM,WAAW,mBAAmB;IAClC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAChC,QAAQ,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC;IACpC,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,OAAO,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,CAAC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,GAAG,CAAC,OAAO,CAAC;IACtD,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,GAAG,CAAC,OAAO,CAAC;IACzC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,iBAAiB,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,SAAS,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAqKD,QAAA,MAAM,iBAAiB,EAAE,sBAAsB,CAC7C,GAAG,CAAC,GAAG,CAAC,EACR,mBAAmB,CACK,CAAC;AAQ3B,eAAe,iBAAiB,CAAC"}
@@ -62,6 +62,8 @@ function InputField(props, targetRef) {
62
62
  _props$cursor = props.cursor,
63
63
  cursor = _props$cursor === void 0 ? 'text' : _props$cursor,
64
64
  disabled = props.disabled,
65
+ _props$hideLabel = props.hideLabel,
66
+ hideLabel = _props$hideLabel === void 0 ? false : _props$hideLabel,
65
67
  helpMessage = props.helpMessage,
66
68
  IconComponent = props.icon,
67
69
  id = props.id,
@@ -82,7 +84,9 @@ function InputField(props, targetRef) {
82
84
  style = props.style,
83
85
  value = props.value,
84
86
  warningMessage = props.warningMessage,
85
- rest = _objectWithoutProperties(props, ["children", "cursor", "disabled", "helpMessage", "icon", "id", "inputContainerRef", "label", "labelId", "maxLength", "onBlur", "onChange", "onClick", "onFocus", "onKeyDown", "overflow", "readOnly", "required", "requiredMessage", "showCharacterCount", "style", "value", "warningMessage"]);
87
+ _props$isTextArea = props.isTextArea,
88
+ isTextArea = _props$isTextArea === void 0 ? false : _props$isTextArea,
89
+ rest = _objectWithoutProperties(props, ["children", "cursor", "disabled", "hideLabel", "helpMessage", "icon", "id", "inputContainerRef", "label", "labelId", "maxLength", "onBlur", "onChange", "onClick", "onFocus", "onKeyDown", "overflow", "readOnly", "required", "requiredMessage", "showCharacterCount", "style", "value", "warningMessage", "isTextArea"]);
86
90
 
87
91
  var fallbackTargetRef = (0, _react.useRef)(null);
88
92
  var finalTargetRef = targetRef || fallbackTargetRef;
@@ -151,18 +155,24 @@ function InputField(props, targetRef) {
151
155
  style: style
152
156
  }, _react.default.createElement(_Containers.InputContainer, {
153
157
  cursor: cursor,
158
+ hiddenLabel: hideLabel,
154
159
  disabled: disabled,
155
160
  hasWarning: !!warningMessage,
156
161
  isFocused: isFocused,
157
162
  readOnly: readOnly,
158
163
  ref: inputContainerRef,
159
164
  onClick: onInputContainerClickHandler,
160
- onKeyDown: onKeyDown
161
- }, IconComponent && _react.default.createElement(_Containers.IconContainer, null, _react.default.createElement(IconComponent, null)), _react.default.createElement(_Containers.InputInnerContainer, {
162
- hasIcon: !!IconComponent
165
+ onKeyDown: onKeyDown,
166
+ isTextArea: isTextArea
167
+ }, IconComponent && _react.default.createElement(_Containers.IconContainer, {
168
+ hiddenLabel: hideLabel
169
+ }, _react.default.createElement(IconComponent, null)), _react.default.createElement(_Containers.InputInnerContainer, {
170
+ hasIcon: !!IconComponent,
171
+ hiddenLabel: hideLabel
163
172
  }, _react.default.createElement(_InputLabel.default, {
164
173
  disabled: disabled,
165
174
  htmlFor: targetId,
175
+ hidden: hideLabel,
166
176
  id: labelId,
167
177
  readOnly: readOnly,
168
178
  onClick: function onClick(event) {
@@ -1 +1 @@
1
- {"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../src/atoms/InputField/schema.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,MAAM,KAAqC,CAAC;AAiElD,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../src/atoms/InputField/schema.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,MAAM,KAAqC,CAAC;AAsElD,eAAe,MAAM,CAAC"}
@@ -16,6 +16,7 @@ schema.makePropTypes = function () {
16
16
  return {
17
17
  disabled: _reactDesc.PropTypes.bool.description('Sets the input state to disabled if true.'),
18
18
  helpMessage: _reactDesc.PropTypes.string.description("A short message to help clarify the input's purpose to the user."),
19
+ hideLabel: _reactDesc.PropTypes.bool.description("Visually hides the label, but leaves it available for screen readers. Use this only if you are sure the input doesn't need a visual label").defaultValue('false'),
19
20
  icon: _reactDesc.PropTypes.element.description('An icon to be rendered on the left side of the input.'),
20
21
  id: _reactDesc.PropTypes.string.description('A unique ID for the input.'),
21
22
  inputContainerRef: _reactDesc.PropTypes.oneOfType([// Either a function
@@ -1 +1 @@
1
- {"version":3,"file":"Target.d.ts","sourceRoot":"","sources":["../../../src/components/Combobox/Target.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAO,sBAAsB,EAAc,MAAM,OAAO,CAAC;AAkBvE,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAoLtC,QAAA,MAAM,aAAa,EAAE,sBAAsB,CACzC,gBAAgB,EAChB,WAAW,CACS,CAAC;AAGvB,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"Target.d.ts","sourceRoot":"","sources":["../../../src/components/Combobox/Target.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAO,sBAAsB,EAAc,MAAM,OAAO,CAAC;AAkBvE,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAiLtC,QAAA,MAAM,aAAa,EAAE,sBAAsB,CACzC,gBAAgB,EAChB,WAAW,CACS,CAAC;AAGvB,eAAe,aAAa,CAAC"}
@@ -46,24 +46,23 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
46
46
  var TargetContainer = _styledComponents.default.div.withConfig({
47
47
  displayName: "Target__TargetContainer",
48
48
  componentId: "sc-1obpsql-0"
49
- })(["align-items:center;display:flex;flex-wrap:wrap;justify-content:flex-start;position:relative;width:100%;margin:2px auto;padding-right:15px;", ""], (0, _styleModifiers.when)('hasExpandIndicator', (0, _styledComponents.css)(["padding-right:45px;"])));
49
+ })(["align-items:center;display:flex;flex-wrap:wrap;justify-content:flex-start;width:100%;padding-right:15px;", ""], (0, _styleModifiers.when)('hasExpandIndicator', (0, _styledComponents.css)(["padding-right:45px;"])));
50
50
 
51
51
  var Input = _styledComponents.default.input.withConfig({
52
52
  displayName: "Target__Input",
53
53
  componentId: "sc-1obpsql-1"
54
- })(["font-family:", ";font-size:", ";font-weight:", ";overflow:visible;&::-moz-focus-inner{border:0;padding:0;margin:0;}background-color:inherit;border:transparent;display:block;line-height:140%;padding:1px 10px 6px 1px;flex-grow:100;&:active,&:focus{outline:none;}"], _designTokens.typography.typeface.default, (0, _rem.default)(_designTokens.typography.size.alias.default), _designTokens.typography.weight.alias.default);
54
+ })(["font-family:", ";font-size:", ";font-weight:", ";overflow:visible;&::-moz-focus-inner{border:0;padding:0;margin:0;}background-color:inherit;border:transparent;display:block;line-height:140%;padding:0 10px 5px 1px;flex-grow:100;&:active,&:focus{outline:none;}"], _designTokens.typography.typeface.default, (0, _rem.default)(_designTokens.typography.size.alias.default), _designTokens.typography.weight.alias.default);
55
55
 
56
56
  var ClearButtonContainer = (0, _styledComponents.default)(_Flex.default).withConfig({
57
57
  displayName: "Target__ClearButtonContainer",
58
58
  componentId: "sc-1obpsql-2"
59
59
  })(["position:absolute;bottom:0;right:0;padding-bottom:2px;padding-left:10px;padding-right:10px;", ""], (0, _styleModifiers.when)('hasExpandIndicator', (0, _styledComponents.css)(["right:20px;"])));
60
60
  var ExpandedIndicatorContainer = (0, _styledComponents.default)(_Flex.default).attrs({
61
- paddingBottom: 0.2,
62
61
  alignItems: 'center'
63
62
  }).withConfig({
64
63
  displayName: "Target__ExpandedIndicatorContainer",
65
64
  componentId: "sc-1obpsql-3"
66
- })(["position:absolute;bottom:0;right:10px;color:", ";&:hover{color:", ";}", ";"], (0, _toColorString.default)(_color.default.interaction.pacificOcean), (0, _toColorString.default)(_color.default.interaction.indianOcean), (0, _styleModifiers.when)('disabled', (0, _styledComponents.css)(["color:", ";&:hover{color:", ";}"], (0, _toColorString.default)(_color.default.opacity.charcoal40), (0, _toColorString.default)(_color.default.opacity.charcoal40))));
65
+ })(["position:absolute;bottom:2px;right:10px;color:", ";&:hover{color:", ";}", ";"], (0, _toColorString.default)(_color.default.interaction.pacificOcean), (0, _toColorString.default)(_color.default.interaction.indianOcean), (0, _styleModifiers.when)('disabled', (0, _styledComponents.css)(["color:", ";&:hover{color:", ";}"], (0, _toColorString.default)(_color.default.opacity.charcoal40), (0, _toColorString.default)(_color.default.opacity.charcoal40))));
67
66
 
68
67
  function Target(_ref, ref) {
69
68
  var clearButtonLabel = _ref.clearButtonLabel,