@invoicebox/ui 0.1.0-alpha.200 → 0.1.0-alpha.202

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 (29) hide show
  1. package/dist/components/common/Chip/index.d.ts +9 -0
  2. package/dist/components/common/Chip/index.js +24 -0
  3. package/dist/components/common/Chip/index.stories.d.ts +5 -0
  4. package/dist/components/common/Chip/index.stories.js +20 -0
  5. package/dist/components/common/Chip/styles.d.ts +7 -0
  6. package/dist/components/common/Chip/styles.js +25 -0
  7. package/dist/components/form/CurrencyInput/CoreCurrencyInput/index.js +1 -0
  8. package/dist/components/form/CurrencyInput/CoreCurrencyInput/styles.d.ts +1 -0
  9. package/dist/components/form/PureInput/index.d.ts +2 -0
  10. package/dist/components/form/PureInput/index.js +4 -1
  11. package/dist/components/form/PureInput/styles.d.ts +2 -0
  12. package/dist/components/form/PureInput/styles.js +20 -17
  13. package/dist/components/form/TagsInput/assets/CrossIcon.d.ts +6 -0
  14. package/dist/components/form/TagsInput/assets/CrossIcon.js +30 -0
  15. package/dist/components/form/TagsInput/index.d.ts +13 -0
  16. package/dist/components/form/TagsInput/index.js +115 -0
  17. package/dist/components/form/TagsInput/index.stories.d.ts +5 -0
  18. package/dist/components/form/TagsInput/index.stories.js +42 -0
  19. package/dist/components/form/TagsInput/palette.d.ts +6 -0
  20. package/dist/components/form/TagsInput/palette.js +12 -0
  21. package/dist/components/form/TagsInput/styles.d.ts +17 -0
  22. package/dist/components/form/TagsInput/styles.js +35 -0
  23. package/dist/index.d.ts +25 -21
  24. package/dist/index.js +35 -15
  25. package/dist/palette/context.d.ts +2 -0
  26. package/dist/palette/context.js +3 -1
  27. package/dist/palette/provider.js +3 -1
  28. package/dist/palette/usePalette.d.ts +1 -0
  29. package/package.json +1 -1
