@flexmatch-dev/react-ui 0.0.1 → 0.0.3
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/cjs/assets/icon-check.d.ts +7 -0
- package/cjs/assets/icon-check.d.ts.map +1 -0
- package/cjs/assets/icon-check.js +28 -0
- package/cjs/assets/icon-close.d.ts +3 -0
- package/cjs/assets/icon-close.d.ts.map +1 -0
- package/cjs/assets/icon-close.js +24 -0
- package/cjs/assets/icon-selectbox-arrow.d.ts +7 -0
- package/cjs/assets/icon-selectbox-arrow.d.ts.map +1 -0
- package/cjs/assets/icon-selectbox-arrow.js +28 -0
- package/cjs/assets/index.d.ts +4 -0
- package/cjs/assets/index.d.ts.map +1 -0
- package/cjs/assets/index.js +27 -0
- package/cjs/components/Input/Chip/InputChipButton.d.ts +5 -0
- package/cjs/components/Input/Chip/InputChipButton.d.ts.map +1 -0
- package/cjs/components/Input/Chip/InputChipButton.js +31 -0
- package/cjs/components/Input/Chip/InputChipRow.d.ts +13 -0
- package/cjs/components/Input/Chip/InputChipRow.d.ts.map +1 -0
- package/cjs/components/Input/Chip/InputChipRow.js +96 -0
- package/cjs/components/Input/Chip/InputTextbox.d.ts +5 -0
- package/cjs/components/Input/Chip/InputTextbox.d.ts.map +1 -0
- package/cjs/components/Input/Chip/InputTextbox.js +30 -0
- package/cjs/components/Input/Chip/index.d.ts +15 -0
- package/cjs/components/Input/Chip/index.d.ts.map +1 -0
- package/cjs/components/Input/Chip/index.js +17 -0
- package/cjs/components/Input/Selectable/InputButtonMultiSelect.d.ts +14 -0
- package/cjs/components/Input/Selectable/InputButtonMultiSelect.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputButtonMultiSelect.js +96 -0
- package/cjs/components/Input/Selectable/InputButtonSelect.d.ts +14 -0
- package/cjs/components/Input/Selectable/InputButtonSelect.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputButtonSelect.js +65 -0
- package/cjs/components/Input/Selectable/InputButtonSelectButton.d.ts +14 -0
- package/cjs/components/Input/Selectable/InputButtonSelectButton.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputButtonSelectButton.js +78 -0
- package/cjs/components/Input/Selectable/InputCardSelect.d.ts +14 -0
- package/cjs/components/Input/Selectable/InputCardSelect.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputCardSelect.js +65 -0
- package/cjs/components/Input/Selectable/InputCardSelectButton.d.ts +14 -0
- package/cjs/components/Input/Selectable/InputCardSelectButton.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputCardSelectButton.js +85 -0
- package/cjs/components/Input/Selectable/InputCheckbox.d.ts +11 -0
- package/cjs/components/Input/Selectable/InputCheckbox.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputCheckbox.js +43 -0
- package/cjs/components/Input/Selectable/InputOptionSwitch.d.ts.map +1 -1
- package/cjs/components/Input/Selectable/InputOptionSwitch.js +5 -2
- package/cjs/components/Input/Selectable/InputOptionSwitchButton.d.ts +2 -1
- package/cjs/components/Input/Selectable/InputOptionSwitchButton.d.ts.map +1 -1
- package/cjs/components/Input/Selectable/InputOptionSwitchButton.js +5 -1
- package/cjs/components/Input/Selectable/InputRadiobutton.d.ts +10 -0
- package/cjs/components/Input/Selectable/InputRadiobutton.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputRadiobutton.js +45 -0
- package/cjs/components/Input/Selectable/InputSelectbox.d.ts +12 -0
- package/cjs/components/Input/Selectable/InputSelectbox.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputSelectbox.js +92 -0
- package/cjs/components/atoms/button.ui.d.ts +6 -0
- package/cjs/components/atoms/button.ui.d.ts.map +1 -0
- package/cjs/components/atoms/button.ui.js +31 -0
- package/cjs/components/atoms/card-select.ui.d.ts +14 -0
- package/cjs/components/atoms/card-select.ui.d.ts.map +1 -0
- package/cjs/components/atoms/card-select.ui.js +72 -0
- package/cjs/components/atoms/checkbox.ui.d.ts +9 -0
- package/cjs/components/atoms/checkbox.ui.d.ts.map +1 -0
- package/cjs/components/atoms/checkbox.ui.js +86 -0
- package/cjs/components/atoms/chip.ui.d.ts +10 -0
- package/cjs/components/atoms/chip.ui.d.ts.map +1 -0
- package/cjs/components/atoms/chip.ui.js +35 -0
- package/cjs/components/atoms/index.d.ts +9 -0
- package/cjs/components/atoms/index.d.ts.map +1 -0
- package/cjs/components/atoms/index.js +62 -0
- package/cjs/components/atoms/info-card.ui.d.ts +7 -0
- package/cjs/components/atoms/info-card.ui.d.ts.map +1 -0
- package/cjs/components/atoms/info-card.ui.js +36 -0
- package/cjs/components/atoms/radio.ui.d.ts +14 -0
- package/cjs/components/atoms/radio.ui.d.ts.map +1 -0
- package/cjs/components/atoms/radio.ui.js +52 -0
- package/cjs/components/atoms/select.ui.d.ts +19 -0
- package/cjs/components/atoms/select.ui.d.ts.map +1 -0
- package/cjs/components/atoms/select.ui.js +87 -0
- package/cjs/components/atoms/textarea.ui.d.ts +5 -0
- package/cjs/components/atoms/textarea.ui.d.ts.map +1 -0
- package/cjs/components/atoms/textarea.ui.js +33 -0
- package/cjs/components/atoms/textbox.ui.d.ts +6 -1
- package/cjs/components/atoms/textbox.ui.d.ts.map +1 -1
- package/cjs/components/atoms/textbox.ui.js +54 -7
- package/cjs/constant/chip.constant.d.ts +5 -0
- package/cjs/constant/chip.constant.d.ts.map +1 -0
- package/cjs/constant/chip.constant.js +10 -0
- package/cjs/context/Input.d.ts +15 -0
- package/cjs/context/Input.d.ts.map +1 -1
- package/cjs/index.d.ts +12 -1
- package/cjs/index.d.ts.map +1 -1
- package/cjs/index.js +77 -16
- package/dist/index.css +1083 -3
- package/lib/assets/icon-check.d.ts +7 -0
- package/lib/assets/icon-check.d.ts.map +1 -0
- package/lib/assets/icon-check.js +22 -0
- package/lib/assets/icon-close.d.ts +3 -0
- package/lib/assets/icon-close.d.ts.map +1 -0
- package/lib/assets/icon-close.js +18 -0
- package/lib/assets/icon-selectbox-arrow.d.ts +7 -0
- package/lib/assets/icon-selectbox-arrow.d.ts.map +1 -0
- package/lib/assets/icon-selectbox-arrow.js +22 -0
- package/lib/assets/index.d.ts +4 -0
- package/lib/assets/index.d.ts.map +1 -0
- package/lib/assets/index.js +3 -0
- package/lib/components/Input/Chip/InputChipButton.d.ts +5 -0
- package/lib/components/Input/Chip/InputChipButton.d.ts.map +1 -0
- package/lib/components/Input/Chip/InputChipButton.js +24 -0
- package/lib/components/Input/Chip/InputChipRow.d.ts +13 -0
- package/lib/components/Input/Chip/InputChipRow.d.ts.map +1 -0
- package/lib/components/Input/Chip/InputChipRow.js +89 -0
- package/lib/components/Input/Chip/InputTextbox.d.ts +5 -0
- package/lib/components/Input/Chip/InputTextbox.d.ts.map +1 -0
- package/lib/components/Input/Chip/InputTextbox.js +23 -0
- package/lib/components/Input/Chip/index.d.ts +15 -0
- package/lib/components/Input/Chip/index.d.ts.map +1 -0
- package/lib/components/Input/Chip/index.js +10 -0
- package/lib/components/Input/Selectable/InputButtonMultiSelect.d.ts +14 -0
- package/lib/components/Input/Selectable/InputButtonMultiSelect.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputButtonMultiSelect.js +89 -0
- package/lib/components/Input/Selectable/InputButtonSelect.d.ts +14 -0
- package/lib/components/Input/Selectable/InputButtonSelect.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputButtonSelect.js +58 -0
- package/lib/components/Input/Selectable/InputButtonSelectButton.d.ts +14 -0
- package/lib/components/Input/Selectable/InputButtonSelectButton.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputButtonSelectButton.js +71 -0
- package/lib/components/Input/Selectable/InputCardSelect.d.ts +14 -0
- package/lib/components/Input/Selectable/InputCardSelect.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputCardSelect.js +58 -0
- package/lib/components/Input/Selectable/InputCardSelectButton.d.ts +14 -0
- package/lib/components/Input/Selectable/InputCardSelectButton.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputCardSelectButton.js +78 -0
- package/lib/components/Input/Selectable/InputCheckbox.d.ts +11 -0
- package/lib/components/Input/Selectable/InputCheckbox.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputCheckbox.js +37 -0
- package/lib/components/Input/Selectable/InputOptionSwitch.d.ts.map +1 -1
- package/lib/components/Input/Selectable/InputOptionSwitch.js +6 -2
- package/lib/components/Input/Selectable/InputOptionSwitchButton.d.ts +2 -1
- package/lib/components/Input/Selectable/InputOptionSwitchButton.d.ts.map +1 -1
- package/lib/components/Input/Selectable/InputOptionSwitchButton.js +4 -1
- package/lib/components/Input/Selectable/InputRadiobutton.d.ts +10 -0
- package/lib/components/Input/Selectable/InputRadiobutton.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputRadiobutton.js +38 -0
- package/lib/components/Input/Selectable/InputSelectbox.d.ts +12 -0
- package/lib/components/Input/Selectable/InputSelectbox.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputSelectbox.js +85 -0
- package/lib/components/atoms/button.ui.d.ts +6 -0
- package/lib/components/atoms/button.ui.d.ts.map +1 -0
- package/lib/components/atoms/button.ui.js +24 -0
- package/lib/components/atoms/card-select.ui.d.ts +14 -0
- package/lib/components/atoms/card-select.ui.d.ts.map +1 -0
- package/lib/components/atoms/card-select.ui.js +65 -0
- package/lib/components/atoms/checkbox.ui.d.ts +9 -0
- package/lib/components/atoms/checkbox.ui.d.ts.map +1 -0
- package/lib/components/atoms/checkbox.ui.js +79 -0
- package/lib/components/atoms/chip.ui.d.ts +10 -0
- package/lib/components/atoms/chip.ui.d.ts.map +1 -0
- package/lib/components/atoms/chip.ui.js +28 -0
- package/lib/components/atoms/index.d.ts +9 -0
- package/lib/components/atoms/index.d.ts.map +1 -0
- package/lib/components/atoms/index.js +8 -0
- package/lib/components/atoms/info-card.ui.d.ts +7 -0
- package/lib/components/atoms/info-card.ui.d.ts.map +1 -0
- package/lib/components/atoms/info-card.ui.js +29 -0
- package/lib/components/atoms/radio.ui.d.ts +14 -0
- package/lib/components/atoms/radio.ui.d.ts.map +1 -0
- package/lib/components/atoms/radio.ui.js +45 -0
- package/lib/components/atoms/select.ui.d.ts +19 -0
- package/lib/components/atoms/select.ui.d.ts.map +1 -0
- package/lib/components/atoms/select.ui.js +80 -0
- package/lib/components/atoms/textarea.ui.d.ts +5 -0
- package/lib/components/atoms/textarea.ui.d.ts.map +1 -0
- package/lib/components/atoms/textarea.ui.js +26 -0
- package/lib/components/atoms/textbox.ui.d.ts +6 -1
- package/lib/components/atoms/textbox.ui.d.ts.map +1 -1
- package/lib/components/atoms/textbox.ui.js +56 -9
- package/lib/constant/chip.constant.d.ts +5 -0
- package/lib/constant/chip.constant.d.ts.map +1 -0
- package/lib/constant/chip.constant.js +4 -0
- package/lib/context/Input.d.ts +15 -0
- package/lib/context/Input.d.ts.map +1 -1
- package/lib/index.d.ts +12 -1
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +17 -3
- package/package.json +1 -1
|
@@ -0,0 +1,78 @@
|
|
|
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"] = void 0;
|
|
8
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
var _atoms = require("../../atoms");
|
|
11
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
var _excluded = ["title", "size", "icon", "description", "disabled", "isSelected", "eventKey", "onSelect", "onClick", "children", "className"];
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
14
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
15
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
16
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
17
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
18
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
19
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
20
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
21
|
+
var InputButtonSelectButton = function InputButtonSelectButton(_ref) {
|
|
22
|
+
var title = _ref.title,
|
|
23
|
+
_ref$size = _ref.size,
|
|
24
|
+
size = _ref$size === void 0 ? 'normal' : _ref$size,
|
|
25
|
+
icon = _ref.icon,
|
|
26
|
+
description = _ref.description,
|
|
27
|
+
disabled = _ref.disabled,
|
|
28
|
+
isSelected = _ref.isSelected,
|
|
29
|
+
eventKey = _ref.eventKey,
|
|
30
|
+
onSelect = _ref.onSelect,
|
|
31
|
+
onClick = _ref.onClick,
|
|
32
|
+
children = _ref.children,
|
|
33
|
+
className = _ref.className,
|
|
34
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
35
|
+
var handleClick = (0, _react.useCallback)(function (e) {
|
|
36
|
+
if (disabled) {
|
|
37
|
+
e.preventDefault();
|
|
38
|
+
e.stopPropagation();
|
|
39
|
+
return;
|
|
40
|
+
}
|
|
41
|
+
if (onClick) {
|
|
42
|
+
onClick(e);
|
|
43
|
+
}
|
|
44
|
+
if (!e.defaultPrevented) {
|
|
45
|
+
if (onSelect) {
|
|
46
|
+
onSelect(eventKey !== null && eventKey !== void 0 ? eventKey : null, e);
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}, [disabled, onClick, onSelect, eventKey]);
|
|
50
|
+
var handleKeyDown = (0, _react.useCallback)(function (e) {
|
|
51
|
+
if (disabled) {
|
|
52
|
+
e.preventDefault();
|
|
53
|
+
e.stopPropagation();
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
57
|
+
e.preventDefault();
|
|
58
|
+
if (onClick) {
|
|
59
|
+
onClick(e);
|
|
60
|
+
}
|
|
61
|
+
if (!e.defaultPrevented) {
|
|
62
|
+
if (onSelect) {
|
|
63
|
+
onSelect(eventKey !== null && eventKey !== void 0 ? eventKey : null, e);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
}, [disabled, onClick, onSelect, eventKey]);
|
|
68
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_atoms.ButtonUI, _objectSpread(_objectSpread({
|
|
69
|
+
className: (0, _clsx["default"])('flexmatch-button-select-button-container', className, isSelected && 'selected', size === 'small' && 'small', size === 'normal' && 'normal'),
|
|
70
|
+
onClick: handleClick,
|
|
71
|
+
onKeyDown: handleKeyDown,
|
|
72
|
+
tabIndex: disabled ? -1 : 0,
|
|
73
|
+
"aria-disabled": disabled
|
|
74
|
+
}, props), {}, {
|
|
75
|
+
children: [icon, title]
|
|
76
|
+
}));
|
|
77
|
+
};
|
|
78
|
+
var _default = exports["default"] = InputButtonSelectButton;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { InputSelectableExtraOption, InputSelectableProps } from '@/context/Input';
|
|
2
|
+
export interface InputCardSelectProps<T> extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>, InputSelectableProps<T> {
|
|
3
|
+
id?: string | undefined;
|
|
4
|
+
title?: string | undefined;
|
|
5
|
+
description?: string | undefined;
|
|
6
|
+
extraOptions: InputSelectableExtraOption<T>[];
|
|
7
|
+
size?: 'small' | 'normal';
|
|
8
|
+
}
|
|
9
|
+
declare const InputCardSelect: {
|
|
10
|
+
<T>({ id, className, options, size, value, onChange, title, description, extraOptions, ...props }: InputCardSelectProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
displayName: string;
|
|
12
|
+
};
|
|
13
|
+
export default InputCardSelect;
|
|
14
|
+
//# sourceMappingURL=InputCardSelect.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputCardSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputCardSelect.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,0BAA0B,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAInF,MAAM,WAAW,oBAAoB,CAAC,CAAC,CACrC,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC;IACvF,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,YAAY,EAAE,0BAA0B,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9C,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC3B;AACD,QAAA,MAAM,eAAe;KAAI,CAAC,iGAWvB,oBAAoB,CAAC,CAAC,CAAC;;CAiCzB,CAAC;AAEF,eAAe,eAAe,CAAC"}
|
|
@@ -0,0 +1,65 @@
|
|
|
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"] = void 0;
|
|
8
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
var _InputCardSelectButton = _interopRequireDefault(require("./InputCardSelectButton"));
|
|
11
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
var _excluded = ["id", "className", "options", "size", "value", "onChange", "title", "description", "extraOptions"];
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
14
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
15
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
16
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
17
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
18
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
19
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
20
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
21
|
+
var InputCardSelect = function InputCardSelect(_ref) {
|
|
22
|
+
var id = _ref.id,
|
|
23
|
+
className = _ref.className,
|
|
24
|
+
options = _ref.options,
|
|
25
|
+
_ref$size = _ref.size,
|
|
26
|
+
size = _ref$size === void 0 ? 'normal' : _ref$size,
|
|
27
|
+
value = _ref.value,
|
|
28
|
+
onChange = _ref.onChange,
|
|
29
|
+
title = _ref.title,
|
|
30
|
+
description = _ref.description,
|
|
31
|
+
extraOptions = _ref.extraOptions,
|
|
32
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
33
|
+
var handleSelect = (0, _react.useCallback)(function (eventKey) {
|
|
34
|
+
if (eventKey !== null) {
|
|
35
|
+
var option = options.find(function (opt) {
|
|
36
|
+
return String(opt.value) === String(eventKey);
|
|
37
|
+
});
|
|
38
|
+
if (option && onChange) {
|
|
39
|
+
onChange(option.value);
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
}, [options, onChange]);
|
|
43
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({
|
|
44
|
+
id: id,
|
|
45
|
+
className: (0, _clsx["default"])(className, 'flexmatch-card-select-container')
|
|
46
|
+
}, props), {}, {
|
|
47
|
+
children: options.map(function (option) {
|
|
48
|
+
var extraOption = extraOptions.find(function (opt) {
|
|
49
|
+
return opt.value === option.value;
|
|
50
|
+
});
|
|
51
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputCardSelectButton["default"], {
|
|
52
|
+
size: size,
|
|
53
|
+
disabled: option.disabled,
|
|
54
|
+
isSelected: option.value === value,
|
|
55
|
+
eventKey: String(option.value),
|
|
56
|
+
onSelect: handleSelect,
|
|
57
|
+
title: option.label,
|
|
58
|
+
description: extraOption === null || extraOption === void 0 ? void 0 : extraOption.description,
|
|
59
|
+
icon: extraOption === null || extraOption === void 0 ? void 0 : extraOption.icon
|
|
60
|
+
}, String(option.value));
|
|
61
|
+
})
|
|
62
|
+
}));
|
|
63
|
+
};
|
|
64
|
+
InputCardSelect.displayName = 'InputCardSelect';
|
|
65
|
+
var _default = exports["default"] = InputCardSelect;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
interface InputCardSelectButtonProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {
|
|
2
|
+
size?: 'small' | 'normal';
|
|
3
|
+
title?: string | undefined;
|
|
4
|
+
icon?: React.ReactNode | undefined;
|
|
5
|
+
description?: string | undefined;
|
|
6
|
+
disabled?: boolean | undefined;
|
|
7
|
+
isSelected?: boolean | undefined;
|
|
8
|
+
eventKey?: string | number | null | undefined;
|
|
9
|
+
onSelect?: ((eventKey: string | number | null, event: React.SyntheticEvent<HTMLElement>) => void) | undefined;
|
|
10
|
+
onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
11
|
+
}
|
|
12
|
+
declare const InputCardSelectButton: ({ title, size, icon, description, disabled, isSelected, eventKey, onSelect, onClick, children, className, ...props }: InputCardSelectButtonProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export default InputCardSelectButton;
|
|
14
|
+
//# sourceMappingURL=InputCardSelectButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputCardSelectButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputCardSelectButton.tsx"],"names":[],"mappings":"AAUA,UAAU,0BAA2B,SAAQ,IAAI,CAC/C,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,UAAU,CACX;IACC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAE1B,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IAEnC,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAEjC,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAE/B,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAEjC,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAE9C,QAAQ,CAAC,EACL,CAAC,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC,GACtF,SAAS,CAAC;IAEd,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,GAAG,SAAS,CAAC;CAC/D;AAED,QAAA,MAAM,qBAAqB,GAAI,sHAa5B,0BAA0B,4CAgE5B,CAAC;AACF,eAAe,qBAAqB,CAAC"}
|
|
@@ -0,0 +1,85 @@
|
|
|
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"] = void 0;
|
|
8
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
var _cardSelect = require("../../atoms/card-select.ui");
|
|
11
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
var _excluded = ["title", "size", "icon", "description", "disabled", "isSelected", "eventKey", "onSelect", "onClick", "children", "className"];
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
14
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
15
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
16
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
17
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
18
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
19
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
20
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
21
|
+
var InputCardSelectButton = function InputCardSelectButton(_ref) {
|
|
22
|
+
var title = _ref.title,
|
|
23
|
+
_ref$size = _ref.size,
|
|
24
|
+
size = _ref$size === void 0 ? 'normal' : _ref$size,
|
|
25
|
+
icon = _ref.icon,
|
|
26
|
+
description = _ref.description,
|
|
27
|
+
disabled = _ref.disabled,
|
|
28
|
+
isSelected = _ref.isSelected,
|
|
29
|
+
eventKey = _ref.eventKey,
|
|
30
|
+
onSelect = _ref.onSelect,
|
|
31
|
+
onClick = _ref.onClick,
|
|
32
|
+
children = _ref.children,
|
|
33
|
+
className = _ref.className,
|
|
34
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
35
|
+
var handleClick = (0, _react.useCallback)(function (e) {
|
|
36
|
+
if (disabled) {
|
|
37
|
+
e.preventDefault();
|
|
38
|
+
e.stopPropagation();
|
|
39
|
+
return;
|
|
40
|
+
}
|
|
41
|
+
if (onClick) {
|
|
42
|
+
onClick(e);
|
|
43
|
+
}
|
|
44
|
+
if (!e.defaultPrevented) {
|
|
45
|
+
if (onSelect) {
|
|
46
|
+
onSelect(eventKey !== null && eventKey !== void 0 ? eventKey : null, e);
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}, [disabled, onClick, onSelect, eventKey]);
|
|
50
|
+
var handleKeyDown = (0, _react.useCallback)(function (e) {
|
|
51
|
+
if (disabled) {
|
|
52
|
+
e.preventDefault();
|
|
53
|
+
e.stopPropagation();
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
57
|
+
e.preventDefault();
|
|
58
|
+
if (onClick) {
|
|
59
|
+
onClick(e);
|
|
60
|
+
}
|
|
61
|
+
if (!e.defaultPrevented) {
|
|
62
|
+
if (onSelect) {
|
|
63
|
+
onSelect(eventKey !== null && eventKey !== void 0 ? eventKey : null, e);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
}, [disabled, onClick, onSelect, eventKey]);
|
|
68
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_cardSelect.CardSelectContainerUI, _objectSpread(_objectSpread({
|
|
69
|
+
className: (0, _clsx["default"])(className, isSelected && 'selected', size === 'small' && 'small', size === 'normal' && 'normal'),
|
|
70
|
+
onClick: handleClick,
|
|
71
|
+
onKeyDown: handleKeyDown,
|
|
72
|
+
tabIndex: disabled ? -1 : 0,
|
|
73
|
+
"aria-disabled": disabled
|
|
74
|
+
}, props), {}, {
|
|
75
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_cardSelect.CardSelectIconUI, {
|
|
76
|
+
children: icon
|
|
77
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_cardSelect.CardSelectContentUI, {
|
|
78
|
+
title: title,
|
|
79
|
+
description: description
|
|
80
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_cardSelect.CardSelectContentButtonUI, {
|
|
81
|
+
isSelected: isSelected
|
|
82
|
+
})]
|
|
83
|
+
}));
|
|
84
|
+
};
|
|
85
|
+
var _default = exports["default"] = InputCardSelectButton;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { InputSelectableProps } from '@/context/Input';
|
|
2
|
+
export interface InputCheckboxProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>, InputSelectableProps<boolean> {
|
|
3
|
+
id?: string | undefined;
|
|
4
|
+
disabled?: boolean | undefined;
|
|
5
|
+
label?: string | undefined;
|
|
6
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
7
|
+
required?: boolean;
|
|
8
|
+
}
|
|
9
|
+
declare const InputCheckbox: import("react").ForwardRefExoticComponent<InputCheckboxProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
10
|
+
export default InputCheckbox;
|
|
11
|
+
//# sourceMappingURL=InputCheckbox.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputCheckbox.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputCheckbox.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAEvD,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EAAE,oBAAoB,CAAC,OAAO,CAAC;IAC7F,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,aAAa,iHAiBlB,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -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["default"] = void 0;
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
var _atoms = require("../../atoms");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
var _excluded = ["id", "className", "label", "disabled", "value", "onChange", "size", "required"];
|
|
12
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
13
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
14
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
15
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
16
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
17
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
18
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
19
|
+
var InputCheckbox = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
20
|
+
var id = _ref.id,
|
|
21
|
+
className = _ref.className,
|
|
22
|
+
label = _ref.label,
|
|
23
|
+
disabled = _ref.disabled,
|
|
24
|
+
value = _ref.value,
|
|
25
|
+
onChange = _ref.onChange,
|
|
26
|
+
_ref$size = _ref.size,
|
|
27
|
+
size = _ref$size === void 0 ? 'md' : _ref$size,
|
|
28
|
+
required = _ref.required,
|
|
29
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
30
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_atoms.CheckboxUI, _objectSpread({
|
|
31
|
+
id: id,
|
|
32
|
+
className: className,
|
|
33
|
+
label: label,
|
|
34
|
+
disabled: disabled,
|
|
35
|
+
checked: value !== null && value !== void 0 ? value : true,
|
|
36
|
+
onChange: onChange,
|
|
37
|
+
size: size,
|
|
38
|
+
required: required,
|
|
39
|
+
ref: ref
|
|
40
|
+
}, props));
|
|
41
|
+
});
|
|
42
|
+
InputCheckbox.displayName = 'InputCheckbox';
|
|
43
|
+
var _default = exports["default"] = InputCheckbox;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputOptionSwitch.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputOptionSwitch.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"InputOptionSwitch.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputOptionSwitch.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAStD,MAAM,WAAW,sBAAsB,CAAC,CAAC,CACvC,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC;IACvF,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACzB;AAED,QAAA,MAAM,iBAAiB;KAAI,CAAC,gDAMzB,sBAAsB,CAAC,CAAC,CAAC;;CAqC3B,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|
|
@@ -9,7 +9,9 @@ var _react = require("react");
|
|
|
9
9
|
var _InputOptionSwitchButton = _interopRequireDefault(require("./InputOptionSwitchButton"));
|
|
10
10
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
11
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
12
|
-
|
|
12
|
+
// 값이 이원화되어있습니다.
|
|
13
|
+
// 해당 값을 변경할 경우 react-ui/src/css/option-switch.ui.css 파일의 --flexmatch-input-option-switch-size 값을 수정해주세요.
|
|
14
|
+
var FLEXMATCH_INPUT_OPTION_SWITCH_SIZE = 100;
|
|
13
15
|
var InputOptionSwitch = function InputOptionSwitch(_ref) {
|
|
14
16
|
var id = _ref.id,
|
|
15
17
|
className = _ref.className,
|
|
@@ -23,7 +25,7 @@ var InputOptionSwitch = function InputOptionSwitch(_ref) {
|
|
|
23
25
|
if (index === -1) {
|
|
24
26
|
return 0;
|
|
25
27
|
}
|
|
26
|
-
return index *
|
|
28
|
+
return index * FLEXMATCH_INPUT_OPTION_SWITCH_SIZE;
|
|
27
29
|
}, [options, value]);
|
|
28
30
|
var handleSelect = (0, _react.useCallback)(function (eventKey) {
|
|
29
31
|
if (eventKey !== null) {
|
|
@@ -44,6 +46,7 @@ var InputOptionSwitch = function InputOptionSwitch(_ref) {
|
|
|
44
46
|
}
|
|
45
47
|
}), options.map(function (option) {
|
|
46
48
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputOptionSwitchButton["default"], {
|
|
49
|
+
isSelected: option.value === value,
|
|
47
50
|
eventKey: String(option.value),
|
|
48
51
|
disabled: !!option.disabled,
|
|
49
52
|
onSelect: function onSelect(eventKey) {
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
export interface InputOptionSwitchButtonProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {
|
|
2
2
|
disabled?: boolean | undefined;
|
|
3
|
+
isSelected?: boolean | undefined;
|
|
3
4
|
eventKey?: string | number | null | undefined;
|
|
4
5
|
onSelect?: ((eventKey: string | number | null, event: React.SyntheticEvent<HTMLElement>) => void) | undefined;
|
|
5
6
|
onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
6
7
|
}
|
|
7
|
-
declare const InputOptionSwitchButton: ({ disabled, eventKey, onSelect, onClick, children, ...props }: InputOptionSwitchButtonProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
declare const InputOptionSwitchButton: ({ disabled, isSelected, eventKey, onSelect, onClick, children, ...props }: InputOptionSwitchButtonProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
9
|
export default InputOptionSwitchButton;
|
|
9
10
|
//# sourceMappingURL=InputOptionSwitchButton.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputOptionSwitchButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputOptionSwitchButton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"InputOptionSwitchButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputOptionSwitchButton.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,4BAA6B,SAAQ,IAAI,CACxD,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,UAAU,CACX;IACC,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAE/B,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAEjC,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAE9C,QAAQ,CAAC,EACL,CAAC,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC,GACtF,SAAS,CAAC;IAEd,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,GAAG,SAAS,CAAC;CAC/D;AACD,QAAA,MAAM,uBAAuB,GAAI,2EAQ9B,4BAA4B,4CA2D9B,CAAC;AACF,eAAe,uBAAuB,CAAC"}
|
|
@@ -6,9 +6,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports["default"] = void 0;
|
|
8
8
|
var _optionSwitch = require("../../atoms/option-switch.ui");
|
|
9
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
9
10
|
var _react = require("react");
|
|
10
11
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
-
var _excluded = ["disabled", "eventKey", "onSelect", "onClick", "children"];
|
|
12
|
+
var _excluded = ["disabled", "isSelected", "eventKey", "onSelect", "onClick", "children"];
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
12
14
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
13
15
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
14
16
|
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
@@ -18,6 +20,7 @@ function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i
|
|
|
18
20
|
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
19
21
|
var InputOptionSwitchButton = function InputOptionSwitchButton(_ref) {
|
|
20
22
|
var disabled = _ref.disabled,
|
|
23
|
+
isSelected = _ref.isSelected,
|
|
21
24
|
eventKey = _ref.eventKey,
|
|
22
25
|
onSelect = _ref.onSelect,
|
|
23
26
|
onClick = _ref.onClick,
|
|
@@ -57,6 +60,7 @@ var InputOptionSwitchButton = function InputOptionSwitchButton(_ref) {
|
|
|
57
60
|
}
|
|
58
61
|
}, [disabled, onClick, onSelect, eventKey]);
|
|
59
62
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_optionSwitch.OptionSwitchButtonUI, _objectSpread(_objectSpread({
|
|
63
|
+
className: (0, _clsx["default"])('no-drag', isSelected && 'selected'),
|
|
60
64
|
disabled: !!disabled,
|
|
61
65
|
onClick: handleClick,
|
|
62
66
|
onKeyDown: handleKeyDown,
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { InputSelectableProps } from '@/context/Input';
|
|
2
|
+
export interface InputRadiobuttonProps<T> extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>, InputSelectableProps<T> {
|
|
3
|
+
id?: string | undefined;
|
|
4
|
+
}
|
|
5
|
+
declare const InputRadiobutton: {
|
|
6
|
+
<T>({ id, className, options, value, onChange, }: InputRadiobuttonProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
displayName: string;
|
|
8
|
+
};
|
|
9
|
+
export default InputRadiobutton;
|
|
10
|
+
//# sourceMappingURL=InputRadiobutton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputRadiobutton.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputRadiobutton.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAEvD,MAAM,WAAW,qBAAqB,CAAC,CAAC,CACtC,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC;IACvF,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACzB;AAED,QAAA,MAAM,gBAAgB;KAAI,CAAC,gDAMxB,qBAAqB,CAAC,CAAC,CAAC;;CA2B1B,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
var _atoms = require("../../atoms");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
12
|
+
var InputRadiobutton = function InputRadiobutton(_ref) {
|
|
13
|
+
var id = _ref.id,
|
|
14
|
+
className = _ref.className,
|
|
15
|
+
options = _ref.options,
|
|
16
|
+
value = _ref.value,
|
|
17
|
+
onChange = _ref.onChange;
|
|
18
|
+
var handleClick = (0, _react.useCallback)(function (eventKey) {
|
|
19
|
+
if (eventKey !== null) {
|
|
20
|
+
var option = options.find(function (opt) {
|
|
21
|
+
return String(opt.value) === String(eventKey);
|
|
22
|
+
});
|
|
23
|
+
if (option && onChange) {
|
|
24
|
+
onChange(option.value);
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
}, [options, onChange]);
|
|
28
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
29
|
+
id: id,
|
|
30
|
+
className: (0, _clsx["default"])(className, 'flexmatch-radiobutton-container'),
|
|
31
|
+
children: options.map(function (option) {
|
|
32
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_atoms.RadioUI, {
|
|
33
|
+
className: 'flexmatch-radiobutton-item',
|
|
34
|
+
onClick: function onClick() {
|
|
35
|
+
return !option.disabled && handleClick(String(option.value));
|
|
36
|
+
},
|
|
37
|
+
checked: option.value === value,
|
|
38
|
+
disabled: !!option.disabled,
|
|
39
|
+
children: option.label
|
|
40
|
+
}, String(option.value));
|
|
41
|
+
})
|
|
42
|
+
});
|
|
43
|
+
};
|
|
44
|
+
InputRadiobutton.displayName = 'InputRadiobutton';
|
|
45
|
+
var _default = exports["default"] = InputRadiobutton;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { InputSelectableProps } from '@/context/Input';
|
|
2
|
+
export interface InputSelectboxProps<T> extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>, InputSelectableProps<T> {
|
|
3
|
+
id?: string | undefined;
|
|
4
|
+
disabled?: boolean | undefined;
|
|
5
|
+
placeholder?: string | undefined;
|
|
6
|
+
}
|
|
7
|
+
declare const InputSelectbox: {
|
|
8
|
+
<T>({ id, className, options, value, onChange, disabled, placeholder, }: InputSelectboxProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
displayName: string;
|
|
10
|
+
};
|
|
11
|
+
export default InputSelectbox;
|
|
12
|
+
//# sourceMappingURL=InputSelectbox.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputSelectbox.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputSelectbox.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAEvD,MAAM,WAAW,mBAAmB,CAAC,CAAC,CACpC,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC;IACvF,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAClC;AACD,QAAA,MAAM,cAAc;KAAI,CAAC,uEAQtB,mBAAmB,CAAC,CAAC,CAAC;;CAiExB,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
var _atoms = require("../../atoms");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
12
|
+
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
13
|
+
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."); }
|
|
14
|
+
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
15
|
+
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
16
|
+
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; } }
|
|
17
|
+
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
18
|
+
var InputSelectbox = function InputSelectbox(_ref) {
|
|
19
|
+
var id = _ref.id,
|
|
20
|
+
className = _ref.className,
|
|
21
|
+
options = _ref.options,
|
|
22
|
+
value = _ref.value,
|
|
23
|
+
onChange = _ref.onChange,
|
|
24
|
+
disabled = _ref.disabled,
|
|
25
|
+
placeholder = _ref.placeholder;
|
|
26
|
+
var _useState = (0, _react.useState)(false),
|
|
27
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
28
|
+
isOpen = _useState2[0],
|
|
29
|
+
setIsOpen = _useState2[1];
|
|
30
|
+
var selectedOption = (0, _react.useMemo)(function () {
|
|
31
|
+
return options.find(function (option) {
|
|
32
|
+
return option.value === value;
|
|
33
|
+
});
|
|
34
|
+
}, [options, value]);
|
|
35
|
+
var handleClickOpen = (0, _react.useCallback)(function (e) {
|
|
36
|
+
if (disabled) {
|
|
37
|
+
return;
|
|
38
|
+
}
|
|
39
|
+
e.preventDefault();
|
|
40
|
+
e.stopPropagation();
|
|
41
|
+
setIsOpen(true);
|
|
42
|
+
}, [disabled, setIsOpen]);
|
|
43
|
+
(0, _react.useEffect)(function () {
|
|
44
|
+
var handleClickOutside = function handleClickOutside(e) {
|
|
45
|
+
var isClickInside = e.target instanceof HTMLElement && (id ? e.target.closest('#' + id) : e.target.closest('.flexmatch-selectbox-container'));
|
|
46
|
+
if (!isClickInside) {
|
|
47
|
+
setIsOpen(false);
|
|
48
|
+
}
|
|
49
|
+
};
|
|
50
|
+
document.addEventListener('click', handleClickOutside);
|
|
51
|
+
return function () {
|
|
52
|
+
document.removeEventListener('click', handleClickOutside);
|
|
53
|
+
};
|
|
54
|
+
}, [id, setIsOpen]);
|
|
55
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
56
|
+
id: id,
|
|
57
|
+
className: (0, _clsx["default"])(className, 'flexmatch-selectbox-container'),
|
|
58
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_atoms.SelectBoxUI.Button, {
|
|
59
|
+
className: className,
|
|
60
|
+
onClick: handleClickOpen,
|
|
61
|
+
disabled: disabled,
|
|
62
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_atoms.SelectBoxUI.ItemText, {
|
|
63
|
+
className: (0, _clsx["default"])(!selectedOption && 'placeholder', disabled && 'disabled'),
|
|
64
|
+
children: (selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.label) || placeholder || '옵션을 선택해주세요'
|
|
65
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_atoms.SelectBoxUI.Toggle, {
|
|
66
|
+
isOpen: isOpen
|
|
67
|
+
})]
|
|
68
|
+
}), isOpen && !disabled && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_atoms.SelectBoxUI.Menu, {
|
|
69
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_atoms.SelectBoxUI.ButtonOverlay, {
|
|
70
|
+
onClick: function onClick() {
|
|
71
|
+
return setIsOpen(false);
|
|
72
|
+
}
|
|
73
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_atoms.SelectBoxUI.ItemBackground, {
|
|
74
|
+
children: options.map(function (option) {
|
|
75
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_atoms.SelectBoxUI.Item, {
|
|
76
|
+
disabled: option.disabled,
|
|
77
|
+
onClick: function onClick() {
|
|
78
|
+
onChange === null || onChange === void 0 || onChange(option.value);
|
|
79
|
+
setIsOpen(false);
|
|
80
|
+
},
|
|
81
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_atoms.SelectBoxUI.ItemText, {
|
|
82
|
+
className: (0, _clsx["default"])(option.disabled && 'disabled'),
|
|
83
|
+
children: option.label
|
|
84
|
+
})
|
|
85
|
+
}, String(option.value));
|
|
86
|
+
})
|
|
87
|
+
})]
|
|
88
|
+
})]
|
|
89
|
+
});
|
|
90
|
+
};
|
|
91
|
+
InputSelectbox.displayName = 'InputSelectbox';
|
|
92
|
+
var _default = exports["default"] = InputSelectbox;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
interface ButtonUIProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
2
|
+
variant?: 'chip-add';
|
|
3
|
+
}
|
|
4
|
+
declare const ButtonUI: import("react").ForwardRefExoticComponent<ButtonUIProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
5
|
+
export default ButtonUI;
|
|
6
|
+
//# sourceMappingURL=button.ui.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"button.ui.d.ts","sourceRoot":"","sources":["../../../src/components/atoms/button.ui.tsx"],"names":[],"mappings":"AAGA,UAAU,aAAc,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IAC3E,OAAO,CAAC,EAAE,UAAU,CAAC;CACtB;AAED,QAAA,MAAM,QAAQ,6GAeZ,CAAC;AAGH,eAAe,QAAQ,CAAC"}
|