@xqmsg/ui-core 0.17.0 → 0.17.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ui-core.cjs.development.js +59 -60
- package/dist/ui-core.cjs.development.js.map +1 -1
- package/dist/ui-core.cjs.production.min.js +1 -1
- package/dist/ui-core.cjs.production.min.js.map +1 -1
- package/dist/ui-core.esm.js +59 -60
- package/dist/ui-core.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/icons/close/index.tsx +8 -1
- package/src/components/input/StackedPilledInput/index.tsx +5 -4
- package/src/components/input/components/token/Token.stories.tsx +5 -2
- package/src/components/input/components/token/index.tsx +1 -1
- package/src/components/navigation/components/header/index.tsx +1 -0
- package/src/components/navigation/components/items/index.tsx +1 -1
|
@@ -9,9 +9,7 @@ var React__default = _interopDefault(React);
|
|
|
9
9
|
var react = require('@chakra-ui/react');
|
|
10
10
|
var reactHookForm = require('react-hook-form');
|
|
11
11
|
var lodash = require('lodash');
|
|
12
|
-
var close = require('src/components/icons/close');
|
|
13
12
|
var icons = require('@chakra-ui/icons');
|
|
14
|
-
var colors$1 = _interopDefault(require('src/theme/foundations/colors'));
|
|
15
13
|
var hi = require('react-icons/hi');
|
|
16
14
|
var provider = require('@chakra-ui/provider');
|
|
17
15
|
var themeTools = require('@chakra-ui/theme-tools');
|
|
@@ -1079,6 +1077,40 @@ var StackedTextarea = /*#__PURE__*/React__default.forwardRef(function (_ref2, _r
|
|
|
1079
1077
|
}));
|
|
1080
1078
|
});
|
|
1081
1079
|
|
|
1080
|
+
var _path$7;
|
|
1081
|
+
function _extends$8() { _extends$8 = 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$8.apply(this, arguments); }
|
|
1082
|
+
var SvgClose = function SvgClose(props, ref) {
|
|
1083
|
+
return /*#__PURE__*/React.createElement("svg", _extends$8({
|
|
1084
|
+
viewBox: "0 0 56 56",
|
|
1085
|
+
fill: "none",
|
|
1086
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1087
|
+
ref: ref
|
|
1088
|
+
}, props), _path$7 || (_path$7 = /*#__PURE__*/React.createElement("path", {
|
|
1089
|
+
fillRule: "evenodd",
|
|
1090
|
+
clipRule: "evenodd",
|
|
1091
|
+
d: "M28 56c15.464 0 28-12.536 28-28S43.463 0 28 0 0 12.536 0 28s12.536 28 28 28Zm-6.02-37.731a2.625 2.625 0 0 0-3.712 3.712L24.288 28l-6.02 6.019a2.625 2.625 0 1 0 3.713 3.712l6.018-6.019 6.02 6.02a2.625 2.625 0 0 0 3.712-3.713L31.71 28l6.02-6.019a2.625 2.625 0 0 0-3.713-3.712L28 24.288l-6.02-6.02Z",
|
|
1092
|
+
fill: "#3C3C43",
|
|
1093
|
+
fillOpacity: 0.6
|
|
1094
|
+
})));
|
|
1095
|
+
};
|
|
1096
|
+
var ForwardRef$7 = /*#__PURE__*/React.forwardRef(SvgClose);
|
|
1097
|
+
var Memo$7 = /*#__PURE__*/React.memo(ForwardRef$7);
|
|
1098
|
+
|
|
1099
|
+
/**
|
|
1100
|
+
* A functional React component utilized to render the `Close` icon component
|
|
1101
|
+
*/
|
|
1102
|
+
|
|
1103
|
+
var Close = function Close(_ref) {
|
|
1104
|
+
var boxSize = _ref.boxSize,
|
|
1105
|
+
onClick = _ref.onClick;
|
|
1106
|
+
return /*#__PURE__*/React__default.createElement(Memo$7, {
|
|
1107
|
+
width: boxSize,
|
|
1108
|
+
height: boxSize,
|
|
1109
|
+
onClick: onClick,
|
|
1110
|
+
cursor: "pointer"
|
|
1111
|
+
});
|
|
1112
|
+
};
|
|
1113
|
+
|
|
1082
1114
|
var Token = function Token(_ref) {
|
|
1083
1115
|
var label = _ref.label,
|
|
1084
1116
|
onDelete = _ref.onDelete;
|
|
@@ -1102,7 +1134,7 @@ var Token = function Token(_ref) {
|
|
|
1102
1134
|
}, lodash.truncate(label.trim(), {
|
|
1103
1135
|
length: 15,
|
|
1104
1136
|
omission: '...'
|
|
1105
|
-
})), /*#__PURE__*/React__default.createElement(
|
|
1137
|
+
})), /*#__PURE__*/React__default.createElement(Close, {
|
|
1106
1138
|
boxSize: "11px",
|
|
1107
1139
|
onClick: onDelete
|
|
1108
1140
|
}));
|
|
@@ -1482,7 +1514,7 @@ var StackedPilledInput = /*#__PURE__*/React__default.forwardRef(function (_ref2,
|
|
|
1482
1514
|
}, [latestTokenElement, watchedValue]);
|
|
1483
1515
|
|
|
1484
1516
|
var onHandleKeyDown = function onHandleKeyDown(e) {
|
|
1485
|
-
if (e.key === ' ' || e.key === 'Enter' || e.key === ',' || e.key === 'Tab') {
|
|
1517
|
+
if ((e.key === ' ' || e.key === 'Enter' || e.key === ',' || e.key === 'Tab') && localValue.trim().length) {
|
|
1486
1518
|
if (e.key === 'Enter' && !localValue.trim().length && tokenIndex !== null) {
|
|
1487
1519
|
setLocalValue(lastestFormValueToArray[tokenIndex]);
|
|
1488
1520
|
|
|
@@ -1984,25 +2016,25 @@ function FormSection(_ref) {
|
|
|
1984
2016
|
}));
|
|
1985
2017
|
}
|
|
1986
2018
|
|
|
1987
|
-
var _path$
|
|
1988
|
-
function _extends$
|
|
2019
|
+
var _path$8;
|
|
2020
|
+
function _extends$9() { _extends$9 = 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$9.apply(this, arguments); }
|
|
1989
2021
|
var SvgChevronDown = function SvgChevronDown(props, ref) {
|
|
1990
|
-
return /*#__PURE__*/React.createElement("svg", _extends$
|
|
2022
|
+
return /*#__PURE__*/React.createElement("svg", _extends$9({
|
|
1991
2023
|
width: 8,
|
|
1992
2024
|
height: 6,
|
|
1993
2025
|
viewBox: "0 0 8 6",
|
|
1994
2026
|
fill: "none",
|
|
1995
2027
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1996
2028
|
ref: ref
|
|
1997
|
-
}, props), _path$
|
|
2029
|
+
}, props), _path$8 || (_path$8 = /*#__PURE__*/React.createElement("path", {
|
|
1998
2030
|
fillRule: "evenodd",
|
|
1999
2031
|
clipRule: "evenodd",
|
|
2000
2032
|
d: "M.184.768a.6.6 0 0 1 .849.016L4 3.934 6.968.784a.6.6 0 0 1 .864.832l-3.4 3.6a.6.6 0 0 1-.865 0l-3.4-3.6A.6.6 0 0 1 .185.768Z",
|
|
2001
2033
|
fill: "#fff"
|
|
2002
2034
|
})));
|
|
2003
2035
|
};
|
|
2004
|
-
var ForwardRef$
|
|
2005
|
-
var Memo$
|
|
2036
|
+
var ForwardRef$8 = /*#__PURE__*/React.forwardRef(SvgChevronDown);
|
|
2037
|
+
var Memo$8 = /*#__PURE__*/React.memo(ForwardRef$8);
|
|
2006
2038
|
|
|
2007
2039
|
/**
|
|
2008
2040
|
* A functional React component utilized to render the `ChevronDown` icon component
|
|
@@ -2010,31 +2042,31 @@ var Memo$7 = /*#__PURE__*/React.memo(ForwardRef$7);
|
|
|
2010
2042
|
|
|
2011
2043
|
var ChevronDown = function ChevronDown(_ref) {
|
|
2012
2044
|
var boxSize = _ref.boxSize;
|
|
2013
|
-
return /*#__PURE__*/React__default.createElement(Memo$
|
|
2045
|
+
return /*#__PURE__*/React__default.createElement(Memo$8, {
|
|
2014
2046
|
boxSize: boxSize,
|
|
2015
2047
|
fill: colors.fill.action
|
|
2016
2048
|
});
|
|
2017
2049
|
};
|
|
2018
2050
|
|
|
2019
|
-
var _path$
|
|
2020
|
-
function _extends$
|
|
2051
|
+
var _path$9;
|
|
2052
|
+
function _extends$a() { _extends$a = 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$a.apply(this, arguments); }
|
|
2021
2053
|
var SvgChevronRight = function SvgChevronRight(props, ref) {
|
|
2022
|
-
return /*#__PURE__*/React.createElement("svg", _extends$
|
|
2054
|
+
return /*#__PURE__*/React.createElement("svg", _extends$a({
|
|
2023
2055
|
width: 6,
|
|
2024
2056
|
height: 8,
|
|
2025
2057
|
viewBox: "0 0 6 8",
|
|
2026
2058
|
fill: "none",
|
|
2027
2059
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2028
2060
|
ref: ref
|
|
2029
|
-
}, props), _path$
|
|
2061
|
+
}, props), _path$9 || (_path$9 = /*#__PURE__*/React.createElement("path", {
|
|
2030
2062
|
fillRule: "evenodd",
|
|
2031
2063
|
clipRule: "evenodd",
|
|
2032
2064
|
d: "M.768 7.816a.6.6 0 0 1 .016-.848L3.934 4 .784 1.032a.6.6 0 0 1 .832-.865l3.6 3.4a.6.6 0 0 1 0 .865l-3.6 3.4a.6.6 0 0 1-.848-.016Z",
|
|
2033
2065
|
fill: "#fff"
|
|
2034
2066
|
})));
|
|
2035
2067
|
};
|
|
2036
|
-
var ForwardRef$
|
|
2037
|
-
var Memo$
|
|
2068
|
+
var ForwardRef$9 = /*#__PURE__*/React.forwardRef(SvgChevronRight);
|
|
2069
|
+
var Memo$9 = /*#__PURE__*/React.memo(ForwardRef$9);
|
|
2038
2070
|
|
|
2039
2071
|
/**
|
|
2040
2072
|
* A functional React component utilized to render the `ChevronRight` icon component
|
|
@@ -2042,30 +2074,30 @@ var Memo$8 = /*#__PURE__*/React.memo(ForwardRef$8);
|
|
|
2042
2074
|
|
|
2043
2075
|
var ChevronRight = function ChevronRight(_ref) {
|
|
2044
2076
|
var boxSize = _ref.boxSize;
|
|
2045
|
-
return /*#__PURE__*/React__default.createElement(Memo$
|
|
2077
|
+
return /*#__PURE__*/React__default.createElement(Memo$9, {
|
|
2046
2078
|
boxSize: boxSize
|
|
2047
2079
|
});
|
|
2048
2080
|
};
|
|
2049
2081
|
|
|
2050
|
-
var _path$
|
|
2051
|
-
function _extends$
|
|
2082
|
+
var _path$a;
|
|
2083
|
+
function _extends$b() { _extends$b = 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$b.apply(this, arguments); }
|
|
2052
2084
|
var SvgClock = function SvgClock(props, ref) {
|
|
2053
|
-
return /*#__PURE__*/React.createElement("svg", _extends$
|
|
2085
|
+
return /*#__PURE__*/React.createElement("svg", _extends$b({
|
|
2054
2086
|
width: 14,
|
|
2055
2087
|
height: 14,
|
|
2056
2088
|
viewBox: "0 0 14 14",
|
|
2057
2089
|
fill: "none",
|
|
2058
2090
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2059
2091
|
ref: ref
|
|
2060
|
-
}, props), _path$
|
|
2092
|
+
}, props), _path$a || (_path$a = /*#__PURE__*/React.createElement("path", {
|
|
2061
2093
|
d: "M7 3v4h3m3 0A6 6 0 1 1 1 7a6 6 0 0 1 12 0Z",
|
|
2062
2094
|
stroke: "#0082ff",
|
|
2063
2095
|
strokeLinecap: "round",
|
|
2064
2096
|
strokeLinejoin: "round"
|
|
2065
2097
|
})));
|
|
2066
2098
|
};
|
|
2067
|
-
var ForwardRef$
|
|
2068
|
-
var Memo$
|
|
2099
|
+
var ForwardRef$a = /*#__PURE__*/React.forwardRef(SvgClock);
|
|
2100
|
+
var Memo$a = /*#__PURE__*/React.memo(ForwardRef$a);
|
|
2069
2101
|
|
|
2070
2102
|
/**
|
|
2071
2103
|
* A functional React component utilized to render the `Clock` icon component
|
|
@@ -2073,41 +2105,8 @@ var Memo$9 = /*#__PURE__*/React.memo(ForwardRef$9);
|
|
|
2073
2105
|
|
|
2074
2106
|
var Clock = function Clock(_ref) {
|
|
2075
2107
|
var boxSize = _ref.boxSize;
|
|
2076
|
-
return /*#__PURE__*/React__default.createElement(Memo$9, {
|
|
2077
|
-
boxSize: boxSize
|
|
2078
|
-
});
|
|
2079
|
-
};
|
|
2080
|
-
|
|
2081
|
-
var _path$a;
|
|
2082
|
-
function _extends$b() { _extends$b = 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$b.apply(this, arguments); }
|
|
2083
|
-
var SvgClose = function SvgClose(props, ref) {
|
|
2084
|
-
return /*#__PURE__*/React.createElement("svg", _extends$b({
|
|
2085
|
-
viewBox: "0 0 56 56",
|
|
2086
|
-
fill: "none",
|
|
2087
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
2088
|
-
ref: ref
|
|
2089
|
-
}, props), _path$a || (_path$a = /*#__PURE__*/React.createElement("path", {
|
|
2090
|
-
fillRule: "evenodd",
|
|
2091
|
-
clipRule: "evenodd",
|
|
2092
|
-
d: "M28 56c15.464 0 28-12.536 28-28S43.463 0 28 0 0 12.536 0 28s12.536 28 28 28Zm-6.02-37.731a2.625 2.625 0 0 0-3.712 3.712L24.288 28l-6.02 6.019a2.625 2.625 0 1 0 3.713 3.712l6.018-6.019 6.02 6.02a2.625 2.625 0 0 0 3.712-3.713L31.71 28l6.02-6.019a2.625 2.625 0 0 0-3.713-3.712L28 24.288l-6.02-6.02Z",
|
|
2093
|
-
fill: "#3C3C43",
|
|
2094
|
-
fillOpacity: 0.6
|
|
2095
|
-
})));
|
|
2096
|
-
};
|
|
2097
|
-
var ForwardRef$a = /*#__PURE__*/React.forwardRef(SvgClose);
|
|
2098
|
-
var Memo$a = /*#__PURE__*/React.memo(ForwardRef$a);
|
|
2099
|
-
|
|
2100
|
-
/**
|
|
2101
|
-
* A functional React component utilized to render the `Close` icon component
|
|
2102
|
-
*/
|
|
2103
|
-
|
|
2104
|
-
var Close = function Close(_ref) {
|
|
2105
|
-
var boxSize = _ref.boxSize,
|
|
2106
|
-
onClick = _ref.onClick;
|
|
2107
2108
|
return /*#__PURE__*/React__default.createElement(Memo$a, {
|
|
2108
|
-
boxSize: boxSize
|
|
2109
|
-
onClick: onClick,
|
|
2110
|
-
cursor: "pointer"
|
|
2109
|
+
boxSize: boxSize
|
|
2111
2110
|
});
|
|
2112
2111
|
};
|
|
2113
2112
|
|
|
@@ -2784,8 +2783,8 @@ var NavigationMenuItem = function NavigationMenuItem(_ref) {
|
|
|
2784
2783
|
px: "4px",
|
|
2785
2784
|
height: "26px",
|
|
2786
2785
|
width: "204px",
|
|
2787
|
-
color: colors
|
|
2788
|
-
bg: isSelected ? colors
|
|
2786
|
+
color: colors.label.primary,
|
|
2787
|
+
bg: isSelected ? colors.fill.light.tertiary : 'transparent',
|
|
2789
2788
|
borderRadius: "4px",
|
|
2790
2789
|
fontSize: "13px",
|
|
2791
2790
|
textDecoration: "none",
|