@@ -0,0 +1,9 @@
1
+ import { FC, ReactNode } from 'react';
2
+ import { TChipSize } from './styles';
3
+ export type TProps = {
4
+ label: string | ReactNode;
5
+ color: string;
6
+ bgColor: string;
7
+ size?: TChipSize;
8
+ };
9
+ export declare const Chip: FC<TProps>;
@@ -0,0 +1,24 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.Chip = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _styles = require("./styles");
9
+ var _Typography = require("../Typography");
10
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
11
+ var Chip = exports.Chip = function Chip(_ref) {
12
+ var label = _ref.label,
13
+ bgColor = _ref.bgColor,
14
+ color = _ref.color,
15
+ _ref$size = _ref.size,
16
+ size = _ref$size === void 0 ? 'xs' : _ref$size;
17
+ return /*#__PURE__*/_react["default"].createElement(_styles.Wrapper, {
18
+ $color: color,
19
+ $backgroundColor: bgColor,
20
+ $size: size
21
+ }, typeof label === 'string' ? /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
22
+ variant: "smallMedium"
23
+ }, label) : label);
24
+ };
@@ -0,0 +1,5 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import { TProps, Chip } from '.';
3
+ declare const meta: Meta<typeof Chip>;
4
+ export default meta;
5
+ export declare const Default: StoryObj<TProps>;
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = exports.Default = void 0;
7
+ var _ = require(".");
8
+ var meta = {
9
+ title: 'common/Chip',
10
+ component: _.Chip,
11
+ tags: ['autodocs']
12
+ };
13
+ var _default = exports["default"] = meta;
14
+ var Default = exports.Default = {
15
+ args: {
16
+ label: 'Название',
17
+ color: 'blue',
18
+ bgColor: 'red'
19
+ }
20
+ };
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ export type TChipSize = 'xxs' | 'xs';
3
+ export declare const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
4
+ $color: string;
5
+ $backgroundColor: string;
6
+ $size: TChipSize;
7
+ }>> & string;
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.Wrapper = void 0;
7
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
8
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
9
+ var CHIP_PADDING_MAP = {
10
+ xxs: '0 4px',
11
+ xs: '4px 6px'
12
+ };
13
+ var Wrapper = exports.Wrapper = _styledComponents["default"].div.withConfig({
14
+ displayName: "styles__Wrapper",
15
+ componentId: "sc-1v052gm-0"
16
+ })(["display:inline-flex;align-items:center;gap:4px;padding:", ";color:", ";background-color:", ";border-radius:6px;white-space:nowrap;"], function (_ref) {
17
+ var $size = _ref.$size;
18
+ return CHIP_PADDING_MAP[$size];
19
+ }, function (_ref2) {
20
+ var $color = _ref2.$color;
21
+ return $color;
22
+ }, function (_ref3) {
23
+ var $backgroundColor = _ref3.$backgroundColor;
24
+ return $backgroundColor;
25
+ });
@@ -43,6 +43,7 @@ var CoreCurrencyInput = exports.CoreCurrencyInput = function CoreCurrencyInput(_
43
43
  $hasBorder: true,
44
44
  $paddingLeft: 18,
45
45
  $paddingRight: 18,
46
+ $borderRadius: 10,
46
47
  $variant: variant,
47
48
  $paddingTop: paddingTop,
48
49
  $paddingBottom: paddingBottom,
@@ -4,6 +4,7 @@ export declare const StyledCurrencyInputFromLibrary: import("styled-components/d
4
4
  $paddingRight: number;
5
5
  $paddingTop: number;
6
6
  $paddingBottom: number;
7
+ $borderRadius: number;
7
8
  $hasError: boolean;
8
9
  $inFocus: boolean;
9
10
  $hasBorder: boolean;
@@ -5,6 +5,7 @@ export type TProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'onBlur'
5
5
  paddingRight?: number;
6
6
  paddingTop?: number;
7
7
  paddingBottom?: number;
8
+ borderRadius?: number;
8
9
  hasError?: boolean;
9
10
  inFocus?: boolean;
10
11
  hasBorder?: boolean;
@@ -17,6 +18,7 @@ export declare const PureInput: React.ForwardRefExoticComponent<Omit<React.Texta
17
18
  paddingRight?: number | undefined;
18
19
  paddingTop?: number | undefined;
19
20
  paddingBottom?: number | undefined;
21
+ borderRadius?: number | undefined;
20
22
  hasError?: boolean | undefined;
21
23
  inFocus?: boolean | undefined;
22
24
  hasBorder?: boolean | undefined;
@@ -8,7 +8,7 @@ exports.PureInput = void 0;
8
8
  var _react = _interopRequireWildcard(require("react"));
9
9
  var S = _interopRequireWildcard(require("./styles"));
10
10
  var _palette = require("../../../palette");
11
- var _excluded = ["paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "hasError", "inFocus", "hasBorder", "isOnlyNumbers", "className", "onChange", "element", "variant"];
11
+ var _excluded = ["paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "borderRadius", "hasError", "inFocus", "hasBorder", "isOnlyNumbers", "className", "onChange", "element", "variant"];
12
12
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
13
13
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
14
14
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -23,6 +23,8 @@ var PureInput = exports.PureInput = /*#__PURE__*/_react["default"].forwardRef(fu
23
23
  paddingTop = _ref$paddingTop === void 0 ? 13 : _ref$paddingTop,
24
24
  _ref$paddingBottom = _ref.paddingBottom,
25
25
  paddingBottom = _ref$paddingBottom === void 0 ? 13 : _ref$paddingBottom,
26
+ _ref$borderRadius = _ref.borderRadius,
27
+ borderRadius = _ref$borderRadius === void 0 ? 10 : _ref$borderRadius,
26
28
  _ref$hasError = _ref.hasError,
27
29
  hasError = _ref$hasError === void 0 ? false : _ref$hasError,
28
30
  _ref$inFocus = _ref.inFocus,
@@ -58,6 +60,7 @@ var PureInput = exports.PureInput = /*#__PURE__*/_react["default"].forwardRef(fu
58
60
  $inFocus: inFocus,
59
61
  $hasBorder: hasBorder,
60
62
  $palette: palette,
63
+ $borderRadius: borderRadius,
61
64
  onChange: handleChange
62
65
  }, rest));
63
66
  });
@@ -5,6 +5,7 @@ export declare const getPureInputStyled: (component: ElementType) => import("sty
5
5
  $paddingRight: number;
6
6
  $paddingTop: number;
7
7
  $paddingBottom: number;
8
+ $borderRadius: number;
8
9
  $hasError: boolean;
9
10
  $inFocus: boolean;
10
11
  $hasBorder: boolean;
@@ -16,6 +17,7 @@ export declare const Wrapper: import("styled-components/dist/types").IStyledComp
16
17
  $paddingRight: number;
17
18
  $paddingTop: number;
18
19
  $paddingBottom: number;
20
+ $borderRadius: number;
19
21
  $hasError: boolean;
20
22
  $inFocus: boolean;
21
23
  $hasBorder: boolean;
@@ -12,35 +12,38 @@ var getPureInputStyled = exports.getPureInputStyled = function getPureInputStyle
12
12
  return (0, _styledComponents["default"])(component).withConfig({
13
13
  displayName: "styles",
14
14
  componentId: "sc-1g8ijo6-0"
15
- })(["", " resize:none;color:", ";border-radius:10px;border:none;width:100%;background-color:", ";transition:all 0.2s ease-in-out 0s;box-sizing:border-box;padding-right:", "px;padding-left:", "px;padding-top:", "px;padding-bottom:", "px;outline:1px solid ", ";&::placeholder{color:", ";}&::-webkit-outer-spin-button,&::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}&[type='number']{-moz-appearance:textfield;}&:-webkit-autofill,&:-webkit-autofill:hover,&:-webkit-autofill:focus{transition:background-color 0s 600000s,color 0s 600000s !important;}"], function (_ref) {
15
+ })(["", " resize:none;color:", ";border-radius:", "px;border:none;width:100%;background-color:", ";transition:all 0.2s ease-in-out 0s;box-sizing:border-box;padding-right:", "px;padding-left:", "px;padding-top:", "px;padding-bottom:", "px;outline:1px solid ", ";&::placeholder{color:", ";}&::-webkit-outer-spin-button,&::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}&[type='number']{-moz-appearance:textfield;}&:-webkit-autofill,&:-webkit-autofill:hover,&:-webkit-autofill:focus{transition:background-color 0s 600000s,color 0s 600000s !important;}"], function (_ref) {
16
16
  var $variant = _ref.$variant;
17
17
  return $variant && _typography.typography[$variant];
18
18
  }, function (_ref2) {
19
19
  var $palette = _ref2.$palette;
20
20
  return $palette.text;
21
21
  }, function (_ref3) {
22
- var $palette = _ref3.$palette;
23
- return $palette.bg;
22
+ var $borderRadius = _ref3.$borderRadius;
23
+ return $borderRadius;
24
24
  }, function (_ref4) {
25
- var $paddingRight = _ref4.$paddingRight;
26
- return $paddingRight;
25
+ var $palette = _ref4.$palette;
26
+ return $palette.bg;
27
27
  }, function (_ref5) {
28
- var $paddingLeft = _ref5.$paddingLeft;
29
- return $paddingLeft;
28
+ var $paddingRight = _ref5.$paddingRight;
29
+ return $paddingRight;
30
30
  }, function (_ref6) {
31
- var $paddingTop = _ref6.$paddingTop;
32
- return $paddingTop;
31
+ var $paddingLeft = _ref6.$paddingLeft;
32
+ return $paddingLeft;
33
33
  }, function (_ref7) {
34
- var $paddingBottom = _ref7.$paddingBottom;
35
- return $paddingBottom;
34
+ var $paddingTop = _ref7.$paddingTop;
35
+ return $paddingTop;
36
36
  }, function (_ref8) {
37
- var $hasError = _ref8.$hasError,
38
- $inFocus = _ref8.$inFocus,
39
- $hasBorder = _ref8.$hasBorder,
40
- $palette = _ref8.$palette;
41
- return !$hasBorder ? 'transparent' : $hasError ? $palette.error : $inFocus ? $palette.borderFocus : $palette.border;
37
+ var $paddingBottom = _ref8.$paddingBottom;
38
+ return $paddingBottom;
42
39
  }, function (_ref9) {
43
- var $palette = _ref9.$palette;
40
+ var $hasError = _ref9.$hasError,
41
+ $inFocus = _ref9.$inFocus,
42
+ $hasBorder = _ref9.$hasBorder,
43
+ $palette = _ref9.$palette;
44
+ return !$hasBorder ? 'transparent' : $hasError ? $palette.error : $inFocus ? $palette.borderFocus : $palette.border;
45
+ }, function (_ref10) {
46
+ var $palette = _ref10.$palette;
44
47
  return $palette.placeholder;
45
48
  });
46
49
  };
@@ -0,0 +1,6 @@
1
+ import { FC } from 'react';
2
+ type TProps = {
3
+ color: string;
4
+ };
5
+ export declare const CrossIcon: FC<TProps>;
6
+ export {};
@@ -0,0 +1,30 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.CrossIcon = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
9
+ var CrossIcon = exports.CrossIcon = function CrossIcon(_ref) {
10
+ var color = _ref.color;
11
+ return /*#__PURE__*/_react["default"].createElement("svg", {
12
+ xmlns: "http://www.w3.org/2000/svg",
13
+ width: "16",
14
+ height: "16",
15
+ viewBox: "0 0 16 16",
16
+ fill: "none"
17
+ }, /*#__PURE__*/_react["default"].createElement("path", {
18
+ d: "M11.3307 4.6665L4.66406 11.3332L11.3307 4.6665Z",
19
+ fill: color
20
+ }), /*#__PURE__*/_react["default"].createElement("path", {
21
+ d: "M11.3307 11.3332L4.66406 4.6665L11.3307 11.3332Z",
22
+ fill: color
23
+ }), /*#__PURE__*/_react["default"].createElement("path", {
24
+ d: "M11.3307 4.6665L4.66406 11.3332M11.3307 11.3332L4.66406 4.6665",
25
+ stroke: color,
26
+ strokeWidth: "1.5",
27
+ strokeLinecap: "round",
28
+ strokeLinejoin: "round"
29
+ }));
30
+ };
@@ -0,0 +1,13 @@
1
+ import { FC } from 'react';
2
+ import { TProps as TInputLabelProps } from '../InputLabel';
3
+ import { TSizes } from '../constants';
4
+ import { TTagsInputPalette } from './palette';
5
+ export type TProps = Pick<TInputLabelProps, 'label'> & {
6
+ hasError?: boolean;
7
+ } & {
8
+ value?: Array<string>;
9
+ onChange: (value?: Array<string>) => void;
10
+ size?: TSizes;
11
+ palette?: Partial<TTagsInputPalette>;
12
+ };
13
+ export declare const TagsInput: FC<TProps>;
@@ -0,0 +1,115 @@
1
+ "use strict";
2
+
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.TagsInput = void 0;
8
+ var _react = _interopRequireWildcard(require("react"));
9
+ var _InputLabel = require("../InputLabel");
10
+ var _PureInput = require("../PureInput");
11
+ var S = _interopRequireWildcard(require("./styles"));
12
+ var _constants = require("../constants");
13
+ var _palette = require("../../../palette");
14
+ var _Typography = require("../../common/Typography");
15
+ var _Chip = require("../../common/Chip");
16
+ var _CrossIcon = require("./assets/CrossIcon");
17
+ var _useInputFocus2 = require("../../../hooks/useInputFocus");
18
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
19
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
20
+ function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
21
+ function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
22
+ function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
23
+ function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
24
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
25
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
26
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
27
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
28
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
29
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
30
+ var TagsInput = exports.TagsInput = function TagsInput(_ref) {
31
+ var _ref$hasError = _ref.hasError,
32
+ hasError = _ref$hasError === void 0 ? false : _ref$hasError,
33
+ _ref$size = _ref.size,
34
+ size = _ref$size === void 0 ? 'M' : _ref$size,
35
+ label = _ref.label,
36
+ value = _ref.value,
37
+ onChange = _ref.onChange,
38
+ palette = _ref.palette;
39
+ var _useState = (0, _react.useState)(''),
40
+ _useState2 = _slicedToArray(_useState, 2),
41
+ newValue = _useState2[0],
42
+ setNewValue = _useState2[1];
43
+ var _useInputFocus = (0, _useInputFocus2.useInputFocus)(),
44
+ inFocus = _useInputFocus.inFocus,
45
+ handleFocus = _useInputFocus.handleFocus,
46
+ handleBlur = _useInputFocus.handleBlur;
47
+ var inputRef = (0, _react.useRef)(null);
48
+ var pureInputPalette = (0, _palette.useComponentPalette)('pureInput');
49
+ var tagsInputPalette = (0, _palette.useComponentPalette)('tagsInput', palette);
50
+ var _SIZE_PARAMS_MAP$size = _constants.SIZE_PARAMS_MAP[size],
51
+ paddingBottom = _SIZE_PARAMS_MAP$size.paddingBottom,
52
+ paddingTop = _SIZE_PARAMS_MAP$size.paddingTop;
53
+ var handleChange = (0, _react.useCallback)(function (event) {
54
+ setNewValue(event.target.value);
55
+ }, []);
56
+ var handleKeyDown = function handleKeyDown(event) {
57
+ if (event.key === 'Enter') {
58
+ onChange(value !== null && value !== void 0 && value.includes(newValue) ? value : [].concat(_toConsumableArray(value ? value : []), [newValue]));
59
+ setNewValue('');
60
+ }
61
+ };
62
+ var handleTagRemove = function handleTagRemove(tagRemoved) {
63
+ var valueWithoutRemovedTag = value === null || value === void 0 ? void 0 : value.filter(function (tagItem) {
64
+ return tagItem !== tagRemoved;
65
+ });
66
+ onChange(valueWithoutRemovedTag !== null && valueWithoutRemovedTag !== void 0 && valueWithoutRemovedTag.length ? valueWithoutRemovedTag : undefined);
67
+ };
68
+ var handlePureInputClick = function handlePureInputClick() {
69
+ var _inputRef$current;
70
+ (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
71
+ };
72
+ return /*#__PURE__*/_react["default"].createElement(_InputLabel.InputLabel, {
73
+ label: label
74
+ }, /*#__PURE__*/_react["default"].createElement(S.PureInputStyledWrapper, {
75
+ $palette: pureInputPalette,
76
+ $hasBorder: true,
77
+ $paddingLeft: 18,
78
+ $paddingRight: 18,
79
+ $borderRadius: 10,
80
+ $paddingTop: paddingTop,
81
+ $paddingBottom: paddingBottom,
82
+ $hasError: hasError,
83
+ $inFocus: inFocus,
84
+ onClick: handlePureInputClick
85
+ }, /*#__PURE__*/_react["default"].createElement(S.TagsWrapper, null, value === null || value === void 0 ? void 0 : value.map(function (tagItem, index) {
86
+ return /*#__PURE__*/_react["default"].createElement(_Chip.Chip, {
87
+ key: tagItem + index,
88
+ label: /*#__PURE__*/_react["default"].createElement(S.ChipLabel, null, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
89
+ variant: 'labelsHintsBold'
90
+ }, tagItem), /*#__PURE__*/_react["default"].createElement(S.ChipRemoveButton, {
91
+ type: 'button',
92
+ onClick: function onClick() {
93
+ return handleTagRemove(tagItem);
94
+ }
95
+ }, /*#__PURE__*/_react["default"].createElement(_CrossIcon.CrossIcon, {
96
+ color: tagsInputPalette.chipColor
97
+ }))),
98
+ color: tagsInputPalette.chipColor,
99
+ bgColor: tagsInputPalette.chipBg
100
+ });
101
+ }), /*#__PURE__*/_react["default"].createElement(S.InputWrapper, null, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, {
102
+ ref: inputRef,
103
+ hasBorder: false,
104
+ paddingBottom: 0,
105
+ paddingRight: 0,
106
+ paddingTop: 0,
107
+ paddingLeft: 0,
108
+ borderRadius: 0,
109
+ value: newValue,
110
+ onChange: handleChange,
111
+ onKeyDown: handleKeyDown,
112
+ onBlur: handleBlur,
113
+ onFocus: handleFocus
114
+ })))));
115
+ };
@@ -0,0 +1,5 @@
1
+ import type { Meta, StoryObj } from '@storybook/react';
2
+ import { TagsInput, TProps } from '.';
3
+ declare const meta: Meta<typeof TagsInput>;
4
+ export default meta;
5
+ export declare const Default: StoryObj<TProps>;
@@ -0,0 +1,42 @@
1
+ "use strict";
2
+
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = exports.Default = void 0;
8
+ var _react = _interopRequireWildcard(require("react"));
9
+ var _ = require(".");
10
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
11
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
12
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
13
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
14
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
15
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
16
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
17
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
18
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
19
+ var meta = {
20
+ title: 'form/TagsInput',
21
+ component: _.TagsInput,
22
+ tags: ['autodocs']
23
+ };
24
+ var _default = exports["default"] = meta;
25
+ var Component = function Component(props) {
26
+ var _useState = (0, _react.useState)(),
27
+ _useState2 = _slicedToArray(_useState, 2),
28
+ value = _useState2[0],
29
+ setValue = _useState2[1];
30
+ return /*#__PURE__*/_react["default"].createElement(_.TagsInput, _extends({}, props, {
31
+ value: value,
32
+ onChange: setValue
33
+ }));
34
+ };
35
+ var Default = exports.Default = {
36
+ args: {
37
+ size: 'M',
38
+ label: 'Label',
39
+ hasError: false
40
+ },
41
+ render: Component
42
+ };
@@ -0,0 +1,6 @@
1
+ import { TAbstractPalette } from '../../../palette';
2
+ export type TTagsInputPalette = {
3
+ chipColor: string;
4
+ chipBg: string;
5
+ };
6
+ export declare const generateTagsInputPalette: (abstractPalette: TAbstractPalette) => TTagsInputPalette;
@@ -0,0 +1,12 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.generateTagsInputPalette = void 0;
7
+ var generateTagsInputPalette = exports.generateTagsInputPalette = function generateTagsInputPalette(abstractPalette) {
8
+ return {
9
+ chipColor: abstractPalette.base,
10
+ chipBg: abstractPalette.primary
11
+ };
12
+ };
@@ -0,0 +1,17 @@
1
+ import React from 'react';
2
+ export declare const PureInputStyledWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<any, {
3
+ $paddingLeft: number;
4
+ $paddingRight: number;
5
+ $paddingTop: number;
6
+ $paddingBottom: number;
7
+ $borderRadius: number;
8
+ $hasError: boolean;
9
+ $inFocus: boolean;
10
+ $hasBorder: boolean;
11
+ $palette: import("../PureInput/palette").TPureInputPalette;
12
+ $variant?: "headline1" | "headline2" | "headline3" | "headline4" | "headline5" | "headline6" | "headerText" | "buttonL" | "bodyL" | "bodyLUnderlined" | "buttonM" | "bodyMRegular" | "bodyMBold" | "bodyMUnderlined" | "captionRegular" | "labelsHintsRegular" | "labelsHintsBold" | "captionSRegular" | "captionUnderlined" | "smallMedium" | "labelsAndHints" | undefined;
13
+ }>> & string & ({} | Omit<React.ComponentClass<any, any>, keyof React.Component<any, {}, any>> | Omit<React.FunctionComponent<any>, keyof React.Component<any, {}, any>>);
14
+ export declare const TagsWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
15
+ export declare const InputWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
16
+ export declare const ChipLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
17
+ export declare const ChipRemoveButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
@@ -0,0 +1,35 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.TagsWrapper = exports.PureInputStyledWrapper = exports.InputWrapper = exports.ChipRemoveButton = exports.ChipLabel = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _styles = require("../PureInput/styles");
9
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
10
+ var _excluded = ["children"];
11
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
12
+ function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
13
+ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
14
+ var Wrapper = function Wrapper(_ref) {
15
+ var children = _ref.children,
16
+ other = _objectWithoutProperties(_ref, _excluded);
17
+ return /*#__PURE__*/_react["default"].createElement("div", other, children);
18
+ };
19
+ var PureInputStyledWrapper = exports.PureInputStyledWrapper = (0, _styles.getPureInputStyled)(Wrapper);
20
+ var TagsWrapper = exports.TagsWrapper = _styledComponents["default"].div.withConfig({
21
+ displayName: "styles__TagsWrapper",
22
+ componentId: "sc-1uwnjdr-0"
23
+ })(["display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px;"]);
24
+ var InputWrapper = exports.InputWrapper = _styledComponents["default"].div.withConfig({
25
+ displayName: "styles__InputWrapper",
26
+ componentId: "sc-1uwnjdr-1"
27
+ })(["width:auto;"]);
28
+ var ChipLabel = exports.ChipLabel = _styledComponents["default"].div.withConfig({
29
+ displayName: "styles__ChipLabel",
30
+ componentId: "sc-1uwnjdr-2"
31
+ })(["display:flex;align-items:center;gap:6px;"]);
32
+ var ChipRemoveButton = exports.ChipRemoveButton = _styledComponents["default"].button.withConfig({
33
+ displayName: "styles__ChipRemoveButton",
34
+ componentId: "sc-1uwnjdr-3"
35
+ })(["display:flex;justify-content:center;align-items:center;background:transparent;border:none;cursor:pointer;outline:none;color:inherit;padding:0;"]);
package/dist/index.d.ts CHANGED
@@ -1,15 +1,13 @@
1
+ export { PaletteProvider, defaultAbstractPalette } from './palette';
2
+ export type { TAbstractPalette } from './palette';
1
3
  export { Skeleton } from './components/common/Skeleton';
