@invoicebox/ui 0.1.0-alpha.4 → 0.1.0-alpha.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +15 -1
- package/dist/breakpoints/index.d.ts +7 -0
- package/dist/breakpoints/index.js +13 -0
- package/dist/components/common/Arrow/components/StyledSvg/index.d.ts +11 -0
- package/dist/components/common/Arrow/components/StyledSvg/index.js +31 -0
- package/dist/components/common/Arrow/components/StyledSvg/index.stories.d.ts +5 -0
- package/dist/components/common/Arrow/components/StyledSvg/index.stories.js +29 -0
- package/dist/components/common/Arrow/components/Svg/index.d.ts +6 -0
- package/dist/components/common/Arrow/components/Svg/index.js +26 -0
- package/dist/components/common/Arrow/components/Svg/index.stories.d.ts +6 -0
- package/dist/components/common/Arrow/components/Svg/index.stories.js +21 -0
- package/dist/components/common/Arrow/index.d.ts +11 -0
- package/dist/components/common/Arrow/index.js +34 -0
- package/dist/components/common/Arrow/index.stories.d.ts +6 -0
- package/dist/components/common/Arrow/index.stories.js +22 -0
- package/dist/components/common/Arrow/palette.d.ts +8 -0
- package/dist/components/common/Arrow/palette.js +16 -0
- package/dist/components/common/Dropdown/index.d.ts +14 -0
- package/dist/components/common/Dropdown/index.js +117 -0
- package/dist/components/common/Dropdown/index.stories.d.ts +6 -0
- package/dist/components/common/Dropdown/index.stories.js +59 -0
- package/dist/components/common/Dropdown/palette.d.ts +6 -0
- package/dist/components/common/Dropdown/palette.js +14 -0
- package/dist/components/common/Dropdown/styles.d.ts +14 -0
- package/dist/components/common/Dropdown/styles.js +47 -0
- package/dist/components/common/InvoiceboxLoader/index.d.ts +5 -0
- package/dist/components/common/InvoiceboxLoader/index.js +878 -0
- package/dist/components/common/InvoiceboxLoader/index.stories.d.ts +5 -0
- package/dist/components/common/InvoiceboxLoader/index.stories.js +18 -0
- package/dist/components/common/InvoiceboxSpinner/index.d.ts +8 -0
- package/dist/components/common/InvoiceboxSpinner/index.js +41 -0
- package/dist/components/common/InvoiceboxSpinner/index.stories.d.ts +10 -0
- package/dist/components/common/InvoiceboxSpinner/index.stories.js +19 -0
- package/dist/components/common/InvoiceboxSpinner/palette.d.ts +8 -0
- package/dist/components/common/InvoiceboxSpinner/palette.js +14 -0
- package/dist/components/common/InvoiceboxSpinner/styles.d.ts +4 -0
- package/dist/components/common/InvoiceboxSpinner/styles.js +19 -0
- package/dist/components/common/Scrollbar/index.d.ts +6 -0
- package/dist/components/common/Scrollbar/index.js +69 -0
- package/dist/components/common/Scrollbar/index.stories.d.ts +12 -0
- package/dist/components/common/Scrollbar/index.stories.js +36 -0
- package/dist/components/common/Scrollbar/palette.d.ts +5 -0
- package/dist/components/common/Scrollbar/palette.js +11 -0
- package/dist/components/common/SecondaryButton/index.d.ts +19 -0
- package/dist/components/common/SecondaryButton/index.js +51 -0
- package/dist/components/common/SecondaryButton/index.stories.d.ts +11 -0
- package/dist/components/common/SecondaryButton/index.stories.js +38 -0
- package/dist/components/common/SecondaryButton/palette.d.ts +8 -0
- package/dist/components/common/SecondaryButton/palette.js +14 -0
- package/dist/components/common/SecondaryButton/styles.d.ts +11 -0
- package/dist/components/common/SecondaryButton/styles.js +46 -0
- package/dist/components/common/Skeleton/index.d.ts +8 -0
- package/dist/components/common/Skeleton/index.js +28 -0
- package/dist/components/common/Skeleton/index.stories.d.ts +11 -0
- package/dist/components/common/Skeleton/index.stories.js +29 -0
- package/dist/components/common/Skeleton/palette.d.ts +6 -0
- package/dist/components/common/Skeleton/palette.js +12 -0
- package/dist/components/common/Skeleton/styles.d.ts +10 -0
- package/dist/components/common/Skeleton/styles.js +37 -0
- package/dist/components/common/Typography/docs.stories.d.ts +6 -0
- package/dist/components/common/Typography/docs.stories.js +20 -0
- package/dist/components/common/Typography/index.d.ts +26 -0
- package/dist/components/common/Typography/index.js +49 -0
- package/dist/components/common/Typography/index.stories.d.ts +11 -0
- package/dist/components/common/Typography/index.stories.js +35 -0
- package/dist/components/common/Typography/styles.d.ts +5 -0
- package/dist/components/common/Typography/styles.js +16 -0
- package/dist/components/common/Typography/typography.d.ts +20 -0
- package/dist/components/common/Typography/typography.js +28 -0
- package/dist/components/form/InputLabel/index.d.ts +10 -0
- package/dist/components/form/InputLabel/index.js +32 -0
- package/dist/components/form/InputLabel/index.stories.d.ts +5 -0
- package/dist/components/form/InputLabel/index.stories.js +33 -0
- package/dist/components/form/InputLabel/palette.d.ts +7 -0
- package/dist/components/form/InputLabel/palette.js +13 -0
- package/dist/components/form/InputLabel/styles.d.ts +12 -0
- package/dist/components/form/InputLabel/styles.js +40 -0
- package/dist/components/form/PositiveIntegerInput/hooks/useFilters.d.ts +6 -0
- package/dist/components/form/PositiveIntegerInput/hooks/useFilters.js +21 -0
- package/dist/components/form/PositiveIntegerInput/hooks/useIncrement.d.ts +4 -0
- package/dist/components/form/PositiveIntegerInput/hooks/useIncrement.js +22 -0
- package/dist/components/form/PositiveIntegerInput/hooks/useIncrementDisabledFlags.d.ts +9 -0
- package/dist/components/form/PositiveIntegerInput/hooks/useIncrementDisabledFlags.js +24 -0
- package/dist/components/form/PositiveIntegerInput/hooks/useNormalizers.d.ts +4 -0
- package/dist/components/form/PositiveIntegerInput/hooks/useNormalizers.js +22 -0
- package/dist/components/form/PositiveIntegerInput/index.d.ts +10 -0
- package/dist/components/form/PositiveIntegerInput/index.js +94 -0
- package/dist/components/form/PositiveIntegerInput/index.stories.d.ts +5 -0
- package/dist/components/form/PositiveIntegerInput/index.stories.js +49 -0
- package/dist/components/form/PositiveIntegerInput/styles.d.ts +5 -0
- package/dist/components/form/PositiveIntegerInput/styles.js +21 -0
- package/dist/components/form/PureInput/index.d.ts +12 -0
- package/dist/components/form/PureInput/index.js +43 -0
- package/dist/components/form/PureInput/index.stories.d.ts +5 -0
- package/dist/components/form/PureInput/index.stories.js +23 -0
- package/dist/components/form/PureInput/palette.d.ts +10 -0
- package/dist/components/form/PureInput/palette.js +18 -0
- package/dist/components/form/PureInput/styles.d.ts +10 -0
- package/dist/components/form/PureInput/styles.js +34 -0
- package/dist/hooks/useFocusField.d.ts +11 -0
- package/dist/hooks/useFocusField.js +37 -0
- package/dist/index.d.ts +14 -1
- package/dist/index.js +94 -4
- package/dist/palette/colors.stories.d.ts +4 -0
- package/dist/palette/colors.stories.js +40 -0
- package/dist/palette/constants.d.ts +2 -0
- package/dist/palette/constants.js +18 -0
- package/dist/palette/context.d.ts +21 -0
- package/dist/palette/context.js +26 -0
- package/dist/palette/index.d.ts +3 -0
- package/dist/palette/index.js +19 -0
- package/dist/palette/index.stories.d.ts +4 -0
- package/dist/palette/index.stories.js +81 -0
- package/dist/palette/provider.d.ts +20 -0
- package/dist/palette/provider.js +71 -0
- package/dist/palette/types.d.ts +12 -0
- package/dist/palette/types.js +1 -0
- package/dist/palette/useComponentPalette.d.ts +2 -0
- package/dist/palette/useComponentPalette.js +22 -0
- package/dist/palette/usePalette.d.ts +10 -0
- package/dist/palette/usePalette.js +11 -0
- package/package.json +22 -10
- package/dist/stories/Button.d.ts +0 -26
- package/dist/stories/Button.js +0 -41
- package/dist/stories/Button.stories.d.ts +0 -21
- package/dist/stories/Button.stories.js +0 -44
- package/dist/stories/styles.d.ts +0 -30
- package/dist/stories/styles.js +0 -33
|
@@ -0,0 +1,94 @@
|
|
|
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.PositiveIntegerInput = void 0;
|
|
8
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
+
var S = _interopRequireWildcard(require("./styles"));
|
|
10
|
+
var _useFocusField = require("../../../hooks/useFocusField");
|
|
11
|
+
var _InputLabel = require("../InputLabel");
|
|
12
|
+
var _PureInput = require("../PureInput");
|
|
13
|
+
var _Arrow = require("../../common/Arrow");
|
|
14
|
+
var _useFilters = require("./hooks/useFilters");
|
|
15
|
+
var _useNormalizers2 = require("./hooks/useNormalizers");
|
|
16
|
+
var _useIncrement2 = require("./hooks/useIncrement");
|
|
17
|
+
var _useIncrementDisabledFlags = require("./hooks/useIncrementDisabledFlags");
|
|
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 && Object.prototype.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
|
+
var PositiveIntegerInput = exports.PositiveIntegerInput = function PositiveIntegerInput(_ref) {
|
|
21
|
+
var value = _ref.value,
|
|
22
|
+
onChange = _ref.onChange,
|
|
23
|
+
_ref$max = _ref.max,
|
|
24
|
+
max = _ref$max === void 0 ? Infinity : _ref$max,
|
|
25
|
+
_ref$upAndDown = _ref.upAndDown,
|
|
26
|
+
upAndDown = _ref$upAndDown === void 0 ? false : _ref$upAndDown,
|
|
27
|
+
label = _ref.label,
|
|
28
|
+
placeholder = _ref.placeholder,
|
|
29
|
+
hasError = _ref.hasError,
|
|
30
|
+
onFocus = _ref.onFocus,
|
|
31
|
+
onBlur = _ref.onBlur,
|
|
32
|
+
name = _ref.name;
|
|
33
|
+
var _useInputFocus = (0, _useFocusField.useInputFocus)({
|
|
34
|
+
onFocus: onFocus,
|
|
35
|
+
onBlur: onBlur
|
|
36
|
+
}),
|
|
37
|
+
inFocus = _useInputFocus.inFocus,
|
|
38
|
+
handleFocus = _useInputFocus.handleFocus,
|
|
39
|
+
handleBlur = _useInputFocus.handleBlur;
|
|
40
|
+
var filters = (0, _useFilters.useFilters)({
|
|
41
|
+
max: max
|
|
42
|
+
});
|
|
43
|
+
var _useNormalizers = (0, _useNormalizers2.useNormalizers)(),
|
|
44
|
+
normalizeFrom = _useNormalizers.normalizeFrom,
|
|
45
|
+
normalizeTo = _useNormalizers.normalizeTo;
|
|
46
|
+
var _useIncrement = (0, _useIncrement2.useIncrement)(),
|
|
47
|
+
increment = _useIncrement.increment,
|
|
48
|
+
decrement = _useIncrement.decrement;
|
|
49
|
+
var _useIncrementDisabled = (0, _useIncrementDisabledFlags.useIncrementDisabledFlags)({
|
|
50
|
+
max: max,
|
|
51
|
+
value: value
|
|
52
|
+
}),
|
|
53
|
+
isDecrementDisabled = _useIncrementDisabled.isDecrementDisabled,
|
|
54
|
+
isIncrementDisabled = _useIncrementDisabled.isIncrementDisabled;
|
|
55
|
+
var handleChange = (0, _react.useCallback)(function (event) {
|
|
56
|
+
var newValue = event.target.value;
|
|
57
|
+
var filtredValue = filters.reduce(function (acc, fn) {
|
|
58
|
+
return fn(acc);
|
|
59
|
+
}, newValue);
|
|
60
|
+
onChange(normalizeTo(filtredValue));
|
|
61
|
+
}, [normalizeTo, onChange, filters]);
|
|
62
|
+
var handleUp = (0, _react.useCallback)(function () {
|
|
63
|
+
onChange(increment(value));
|
|
64
|
+
}, [increment, value, onChange]);
|
|
65
|
+
var handleDown = (0, _react.useCallback)(function () {
|
|
66
|
+
onChange(decrement(value));
|
|
67
|
+
}, [decrement, value, onChange]);
|
|
68
|
+
return /*#__PURE__*/_react["default"].createElement(_InputLabel.InputLabel, {
|
|
69
|
+
inFocus: inFocus,
|
|
70
|
+
label: label
|
|
71
|
+
}, /*#__PURE__*/_react["default"].createElement(_PureInput.PureInput, {
|
|
72
|
+
name: name,
|
|
73
|
+
hasError: hasError,
|
|
74
|
+
inFocus: inFocus,
|
|
75
|
+
placeholder: placeholder,
|
|
76
|
+
onFocus: handleFocus,
|
|
77
|
+
onBlur: handleBlur,
|
|
78
|
+
value: normalizeFrom(value),
|
|
79
|
+
onChange: handleChange,
|
|
80
|
+
paddingRight: upAndDown ? 44 : undefined
|
|
81
|
+
}), upAndDown && /*#__PURE__*/_react["default"].createElement(S.Arrows, null, /*#__PURE__*/_react["default"].createElement(S.Arrow, {
|
|
82
|
+
onClick: handleUp,
|
|
83
|
+
$disabled: isIncrementDisabled
|
|
84
|
+
}, /*#__PURE__*/_react["default"].createElement(_Arrow.Arrow, {
|
|
85
|
+
isOpen: true,
|
|
86
|
+
outterSize: 12
|
|
87
|
+
})), /*#__PURE__*/_react["default"].createElement(S.Arrow, {
|
|
88
|
+
onClick: handleDown,
|
|
89
|
+
$disabled: isDecrementDisabled
|
|
90
|
+
}, /*#__PURE__*/_react["default"].createElement(_Arrow.Arrow, {
|
|
91
|
+
isOpen: false,
|
|
92
|
+
outterSize: 12
|
|
93
|
+
}))));
|
|
94
|
+
};
|
|
@@ -0,0 +1,49 @@
|
|
|
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 _addonActions = require("@storybook/addon-actions");
|
|
10
|
+
var _ = require(".");
|
|
11
|
+
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); }
|
|
12
|
+
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 && Object.prototype.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; }
|
|
13
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
14
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
15
|
+
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."); }
|
|
16
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
17
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
18
|
+
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; } }
|
|
19
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
20
|
+
var meta = {
|
|
21
|
+
title: 'form/PositiveIntegerInput',
|
|
22
|
+
component: _.PositiveIntegerInput,
|
|
23
|
+
tags: ['autodocs']
|
|
24
|
+
};
|
|
25
|
+
var _default = exports["default"] = meta;
|
|
26
|
+
var Component = function Component(props) {
|
|
27
|
+
var _useState = (0, _react.useState)(null),
|
|
28
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
29
|
+
value = _useState2[0],
|
|
30
|
+
setValue = _useState2[1];
|
|
31
|
+
var handleChange = (0, _react.useCallback)(function (newValue) {
|
|
32
|
+
setValue(newValue);
|
|
33
|
+
(0, _addonActions.action)('onChange')(newValue);
|
|
34
|
+
}, []);
|
|
35
|
+
return /*#__PURE__*/_react["default"].createElement(_.PositiveIntegerInput, _extends({}, props, {
|
|
36
|
+
value: value,
|
|
37
|
+
onChange: handleChange
|
|
38
|
+
}));
|
|
39
|
+
};
|
|
40
|
+
var Default = exports.Default = {
|
|
41
|
+
args: {
|
|
42
|
+
max: 1000,
|
|
43
|
+
upAndDown: true,
|
|
44
|
+
label: 'Label',
|
|
45
|
+
placeholder: 'Placeholder',
|
|
46
|
+
hasError: false
|
|
47
|
+
},
|
|
48
|
+
render: Component
|
|
49
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const Arrows: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
|
|
3
|
+
export declare const Arrow: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
4
|
+
$disabled: boolean;
|
|
5
|
+
}>>;
|
|
@@ -0,0 +1,21 @@
|
|
|
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.Arrows = exports.Arrow = void 0;
|
|
8
|
+
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
9
|
+
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); }
|
|
10
|
+
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 && Object.prototype.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; }
|
|
11
|
+
var Arrows = exports.Arrows = _styledComponents["default"].div.withConfig({
|
|
12
|
+
displayName: "styles__Arrows",
|
|
13
|
+
componentId: "sc-ctutr8-0"
|
|
14
|
+
})(["display:flex;flex-direction:column;position:absolute;height:100%;justify-content:center;top:0;right:18px;"]);
|
|
15
|
+
var Arrow = exports.Arrow = _styledComponents["default"].div.withConfig({
|
|
16
|
+
displayName: "styles__Arrow",
|
|
17
|
+
componentId: "sc-ctutr8-1"
|
|
18
|
+
})(["cursor:pointer;display:flex;user-select:none;", ""], function (_ref) {
|
|
19
|
+
var $disabled = _ref.$disabled;
|
|
20
|
+
return $disabled && (0, _styledComponents.css)(["opacity:0.4;pointer-events:none;"]);
|
|
21
|
+
});
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { FC, InputHTMLAttributes } from 'react';
|
|
2
|
+
import { TPureInputPalette } from './palette';
|
|
3
|
+
export type TProps = InputHTMLAttributes<HTMLInputElement> & {
|
|
4
|
+
paddingLeft?: number;
|
|
5
|
+
paddingRight?: number;
|
|
6
|
+
hasError?: boolean;
|
|
7
|
+
inFocus?: boolean;
|
|
8
|
+
hasBorder?: boolean;
|
|
9
|
+
className?: never;
|
|
10
|
+
palette?: Partial<TPureInputPalette>;
|
|
11
|
+
};
|
|
12
|
+
export declare const PureInput: FC<TProps>;
|
|
@@ -0,0 +1,43 @@
|
|
|
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.PureInput = void 0;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var S = _interopRequireWildcard(require("./styles"));
|
|
10
|
+
var _palette = require("../../../palette");
|
|
11
|
+
var _excluded = ["paddingLeft", "paddingRight", "hasError", "inFocus", "hasBorder", "className", "palette"];
|
|
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
|
+
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 && Object.prototype.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
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
15
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
16
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
17
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
18
|
+
var PureInput = exports.PureInput = function PureInput(_ref) {
|
|
19
|
+
var _ref$paddingLeft = _ref.paddingLeft,
|
|
20
|
+
paddingLeft = _ref$paddingLeft === void 0 ? 18 : _ref$paddingLeft,
|
|
21
|
+
_ref$paddingRight = _ref.paddingRight,
|
|
22
|
+
paddingRight = _ref$paddingRight === void 0 ? 18 : _ref$paddingRight,
|
|
23
|
+
_ref$hasError = _ref.hasError,
|
|
24
|
+
hasError = _ref$hasError === void 0 ? false : _ref$hasError,
|
|
25
|
+
_ref$inFocus = _ref.inFocus,
|
|
26
|
+
inFocus = _ref$inFocus === void 0 ? false : _ref$inFocus,
|
|
27
|
+
_ref$hasBorder = _ref.hasBorder,
|
|
28
|
+
hasBorder = _ref$hasBorder === void 0 ? true : _ref$hasBorder,
|
|
29
|
+
className = _ref.className,
|
|
30
|
+
palette = _ref.palette,
|
|
31
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
32
|
+
var mergedPalette = (0, _palette.useComponentPalette)('pureInput', palette);
|
|
33
|
+
return /*#__PURE__*/_react["default"].createElement(S.Wrapper, _extends({
|
|
34
|
+
variant: "bodyMRegular",
|
|
35
|
+
element: "input",
|
|
36
|
+
$paddingLeft: paddingLeft,
|
|
37
|
+
$paddingRight: paddingRight,
|
|
38
|
+
$hasError: hasError,
|
|
39
|
+
$inFocus: inFocus,
|
|
40
|
+
$hasBorder: hasBorder,
|
|
41
|
+
$palette: mergedPalette
|
|
42
|
+
}, rest));
|
|
43
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
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: 'form/PureInput',
|
|
10
|
+
component: _.PureInput,
|
|
11
|
+
tags: ['autodocs']
|
|
12
|
+
};
|
|
13
|
+
var _default = exports["default"] = meta;
|
|
14
|
+
var Default = exports.Default = {
|
|
15
|
+
args: {
|
|
16
|
+
paddingLeft: 18,
|
|
17
|
+
paddingRight: 18,
|
|
18
|
+
hasError: false,
|
|
19
|
+
inFocus: false,
|
|
20
|
+
hasBorder: true,
|
|
21
|
+
placeholder: 'Введите текст'
|
|
22
|
+
}
|
|
23
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { TAbstractPalette } from '../../../palette';
|
|
2
|
+
export type TPureInputPalette = {
|
|
3
|
+
text: string;
|
|
4
|
+
bg: string;
|
|
5
|
+
error: string;
|
|
6
|
+
border: string;
|
|
7
|
+
borderFocus: string;
|
|
8
|
+
placeholder: string;
|
|
9
|
+
};
|
|
10
|
+
export declare const generatePureInputPalette: (abstractPalette: TAbstractPalette) => TPureInputPalette;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.generatePureInputPalette = void 0;
|
|
7
|
+
var _hexToRgba = _interopRequireDefault(require("hex-to-rgba"));
|
|
8
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
9
|
+
var generatePureInputPalette = exports.generatePureInputPalette = function generatePureInputPalette(abstractPalette) {
|
|
10
|
+
return {
|
|
11
|
+
text: abstractPalette.primary,
|
|
12
|
+
bg: abstractPalette.base,
|
|
13
|
+
error: abstractPalette.error,
|
|
14
|
+
border: (0, _hexToRgba["default"])(abstractPalette.neutralBrutal, 0.3),
|
|
15
|
+
borderFocus: abstractPalette.primary,
|
|
16
|
+
placeholder: (0, _hexToRgba["default"])(abstractPalette.primary, 0.3)
|
|
17
|
+
};
|
|
18
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { TPureInputPalette } from './palette';
|
|
3
|
+
export declare const Wrapper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("../../common/Typography").TProps, {
|
|
4
|
+
$paddingLeft: number;
|
|
5
|
+
$paddingRight: number;
|
|
6
|
+
$hasError: boolean;
|
|
7
|
+
$inFocus: boolean;
|
|
8
|
+
$hasBorder: boolean;
|
|
9
|
+
$palette: TPureInputPalette;
|
|
10
|
+
}>> & Omit<import("react").FC<import("../../common/Typography").TProps>, keyof import("react").Component<any, {}, any>>;
|
|
@@ -0,0 +1,34 @@
|
|
|
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
|
+
var _Typography = require("../../common/Typography");
|
|
9
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
10
|
+
var Wrapper = exports.Wrapper = (0, _styledComponents["default"])(_Typography.Typography).withConfig({
|
|
11
|
+
displayName: "styles__Wrapper",
|
|
12
|
+
componentId: "sc-1g8ijo6-0"
|
|
13
|
+
})(["color:", ";border-radius:10px;outline:none;padding:12px 18px;width:100%;background-color:", ";transition:all 0.2s ease-in-out 0s;box-sizing:border-box;padding-right:", "px;padding-left:", "px;border: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) {
|
|
14
|
+
var $palette = _ref.$palette;
|
|
15
|
+
return $palette.text;
|
|
16
|
+
}, function (_ref2) {
|
|
17
|
+
var $palette = _ref2.$palette;
|
|
18
|
+
return $palette.bg;
|
|
19
|
+
}, function (_ref3) {
|
|
20
|
+
var $paddingRight = _ref3.$paddingRight;
|
|
21
|
+
return $paddingRight;
|
|
22
|
+
}, function (_ref4) {
|
|
23
|
+
var $paddingLeft = _ref4.$paddingLeft;
|
|
24
|
+
return $paddingLeft;
|
|
25
|
+
}, function (_ref5) {
|
|
26
|
+
var $hasError = _ref5.$hasError,
|
|
27
|
+
$inFocus = _ref5.$inFocus,
|
|
28
|
+
$hasBorder = _ref5.$hasBorder,
|
|
29
|
+
$palette = _ref5.$palette;
|
|
30
|
+
return !$hasBorder ? 'transparent' : $hasError ? $palette.error : $inFocus ? $palette.borderFocus : $palette.border;
|
|
31
|
+
}, function (_ref6) {
|
|
32
|
+
var $palette = _ref6.$palette;
|
|
33
|
+
return $palette.placeholder;
|
|
34
|
+
});
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
type TProps<TEvent> = {
|
|
2
|
+
initialFocusFlag?: boolean;
|
|
3
|
+
onFocus?: (e: TEvent) => void;
|
|
4
|
+
onBlur?: (e: TEvent) => void;
|
|
5
|
+
};
|
|
6
|
+
export declare const useInputFocus: <TEvent>({ initialFocusFlag, onFocus, onBlur }?: TProps<TEvent>) => {
|
|
7
|
+
inFocus: boolean;
|
|
8
|
+
handleFocus: (event: TEvent) => void;
|
|
9
|
+
handleBlur: (event: TEvent) => void;
|
|
10
|
+
};
|
|
11
|
+
export {};
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useInputFocus = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
9
|
+
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."); }
|
|
10
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
11
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
12
|
+
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; } }
|
|
13
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
14
|
+
var useInputFocus = exports.useInputFocus = function useInputFocus() {
|
|
15
|
+
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
16
|
+
_ref$initialFocusFlag = _ref.initialFocusFlag,
|
|
17
|
+
initialFocusFlag = _ref$initialFocusFlag === void 0 ? false : _ref$initialFocusFlag,
|
|
18
|
+
onFocus = _ref.onFocus,
|
|
19
|
+
onBlur = _ref.onBlur;
|
|
20
|
+
var _useState = (0, _react.useState)(initialFocusFlag),
|
|
21
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
22
|
+
inFocus = _useState2[0],
|
|
23
|
+
setInFocus = _useState2[1];
|
|
24
|
+
var handleFocus = function handleFocus(event) {
|
|
25
|
+
setInFocus(true);
|
|
26
|
+
if (onFocus) onFocus(event);
|
|
27
|
+
};
|
|
28
|
+
var handleBlur = function handleBlur(event) {
|
|
29
|
+
setInFocus(false);
|
|
30
|
+
if (onBlur) onBlur(event);
|
|
31
|
+
};
|
|
32
|
+
return {
|
|
33
|
+
inFocus: inFocus,
|
|
34
|
+
handleFocus: handleFocus,
|
|
35
|
+
handleBlur: handleBlur
|
|
36
|
+
};
|
|
37
|
+
};
|
package/dist/index.d.ts
CHANGED
|
@@ -1 +1,14 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { Skeleton } from './components/common/Skeleton';
|
|
2
|
+
export { InvoiceboxLoader } from './components/common/InvoiceboxLoader';
|
|
3
|
+
export { Typography, TypographyGlobalStyle } from './components/common/Typography';
|
|
4
|
+
export { InvoiceboxSpinner } from './components/common/InvoiceboxSpinner';
|
|
5
|
+
export { SecondaryButton } from './components/common/SecondaryButton';
|
|
6
|
+
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 { Dropdown } from './components/common/Dropdown';
|
|
12
|
+
export type { TProps as TDropdownProps } from './components/common/Dropdown';
|
|
13
|
+
export { Scrollbar } from './components/common/Scrollbar';
|
|
14
|
+
export { PaletteProvider } from './palette';
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,95 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
|
-
exports
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "Arrow", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _Arrow.Arrow;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "Dropdown", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function get() {
|
|
15
|
+
return _Dropdown.Dropdown;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
Object.defineProperty(exports, "InputLabel", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function get() {
|
|
21
|
+
return _InputLabel.InputLabel;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
Object.defineProperty(exports, "InvoiceboxLoader", {
|
|
25
|
+
enumerable: true,
|
|
26
|
+
get: function get() {
|
|
27
|
+
return _InvoiceboxLoader.InvoiceboxLoader;
|
|
28
|
+
}
|
|
29
|
+
});
|
|
30
|
+
Object.defineProperty(exports, "InvoiceboxSpinner", {
|
|
31
|
+
enumerable: true,
|
|
32
|
+
get: function get() {
|
|
33
|
+
return _InvoiceboxSpinner.InvoiceboxSpinner;
|
|
34
|
+
}
|
|
35
|
+
});
|
|
36
|
+
Object.defineProperty(exports, "PaletteProvider", {
|
|
37
|
+
enumerable: true,
|
|
38
|
+
get: function get() {
|
|
39
|
+
return _palette.PaletteProvider;
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
Object.defineProperty(exports, "PositiveIntegerInput", {
|
|
43
|
+
enumerable: true,
|
|
44
|
+
get: function get() {
|
|
45
|
+
return _PositiveIntegerInput.PositiveIntegerInput;
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
Object.defineProperty(exports, "PureInput", {
|
|
49
|
+
enumerable: true,
|
|
50
|
+
get: function get() {
|
|
51
|
+
return _PureInput.PureInput;
|
|
52
|
+
}
|
|
53
|
+
});
|
|
54
|
+
Object.defineProperty(exports, "Scrollbar", {
|
|
55
|
+
enumerable: true,
|
|
56
|
+
get: function get() {
|
|
57
|
+
return _Scrollbar.Scrollbar;
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
Object.defineProperty(exports, "SecondaryButton", {
|
|
61
|
+
enumerable: true,
|
|
62
|
+
get: function get() {
|
|
63
|
+
return _SecondaryButton.SecondaryButton;
|
|
64
|
+
}
|
|
65
|
+
});
|
|
66
|
+
Object.defineProperty(exports, "Skeleton", {
|
|
67
|
+
enumerable: true,
|
|
68
|
+
get: function get() {
|
|
69
|
+
return _Skeleton.Skeleton;
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
Object.defineProperty(exports, "Typography", {
|
|
73
|
+
enumerable: true,
|
|
74
|
+
get: function get() {
|
|
75
|
+
return _Typography.Typography;
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
Object.defineProperty(exports, "TypographyGlobalStyle", {
|
|
79
|
+
enumerable: true,
|
|
80
|
+
get: function get() {
|
|
81
|
+
return _Typography.TypographyGlobalStyle;
|
|
82
|
+
}
|
|
83
|
+
});
|
|
84
|
+
var _Skeleton = require("./components/common/Skeleton");
|
|
85
|
+
var _InvoiceboxLoader = require("./components/common/InvoiceboxLoader");
|
|
86
|
+
var _Typography = require("./components/common/Typography");
|
|
87
|
+
var _InvoiceboxSpinner = require("./components/common/InvoiceboxSpinner");
|
|
88
|
+
var _SecondaryButton = require("./components/common/SecondaryButton");
|
|
89
|
+
var _Arrow = require("./components/common/Arrow");
|
|
90
|
+
var _InputLabel = require("./components/form/InputLabel");
|
|
91
|
+
var _PureInput = require("./components/form/PureInput");
|
|
92
|
+
var _PositiveIntegerInput = require("./components/form/PositiveIntegerInput");
|
|
93
|
+
var _Dropdown = require("./components/common/Dropdown");
|
|
94
|
+
var _Scrollbar = require("./components/common/Scrollbar");
|
|
95
|
+
var _palette = require("./palette");
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = exports.Docs = void 0;
|
|
7
|
+
var _constants = require("./constants");
|
|
8
|
+
var _Typography = require("../components/common/Typography");
|
|
9
|
+
var meta = {
|
|
10
|
+
title: 'palette/Colors'
|
|
11
|
+
};
|
|
12
|
+
var _default = exports["default"] = meta;
|
|
13
|
+
var Docs = exports.Docs = {
|
|
14
|
+
render: function render() {
|
|
15
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
16
|
+
style: {
|
|
17
|
+
display: 'flex',
|
|
18
|
+
flexDirection: 'column',
|
|
19
|
+
gap: 30
|
|
20
|
+
}
|
|
21
|
+
}, Object.keys(_constants.defaultAbstractPalette).map(function (key) {
|
|
22
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
23
|
+
style: {
|
|
24
|
+
display: 'flex',
|
|
25
|
+
alignItems: 'center',
|
|
26
|
+
gap: 20
|
|
27
|
+
}
|
|
28
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
29
|
+
style: {
|
|
30
|
+
backgroundColor: _constants.defaultAbstractPalette[key],
|
|
31
|
+
width: 40,
|
|
32
|
+
height: 40,
|
|
33
|
+
borderRadius: '50%'
|
|
34
|
+
}
|
|
35
|
+
}), /*#__PURE__*/React.createElement(_Typography.Typography, {
|
|
36
|
+
variant: "bodyL"
|
|
37
|
+
}, key, " ", _constants.defaultAbstractPalette[key]));
|
|
38
|
+
}));
|
|
39
|
+
}
|
|
40
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.defaultAbstractPalette = void 0;
|
|
7
|
+
var defaultAbstractPalette = exports.defaultAbstractPalette = {
|
|
8
|
+
primary: '#353F47',
|
|
9
|
+
secondary: '#FAD247',
|
|
10
|
+
base: '#FFFFFF',
|
|
11
|
+
error: '#EB5757',
|
|
12
|
+
neutralLight: '#f9f9f9',
|
|
13
|
+
neutralUsual: '#f1f2f6',
|
|
14
|
+
neutralHeavy: '#ececf0',
|
|
15
|
+
neutralMassive: '#dee0e7',
|
|
16
|
+
neutralFoggy: '#ccc',
|
|
17
|
+
neutralBrutal: '#999'
|
|
18
|
+
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { TSkeletonPalette } from '../components/common/Skeleton/palette';
|
|
3
|
+
import { TInvoiceboxSpinnerPalette } from '../components/common/InvoiceboxSpinner/palette';
|
|
4
|
+
import { TSecondaryButtonPalette } from '../components/common/SecondaryButton/palette';
|
|
5
|
+
import { TArrowPalette } from '../components/common/Arrow/palette';
|
|
6
|
+
import { TInputLabelPalette } from '../components/form/InputLabel/palette';
|
|
7
|
+
import { TPureInputPalette } from '../components/form/PureInput/palette';
|
|
8
|
+
import { TDropdownPalette } from '../components/common/Dropdown/palette';
|
|
9
|
+
import { TScrollbarPalette } from '../components/common/Scrollbar/palette';
|
|
10
|
+
type TContext = {
|
|
11
|
+
skeleton: TSkeletonPalette;
|
|
12
|
+
invoiceboxSpinner: TInvoiceboxSpinnerPalette;
|
|
13
|
+
secondaryButton: TSecondaryButtonPalette;
|
|
14
|
+
arrow: TArrowPalette;
|
|
15
|
+
inputLabel: TInputLabelPalette;
|
|
16
|
+
pureInput: TPureInputPalette;
|
|
17
|
+
dropdown: TDropdownPalette;
|
|
18
|
+
scrollbar: TScrollbarPalette;
|
|
19
|
+
};
|
|
20
|
+
export declare const PaletteContext: import("react").Context<TContext>;
|
|
21
|
+
export {};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.PaletteContext = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _constants = require("./constants");
|
|
9
|
+
var _palette = require("../components/common/Skeleton/palette");
|
|
10
|
+
var _palette2 = require("../components/common/InvoiceboxSpinner/palette");
|
|
11
|
+
var _palette3 = require("../components/common/SecondaryButton/palette");
|
|
12
|
+
var _palette4 = require("../components/common/Arrow/palette");
|
|
13
|
+
var _palette5 = require("../components/form/InputLabel/palette");
|
|
14
|
+
var _palette6 = require("../components/form/PureInput/palette");
|
|
15
|
+
var _palette7 = require("../components/common/Dropdown/palette");
|
|
16
|
+
var _palette8 = require("../components/common/Scrollbar/palette");
|
|
17
|
+
var PaletteContext = exports.PaletteContext = /*#__PURE__*/(0, _react.createContext)({
|
|
18
|
+
skeleton: (0, _palette.generateSkeletonPalette)(_constants.defaultAbstractPalette),
|
|
19
|
+
invoiceboxSpinner: (0, _palette2.generateInvoiceboxSpinnerPalette)(_constants.defaultAbstractPalette),
|
|
20
|
+
secondaryButton: (0, _palette3.generateSecondaryButtonPalette)(_constants.defaultAbstractPalette),
|
|
21
|
+
arrow: (0, _palette4.generateArrowPalette)(_constants.defaultAbstractPalette),
|
|
22
|
+
inputLabel: (0, _palette5.generateInputLabelPalette)(_constants.defaultAbstractPalette),
|
|
23
|
+
pureInput: (0, _palette6.generatePureInputPalette)(_constants.defaultAbstractPalette),
|
|
24
|
+
dropdown: (0, _palette7.generateDropdownPalette)(_constants.defaultAbstractPalette),
|
|
25
|
+
scrollbar: (0, _palette8.generateScrollbarPalette)(_constants.defaultAbstractPalette)
|
|
26
|
+
});
|