@plesk/ui-library 3.28.3 → 3.29.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/README.md +15 -0
- package/cjs/components/ContentLoader/IconsLoader.js +31 -23
- package/cjs/components/FormField/FormField.js +1 -1
- package/cjs/components/Toast/Toast.js +23 -8
- package/cjs/components/Toaster/Toaster.js +4 -6
- package/cjs/index.js +1 -1
- package/dist/plesk-ui-library-rtl.css +1 -1
- package/dist/plesk-ui-library-rtl.css.map +1 -1
- package/dist/plesk-ui-library.css +1 -1
- package/dist/plesk-ui-library.css.map +1 -1
- package/dist/plesk-ui-library.js +58 -37
- package/dist/plesk-ui-library.js.map +1 -1
- package/dist/plesk-ui-library.min.js +2 -2
- package/dist/plesk-ui-library.min.js.map +1 -1
- package/esm/components/ContentLoader/IconsLoader.js +31 -23
- package/esm/components/FormField/FormField.js +1 -1
- package/esm/components/Toast/Toast.js +21 -8
- package/esm/components/Toaster/Toaster.js +4 -5
- package/esm/index.js +1 -1
- package/package.json +2 -2
- package/styleguide/build/bundle.73fec982.js +2 -0
- package/styleguide/build/{bundle.3b7e4d37.js.LICENSE.txt → bundle.73fec982.js.LICENSE.txt} +0 -0
- package/styleguide/index.html +2 -2
- package/types/src/components/ContentLoader/IconsLoader.d.ts +6 -4
- package/types/src/components/Toast/Toast.d.ts +9 -0
- package/types/src/components/Toaster/Toaster.d.ts +2 -0
- package/styleguide/build/bundle.3b7e4d37.js +0 -2
package/dist/plesk-ui-library.js
CHANGED
|
@@ -5432,7 +5432,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
|
|
|
5432
5432
|
|
|
5433
5433
|
const DEFAULT_ICONS = ['clock', 'emoticon-smile', 'rocket', 'sand-clock', 'sleep', 'web', 'star'];
|
|
5434
5434
|
|
|
5435
|
-
const
|
|
5435
|
+
const useIconCursor = (icons, initialCursor, isSync) => {
|
|
5436
5436
|
const targetRef = (0, _react.useRef)(null);
|
|
5437
5437
|
const [cursor, setCursor] = (0, _react.useState)(initialCursor);
|
|
5438
5438
|
(0, _react.useEffect)(() => {
|
|
@@ -5454,50 +5454,58 @@ const useIcon = (icons, initialCursor, isSync) => {
|
|
|
5454
5454
|
}
|
|
5455
5455
|
}; // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
5456
5456
|
}, [icons]);
|
|
5457
|
-
return
|
|
5458
|
-
name: icons[cursor],
|
|
5459
|
-
targetRef
|
|
5460
|
-
};
|
|
5457
|
+
return [icons[cursor], targetRef];
|
|
5461
5458
|
};
|
|
5462
5459
|
|
|
5463
5460
|
const IconsLoader = ({
|
|
5464
5461
|
baseClassName = `${_constants.CLS_PREFIX}icons-loader`,
|
|
5465
5462
|
className,
|
|
5466
5463
|
icons,
|
|
5464
|
+
size,
|
|
5465
|
+
style,
|
|
5467
5466
|
...props
|
|
5468
5467
|
}) => {
|
|
5469
|
-
|
|
5470
|
-
|
|
5471
|
-
const
|
|
5472
|
-
|
|
5473
|
-
|
|
5468
|
+
var _icons;
|
|
5469
|
+
|
|
5470
|
+
const syncRef = (0, _react.useRef)('icon1');
|
|
5471
|
+
|
|
5472
|
+
if (!((_icons = icons) !== null && _icons !== void 0 && _icons.length)) {
|
|
5473
|
+
icons = DEFAULT_ICONS;
|
|
5474
|
+
} else if (icons.length === 1) {
|
|
5475
|
+
icons = [icons[0], icons[0]];
|
|
5476
|
+
}
|
|
5477
|
+
|
|
5478
|
+
const [icon1, icon1Ref] = useIconCursor(icons, 0, () => {
|
|
5479
|
+
if (syncRef.current === 'icon1') {
|
|
5480
|
+
syncRef.current = 'icon2';
|
|
5474
5481
|
return true;
|
|
5475
5482
|
}
|
|
5476
5483
|
|
|
5477
5484
|
return false;
|
|
5478
5485
|
});
|
|
5479
|
-
const icon2 =
|
|
5480
|
-
if (syncRef.current ===
|
|
5481
|
-
syncRef.current
|
|
5486
|
+
const [icon2, icon2Ref] = useIconCursor(icons, 1, () => {
|
|
5487
|
+
if (syncRef.current === 'icon2') {
|
|
5488
|
+
syncRef.current = 'icon1';
|
|
5482
5489
|
return true;
|
|
5483
5490
|
}
|
|
5484
5491
|
|
|
5485
5492
|
return false;
|
|
5486
5493
|
});
|
|
5487
5494
|
return /*#__PURE__*/_react.default.createElement("div", _extends({
|
|
5488
|
-
className: (0, _classnames.default)(baseClassName, className)
|
|
5495
|
+
className: (0, _classnames.default)(baseClassName, className),
|
|
5496
|
+
style: { ...style,
|
|
5497
|
+
['--icons-loader-size']: size ? size : undefined
|
|
5498
|
+
}
|
|
5489
5499
|
}, props), /*#__PURE__*/_react.default.createElement("div", {
|
|
5490
5500
|
className: (0, _classnames.default)(`${baseClassName}__icon`, `${baseClassName}__icon--1`),
|
|
5491
|
-
ref:
|
|
5492
|
-
},
|
|
5493
|
-
|
|
5494
|
-
size: "64"
|
|
5501
|
+
ref: icon1Ref
|
|
5502
|
+
}, _Icon.default.create(icon1, {
|
|
5503
|
+
size: size ? size : '64'
|
|
5495
5504
|
})), /*#__PURE__*/_react.default.createElement("div", {
|
|
5496
5505
|
className: (0, _classnames.default)(`${baseClassName}__icon`, `${baseClassName}__icon--2`),
|
|
5497
|
-
ref:
|
|
5498
|
-
},
|
|
5499
|
-
|
|
5500
|
-
size: "64"
|
|
5506
|
+
ref: icon2Ref
|
|
5507
|
+
}, _Icon.default.create(icon2, {
|
|
5508
|
+
size: size ? size : '64'
|
|
5501
5509
|
})));
|
|
5502
5510
|
};
|
|
5503
5511
|
|
|
@@ -8810,7 +8818,7 @@ class FormField extends _react.Component {
|
|
|
8810
8818
|
multi
|
|
8811
8819
|
} = this.props;
|
|
8812
8820
|
|
|
8813
|
-
if (!description || multi && this.fieldApi.getValue().length - 1 > index) {
|
|
8821
|
+
if (!description || multi && getArrayHelper(this.fieldApi.getValue()).length - 1 > index) {
|
|
8814
8822
|
return null;
|
|
8815
8823
|
}
|
|
8816
8824
|
|
|
@@ -26497,6 +26505,8 @@ var _Button = _interopRequireDefault(__webpack_require__(/*! ../Button */ "./com
|
|
|
26497
26505
|
|
|
26498
26506
|
var _intentIconMap = __webpack_require__(/*! ../intentIconMap */ "./components/intentIconMap.tsx");
|
|
26499
26507
|
|
|
26508
|
+
var _OnDarkContext = _interopRequireDefault(__webpack_require__(/*! ../OnDarkContext */ "./components/OnDarkContext/index.tsx"));
|
|
26509
|
+
|
|
26500
26510
|
__webpack_require__(/*! ./Toast.less */ "./components/Toast/Toast.less");
|
|
26501
26511
|
|
|
26502
26512
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -26554,6 +26564,10 @@ class Toast extends _react.Component {
|
|
|
26554
26564
|
className,
|
|
26555
26565
|
message,
|
|
26556
26566
|
intent,
|
|
26567
|
+
accent,
|
|
26568
|
+
icon = intent && /*#__PURE__*/_react.default.createElement(_Icon.default, {
|
|
26569
|
+
name: _intentIconMap.intentIconMap[intent]
|
|
26570
|
+
}),
|
|
26557
26571
|
onClose,
|
|
26558
26572
|
closable = true,
|
|
26559
26573
|
autoClosable,
|
|
@@ -26561,18 +26575,19 @@ class Toast extends _react.Component {
|
|
|
26561
26575
|
innerRef,
|
|
26562
26576
|
...props
|
|
26563
26577
|
} = this.props;
|
|
26564
|
-
|
|
26578
|
+
|
|
26579
|
+
const result = /*#__PURE__*/_react.default.createElement("div", _extends({
|
|
26565
26580
|
tabIndex: 0,
|
|
26566
|
-
className: (0, _classnames.default)(baseClassName, intent && `${baseClassName}--${intent}`, className)
|
|
26581
|
+
className: (0, _classnames.default)(baseClassName, intent && `${baseClassName}--${intent}`, accent && `${baseClassName}--accent`, className)
|
|
26567
26582
|
}, props, {
|
|
26568
26583
|
ref: innerRef
|
|
26569
|
-
}),
|
|
26584
|
+
}), icon ? /*#__PURE__*/_react.default.createElement("div", {
|
|
26570
26585
|
className: `${baseClassName}__icon`
|
|
26571
|
-
},
|
|
26572
|
-
|
|
26573
|
-
})) : null, /*#__PURE__*/_react.default.createElement("
|
|
26586
|
+
}, _Icon.default.create(icon, {
|
|
26587
|
+
intent
|
|
26588
|
+
})) : null, /*#__PURE__*/_react.default.createElement("div", {
|
|
26574
26589
|
className: `${baseClassName}__content`
|
|
26575
|
-
}, message), closable ? /*#__PURE__*/_react.default.createElement("
|
|
26590
|
+
}, message), closable ? /*#__PURE__*/_react.default.createElement("div", {
|
|
26576
26591
|
className: `${baseClassName}__action`
|
|
26577
26592
|
}, /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
26578
26593
|
ghost: true,
|
|
@@ -26583,6 +26598,14 @@ class Toast extends _react.Component {
|
|
|
26583
26598
|
className: `${baseClassName}__close`,
|
|
26584
26599
|
onClick: onClose
|
|
26585
26600
|
})) : null);
|
|
26601
|
+
|
|
26602
|
+
if (accent) {
|
|
26603
|
+
return result;
|
|
26604
|
+
}
|
|
26605
|
+
|
|
26606
|
+
return /*#__PURE__*/_react.default.createElement(_OnDarkContext.default.Provider, {
|
|
26607
|
+
value: true
|
|
26608
|
+
}, result);
|
|
26586
26609
|
}
|
|
26587
26610
|
|
|
26588
26611
|
}
|
|
@@ -26663,8 +26686,6 @@ var _Toast = _interopRequireDefault(__webpack_require__(/*! ../Toast */ "./compo
|
|
|
26663
26686
|
|
|
26664
26687
|
var _Layer = _interopRequireDefault(__webpack_require__(/*! ../Layer */ "./components/Layer/index.tsx"));
|
|
26665
26688
|
|
|
26666
|
-
var _OnDarkContext = _interopRequireDefault(__webpack_require__(/*! ../OnDarkContext */ "./components/OnDarkContext/index.tsx"));
|
|
26667
|
-
|
|
26668
26689
|
__webpack_require__(/*! ./Toaster.less */ "./components/Toaster/Toaster.less");
|
|
26669
26690
|
|
|
26670
26691
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -26712,6 +26733,8 @@ class Toaster extends _react.Component {
|
|
|
26712
26733
|
* Add a new toast
|
|
26713
26734
|
*
|
|
26714
26735
|
* `intent` - Visual intent color to apply to component. (Type: `oneOf` 'info', 'success', 'warning', 'danger'. *Required*.)<br>
|
|
26736
|
+
* `accent` - Contrast (light) version of the component. (Type: `boolean`. Default: 'undefined'.)<br>
|
|
26737
|
+
* `icon` - Name of icon or [Icon](#!/Icon) component. (Type: `oneOfType` 'string', 'object', 'element'. Default: `undefined`.)<br>
|
|
26715
26738
|
* `message` - Message to display in the body of the toast. (Type: `any`. Default: `undefined`.)<br>
|
|
26716
26739
|
* `onClose` - onClose handler. (Type: `func`. Default: `undefined`.)<br>
|
|
26717
26740
|
* `closable` - Show close control (cross mark). (Type: `boolean`. Default: `true`.)<br>
|
|
@@ -26801,9 +26824,7 @@ class Toaster extends _react.Component {
|
|
|
26801
26824
|
stack.reverse();
|
|
26802
26825
|
}
|
|
26803
26826
|
|
|
26804
|
-
return /*#__PURE__*/_react.default.createElement(
|
|
26805
|
-
value: true
|
|
26806
|
-
}, /*#__PURE__*/_react.default.createElement(_Layer.default, {
|
|
26827
|
+
return /*#__PURE__*/_react.default.createElement(_Layer.default, {
|
|
26807
26828
|
level: _constants.Z_INDEX_TOASTER
|
|
26808
26829
|
}, /*#__PURE__*/_react.default.createElement("div", _extends({
|
|
26809
26830
|
className: (0, _classnames.default)(baseClassName, {
|
|
@@ -26849,7 +26870,7 @@ class Toaster extends _react.Component {
|
|
|
26849
26870
|
},
|
|
26850
26871
|
innerRef: toastRef
|
|
26851
26872
|
})));
|
|
26852
|
-
}))))
|
|
26873
|
+
}))));
|
|
26853
26874
|
}
|
|
26854
26875
|
|
|
26855
26876
|
}
|
|
@@ -92593,7 +92614,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
92593
92614
|
/***/ ((module) => {
|
|
92594
92615
|
|
|
92595
92616
|
"use strict";
|
|
92596
|
-
module.exports = JSON.parse('{"name":"@plesk/ui-library","version":"3.
|
|
92617
|
+
module.exports = JSON.parse('{"name":"@plesk/ui-library","version":"3.29.1","description":"Plesk UI Library","main":"index.js","module":"esm/index.js","types":"./types/src","sideEffects":["cjs/index.js","esm/index.js","dist/*.js","dist/*.css"],"scripts":{"pretest":"yarn lint","test":"jest --ci --coverage --coverageReporters text-summary","test:vr":"cross-env VISUAL_REGRESSION=true jest","build":"yarn build:types && yarn build:umd && yarn build:esm && yarn build:cjs","build:umd":"webpack --config ./configs/build.config.js","build:esm":"cross-env NODE_ENV=esm node ./scripts/build.js","build:cjs":"cross-env NODE_ENV=cjs node ./scripts/build.js","build:types":"rimraf ./types && tsc --project ./configs/types-generator.config.json","create-svg-sprite":"node ./scripts/create-svg-sprite.js","lint":"yarn lint:es && yarn lint:types && yarn lint:style","lint:es":"eslint --ext js,md,tsx src configs scripts styleguidist","lint:types":"tsc","lint:style":"stylelint \\"src/**/*.less\\"","styleguide":"styleguidist server --config ./configs/styleguide.config.js","styleguide:build":"styleguidist build --config ./configs/styleguide.config.js","create-component":"node scripts/create-component.js","prepublishOnly":"yarn install && yarn test && yarn build && yarn styleguide:build","storybook":"webpack serve --config ./configs/storybook.config.js --disable-host-check","postinstall":"node ./scripts/postinstall.js"},"files":["esm","cjs","dist","styleguide","types","/scripts/postinstall.js","/index.js"],"dependencies":{"@babel/runtime":"^7.15.4","@plesk/react-movable":"^2.6.0","@types/classnames":"2.2.7","@types/react":"16.8.13","@types/react-dom":"16.8.4","@types/react-measure":"2.0.8","@types/react-transition-group":"^4.4.4","@types/svg4everybody":"2.1.0","classnames":"^2.3.1","codemirror":"5.48.0","marked":"0.3.19","memoize-one":"^5.1.1","popper.js":"1.14.3","prop-types":"^15.7.2","react-measure":"2.3.0","react-sortable-hoc":"0.6.8","react-transition-group":"^4.4.2","scroll-into-view-if-needed":"^2.2.20","svg4everybody":"2.1.9","use-focus-visible":"^1.0.0"},"devDependencies":{"@babel/core":"^7.15.8","@babel/plugin-proposal-class-properties":"^7.14.5","@babel/plugin-syntax-dynamic-import":"^7.8.3","@babel/plugin-transform-runtime":"^7.15.8","@babel/preset-env":"^7.15.8","@babel/preset-react":"^7.14.5","@babel/preset-typescript":"^7.15.0","@plesk/eslint-config":"^1.1.0","@plesk/stylelint-config":"^1.0.0","@types/buble":"^0.19.2","@types/cheerio":"^0.22.30","@types/doctrine":"^0.0.3","@types/enzyme":"^3.10.9","@types/jest":"^23.3.12","@types/webpack-dev-server":"^3.10.1","@typescript-eslint/eslint-plugin":"^2.7.0","@typescript-eslint/parser":"^2.7.0","autoprefixer":"^10.3.7","babel-loader":"^8.2.3","babel-plugin-dynamic-import-node":"^2.3.3","babel-plugin-transform-require-ignore":"^0.1.1","clean-webpack-plugin":"^4.0.0","cross-env":"^5.2.0","css-loader":"^6.4.0","css-minimizer-webpack-plugin":"^3.1.1","enzyme":"^3.11.0","enzyme-adapter-react-16":"^1.15.6","enzyme-to-json":"^3.6.2","eslint-config-prettier":"^6.11.0","eslint-plugin-markdown":"^1.0.2","eslint-plugin-prettier":"^3.1.3","expect-puppeteer":"^4.4.0","fs-extra":"^7.0.0","html-webpack-plugin":"^5.5.0","inquirer":"^3.2.1","jest":"^24.9.0","jest-dev-server":"^4.4.0","jest-image-snapshot":"^4.0.2","less":"^4.1.2","less-loader":"^10.2.0","mini-css-extract-plugin":"^2.4.3","postcss":"^8.4.6","postcss-less":"^6.0.0","postcss-loader":"^6.2.1","postcss-logical":"^5.0.3","prettier":"^2.0.5","puppeteer-core":"13.1.3","react":"^16.8.6","react-dom":"^16.8.6","react-styleguidist":"^11.1.7","react-test-renderer":"^16.8.6","rimraf":"^3.0.1","rtlcss":"^3.4.0","style-loader":"^3.3.1","stylelint":"^14.3.0","stylelint-config-prettier":"^9.0.3","stylelint-declaration-block-no-ignored-properties":"^2.5.0","stylelint-no-unsupported-browser-features":"^5.0.2","stylelint-prettier":"^2.0.0","stylelint-use-logical-spec":"^3.2.2","svg-mixer":"^2.3.14","terser-webpack-plugin":"^5.2.4","typescript":"^3.7.2","webpack":"^5.60.0","webpack-cli":"^4.9.1"},"peerDependencies":{"react":"^16.8.6","react-dom":"^16.8.6"},"resolutions":{"@babel/types":"^7.15.6","@types/node":"^12.12.8","**/caniuse-lite":"1.0.30001390"},"browserslist":["last 2 versions",">1%","not op_mini all","not dead","not ie 11"],"author":"Plesk Developers <plesk-dev-leads@plesk.com> (https://www.plesk.com/)","license":"Apache-2.0"}');
|
|
92597
92618
|
|
|
92598
92619
|
/***/ }),
|
|
92599
92620
|
|