2
4
  export { InvoiceboxLoader } from './components/common/InvoiceboxLoader';
3
5
  export { Typography } from './components/common/Typography';
4
6
  export { InvoiceboxSpinner } from './components/common/InvoiceboxSpinner';
5
7
  export { SecondaryButton } from './components/common/SecondaryButton';
6
8
  export { Arrow } from './components/common/Arrow';
7
- export { InputLabel } from './components/form/InputLabel';
8
- export { PureInput } from './components/form/PureInput';
9
- export { PositiveIntegerInput } from './components/form/PositiveIntegerInput';
10
- export type { TProps as TPositiveIntegerInputProps } from './components/form/PositiveIntegerInput';
11
- export { TextInput } from './components/form/TextInput';
12
- export type { TProps as TTextInputProps } from './components/form/TextInput';
9
+ export { Chip } from './components/common/Chip';
10
+ export type { TProps as TChipProps } from './components/common/Chip';
13
11
  export { Dropdown } from './components/common/Dropdown';
14
12
  export type { TProps as TDropdownProps } from './components/common/Dropdown';
15
13
  export { Drawer } from './components/common/Drawer';
@@ -17,27 +15,40 @@ export type { TProps as TDrawerProps } from './components/common/Drawer';
17
15
  export { EntityAutocompleteOptionsDrawer } from './components/common/EntityAutocompleteOptionsDrawer';
