@flexmatch-dev/react-ui 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +68 -0
- package/cjs/components/Input/Selectable/InputOptionSwitch.d.ts +10 -0
- package/cjs/components/Input/Selectable/InputOptionSwitch.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputOptionSwitch.js +58 -0
- package/cjs/components/Input/Selectable/InputOptionSwitchButton.d.ts +9 -0
- package/cjs/components/Input/Selectable/InputOptionSwitchButton.d.ts.map +1 -0
- package/cjs/components/Input/Selectable/InputOptionSwitchButton.js +69 -0
- package/cjs/components/atoms/option-switch.ui.d.ts +9 -0
- package/cjs/components/atoms/option-switch.ui.d.ts.map +1 -0
- package/cjs/components/atoms/option-switch.ui.js +48 -0
- package/cjs/components/atoms/textbox.ui.d.ts +4 -0
- package/cjs/components/atoms/textbox.ui.d.ts.map +1 -0
- package/cjs/components/atoms/textbox.ui.js +31 -0
- package/cjs/context/Input.d.ts +11 -0
- package/cjs/context/Input.d.ts.map +1 -0
- package/cjs/context/Input.js +5 -0
- package/cjs/index.d.ts +4 -0
- package/cjs/index.d.ts.map +1 -0
- package/cjs/index.js +36 -0
- package/cjs/package.json +1 -0
- package/dist/index.css +1066 -0
- package/lib/components/Input/Selectable/InputOptionSwitch.d.ts +10 -0
- package/lib/components/Input/Selectable/InputOptionSwitch.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputOptionSwitch.js +51 -0
- package/lib/components/Input/Selectable/InputOptionSwitchButton.d.ts +9 -0
- package/lib/components/Input/Selectable/InputOptionSwitchButton.d.ts.map +1 -0
- package/lib/components/Input/Selectable/InputOptionSwitchButton.js +63 -0
- package/lib/components/atoms/option-switch.ui.d.ts +9 -0
- package/lib/components/atoms/option-switch.ui.d.ts.map +1 -0
- package/lib/components/atoms/option-switch.ui.js +41 -0
- package/lib/components/atoms/textbox.ui.d.ts +4 -0
- package/lib/components/atoms/textbox.ui.d.ts.map +1 -0
- package/lib/components/atoms/textbox.ui.js +24 -0
- package/lib/context/Input.d.ts +11 -0
- package/lib/context/Input.d.ts.map +1 -0
- package/lib/context/Input.js +1 -0
- package/lib/index.d.ts +4 -0
- package/lib/index.d.ts.map +1 -0
- package/lib/index.js +4 -0
- package/package.json +103 -0
package/README.md
ADDED
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
# @flexmatch-dev/react-ui
|
|
2
|
+
|
|
3
|
+
React UI component library by FlexMatch
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @flexmatch-dev/react-ui
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
```tsx
|
|
14
|
+
import { Button } from '@flexmatch-dev/react-ui';
|
|
15
|
+
import '@flexmatch-dev/react-ui/dist/index.css';
|
|
16
|
+
|
|
17
|
+
function App() {
|
|
18
|
+
return <Button>Click me</Button>;
|
|
19
|
+
}
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Development
|
|
23
|
+
|
|
24
|
+
### Build
|
|
25
|
+
|
|
26
|
+
```bash
|
|
27
|
+
npm run build
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
### Development Mode
|
|
31
|
+
|
|
32
|
+
```bash
|
|
33
|
+
npm run dev
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
## Figma 리소스 빌드
|
|
37
|
+
|
|
38
|
+
Figma에서 내보낸 CSS 파일을 기반으로 Color와 Typography 변수 및 유틸리티 클래스를 자동 생성합니다.
|
|
39
|
+
|
|
40
|
+
### Figma CSS 파일 위치
|
|
41
|
+
|
|
42
|
+
- `res/figma.css` - Figma에서 내보낸 원본 CSS 파일
|
|
43
|
+
|
|
44
|
+
이 파일은 [Anima](https://www.figma.com/community/plugin/857346721138427857) Figma 플러그인을 통해 생성한 CSS입니다. 현재는 Export해서 가져올 자동화된 방법이 없으므로, Anima 플러그인에서 생성한 CSS 코드를 수동으로 `res/figma.css` 파일에 복사해야 합니다.
|
|
45
|
+
|
|
46
|
+
### 생성되는 파일
|
|
47
|
+
|
|
48
|
+
빌드 시 다음 파일들이 `src/css/_generated/` 디렉토리에 생성됩니다:
|
|
49
|
+
|
|
50
|
+
- `color-variable.css` - Color CSS 변수
|
|
51
|
+
- `color-style.css` - Color 유틸리티 클래스 (`.bg-*`, `.font-*`, `.border-*`)
|
|
52
|
+
- `typo-variable.css` - Typography CSS 변수
|
|
53
|
+
- `typo-style.css` - Typography 유틸리티 클래스 (`.text-*`)
|
|
54
|
+
- `index.css` - 모든 파일을 import하는 인덱스 파일
|
|
55
|
+
|
|
56
|
+
### 빌드 스크립트
|
|
57
|
+
|
|
58
|
+
```bash
|
|
59
|
+
# CSS만 빌드
|
|
60
|
+
npm run build:css
|
|
61
|
+
|
|
62
|
+
# 또는 직접 실행
|
|
63
|
+
node scripts/parse-figma.js
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
## License
|
|
67
|
+
|
|
68
|
+
ISC
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { InputSelectableProps } from '@context/Input';
|
|
2
|
+
export interface InputOptionSwitchProps<T> extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>, InputSelectableProps<T> {
|
|
3
|
+
id?: string | undefined;
|
|
4
|
+
}
|
|
5
|
+
declare const InputOptionSwitch: {
|
|
6
|
+
<T>({ id, className, options, value, onChange, }: InputOptionSwitchProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
displayName: string;
|
|
8
|
+
};
|
|
9
|
+
export default InputOptionSwitch;
|
|
10
|
+
//# sourceMappingURL=InputOptionSwitch.d.ts.map
|
|
@@ -0,0 +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;AAOtD,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;;CAoC3B,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
var _optionSwitch = require("../../atoms/option-switch.ui");
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
var _InputOptionSwitchButton = _interopRequireDefault(require("./InputOptionSwitchButton"));
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
12
|
+
var size = 100;
|
|
13
|
+
var InputOptionSwitch = function InputOptionSwitch(_ref) {
|
|
14
|
+
var id = _ref.id,
|
|
15
|
+
className = _ref.className,
|
|
16
|
+
options = _ref.options,
|
|
17
|
+
value = _ref.value,
|
|
18
|
+
onChange = _ref.onChange;
|
|
19
|
+
var positionX = (0, _react.useMemo)(function () {
|
|
20
|
+
var index = options.findIndex(function (option) {
|
|
21
|
+
return option.value === value;
|
|
22
|
+
});
|
|
23
|
+
if (index === -1) {
|
|
24
|
+
return 0;
|
|
25
|
+
}
|
|
26
|
+
return index * size;
|
|
27
|
+
}, [options, value]);
|
|
28
|
+
var handleSelect = (0, _react.useCallback)(function (eventKey) {
|
|
29
|
+
if (eventKey !== null) {
|
|
30
|
+
var option = options.find(function (opt) {
|
|
31
|
+
return String(opt.value) === String(eventKey);
|
|
32
|
+
});
|
|
33
|
+
if (option && onChange) {
|
|
34
|
+
onChange(option.value);
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
}, [options, onChange]);
|
|
38
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_optionSwitch.OptionSwitchContainerUI, {
|
|
39
|
+
id: id,
|
|
40
|
+
className: className,
|
|
41
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_optionSwitch.OptionSwitchSelectionUI, {
|
|
42
|
+
style: {
|
|
43
|
+
transform: "translateX(".concat(positionX, "px)")
|
|
44
|
+
}
|
|
45
|
+
}), options.map(function (option) {
|
|
46
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputOptionSwitchButton["default"], {
|
|
47
|
+
eventKey: String(option.value),
|
|
48
|
+
disabled: !!option.disabled,
|
|
49
|
+
onSelect: function onSelect(eventKey) {
|
|
50
|
+
return handleSelect(eventKey);
|
|
51
|
+
},
|
|
52
|
+
children: option.label
|
|
53
|
+
}, String(option.value));
|
|
54
|
+
})]
|
|
55
|
+
});
|
|
56
|
+
};
|
|
57
|
+
InputOptionSwitch.displayName = 'InputOptionSwitch';
|
|
58
|
+
var _default = exports["default"] = InputOptionSwitch;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export interface InputOptionSwitchButtonProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {
|
|
2
|
+
disabled?: boolean | undefined;
|
|
3
|
+
eventKey?: string | number | null | undefined;
|
|
4
|
+
onSelect?: ((eventKey: string | number | null, event: React.SyntheticEvent<HTMLElement>) => void) | undefined;
|
|
5
|
+
onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
|
|
6
|
+
}
|
|
7
|
+
declare const InputOptionSwitchButton: ({ disabled, eventKey, onSelect, onClick, children, ...props }: InputOptionSwitchButtonProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export default InputOptionSwitchButton;
|
|
9
|
+
//# sourceMappingURL=InputOptionSwitchButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputOptionSwitchButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Selectable/InputOptionSwitchButton.tsx"],"names":[],"mappings":"AAGA,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,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,+DAO9B,4BAA4B,4CA0D9B,CAAC;AACF,eAAe,uBAAuB,CAAC"}
|
|
@@ -0,0 +1,69 @@
|
|
|
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 _optionSwitch = require("../../atoms/option-switch.ui");
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
var _excluded = ["disabled", "eventKey", "onSelect", "onClick", "children"];
|
|
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 InputOptionSwitchButton = function InputOptionSwitchButton(_ref) {
|
|
20
|
+
var disabled = _ref.disabled,
|
|
21
|
+
eventKey = _ref.eventKey,
|
|
22
|
+
onSelect = _ref.onSelect,
|
|
23
|
+
onClick = _ref.onClick,
|
|
24
|
+
children = _ref.children,
|
|
25
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
26
|
+
var handleClick = (0, _react.useCallback)(function (e) {
|
|
27
|
+
if (disabled) {
|
|
28
|
+
e.preventDefault();
|
|
29
|
+
e.stopPropagation();
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
if (onClick) {
|
|
33
|
+
onClick(e);
|
|
34
|
+
}
|
|
35
|
+
if (!e.defaultPrevented) {
|
|
36
|
+
if (onSelect) {
|
|
37
|
+
onSelect(eventKey !== null && eventKey !== void 0 ? eventKey : null, e);
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}, [disabled, onClick, onSelect, eventKey]);
|
|
41
|
+
var handleKeyDown = (0, _react.useCallback)(function (e) {
|
|
42
|
+
if (disabled) {
|
|
43
|
+
e.preventDefault();
|
|
44
|
+
e.stopPropagation();
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
48
|
+
e.preventDefault();
|
|
49
|
+
if (onClick) {
|
|
50
|
+
onClick(e);
|
|
51
|
+
}
|
|
52
|
+
if (!e.defaultPrevented) {
|
|
53
|
+
if (onSelect) {
|
|
54
|
+
onSelect(eventKey !== null && eventKey !== void 0 ? eventKey : null, e);
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
}, [disabled, onClick, onSelect, eventKey]);
|
|
59
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_optionSwitch.OptionSwitchButtonUI, _objectSpread(_objectSpread({
|
|
60
|
+
disabled: !!disabled,
|
|
61
|
+
onClick: handleClick,
|
|
62
|
+
onKeyDown: handleKeyDown,
|
|
63
|
+
tabIndex: disabled ? -1 : 0,
|
|
64
|
+
"aria-disabled": disabled
|
|
65
|
+
}, props), {}, {
|
|
66
|
+
children: children
|
|
67
|
+
}));
|
|
68
|
+
};
|
|
69
|
+
var _default = exports["default"] = InputOptionSwitchButton;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
type OptionSwitchContainerUIProps = React.HTMLAttributes<HTMLDivElement>;
|
|
2
|
+
export declare const OptionSwitchContainerUI: ({ children, className, ...props }: OptionSwitchContainerUIProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
export interface OptionSwitchButtonUIProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
4
|
+
disabled?: boolean | undefined;
|
|
5
|
+
}
|
|
6
|
+
export declare const OptionSwitchButtonUI: ({ className, ...props }: OptionSwitchButtonUIProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare const OptionSwitchSelectionUI: ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export {};
|
|
9
|
+
//# sourceMappingURL=option-switch.ui.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"option-switch.ui.d.ts","sourceRoot":"","sources":["../../../src/components/atoms/option-switch.ui.tsx"],"names":[],"mappings":"AACA,KAAK,4BAA4B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;AAEzE,eAAO,MAAM,uBAAuB,GAAI,mCAIrC,4BAA4B,4CAM9B,CAAC;AAEF,MAAM,WAAW,yBAA0B,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACrF,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAChC;AACD,eAAO,MAAM,oBAAoB,GAAI,yBAAyB,yBAAyB,4CAatF,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,yBAGrC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,4CAMtC,CAAC"}
|
|
@@ -0,0 +1,48 @@
|
|
|
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.OptionSwitchSelectionUI = exports.OptionSwitchContainerUI = exports.OptionSwitchButtonUI = void 0;
|
|
8
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
9
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
10
|
+
var _excluded = ["children", "className"],
|
|
11
|
+
_excluded2 = ["className"],
|
|
12
|
+
_excluded3 = ["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 OptionSwitchContainerUI = exports.OptionSwitchContainerUI = function OptionSwitchContainerUI(_ref) {
|
|
22
|
+
var children = _ref.children,
|
|
23
|
+
className = _ref.className,
|
|
24
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
25
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({
|
|
26
|
+
className: (0, _clsx["default"])('flexmatch-input-option-switch', className)
|
|
27
|
+
}, props), {}, {
|
|
28
|
+
children: children
|
|
29
|
+
}));
|
|
30
|
+
};
|
|
31
|
+
var OptionSwitchButtonUI = exports.OptionSwitchButtonUI = function OptionSwitchButtonUI(_ref2) {
|
|
32
|
+
var className = _ref2.className,
|
|
33
|
+
props = _objectWithoutProperties(_ref2, _excluded2);
|
|
34
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({
|
|
35
|
+
className: (0, _clsx["default"])('flexmatch-input-option-switch-button', className, !!props.disabled && 'disabled')
|
|
36
|
+
}, props), {}, {
|
|
37
|
+
children: props.children
|
|
38
|
+
}));
|
|
39
|
+
};
|
|
40
|
+
var OptionSwitchSelectionUI = exports.OptionSwitchSelectionUI = function OptionSwitchSelectionUI(_ref3) {
|
|
41
|
+
var className = _ref3.className,
|
|
42
|
+
props = _objectWithoutProperties(_ref3, _excluded3);
|
|
43
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({
|
|
44
|
+
className: (0, _clsx["default"])('flexmatch-input-option-switch-selection', className)
|
|
45
|
+
}, props), {}, {
|
|
46
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {})
|
|
47
|
+
}));
|
|
48
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"textbox.ui.d.ts","sourceRoot":"","sources":["../../../src/components/atoms/textbox.ui.tsx"],"names":[],"mappings":"AAGA,KAAK,cAAc,GAAG,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;AAClE,QAAA,MAAM,SAAS,6GAYb,CAAC;AAEH,eAAe,SAAS,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
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 _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
var _excluded = ["className"];
|
|
12
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
13
|
+
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; }
|
|
14
|
+
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; }
|
|
15
|
+
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; }
|
|
16
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
17
|
+
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); }
|
|
18
|
+
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; }
|
|
19
|
+
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; }
|
|
20
|
+
var TextboxUI = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
21
|
+
var className = _ref.className,
|
|
22
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
23
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("input", _objectSpread(_objectSpread({
|
|
24
|
+
ref: ref
|
|
25
|
+
}, props), {}, {
|
|
26
|
+
type: "text",
|
|
27
|
+
className: (0, _clsx["default"])(className, 'p-2 w-full rounded-md border border-gray-200 text-b2 h-[50px] placeholder:text-gray-400 font-gray-800')
|
|
28
|
+
}));
|
|
29
|
+
});
|
|
30
|
+
TextboxUI.displayName = 'TextboxUI';
|
|
31
|
+
var _default = exports["default"] = TextboxUI;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export interface InputSelectableOption<T> {
|
|
2
|
+
label: string;
|
|
3
|
+
value: T;
|
|
4
|
+
disabled?: boolean;
|
|
5
|
+
}
|
|
6
|
+
export interface InputSelectableProps<T> {
|
|
7
|
+
value?: T | undefined;
|
|
8
|
+
onChange?: (value: T) => void;
|
|
9
|
+
options: InputSelectableOption<T>[];
|
|
10
|
+
}
|
|
11
|
+
//# sourceMappingURL=Input.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/context/Input.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,qBAAqB,CAAC,CAAC;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,oBAAoB,CAAC,CAAC;IACrC,KAAK,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B,OAAO,EAAE,qBAAqB,CAAC,CAAC,CAAC,EAAE,CAAC;CACrC"}
|
package/cjs/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,yBAAyB,CAAC;AACxC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,gDAAgD,CAAC"}
|
package/cjs/index.js
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
var _exportNames = {
|
|
7
|
+
TextboxUI: true,
|
|
8
|
+
InputOptionSwitch: true
|
|
9
|
+
};
|
|
10
|
+
Object.defineProperty(exports, "InputOptionSwitch", {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function get() {
|
|
13
|
+
return _InputOptionSwitch["default"];
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
Object.defineProperty(exports, "TextboxUI", {
|
|
17
|
+
enumerable: true,
|
|
18
|
+
get: function get() {
|
|
19
|
+
return _textbox["default"];
|
|
20
|
+
}
|
|
21
|
+
});
|
|
22
|
+
var _optionSwitch = require("./components/atoms/option-switch.ui");
|
|
23
|
+
Object.keys(_optionSwitch).forEach(function (key) {
|
|
24
|
+
if (key === "default" || key === "__esModule") return;
|
|
25
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
26
|
+
if (key in exports && exports[key] === _optionSwitch[key]) return;
|
|
27
|
+
Object.defineProperty(exports, key, {
|
|
28
|
+
enumerable: true,
|
|
29
|
+
get: function get() {
|
|
30
|
+
return _optionSwitch[key];
|
|
31
|
+
}
|
|
32
|
+
});
|
|
33
|
+
});
|
|
34
|
+
var _textbox = _interopRequireDefault(require("./components/atoms/textbox.ui"));
|
|
35
|
+
var _InputOptionSwitch = _interopRequireDefault(require("./components/Input/Selectable/InputOptionSwitch"));
|
|
36
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
package/cjs/package.json
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"type": "commonjs"}
|