@ncds/ui-admin 0.0.17 → 0.0.19
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/cjs/{ui-admin/index.js → index.js} +0 -11
- package/dist/cjs/{ui-admin/src → src}/components/carousel/CarouselArrow.js +4 -4
- package/dist/cjs/{ui-admin/src → src}/components/date-picker/index.js +0 -11
- package/dist/cjs/src/components/dropdown/Dropdown.js +196 -0
- package/dist/cjs/src/components/dropdown/index.js +16 -0
- package/dist/cjs/{ui-admin/src → src}/components/index.js +0 -11
- package/dist/cjs/{ui-admin/src → src}/components/tooltip/Tooltip.js +10 -7
- package/dist/esm/{ui-admin/index.js → index.js} +0 -1
- package/dist/esm/{ui-admin/src → src}/components/carousel/CarouselArrow.js +4 -4
- package/dist/esm/src/components/date-picker/index.js +2 -0
- package/dist/esm/src/components/dropdown/Dropdown.js +188 -0
- package/dist/esm/src/components/dropdown/index.js +1 -0
- package/dist/esm/{ui-admin/src → src}/components/index.js +0 -1
- package/dist/esm/{ui-admin/src → src}/components/tooltip/Tooltip.js +10 -7
- package/dist/types/{ui-admin/index.d.ts → index.d.ts} +0 -1
- package/dist/{esm/ui-admin/src/components/date-picker/index.js → types/src/components/date-picker/index.d.ts} +1 -1
- package/dist/types/src/components/dropdown/Dropdown.d.ts +53 -0
- package/dist/types/src/components/dropdown/index.d.ts +2 -0
- package/dist/types/{ui-admin/src → src}/components/index.d.ts +0 -1
- package/dist/types/{ui-admin/src → src}/components/tooltip/Tooltip.d.ts +2 -1
- package/dist/ui-admin/assets/styles/style.css +206 -3
- package/package.json +2 -2
- package/dist/cjs/const/Icon/FinanceECommerce.js +0 -7
- package/dist/cjs/const/Icon/alertAndFeedback.js +0 -7
- package/dist/cjs/const/Icon/arrow.js +0 -7
- package/dist/cjs/const/Icon/chart.js +0 -7
- package/dist/cjs/const/Icon/chevron.js +0 -7
- package/dist/cjs/const/Icon/circle.js +0 -7
- package/dist/cjs/const/Icon/communication.js +0 -7
- package/dist/cjs/const/Icon/development.js +0 -7
- package/dist/cjs/const/Icon/editor.js +0 -7
- package/dist/cjs/const/Icon/education.js +0 -7
- package/dist/cjs/const/Icon/files.js +0 -7
- package/dist/cjs/const/Icon/general.js +0 -31
- package/dist/cjs/const/Icon/index.js +0 -39
- package/dist/cjs/const/Icon/layout.js +0 -9
- package/dist/cjs/const/Icon/mapsTravel.js +0 -7
- package/dist/cjs/const/Icon/mediaDevices.js +0 -7
- package/dist/cjs/const/Icon/message.js +0 -7
- package/dist/cjs/const/Icon/sales.js +0 -7
- package/dist/cjs/const/Icon/security.js +0 -7
- package/dist/cjs/const/Icon/shapes.js +0 -9
- package/dist/cjs/const/Icon/tag.js +0 -7
- package/dist/cjs/const/Icon/time.js +0 -7
- package/dist/cjs/const/Icon/users.js +0 -7
- package/dist/cjs/const/Icon/weather.js +0 -7
- package/dist/cjs/ui-admin/src/components/svg/SvgIcon.js +0 -65
- package/dist/cjs/ui-admin/src/components/svg/const.js +0 -792
- package/dist/cjs/ui-admin/src/components/svg/index.js +0 -27
- package/dist/esm/const/Icon/FinanceECommerce.js +0 -1
- package/dist/esm/const/Icon/alertAndFeedback.js +0 -1
- package/dist/esm/const/Icon/arrow.js +0 -1
- package/dist/esm/const/Icon/chart.js +0 -1
- package/dist/esm/const/Icon/chevron.js +0 -1
- package/dist/esm/const/Icon/circle.js +0 -1
- package/dist/esm/const/Icon/communication.js +0 -1
- package/dist/esm/const/Icon/development.js +0 -1
- package/dist/esm/const/Icon/editor.js +0 -1
- package/dist/esm/const/Icon/education.js +0 -1
- package/dist/esm/const/Icon/files.js +0 -1
- package/dist/esm/const/Icon/general.js +0 -25
- package/dist/esm/const/Icon/index.js +0 -33
- package/dist/esm/const/Icon/layout.js +0 -3
- package/dist/esm/const/Icon/mapsTravel.js +0 -1
- package/dist/esm/const/Icon/mediaDevices.js +0 -1
- package/dist/esm/const/Icon/message.js +0 -1
- package/dist/esm/const/Icon/sales.js +0 -1
- package/dist/esm/const/Icon/security.js +0 -1
- package/dist/esm/const/Icon/shapes.js +0 -3
- package/dist/esm/const/Icon/tag.js +0 -1
- package/dist/esm/const/Icon/time.js +0 -1
- package/dist/esm/const/Icon/users.js +0 -1
- package/dist/esm/const/Icon/weather.js +0 -1
- package/dist/esm/ui-admin/src/components/svg/SvgIcon.js +0 -58
- package/dist/esm/ui-admin/src/components/svg/const.js +0 -786
- package/dist/esm/ui-admin/src/components/svg/index.js +0 -2
- package/dist/types/const/Icon/FinanceECommerce.d.ts +0 -2
- package/dist/types/const/Icon/alertAndFeedback.d.ts +0 -2
- package/dist/types/const/Icon/arrow.d.ts +0 -2
- package/dist/types/const/Icon/chart.d.ts +0 -2
- package/dist/types/const/Icon/chevron.d.ts +0 -2
- package/dist/types/const/Icon/circle.d.ts +0 -2
- package/dist/types/const/Icon/communication.d.ts +0 -2
- package/dist/types/const/Icon/development.d.ts +0 -2
- package/dist/types/const/Icon/editor.d.ts +0 -2
- package/dist/types/const/Icon/education.d.ts +0 -2
- package/dist/types/const/Icon/files.d.ts +0 -2
- package/dist/types/const/Icon/general.d.ts +0 -2
- package/dist/types/const/Icon/index.d.ts +0 -2
- package/dist/types/const/Icon/layout.d.ts +0 -2
- package/dist/types/const/Icon/mapsTravel.d.ts +0 -2
- package/dist/types/const/Icon/mediaDevices.d.ts +0 -2
- package/dist/types/const/Icon/message.d.ts +0 -2
- package/dist/types/const/Icon/sales.d.ts +0 -2
- package/dist/types/const/Icon/security.d.ts +0 -2
- package/dist/types/const/Icon/shapes.d.ts +0 -2
- package/dist/types/const/Icon/tag.d.ts +0 -2
- package/dist/types/const/Icon/time.d.ts +0 -2
- package/dist/types/const/Icon/users.d.ts +0 -2
- package/dist/types/const/Icon/weather.d.ts +0 -2
- package/dist/types/ui-admin/src/components/date-picker/index.d.ts +0 -4
- package/dist/types/ui-admin/src/components/svg/SvgIcon.d.ts +0 -17
- package/dist/types/ui-admin/src/components/svg/const.d.ts +0 -9
- package/dist/types/ui-admin/src/components/svg/index.d.ts +0 -3
- /package/dist/cjs/{ui-admin/assets → assets}/scripts/index.js +0 -0
- /package/dist/cjs/{ui-admin/assets → assets}/scripts/test.js +0 -0
- /package/dist/cjs/{ui-admin/constant → constant}/color.js +0 -0
- /package/dist/cjs/{ui-admin/constant → constant}/size.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/badge/Badge.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/badge/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/button/Button.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/button/ButtonGroup.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/button/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/carousel/CarouselNumberGroup.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/carousel/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/checkbox/Checkbox.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/checkbox/CheckboxInput.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/checkbox/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/date-picker/DatePicker.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/date-picker/RangeDatePicker.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/date-picker/utils.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/input/InputBase.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/input/PasswordInput.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/input/Textarea.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/input/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/pagination/NavButton.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/pagination/Pagination.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/pagination/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/radio/Radio.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/radio/RadioInput.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/radio/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/select/Select.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/select/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/shared/hintText/HintText.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/shared/hintText/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/shared/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/shared/label/Label.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/shared/label/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/spinner/Spinner.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/spinner/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/toggle/Toggle.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/toggle/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/components/tooltip/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/constant/index.js +0 -0
- /package/dist/cjs/{ui-admin/src → src}/constant/size.js +0 -0
- /package/dist/esm/{ui-admin/assets → assets}/scripts/index.js +0 -0
- /package/dist/esm/{ui-admin/assets → assets}/scripts/test.js +0 -0
- /package/dist/esm/{ui-admin/constant → constant}/color.js +0 -0
- /package/dist/esm/{ui-admin/constant → constant}/size.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/badge/Badge.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/badge/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/button/Button.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/button/ButtonGroup.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/button/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/carousel/CarouselNumberGroup.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/carousel/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/checkbox/Checkbox.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/checkbox/CheckboxInput.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/checkbox/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/date-picker/DatePicker.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/date-picker/RangeDatePicker.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/date-picker/utils.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/input/InputBase.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/input/PasswordInput.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/input/Textarea.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/input/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/pagination/NavButton.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/pagination/Pagination.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/pagination/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/radio/Radio.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/radio/RadioInput.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/radio/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/select/Select.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/select/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/shared/hintText/HintText.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/shared/hintText/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/shared/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/shared/label/Label.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/shared/label/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/spinner/Spinner.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/spinner/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/toggle/Toggle.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/toggle/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/components/tooltip/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/constant/index.js +0 -0
- /package/dist/esm/{ui-admin/src → src}/constant/size.js +0 -0
- /package/dist/types/{ui-admin/assets → assets}/scripts/index.d.ts +0 -0
- /package/dist/types/{ui-admin/assets → assets}/scripts/test.d.ts +0 -0
- /package/dist/types/{ui-admin/constant → constant}/color.d.ts +0 -0
- /package/dist/types/{ui-admin/constant → constant}/size.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/badge/Badge.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/badge/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/button/Button.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/button/ButtonGroup.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/button/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/carousel/CarouselArrow.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/carousel/CarouselNumberGroup.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/carousel/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/checkbox/Checkbox.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/checkbox/CheckboxInput.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/checkbox/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/date-picker/DatePicker.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/date-picker/RangeDatePicker.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/date-picker/utils.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/input/InputBase.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/input/PasswordInput.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/input/Textarea.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/input/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/pagination/NavButton.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/pagination/Pagination.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/pagination/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/radio/Radio.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/radio/RadioInput.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/radio/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/select/Select.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/select/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/shared/hintText/HintText.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/shared/hintText/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/shared/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/shared/label/Label.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/shared/label/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/spinner/Spinner.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/spinner/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/toggle/Toggle.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/toggle/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/components/tooltip/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/constant/index.d.ts +0 -0
- /package/dist/types/{ui-admin/src → src}/constant/size.d.ts +0 -0
|
@@ -146,17 +146,6 @@ Object.keys(_spinner).forEach(function (key) {
|
|
|
146
146
|
}
|
|
147
147
|
});
|
|
148
148
|
});
|
|
149
|
-
var _svg = require("./src/components/svg");
|
|
150
|
-
Object.keys(_svg).forEach(function (key) {
|
|
151
|
-
if (key === "default" || key === "__esModule") return;
|
|
152
|
-
if (key in exports && exports[key] === _svg[key]) return;
|
|
153
|
-
Object.defineProperty(exports, key, {
|
|
154
|
-
enumerable: true,
|
|
155
|
-
get: function () {
|
|
156
|
-
return _svg[key];
|
|
157
|
-
}
|
|
158
|
-
});
|
|
159
|
-
});
|
|
160
149
|
var _toggle = require("./src/components/toggle");
|
|
161
150
|
Object.keys(_toggle).forEach(function (key) {
|
|
162
151
|
if (key === "default" || key === "__esModule") return;
|
|
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.CarouselArrow = void 0;
|
|
7
7
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
8
8
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
9
|
-
var
|
|
9
|
+
var _uiAdminIcon = _interopRequireDefault(require("@ncds/ui-admin-icon"));
|
|
10
10
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
11
11
|
var __assign = void 0 && (void 0).__assign || function () {
|
|
12
12
|
__assign = Object.assign || function (t) {
|
|
@@ -31,10 +31,10 @@ var CarouselArrow = function (_a) {
|
|
|
31
31
|
className: (0, _classnames.default)('ncua-carousel-arrow', (_b = {}, _b["ncua-carousel-arrow--".concat(type)] = type, _b["ncua-carousel-arrow--".concat(size)] = size, _b["ncua-carousel-arrow--".concat(chevron)] = chevron, _b), className),
|
|
32
32
|
onClick: onClick
|
|
33
33
|
}, {
|
|
34
|
-
children: (0, _jsxRuntime.jsx)(
|
|
34
|
+
children: (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
|
|
35
35
|
className: "ncua-carousel-arrow__icon",
|
|
36
|
-
color: "
|
|
37
|
-
|
|
36
|
+
color: "var(--gray-500)",
|
|
37
|
+
name: chevron === 'left' ? 'chevron-left' : 'chevron-right'
|
|
38
38
|
})
|
|
39
39
|
}));
|
|
40
40
|
};
|
|
@@ -24,15 +24,4 @@ Object.keys(_RangeDatePicker).forEach(function (key) {
|
|
|
24
24
|
return _RangeDatePicker[key];
|
|
25
25
|
}
|
|
26
26
|
});
|
|
27
|
-
});
|
|
28
|
-
var _utils = require("./utils");
|
|
29
|
-
Object.keys(_utils).forEach(function (key) {
|
|
30
|
-
if (key === "default" || key === "__esModule") return;
|
|
31
|
-
if (key in exports && exports[key] === _utils[key]) return;
|
|
32
|
-
Object.defineProperty(exports, key, {
|
|
33
|
-
enumerable: true,
|
|
34
|
-
get: function () {
|
|
35
|
-
return _utils[key];
|
|
36
|
-
}
|
|
37
|
-
});
|
|
38
27
|
});
|
|
@@ -0,0 +1,196 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.Dropdown = void 0;
|
|
7
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
8
|
+
var _uiAdminIcon = _interopRequireDefault(require("@ncds/ui-admin-icon"));
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
11
|
+
var __assign = void 0 && (void 0).__assign || function () {
|
|
12
|
+
__assign = Object.assign || function (t) {
|
|
13
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
14
|
+
s = arguments[i];
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
16
|
+
}
|
|
17
|
+
return t;
|
|
18
|
+
};
|
|
19
|
+
return __assign.apply(this, arguments);
|
|
20
|
+
};
|
|
21
|
+
var Dropdown = function (_a) {
|
|
22
|
+
var trigger = _a.trigger,
|
|
23
|
+
_b = _a.align,
|
|
24
|
+
align = _b === void 0 ? 'left' : _b,
|
|
25
|
+
header = _a.header,
|
|
26
|
+
groups = _a.groups,
|
|
27
|
+
className = _a.className;
|
|
28
|
+
var _c = (0, _react.useState)(false),
|
|
29
|
+
isOpen = _c[0],
|
|
30
|
+
setIsOpen = _c[1];
|
|
31
|
+
var dropdownRef = (0, _react.useRef)(null);
|
|
32
|
+
var toggleDropdown = function () {
|
|
33
|
+
setIsOpen(!isOpen);
|
|
34
|
+
};
|
|
35
|
+
var handleClickOutside = function (event) {
|
|
36
|
+
if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
|
|
37
|
+
setIsOpen(false);
|
|
38
|
+
}
|
|
39
|
+
};
|
|
40
|
+
var handleClickItem = function (item) {
|
|
41
|
+
if (!item.disabled && item.onClick) {
|
|
42
|
+
item.onClick();
|
|
43
|
+
setIsOpen(false);
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
(0, _react.useEffect)(function () {
|
|
47
|
+
document.addEventListener('mousedown', handleClickOutside);
|
|
48
|
+
return function () {
|
|
49
|
+
document.removeEventListener('mousedown', handleClickOutside);
|
|
50
|
+
};
|
|
51
|
+
}, []);
|
|
52
|
+
var renderTrigger = function () {
|
|
53
|
+
switch (trigger.type) {
|
|
54
|
+
case 'custom':
|
|
55
|
+
return (0, _jsxRuntime.jsx)("button", __assign({
|
|
56
|
+
className: "ncua-dropdown__trigger",
|
|
57
|
+
onClick: toggleDropdown
|
|
58
|
+
}, {
|
|
59
|
+
children: trigger.children
|
|
60
|
+
}));
|
|
61
|
+
case 'icon':
|
|
62
|
+
return (0, _jsxRuntime.jsx)("button", __assign({
|
|
63
|
+
className: "ncua-dropdown__trigger ncua-dropdown__trigger--icon",
|
|
64
|
+
onClick: toggleDropdown
|
|
65
|
+
}, {
|
|
66
|
+
children: trigger.icon ? (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
|
|
67
|
+
name: trigger.icon
|
|
68
|
+
}) : (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
|
|
69
|
+
name: "dots-vertical"
|
|
70
|
+
})
|
|
71
|
+
}));
|
|
72
|
+
case 'avatar':
|
|
73
|
+
return (0, _jsxRuntime.jsx)("button", __assign({
|
|
74
|
+
className: "ncua-dropdown__trigger ncua-dropdown__trigger--avatar",
|
|
75
|
+
onClick: toggleDropdown
|
|
76
|
+
}, {
|
|
77
|
+
children: (0, _jsxRuntime.jsx)("div", __assign({
|
|
78
|
+
className: "ncua-dropdown__avatar"
|
|
79
|
+
}, {
|
|
80
|
+
children: (0, _jsxRuntime.jsx)("img", {
|
|
81
|
+
src: trigger.avatar,
|
|
82
|
+
alt: "avatar"
|
|
83
|
+
})
|
|
84
|
+
}))
|
|
85
|
+
}));
|
|
86
|
+
case 'button':
|
|
87
|
+
return (0, _jsxRuntime.jsx)("button", __assign({
|
|
88
|
+
className: "ncua-dropdown__trigger ncua-dropdown__trigger--button",
|
|
89
|
+
onClick: toggleDropdown
|
|
90
|
+
}, {
|
|
91
|
+
children: trigger.text
|
|
92
|
+
}));
|
|
93
|
+
default:
|
|
94
|
+
return null;
|
|
95
|
+
}
|
|
96
|
+
};
|
|
97
|
+
var renderHeader = function () {
|
|
98
|
+
if (!header) return null;
|
|
99
|
+
if (header.type === 'avatar' && header.avatar) {
|
|
100
|
+
return (0, _jsxRuntime.jsx)("div", __assign({
|
|
101
|
+
className: "ncua-dropdown__header"
|
|
102
|
+
}, {
|
|
103
|
+
children: (0, _jsxRuntime.jsxs)("div", __assign({
|
|
104
|
+
className: "ncua-dropdown__header-avatar-group"
|
|
105
|
+
}, {
|
|
106
|
+
children: [(0, _jsxRuntime.jsx)("div", __assign({
|
|
107
|
+
className: "ncua-dropdown__avatar"
|
|
108
|
+
}, {
|
|
109
|
+
children: (0, _jsxRuntime.jsx)("img", {
|
|
110
|
+
src: header.avatar,
|
|
111
|
+
alt: "avatar"
|
|
112
|
+
})
|
|
113
|
+
})), (0, _jsxRuntime.jsxs)("div", __assign({
|
|
114
|
+
className: "ncua-dropdown__header-text"
|
|
115
|
+
}, {
|
|
116
|
+
children: [header.title && (0, _jsxRuntime.jsx)("div", __assign({
|
|
117
|
+
className: "ncua-dropdown__header-title"
|
|
118
|
+
}, {
|
|
119
|
+
children: header.title
|
|
120
|
+
})), header.subtitle && (0, _jsxRuntime.jsx)("div", __assign({
|
|
121
|
+
className: "ncua-dropdown__header-subtitle"
|
|
122
|
+
}, {
|
|
123
|
+
children: header.subtitle
|
|
124
|
+
}))]
|
|
125
|
+
}))]
|
|
126
|
+
}))
|
|
127
|
+
}));
|
|
128
|
+
}
|
|
129
|
+
if (header.type === 'text' && header.title) {
|
|
130
|
+
return (0, _jsxRuntime.jsx)("div", __assign({
|
|
131
|
+
className: "ncua-dropdown__header"
|
|
132
|
+
}, {
|
|
133
|
+
children: (0, _jsxRuntime.jsx)("div", __assign({
|
|
134
|
+
className: "ncua-dropdown__header-title"
|
|
135
|
+
}, {
|
|
136
|
+
children: header.title
|
|
137
|
+
}))
|
|
138
|
+
}));
|
|
139
|
+
}
|
|
140
|
+
return null;
|
|
141
|
+
};
|
|
142
|
+
var renderItem = function (item) {
|
|
143
|
+
var itemClasses = ['ncua-dropdown__item', item.disabled ? 'is-disabled' : '', item.type === 'danger' ? 'is-danger' : ''].filter(Boolean).join(' ');
|
|
144
|
+
return (0, _jsxRuntime.jsxs)("div", __assign({
|
|
145
|
+
className: itemClasses
|
|
146
|
+
}, {
|
|
147
|
+
children: [(0, _jsxRuntime.jsx)("button", {
|
|
148
|
+
className: "ncua-dropdown__item-clickable-layer",
|
|
149
|
+
onClick: function () {
|
|
150
|
+
return handleClickItem(item);
|
|
151
|
+
}
|
|
152
|
+
}), (0, _jsxRuntime.jsxs)("div", __assign({
|
|
153
|
+
className: "ncua-dropdown__item-content"
|
|
154
|
+
}, {
|
|
155
|
+
children: [(0, _jsxRuntime.jsxs)("div", __assign({
|
|
156
|
+
className: "ncua-dropdown__item-text-group"
|
|
157
|
+
}, {
|
|
158
|
+
children: [item.icon && (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
|
|
159
|
+
name: item.icon,
|
|
160
|
+
className: "ncua-dropdown__item-icon"
|
|
161
|
+
}), (0, _jsxRuntime.jsx)("span", __assign({
|
|
162
|
+
className: "ncua-dropdown__item-text"
|
|
163
|
+
}, {
|
|
164
|
+
children: item.text
|
|
165
|
+
}))]
|
|
166
|
+
})), item.shortcut && (0, _jsxRuntime.jsx)("span", __assign({
|
|
167
|
+
className: "ncua-dropdown__item-shortcut"
|
|
168
|
+
}, {
|
|
169
|
+
children: item.shortcut
|
|
170
|
+
}))]
|
|
171
|
+
}))]
|
|
172
|
+
}), item.id);
|
|
173
|
+
};
|
|
174
|
+
var dropdownClasses = ['ncua-dropdown', className, align === 'right' ? 'ncua-dropdown--right' : ''].filter(Boolean).join(' ');
|
|
175
|
+
return (0, _jsxRuntime.jsxs)("div", __assign({
|
|
176
|
+
className: dropdownClasses,
|
|
177
|
+
ref: dropdownRef
|
|
178
|
+
}, {
|
|
179
|
+
children: [renderTrigger(), isOpen && (0, _jsxRuntime.jsxs)("div", __assign({
|
|
180
|
+
className: "ncua-dropdown__menu"
|
|
181
|
+
}, {
|
|
182
|
+
children: [renderHeader(), (0, _jsxRuntime.jsx)("div", __assign({
|
|
183
|
+
className: "ncua-dropdown__menu-items"
|
|
184
|
+
}, {
|
|
185
|
+
children: groups.map(function (group, index) {
|
|
186
|
+
return (0, _jsxRuntime.jsx)("div", __assign({
|
|
187
|
+
className: "ncua-dropdown__group"
|
|
188
|
+
}, {
|
|
189
|
+
children: group.items.map(renderItem)
|
|
190
|
+
}), index);
|
|
191
|
+
})
|
|
192
|
+
}))]
|
|
193
|
+
}))]
|
|
194
|
+
}));
|
|
195
|
+
};
|
|
196
|
+
exports.Dropdown = Dropdown;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
var _Dropdown = require("./Dropdown");
|
|
7
|
+
Object.keys(_Dropdown).forEach(function (key) {
|
|
8
|
+
if (key === "default" || key === "__esModule") return;
|
|
9
|
+
if (key in exports && exports[key] === _Dropdown[key]) return;
|
|
10
|
+
Object.defineProperty(exports, key, {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function () {
|
|
13
|
+
return _Dropdown[key];
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
});
|
|
@@ -124,17 +124,6 @@ Object.keys(_spinner).forEach(function (key) {
|
|
|
124
124
|
}
|
|
125
125
|
});
|
|
126
126
|
});
|
|
127
|
-
var _svg = require("./svg");
|
|
128
|
-
Object.keys(_svg).forEach(function (key) {
|
|
129
|
-
if (key === "default" || key === "__esModule") return;
|
|
130
|
-
if (key in exports && exports[key] === _svg[key]) return;
|
|
131
|
-
Object.defineProperty(exports, key, {
|
|
132
|
-
enumerable: true,
|
|
133
|
-
get: function () {
|
|
134
|
-
return _svg[key];
|
|
135
|
-
}
|
|
136
|
-
});
|
|
137
|
-
});
|
|
138
127
|
var _toggle = require("./toggle");
|
|
139
128
|
Object.keys(_toggle).forEach(function (key) {
|
|
140
129
|
if (key === "default" || key === "__esModule") return;
|
|
@@ -45,20 +45,23 @@ var Tooltip = function (_a) {
|
|
|
45
45
|
iconType = _c === void 0 ? 'stroke' : _c,
|
|
46
46
|
_d = _a.position,
|
|
47
47
|
position = _d === void 0 ? 'top' : _d,
|
|
48
|
+
_e = _a.size,
|
|
49
|
+
size = _e === void 0 ? 'sm' : _e,
|
|
48
50
|
title = _a.title,
|
|
49
51
|
content = _a.content,
|
|
50
|
-
|
|
51
|
-
hideArrow =
|
|
52
|
+
_f = _a.hideArrow,
|
|
53
|
+
hideArrow = _f === void 0 ? false : _f;
|
|
54
|
+
var iconSize = size === 'sm' ? 14 : 16;
|
|
52
55
|
return (0, _jsxRuntime.jsxs)("span", __assign({
|
|
53
|
-
className: (0, _classnames.default)('ncua-tooltip', "".concat(hideArrow ? 'ncua-tooltip--hidden-arrow' : ''), "".concat(iconType === 'stroke' ? 'ncua-tooltip--stroke' : ''))
|
|
56
|
+
className: (0, _classnames.default)('ncua-tooltip', "ncua-tooltip--".concat(size), "".concat(hideArrow ? 'ncua-tooltip--hidden-arrow' : ''), "".concat(iconType === 'stroke' ? 'ncua-tooltip--stroke' : ''))
|
|
54
57
|
}, {
|
|
55
58
|
children: [iconType === 'stroke' ? (0, _jsxRuntime.jsx)(_uiAdminIcon.HelpCircle, {
|
|
56
|
-
width:
|
|
57
|
-
height:
|
|
59
|
+
width: iconSize,
|
|
60
|
+
height: iconSize,
|
|
58
61
|
color: "var(--gray-300"
|
|
59
62
|
}) : (0, _jsxRuntime.jsx)(_uiAdminIcon.HelpCircleFill, {
|
|
60
|
-
width:
|
|
61
|
-
height:
|
|
63
|
+
width: iconSize,
|
|
64
|
+
height: iconSize,
|
|
62
65
|
color: "var(--gray-300)"
|
|
63
66
|
}), tooltipContent({
|
|
64
67
|
tooltipType: tooltipType,
|
|
@@ -11,7 +11,6 @@ export * from './src/components/shared/hintText';
|
|
|
11
11
|
export * from './src/components/shared/label';
|
|
12
12
|
export * from './src/components/shared';
|
|
13
13
|
export * from './src/components/spinner';
|
|
14
|
-
export * from './src/components/svg';
|
|
15
14
|
export * from './src/components/toggle';
|
|
16
15
|
export * from './src/components/tooltip';
|
|
17
16
|
export * from './src/components';
|
|
@@ -10,7 +10,7 @@ var __assign = this && this.__assign || function () {
|
|
|
10
10
|
};
|
|
11
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
12
12
|
import classNames from 'classnames';
|
|
13
|
-
import
|
|
13
|
+
import Icon from '@ncds/ui-admin-icon';
|
|
14
14
|
export var CarouselArrow = function (_a) {
|
|
15
15
|
var _b;
|
|
16
16
|
var _c = _a.type,
|
|
@@ -24,10 +24,10 @@ export var CarouselArrow = function (_a) {
|
|
|
24
24
|
className: classNames('ncua-carousel-arrow', (_b = {}, _b["ncua-carousel-arrow--".concat(type)] = type, _b["ncua-carousel-arrow--".concat(size)] = size, _b["ncua-carousel-arrow--".concat(chevron)] = chevron, _b), className),
|
|
25
25
|
onClick: onClick
|
|
26
26
|
}, {
|
|
27
|
-
children: _jsx(
|
|
27
|
+
children: _jsx(Icon, {
|
|
28
28
|
className: "ncua-carousel-arrow__icon",
|
|
29
|
-
color: "
|
|
30
|
-
|
|
29
|
+
color: "var(--gray-500)",
|
|
30
|
+
name: chevron === 'left' ? 'chevron-left' : 'chevron-right'
|
|
31
31
|
})
|
|
32
32
|
}));
|
|
33
33
|
};
|
|
@@ -0,0 +1,188 @@
|
|
|
1
|
+
var __assign = this && this.__assign || function () {
|
|
2
|
+
__assign = Object.assign || function (t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
6
|
+
}
|
|
7
|
+
return t;
|
|
8
|
+
};
|
|
9
|
+
return __assign.apply(this, arguments);
|
|
10
|
+
};
|
|
11
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
|
+
import Icon from '@ncds/ui-admin-icon';
|
|
13
|
+
import { useEffect, useRef, useState } from 'react';
|
|
14
|
+
export var Dropdown = function (_a) {
|
|
15
|
+
var trigger = _a.trigger,
|
|
16
|
+
_b = _a.align,
|
|
17
|
+
align = _b === void 0 ? 'left' : _b,
|
|
18
|
+
header = _a.header,
|
|
19
|
+
groups = _a.groups,
|
|
20
|
+
className = _a.className;
|
|
21
|
+
var _c = useState(false),
|
|
22
|
+
isOpen = _c[0],
|
|
23
|
+
setIsOpen = _c[1];
|
|
24
|
+
var dropdownRef = useRef(null);
|
|
25
|
+
var toggleDropdown = function () {
|
|
26
|
+
setIsOpen(!isOpen);
|
|
27
|
+
};
|
|
28
|
+
var handleClickOutside = function (event) {
|
|
29
|
+
if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
|
|
30
|
+
setIsOpen(false);
|
|
31
|
+
}
|
|
32
|
+
};
|
|
33
|
+
var handleClickItem = function (item) {
|
|
34
|
+
if (!item.disabled && item.onClick) {
|
|
35
|
+
item.onClick();
|
|
36
|
+
setIsOpen(false);
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
useEffect(function () {
|
|
40
|
+
document.addEventListener('mousedown', handleClickOutside);
|
|
41
|
+
return function () {
|
|
42
|
+
document.removeEventListener('mousedown', handleClickOutside);
|
|
43
|
+
};
|
|
44
|
+
}, []);
|
|
45
|
+
var renderTrigger = function () {
|
|
46
|
+
switch (trigger.type) {
|
|
47
|
+
case 'custom':
|
|
48
|
+
return _jsx("button", __assign({
|
|
49
|
+
className: "ncua-dropdown__trigger",
|
|
50
|
+
onClick: toggleDropdown
|
|
51
|
+
}, {
|
|
52
|
+
children: trigger.children
|
|
53
|
+
}));
|
|
54
|
+
case 'icon':
|
|
55
|
+
return _jsx("button", __assign({
|
|
56
|
+
className: "ncua-dropdown__trigger ncua-dropdown__trigger--icon",
|
|
57
|
+
onClick: toggleDropdown
|
|
58
|
+
}, {
|
|
59
|
+
children: trigger.icon ? _jsx(Icon, {
|
|
60
|
+
name: trigger.icon
|
|
61
|
+
}) : _jsx(Icon, {
|
|
62
|
+
name: "dots-vertical"
|
|
63
|
+
})
|
|
64
|
+
}));
|
|
65
|
+
case 'avatar':
|
|
66
|
+
return _jsx("button", __assign({
|
|
67
|
+
className: "ncua-dropdown__trigger ncua-dropdown__trigger--avatar",
|
|
68
|
+
onClick: toggleDropdown
|
|
69
|
+
}, {
|
|
70
|
+
children: _jsx("div", __assign({
|
|
71
|
+
className: "ncua-dropdown__avatar"
|
|
72
|
+
}, {
|
|
73
|
+
children: _jsx("img", {
|
|
74
|
+
src: trigger.avatar,
|
|
75
|
+
alt: "avatar"
|
|
76
|
+
})
|
|
77
|
+
}))
|
|
78
|
+
}));
|
|
79
|
+
case 'button':
|
|
80
|
+
return _jsx("button", __assign({
|
|
81
|
+
className: "ncua-dropdown__trigger ncua-dropdown__trigger--button",
|
|
82
|
+
onClick: toggleDropdown
|
|
83
|
+
}, {
|
|
84
|
+
children: trigger.text
|
|
85
|
+
}));
|
|
86
|
+
default:
|
|
87
|
+
return null;
|
|
88
|
+
}
|
|
89
|
+
};
|
|
90
|
+
var renderHeader = function () {
|
|
91
|
+
if (!header) return null;
|
|
92
|
+
if (header.type === 'avatar' && header.avatar) {
|
|
93
|
+
return _jsx("div", __assign({
|
|
94
|
+
className: "ncua-dropdown__header"
|
|
95
|
+
}, {
|
|
96
|
+
children: _jsxs("div", __assign({
|
|
97
|
+
className: "ncua-dropdown__header-avatar-group"
|
|
98
|
+
}, {
|
|
99
|
+
children: [_jsx("div", __assign({
|
|
100
|
+
className: "ncua-dropdown__avatar"
|
|
101
|
+
}, {
|
|
102
|
+
children: _jsx("img", {
|
|
103
|
+
src: header.avatar,
|
|
104
|
+
alt: "avatar"
|
|
105
|
+
})
|
|
106
|
+
})), _jsxs("div", __assign({
|
|
107
|
+
className: "ncua-dropdown__header-text"
|
|
108
|
+
}, {
|
|
109
|
+
children: [header.title && _jsx("div", __assign({
|
|
110
|
+
className: "ncua-dropdown__header-title"
|
|
111
|
+
}, {
|
|
112
|
+
children: header.title
|
|
113
|
+
})), header.subtitle && _jsx("div", __assign({
|
|
114
|
+
className: "ncua-dropdown__header-subtitle"
|
|
115
|
+
}, {
|
|
116
|
+
children: header.subtitle
|
|
117
|
+
}))]
|
|
118
|
+
}))]
|
|
119
|
+
}))
|
|
120
|
+
}));
|
|
121
|
+
}
|
|
122
|
+
if (header.type === 'text' && header.title) {
|
|
123
|
+
return _jsx("div", __assign({
|
|
124
|
+
className: "ncua-dropdown__header"
|
|
125
|
+
}, {
|
|
126
|
+
children: _jsx("div", __assign({
|
|
127
|
+
className: "ncua-dropdown__header-title"
|
|
128
|
+
}, {
|
|
129
|
+
children: header.title
|
|
130
|
+
}))
|
|
131
|
+
}));
|
|
132
|
+
}
|
|
133
|
+
return null;
|
|
134
|
+
};
|
|
135
|
+
var renderItem = function (item) {
|
|
136
|
+
var itemClasses = ['ncua-dropdown__item', item.disabled ? 'is-disabled' : '', item.type === 'danger' ? 'is-danger' : ''].filter(Boolean).join(' ');
|
|
137
|
+
return _jsxs("div", __assign({
|
|
138
|
+
className: itemClasses
|
|
139
|
+
}, {
|
|
140
|
+
children: [_jsx("button", {
|
|
141
|
+
className: "ncua-dropdown__item-clickable-layer",
|
|
142
|
+
onClick: function () {
|
|
143
|
+
return handleClickItem(item);
|
|
144
|
+
}
|
|
145
|
+
}), _jsxs("div", __assign({
|
|
146
|
+
className: "ncua-dropdown__item-content"
|
|
147
|
+
}, {
|
|
148
|
+
children: [_jsxs("div", __assign({
|
|
149
|
+
className: "ncua-dropdown__item-text-group"
|
|
150
|
+
}, {
|
|
151
|
+
children: [item.icon && _jsx(Icon, {
|
|
152
|
+
name: item.icon,
|
|
153
|
+
className: "ncua-dropdown__item-icon"
|
|
154
|
+
}), _jsx("span", __assign({
|
|
155
|
+
className: "ncua-dropdown__item-text"
|
|
156
|
+
}, {
|
|
157
|
+
children: item.text
|
|
158
|
+
}))]
|
|
159
|
+
})), item.shortcut && _jsx("span", __assign({
|
|
160
|
+
className: "ncua-dropdown__item-shortcut"
|
|
161
|
+
}, {
|
|
162
|
+
children: item.shortcut
|
|
163
|
+
}))]
|
|
164
|
+
}))]
|
|
165
|
+
}), item.id);
|
|
166
|
+
};
|
|
167
|
+
var dropdownClasses = ['ncua-dropdown', className, align === 'right' ? 'ncua-dropdown--right' : ''].filter(Boolean).join(' ');
|
|
168
|
+
return _jsxs("div", __assign({
|
|
169
|
+
className: dropdownClasses,
|
|
170
|
+
ref: dropdownRef
|
|
171
|
+
}, {
|
|
172
|
+
children: [renderTrigger(), isOpen && _jsxs("div", __assign({
|
|
173
|
+
className: "ncua-dropdown__menu"
|
|
174
|
+
}, {
|
|
175
|
+
children: [renderHeader(), _jsx("div", __assign({
|
|
176
|
+
className: "ncua-dropdown__menu-items"
|
|
177
|
+
}, {
|
|
178
|
+
children: groups.map(function (group, index) {
|
|
179
|
+
return _jsx("div", __assign({
|
|
180
|
+
className: "ncua-dropdown__group"
|
|
181
|
+
}, {
|
|
182
|
+
children: group.items.map(renderItem)
|
|
183
|
+
}), index);
|
|
184
|
+
})
|
|
185
|
+
}))]
|
|
186
|
+
}))]
|
|
187
|
+
}));
|
|
188
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Dropdown';
|
|
@@ -38,20 +38,23 @@ export var Tooltip = function (_a) {
|
|
|
38
38
|
iconType = _c === void 0 ? 'stroke' : _c,
|
|
39
39
|
_d = _a.position,
|
|
40
40
|
position = _d === void 0 ? 'top' : _d,
|
|
41
|
+
_e = _a.size,
|
|
42
|
+
size = _e === void 0 ? 'sm' : _e,
|
|
41
43
|
title = _a.title,
|
|
42
44
|
content = _a.content,
|
|
43
|
-
|
|
44
|
-
hideArrow =
|
|
45
|
+
_f = _a.hideArrow,
|
|
46
|
+
hideArrow = _f === void 0 ? false : _f;
|
|
47
|
+
var iconSize = size === 'sm' ? 14 : 16;
|
|
45
48
|
return _jsxs("span", __assign({
|
|
46
|
-
className: classNames('ncua-tooltip', "".concat(hideArrow ? 'ncua-tooltip--hidden-arrow' : ''), "".concat(iconType === 'stroke' ? 'ncua-tooltip--stroke' : ''))
|
|
49
|
+
className: classNames('ncua-tooltip', "ncua-tooltip--".concat(size), "".concat(hideArrow ? 'ncua-tooltip--hidden-arrow' : ''), "".concat(iconType === 'stroke' ? 'ncua-tooltip--stroke' : ''))
|
|
47
50
|
}, {
|
|
48
51
|
children: [iconType === 'stroke' ? _jsx(HelpCircle, {
|
|
49
|
-
width:
|
|
50
|
-
height:
|
|
52
|
+
width: iconSize,
|
|
53
|
+
height: iconSize,
|
|
51
54
|
color: "var(--gray-300"
|
|
52
55
|
}) : _jsx(HelpCircleFill, {
|
|
53
|
-
width:
|
|
54
|
-
height:
|
|
56
|
+
width: iconSize,
|
|
57
|
+
height: iconSize,
|
|
55
58
|
color: "var(--gray-300)"
|
|
56
59
|
}), tooltipContent({
|
|
57
60
|
tooltipType: tooltipType,
|
|
@@ -11,7 +11,6 @@ export * from './src/components/shared/hintText';
|
|
|
11
11
|
export * from './src/components/shared/label';
|
|
12
12
|
export * from './src/components/shared';
|
|
13
13
|
export * from './src/components/spinner';
|
|
14
|
-
export * from './src/components/svg';
|
|
15
14
|
export * from './src/components/toggle';
|
|
16
15
|
export * from './src/components/tooltip';
|
|
17
16
|
export * from './src/components';
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { IconName } from '@ncds/ui-admin-icon';
|
|
2
|
+
export type AvatarTrigger = {
|
|
3
|
+
type: 'avatar';
|
|
4
|
+
avatar: string;
|
|
5
|
+
};
|
|
6
|
+
export type TextTrigger = {
|
|
7
|
+
type: 'text';
|
|
8
|
+
title: string;
|
|
9
|
+
};
|
|
10
|
+
export type ButtonTrigger = {
|
|
11
|
+
type: 'button';
|
|
12
|
+
text: string;
|
|
13
|
+
};
|
|
14
|
+
export type IconTrigger = {
|
|
15
|
+
type: 'icon';
|
|
16
|
+
icon?: IconName;
|
|
17
|
+
};
|
|
18
|
+
export type CustomTrigger = {
|
|
19
|
+
type: 'custom';
|
|
20
|
+
children: React.ReactNode;
|
|
21
|
+
};
|
|
22
|
+
export type DropdownItemType = {
|
|
23
|
+
id: string;
|
|
24
|
+
text: string;
|
|
25
|
+
icon?: IconName;
|
|
26
|
+
shortcut?: string;
|
|
27
|
+
onClick?: () => void;
|
|
28
|
+
disabled?: boolean;
|
|
29
|
+
type?: 'default' | 'danger';
|
|
30
|
+
};
|
|
31
|
+
export type DropdownGroup = {
|
|
32
|
+
items: DropdownItemType[];
|
|
33
|
+
};
|
|
34
|
+
export type AvatarHeader = {
|
|
35
|
+
type: 'avatar';
|
|
36
|
+
avatar: string;
|
|
37
|
+
title: string;
|
|
38
|
+
subtitle: string;
|
|
39
|
+
};
|
|
40
|
+
export type TextHeader = {
|
|
41
|
+
type: 'text';
|
|
42
|
+
title: string;
|
|
43
|
+
};
|
|
44
|
+
export type DropdownHeaderType = AvatarHeader | TextHeader;
|
|
45
|
+
export type DropdownProps = {
|
|
46
|
+
trigger: AvatarTrigger | TextTrigger | ButtonTrigger | IconTrigger | CustomTrigger;
|
|
47
|
+
align?: 'left' | 'right';
|
|
48
|
+
header?: DropdownHeaderType;
|
|
49
|
+
groups: DropdownGroup[];
|
|
50
|
+
className?: string;
|
|
51
|
+
};
|
|
52
|
+
export declare const Dropdown: ({ trigger, align, header, groups, className }: DropdownProps) => import("react/jsx-runtime").JSX.Element;
|
|
53
|
+
//# sourceMappingURL=Dropdown.d.ts.map
|