18
16
  export type { TProps as TEntityAutocompleteOptionsDrawerProps } from './components/common/EntityAutocompleteOptionsDrawer';
19
17
  export { Scrollbar } from './components/common/Scrollbar';
20
- export { Select } from './components/form/Select';
21
- export type { TProps as TSelectProps } from './components/form/Select';
22
- export { Toggle } from './components/form/Toggle';
23
- export type { TProps as TToggleProps } from './components/form/Toggle';
24
18
  export { PointsLoader } from './components/common/PointsLoader';
25
19
  export { Calendar } from './components/common/Calendar';
26
20
  export type { TProps as TCalendarProps } from './components/common/Calendar';
27
- export { DateInput } from './components/form/DateInput';
28
- export type { TProps as TDateInputProps } from './components/form/DateInput';
29
21
  export { WarningIcon } from './components/common/WarningIcon';
30
22
  export type { TProps as TWarningIconProps } from './components/common/WarningIcon';
31
23
  export { Divider } from './components/common/Divider';
32
24
  export type { TProps as TDividerProps } from './components/common/Divider';
33
25
  export { ReadOnlyLabelValueField } from './components/common/ReadOnlyLabelValueField';
34
26
  export type { TProps as TReadOnlyLabelValueFieldProps } from './components/common/ReadOnlyLabelValueField';
