kiban-design-system 1.1.7-hotfix.0 → 1.1.8-hotfix.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/ActionList/ActionList.props.d.ts +4 -0
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/index.js +63 -59
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import react, { createElement, createContext, useState, useEffect, useContext,
|
|
1
|
+
import react, { createElement, isValidElement, createContext, useState, useEffect, useContext, Fragment as Fragment$1, useRef, useCallback, useMemo, Children, memo, cloneElement, useLayoutEffect, forwardRef } from 'react';
|
|
2
2
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
3
|
import { createPortal } from 'react-dom';
|
|
4
4
|
import _extends$2 from '@babel/runtime/helpers/esm/extends';
|
|
@@ -897,6 +897,63 @@ var Icons = /*#__PURE__*/Object.freeze({
|
|
|
897
897
|
*/
|
|
898
898
|
const Icon = ({ name }) => (jsx("svg", Object.assign({ width: '24', height: '24', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2', strokeLinecap: 'round', strokeLinejoin: 'round' }, { children: createElement(Icons[name]) }), void 0));
|
|
899
899
|
|
|
900
|
+
const isComponentTypeOf = (childComponent, parentComponent) => {
|
|
901
|
+
var _a;
|
|
902
|
+
if (childComponent === null ||
|
|
903
|
+
!isValidElement(childComponent) ||
|
|
904
|
+
typeof childComponent === 'string') {
|
|
905
|
+
return false;
|
|
906
|
+
}
|
|
907
|
+
const { type: childComponentType } = childComponent;
|
|
908
|
+
const Components = Array.isArray(parentComponent)
|
|
909
|
+
? parentComponent
|
|
910
|
+
: [parentComponent];
|
|
911
|
+
const type = ((_a = childComponent.props) === null || _a === void 0 ? void 0 : _a.__type__) || childComponentType;
|
|
912
|
+
return Components.some((Component) => typeof type !== 'string' && type === Component);
|
|
913
|
+
};
|
|
914
|
+
|
|
915
|
+
function formatFileSize(bytes) {
|
|
916
|
+
const units = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
|
|
917
|
+
let unitIndex = 0;
|
|
918
|
+
let size = bytes;
|
|
919
|
+
while (size >= 1024 && unitIndex < units.length - 1) {
|
|
920
|
+
size /= 1024;
|
|
921
|
+
unitIndex += 1;
|
|
922
|
+
}
|
|
923
|
+
return `${size.toFixed(2)} ${units[unitIndex]}`;
|
|
924
|
+
}
|
|
925
|
+
// eslint-disable-next-line
|
|
926
|
+
// code end
|
|
927
|
+
|
|
928
|
+
const cssClassName = (mainClass, ...classes) => {
|
|
929
|
+
const filteredClasses = classes
|
|
930
|
+
.filter(Boolean)
|
|
931
|
+
.map((clss) => `${mainClass}--${clss}`);
|
|
932
|
+
filteredClasses.unshift(mainClass);
|
|
933
|
+
return filteredClasses.join(' ');
|
|
934
|
+
};
|
|
935
|
+
|
|
936
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
937
|
+
const isValidIcon = (icon) => typeof icon === 'string' || typeof icon === 'function';
|
|
938
|
+
|
|
939
|
+
const themeClassConverter = (themeClass) => {
|
|
940
|
+
const classConverter = themeClass.charAt(0).toLocaleUpperCase() +
|
|
941
|
+
themeClass.slice(1).toLocaleLowerCase();
|
|
942
|
+
return classConverter;
|
|
943
|
+
};
|
|
944
|
+
|
|
945
|
+
function capitalize(str) {
|
|
946
|
+
return str.charAt(0).toUpperCase() + str.slice(1);
|
|
947
|
+
}
|
|
948
|
+
|
|
949
|
+
const SuccessIcon = () => (jsxs("svg", Object.assign({ width: '24', height: '24', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2' }, { children: [jsx("path", { d: 'M22 11.08V12a10 10 0 1 1-5.93-9.14' }, void 0), jsx("polyline", { points: '22 4 12 14.01 9 11.01' }, void 0)] }), void 0));
|
|
950
|
+
|
|
951
|
+
const ErrorIcon = () => (jsxs("svg", Object.assign({ width: '24', height: '24', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2' }, { children: [jsx("circle", { cx: '12', cy: '12', r: '10' }, void 0), jsx("line", { x1: '15', y1: '9', x2: '9', y2: '15' }, void 0), jsx("line", { x1: '9', y1: '9', x2: '15', y2: '15' }, void 0)] }), void 0));
|
|
952
|
+
|
|
953
|
+
const PendingIcon = () => (jsxs("svg", Object.assign({ width: '24', height: '24', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2' }, { children: [jsx("circle", { cx: '12', cy: '12', r: '10' }, void 0), jsx("line", { x1: '8', y1: '12', x2: '16', y2: '12' }, void 0)] }), void 0));
|
|
954
|
+
|
|
955
|
+
const WarningIcon = () => (jsxs("svg", Object.assign({ width: '24', height: '24', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2', strokeLinecap: 'round', strokeLinejoin: 'round' }, { children: [jsx("path", { d: 'M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z' }, void 0), jsx("line", { x1: '12', y1: '9', x2: '12', y2: '13' }, void 0), jsx("line", { x1: '12', y1: '17', x2: '12.01', y2: '17' }, void 0)] }), void 0));
|
|
956
|
+
|
|
900
957
|
/**
|
|
901
958
|
* It is necessary to create a list that receives
|
|
902
959
|
* strings or Nodes as elements, clicking on
|
|
@@ -928,7 +985,11 @@ const ActionList = ({ header, items, sections }) => {
|
|
|
928
985
|
.join(' ');
|
|
929
986
|
return (jsxs("li", Object.assign({ "aria-label": item.ariaLabel, className: classesItem, onClick: () => item.onClick && item.onClick() }, { children: [item.icon && (jsx("span", Object.assign({ className: 'Action-list__item-icon' }, { children: jsx(Icon, { name: item.icon }, void 0) }), void 0)), item.content] }), j));
|
|
930
987
|
}) }), void 0)] }), i));
|
|
931
|
-
})), items && !sections && (jsx("ul", Object.assign({ className: 'Action-list__items-container' }, { children: items === null || items === void 0 ? void 0 : items.map((item, j) =>
|
|
988
|
+
})), items && !sections && (jsx("ul", Object.assign({ className: 'Action-list__items-container' }, { children: items === null || items === void 0 ? void 0 : items.map((item, j) => {
|
|
989
|
+
const { ariaLabel, content, icon, isActive, isDisabled, onClick } = item;
|
|
990
|
+
const className = cssClassName('Action-list__item', isActive && 'active', isDisabled && 'disabled');
|
|
991
|
+
return (jsxs("li", Object.assign({ "aria-label": ariaLabel, className: className, onClick: () => onClick && !isDisabled && onClick() }, { children: [icon && (jsx("span", Object.assign({ className: 'Action-list__item-icon' }, { children: jsx(Icon, { name: icon }, void 0) }), void 0)), content] }), j));
|
|
992
|
+
}) }), void 0))] }), void 0));
|
|
932
993
|
};
|
|
933
994
|
|
|
934
995
|
const MAIN_CLASS$t = 'Alert';
|
|
@@ -1017,63 +1078,6 @@ const useShowAlert = () => {
|
|
|
1017
1078
|
return addAlert;
|
|
1018
1079
|
};
|
|
1019
1080
|
|
|
1020
|
-
const isComponentTypeOf = (childComponent, parentComponent) => {
|
|
1021
|
-
var _a;
|
|
1022
|
-
if (childComponent === null ||
|
|
1023
|
-
!isValidElement(childComponent) ||
|
|
1024
|
-
typeof childComponent === 'string') {
|
|
1025
|
-
return false;
|
|
1026
|
-
}
|
|
1027
|
-
const { type: childComponentType } = childComponent;
|
|
1028
|
-
const Components = Array.isArray(parentComponent)
|
|
1029
|
-
? parentComponent
|
|
1030
|
-
: [parentComponent];
|
|
1031
|
-
const type = ((_a = childComponent.props) === null || _a === void 0 ? void 0 : _a.__type__) || childComponentType;
|
|
1032
|
-
return Components.some((Component) => typeof type !== 'string' && type === Component);
|
|
1033
|
-
};
|
|
1034
|
-
|
|
1035
|
-
function formatFileSize(bytes) {
|
|
1036
|
-
const units = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
|
|
1037
|
-
let unitIndex = 0;
|
|
1038
|
-
let size = bytes;
|
|
1039
|
-
while (size >= 1024 && unitIndex < units.length - 1) {
|
|
1040
|
-
size /= 1024;
|
|
1041
|
-
unitIndex += 1;
|
|
1042
|
-
}
|
|
1043
|
-
return `${size.toFixed(2)} ${units[unitIndex]}`;
|
|
1044
|
-
}
|
|
1045
|
-
// eslint-disable-next-line
|
|
1046
|
-
// code end
|
|
1047
|
-
|
|
1048
|
-
const cssClassName = (mainClass, ...classes) => {
|
|
1049
|
-
const filteredClasses = classes
|
|
1050
|
-
.filter(Boolean)
|
|
1051
|
-
.map((clss) => `${mainClass}--${clss}`);
|
|
1052
|
-
filteredClasses.unshift(mainClass);
|
|
1053
|
-
return filteredClasses.join(' ');
|
|
1054
|
-
};
|
|
1055
|
-
|
|
1056
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1057
|
-
const isValidIcon = (icon) => typeof icon === 'string' || typeof icon === 'function';
|
|
1058
|
-
|
|
1059
|
-
const themeClassConverter = (themeClass) => {
|
|
1060
|
-
const classConverter = themeClass.charAt(0).toLocaleUpperCase() +
|
|
1061
|
-
themeClass.slice(1).toLocaleLowerCase();
|
|
1062
|
-
return classConverter;
|
|
1063
|
-
};
|
|
1064
|
-
|
|
1065
|
-
function capitalize(str) {
|
|
1066
|
-
return str.charAt(0).toUpperCase() + str.slice(1);
|
|
1067
|
-
}
|
|
1068
|
-
|
|
1069
|
-
const SuccessIcon = () => (jsxs("svg", Object.assign({ width: '24', height: '24', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2' }, { children: [jsx("path", { d: 'M22 11.08V12a10 10 0 1 1-5.93-9.14' }, void 0), jsx("polyline", { points: '22 4 12 14.01 9 11.01' }, void 0)] }), void 0));
|
|
1070
|
-
|
|
1071
|
-
const ErrorIcon = () => (jsxs("svg", Object.assign({ width: '24', height: '24', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2' }, { children: [jsx("circle", { cx: '12', cy: '12', r: '10' }, void 0), jsx("line", { x1: '15', y1: '9', x2: '9', y2: '15' }, void 0), jsx("line", { x1: '9', y1: '9', x2: '15', y2: '15' }, void 0)] }), void 0));
|
|
1072
|
-
|
|
1073
|
-
const PendingIcon = () => (jsxs("svg", Object.assign({ width: '24', height: '24', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2' }, { children: [jsx("circle", { cx: '12', cy: '12', r: '10' }, void 0), jsx("line", { x1: '8', y1: '12', x2: '16', y2: '12' }, void 0)] }), void 0));
|
|
1074
|
-
|
|
1075
|
-
const WarningIcon = () => (jsxs("svg", Object.assign({ width: '24', height: '24', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2', strokeLinecap: 'round', strokeLinejoin: 'round' }, { children: [jsx("path", { d: 'M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z' }, void 0), jsx("line", { x1: '12', y1: '9', x2: '12', y2: '13' }, void 0), jsx("line", { x1: '12', y1: '17', x2: '12.01', y2: '17' }, void 0)] }), void 0));
|
|
1076
|
-
|
|
1077
1081
|
const COMPONENT_NAME$B = 'AlphaAttributeInput';
|
|
1078
1082
|
const AlphaAttributeInput = ({ items, divider, label, isRequired, }) => {
|
|
1079
1083
|
const [isFocused, setIsFocused] = useState(false);
|