27
+ export { Flag } from './components/common/Flag';
28
+ export type { TProps as TFlagProps, TFlagKey } from './components/common/Flag';
29
+ export { BgCard } from './components/common/BgCard';
30
+ export { ToastContainer, toast } from './components/common/Toast';
31
+ export { AppCardLink } from './components/common/AppCardLink';
32
+ export { InvoiceboxLogo } from './components/common/InvoiceboxLogo';
33
+ export { QRCode } from './components/common/QRCode';
34
+ export { InputLabel } from './components/form/InputLabel';
35
+ export { PureInput } from './components/form/PureInput';
36
+ export { PositiveIntegerInput } from './components/form/PositiveIntegerInput';
37
+ export type { TProps as TPositiveIntegerInputProps } from './components/form/PositiveIntegerInput';
38
+ export { TagsInput } from './components/form/TagsInput';
39
+ export type { TProps as TTagsInputProps } from './components/form/TagsInput';
40
+ export { TextInput } from './components/form/TextInput';
41
+ export type { TProps as TTextInputProps } from './components/form/TextInput';
42
+ export { Select } from './components/form/Select';
43
+ export type { TProps as TSelectProps } from './components/form/Select';
44
+ export { Toggle } from './components/form/Toggle';
45
+ export type { TProps as TToggleProps } from './components/form/Toggle';
46
+ export { DateInput } from './components/form/DateInput';
47
+ export type { TProps as TDateInputProps } from './components/form/DateInput';
35
48
  export { SearchInput } from './components/form/SearchInput';
36
49
  export type { TProps as TSearchInputProps } from './components/form/SearchInput';
37
50
  export { CodeInput } from './components/form/CodeInput';
38
51
  export type { TProps as TCodeInputProps } from './components/form/CodeInput';
39
- export { Flag } from './components/common/Flag';
40
- export type { TProps as TFlagProps, TFlagKey } from './components/common/Flag';
41
52
  export { CountrySelect } from './components/form/CountrySelect';
42
53
  export type { TProps as TCountrySelectProps } from './components/form/CountrySelect';
43
54
  export { PhoneInput } from './components/form/PhoneInput';
@@ -47,15 +58,8 @@ export type { TProps as TCurrencyInputNumberProps } from './components/form/Curr
47
58
  export { CurrencyInputString } from './components/form/CurrencyInput/CurrencyInputString';
48
59
  export type { TProps as TCurrencyInputStringProps } from './components/form/CurrencyInput/CurrencyInputString';
49
60
  export { phoneLogic } from './components/form/PhoneInput/externalPhoneLogic';
50
- export { BgCard } from './components/common/BgCard';
51
- export { ToastContainer, toast } from './components/common/Toast';
52
- export { AppCardLink } from './components/common/AppCardLink';
53
- export { InvoiceboxLogo } from './components/common/InvoiceboxLogo';
54
61
  export type { TProps as TAutocompleteProps } from './components/form/Autocomplete/index';
55
62
  export { Autocomplete, AutocompleteDefaultOption, OrganizationAutocompleteItem, } from './components/form/Autocomplete/index';
56
- export { QRCode } from './components/common/QRCode';
57
- export { PaletteProvider, defaultAbstractPalette } from './palette';
58
- export type { TAbstractPalette } from './palette';
59
63
  export { useOutsideClick } from './hooks/useOutsideClick';
60
64
  export { useInputFocus } from './hooks/useInputFocus';
61
65
  export { useUnupdatableHandler } from './hooks/useUnupdatableHandler';
package/dist/index.js CHANGED
@@ -39,6 +39,12 @@ Object.defineProperty(exports, "Calendar", {
39
39
  return _Calendar.Calendar;
40
40
  }
41
41
  });
42
+ Object.defineProperty(exports, "Chip", {
43
+ enumerable: true,
44
+ get: function get() {
45
+ return _Chip.Chip;
46
+ }
47
+ });
42
48
  Object.defineProperty(exports, "CodeInput", {
43
49
  enumerable: true,
44
50
  get: function get() {
@@ -207,6 +213,12 @@ Object.defineProperty(exports, "Skeleton", {
207
213
  return _Skeleton.Skeleton;
208
214
  }
209
215
  });
216
+ Object.defineProperty(exports, "TagsInput", {
217
+ enumerable: true,
218
+ get: function get() {
219
+ return _TagsInput.TagsInput;
220
+ }
221
+ });
210
222
  Object.defineProperty(exports, "TextInput", {
211
223
  enumerable: true,
212
224
  get: function get() {
@@ -321,43 +333,45 @@ Object.defineProperty(exports, "useUnupdatableHandler", {
321
333
  return _useUnupdatableHandler.useUnupdatableHandler;
322
334
  }
323
335
  });
336
+ var _palette = require("./palette");
324
337
  var _Skeleton = require("./components/common/Skeleton");
325
338
  var _InvoiceboxLoader = require("./components/common/InvoiceboxLoader");
326
339
  var _Typography = require("./components/common/Typography");
327
340
  var _InvoiceboxSpinner = require("./components/common/InvoiceboxSpinner");
328
341
  var _SecondaryButton = require("./components/common/SecondaryButton");
329
342
  var _Arrow = require("./components/common/Arrow");
330
- var _InputLabel = require("./components/form/InputLabel");
331
- var _PureInput = require("./components/form/PureInput");
332
- var _PositiveIntegerInput = require("./components/form/PositiveIntegerInput");
333
- var _TextInput = require("./components/form/TextInput");
343
+ var _Chip = require("./components/common/Chip");
334
344
  var _Dropdown = require("./components/common/Dropdown");
335
345
  var _Drawer = require("./components/common/Drawer");
336
346
  var _EntityAutocompleteOptionsDrawer = require("./components/common/EntityAutocompleteOptionsDrawer");
337
347
  var _Scrollbar = require("./components/common/Scrollbar");
338
- var _Select = require("./components/form/Select");
339
- var _Toggle = require("./components/form/Toggle");
340
348
  var _PointsLoader = require("./components/common/PointsLoader");
341
349
  var _Calendar = require("./components/common/Calendar");
342
- var _DateInput = require("./components/form/DateInput");
343
350
  var _WarningIcon = require("./components/common/WarningIcon");
344
351
  var _Divider = require("./components/common/Divider");
345
352
  var _ReadOnlyLabelValueField = require("./components/common/ReadOnlyLabelValueField");
353
+ var _Flag = require("./components/common/Flag");
354
+ var _BgCard = require("./components/common/BgCard");
355
+ var _Toast = require("./components/common/Toast");
356
+ var _AppCardLink = require("./components/common/AppCardLink");
357
+ var _InvoiceboxLogo = require("./components/common/InvoiceboxLogo");
358
+ var _QRCode = require("./components/common/QRCode");
359
+ var _InputLabel = require("./components/form/InputLabel");
360
+ var _PureInput = require("./components/form/PureInput");
361
+ var _PositiveIntegerInput = require("./components/form/PositiveIntegerInput");
362
+ var _TagsInput = require("./components/form/TagsInput");
363
+ var _TextInput = require("./components/form/TextInput");
364
+ var _Select = require("./components/form/Select");
365
+ var _Toggle = require("./components/form/Toggle");
366
+ var _DateInput = require("./components/form/DateInput");
346
367
  var _SearchInput = require("./components/form/SearchInput");
347
368
  var _CodeInput = require("./components/form/CodeInput");
348
- var _Flag = require("./components/common/Flag");
349
369
  var _CountrySelect = require("./components/form/CountrySelect");
350
370
  var _PhoneInput = require("./components/form/PhoneInput");
351
371
  var _CurrencyInputNumber = require("./components/form/CurrencyInput/CurrencyInputNumber");
352
372
  var _CurrencyInputString = require("./components/form/CurrencyInput/CurrencyInputString");
353
373
  var _externalPhoneLogic = require("./components/form/PhoneInput/externalPhoneLogic");
354
- var _BgCard = require("./components/common/BgCard");
355
- var _Toast = require("./components/common/Toast");
356
- var _AppCardLink = require("./components/common/AppCardLink");
357
- var _InvoiceboxLogo = require("./components/common/InvoiceboxLogo");
358
374
  var _index = require("./components/form/Autocomplete/index");
359
- var _QRCode = require("./components/common/QRCode");
360
- var _palette = require("./palette");
361
375
  var _useOutsideClick = require("./hooks/useOutsideClick");
362
376
  var _useInputFocus = require("./hooks/useInputFocus");
363
377
  var _useUnupdatableHandler = require("./hooks/useUnupdatableHandler");
@@ -372,4 +386,10 @@ var fromEntries = require('object.fromentries');
372
386
  // eslint-disable-next-line @typescript-eslint/no-var-requires,no-undef
373
387
  var entries = require('object.entries');
374
388
  fromEntries.shim();
375
- entries.shim();
389
+ entries.shim();
390
+
391
+ // common
392
+
393
+ // form
394
+
395
+ // hooks
@@ -25,6 +25,7 @@ import { TResetButtonPalette } from '../components/form/ResetButton/palette';
25
25
  import { TTogglePalette } from '../components/form/Toggle/palette';
26
26
  import { TReadOnlyLabelValueFieldPalette } from '../components/common/ReadOnlyLabelValueField/palette';
27
27
  import { TPointsLoaderPalette } from '../components/common/PointsLoader/palette';
28
+ import { TTagsInputPalette } from '../components/form/TagsInput/palette';
28
29
  type TContext = {
29
30
  skeleton: TSkeletonPalette;
30
31
  invoiceboxSpinner: TInvoiceboxSpinnerPalette;
@@ -52,6 +53,7 @@ type TContext = {
52
53
  toggle: TTogglePalette;
53
54
  readOnlyLabelValueField: TReadOnlyLabelValueFieldPalette;
54
55
  pointsLoader: TPointsLoaderPalette;
56
+ tagsInput: TTagsInputPalette;
55
57
  };
56
58
  export declare const PaletteContext: import("react").Context<TContext>;
57
59
  export {};
@@ -32,6 +32,7 @@ var _palette23 = require("../components/form/ResetButton/palette");
32
32
  var _palette24 = require("../components/form/Toggle/palette");
33
33
  var _palette25 = require("../components/common/ReadOnlyLabelValueField/palette");
34
34
  var _palette26 = require("../components/common/PointsLoader/palette");
35
+ var _palette27 = require("../components/form/TagsInput/palette");
35
36
  var PaletteContext = exports.PaletteContext = /*#__PURE__*/(0, _react.createContext)({
36
37
  skeleton: (0, _palette.generateSkeletonPalette)(_constants.defaultAbstractPalette),
37
38
  invoiceboxSpinner: (0, _palette2.generateInvoiceboxSpinnerPalette)(_constants.defaultAbstractPalette),
@@ -58,5 +59,6 @@ var PaletteContext = exports.PaletteContext = /*#__PURE__*/(0, _react.createCont
58
59
  resetButton: (0, _palette23.generateResetButtonPalette)(_constants.defaultAbstractPalette),
59
60
  toggle: (0, _palette24.generateTogglePalette)(_constants.defaultAbstractPalette),
60
61
  readOnlyLabelValueField: (0, _palette25.generateReadOnlyLabelValueFieldPalette)(_constants.defaultAbstractPalette),
61
- pointsLoader: (0, _palette26.generatePointsLoaderPalette)(_constants.defaultAbstractPalette)
62
+ pointsLoader: (0, _palette26.generatePointsLoaderPalette)(_constants.defaultAbstractPalette),
63
+ tagsInput: (0, _palette27.generateTagsInputPalette)(_constants.defaultAbstractPalette)
62
64
  });
@@ -33,6 +33,7 @@ var _palette23 = require("../components/form/ResetButton/palette");
33
33
  var _palette24 = require("../components/form/Toggle/palette");
34
34
  var _palette25 = require("../components/common/ReadOnlyLabelValueField/palette");
35
35
  var _palette26 = require("../components/common/PointsLoader/palette");
36
+ var _palette27 = require("../components/form/TagsInput/palette");
36
37
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
37
38
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
38
39
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
@@ -78,7 +79,8 @@ var PaletteProvider = exports.PaletteProvider = function PaletteProvider(_ref) {
78
79
  resetButton: (0, _palette23.generateResetButtonPalette)(mergedAbstractPalette),
79
80
  toggle: (0, _palette24.generateTogglePalette)(mergedAbstractPalette),
80
81
  readOnlyLabelValueField: (0, _palette25.generateReadOnlyLabelValueFieldPalette)(mergedAbstractPalette),
81
- pointsLoader: (0, _palette26.generatePointsLoaderPalette)(mergedAbstractPalette)
82
+ pointsLoader: (0, _palette26.generatePointsLoaderPalette)(mergedAbstractPalette),
83
+ tagsInput: (0, _palette27.generateTagsInputPalette)(mergedAbstractPalette)
82
84
  };
83
85
  }, [mergedSkeletonPalette, mergedAbstractPalette]);
84
86
  return /*#__PURE__*/_react["default"].createElement(_context.PaletteContext.Provider, {
@@ -25,4 +25,5 @@ export declare const usePalette: () => {
25
25
  toggle: import("../components/form/Toggle/palette").TTogglePalette;
26
26
  readOnlyLabelValueField: import("../components/common/ReadOnlyLabelValueField/palette").TReadOnlyLabelValueFieldPalette;
27
27
  pointsLoader: import("../components/common/PointsLoader/palette").TPointsLoaderPalette;
28
+ tagsInput: import("../components/form/TagsInput/palette").TTagsInputPalette;
28
29
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@invoicebox/ui",
3
- "version": "0.1.0-alpha.200",
3
+ "version": "0.1.0-alpha.202",
4
4
  "description": "Invoicebox UI",
5
5
  "license": "Apache License 2.0",
6
6
  "scripts": {