@euler-edu/react 0.0.0-stage → 7.0.1-beta1

package/lib/components/atoms/editors/CodeEditor.js

@@ -0,0 +1,217 @@
+'use client';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importDefault(require("react"));
+const monaco = __importStar(require("monaco-editor/editor/editor.api"));
+require("monaco-editor/editor/editor.main");
+const styled_components_1 = require("styled-components");
+const oj_submit_1 = require("@euler-edu/constant/oj-submit");
+const styles_1 = require("@euler-edu/constant/styles");
+const shortcuts_1 = require("../../../utils/shortcuts");
+const styles_2 = require("../../../utils/styles");
+const stores_1 = require("../../../hooks/stores");
+const atoms_1 = require("../../../components/atoms");
+const editorShortcutLabels = {
+    'problem-editor': '코드 실행',
+    'problem-submit': '코드 제출',
+    'editor-save': '코드 저장',
+};
+const getInitValue = (language, initValue) => {
+    if (typeof initValue === 'string')
+        return initValue;
+    if (language in oj_submit_1.ojSubmit.defaultCodes)
+        return oj_submit_1.ojSubmit.defaultCodes[language].join('\n');
+    return '';
+};
+exports.default = ({ language = 'plaintext', theme: _theme, isReadOnly = false, initValue, initValueVersion, onChangeValue, onChangeLineNumber, onChangeColumnNumber, $letterSpacing: _$letterSpacing, $font: _$font, $fontSize: _$fontSize, $tabSize: _$tabSize, $height: _$height, ...props }) => {
+    var _a, _b, _c, _d;
+    const ref = react_1.default.useRef(null);
+    const instanceRef = react_1.default.useRef(null);
+    const { editorConfig, ojEnvConfig } = (0, stores_1.useConfigStore)();
+    const { clientPlatform } = (0, stores_1.useClientStore)();
+    const { isDisabled: isShortcutStoreDisabled, shortcutEvents } = (0, stores_1.useShortcutStore)();
+    const { shortcuts, isShortcutDisabled } = ojEnvConfig;
+    const { theme: defaultTheme, letterSpacing: defaultLetterSpacing, font: defaultFont, fontSize: defaultFontSize, tabSize: defaultTabSize, } = editorConfig;
+    const editorTheme = _theme || defaultTheme || 'vs-dark';
+    const $letterSpacing = (_a = _$letterSpacing !== null && _$letterSpacing !== void 0 ? _$letterSpacing : defaultLetterSpacing) !== null && _a !== void 0 ? _a : 0;
+    const $font = (_b = _$font !== null && _$font !== void 0 ? _$font : defaultFont) !== null && _b !== void 0 ? _b : styles_1.codeFonts[0].font;
+    const $fontSize = (_c = _$fontSize !== null && _$fontSize !== void 0 ? _$fontSize : defaultFontSize) !== null && _c !== void 0 ? _c : 14;
+    const $tabSize = (_d = _$tabSize !== null && _$tabSize !== void 0 ? _$tabSize : defaultTabSize) !== null && _d !== void 0 ? _d : 2;
+    const [contentHeight, setContentHeight] = react_1.default.useState(0);
+    const $height = _$height !== null && _$height !== void 0 ? _$height : contentHeight + styles_2.theme.size.height.base.large;
+    react_1.default.useEffect(() => {
+        if (!ref.current)
+            return;
+        instanceRef.current = monaco.editor.create(ref.current, {
+            value: getInitValue(language, initValue),
+            language,
+            theme: editorTheme,
+            readOnly: isReadOnly,
+            letterSpacing: $letterSpacing,
+            fontFamily: $font,
+            fontSize: $fontSize,
+            tabSize: $tabSize,
+            automaticLayout: true,
+            scrollBeyondLastLine: false,
+            detectIndentation: false,
+            minimap: { enabled: true },
+            scrollbar: { alwaysConsumeMouseWheel: false },
+        });
+        return () => {
+            if (instanceRef.current) {
+                instanceRef.current.dispose();
+            }
+        };
+    }, []);
+    react_1.default.useEffect(() => {
+        if (!instanceRef.current)
+            return;
+        instanceRef.current.setValue(getInitValue(language, initValue));
+    }, [initValue, initValueVersion]);
+    react_1.default.useEffect(() => {
+        var _a, _b;
+        const model = (_b = (_a = instanceRef.current) === null || _a === void 0 ? void 0 : _a.getModel) === null || _b === void 0 ? void 0 : _b.call(_a);
+        if (!model)
+            return;
+        monaco.editor.setModelLanguage(model, language);
+    }, [language]);
+    react_1.default.useEffect(() => {
+        monaco.editor.setTheme(editorTheme);
+    }, [editorTheme]);
+    react_1.default.useEffect(() => {
+        if (!instanceRef.current || !onChangeValue)
+            return;
+        const disposable = instanceRef.current.onDidChangeModelContent(() => {
+            if (!instanceRef.current)
+                return;
+            onChangeValue(instanceRef.current.getValue());
+        });
+        return () => disposable.dispose();
+    }, [onChangeValue]);
+    react_1.default.useEffect(() => {
+        if (!instanceRef.current)
+            return;
+        const disposable = instanceRef.current.onDidChangeCursorPosition(e => {
+            if (!instanceRef.current)
+                return;
+            onChangeLineNumber === null || onChangeLineNumber === void 0 ? void 0 : onChangeLineNumber(e.position.lineNumber);
+            onChangeColumnNumber === null || onChangeColumnNumber === void 0 ? void 0 : onChangeColumnNumber(e.position.column);
+        });
+        return () => disposable.dispose();
+    }, [onChangeLineNumber, onChangeColumnNumber]);
+    react_1.default.useEffect(() => {
+        if (!instanceRef.current)
+            return;
+        setContentHeight(instanceRef.current.getContentHeight());
+        const disposable = instanceRef.current.onDidChangeModelContent(() => {
+            if (!instanceRef.current)
+                return;
+            setContentHeight(instanceRef.current.getContentHeight());
+        });
+        return () => disposable.dispose();
+    }, []);
+    react_1.default.useEffect(() => {
+        var _a, _b;
+        if (!instanceRef.current)
+            return;
+        instanceRef.current.updateOptions({
+            readOnly: isReadOnly,
+            letterSpacing: $letterSpacing,
+            fontFamily: $font,
+            fontSize: $fontSize,
+            tabSize: $tabSize,
+        });
+        (_b = (_a = instanceRef.current.getModel()) === null || _a === void 0 ? void 0 : _a.updateOptions) === null || _b === void 0 ? void 0 : _b.call(_a, {
+            tabSize: $tabSize,
+        });
+    }, [isReadOnly, $letterSpacing, $font, $fontSize, $tabSize]);
+    react_1.default.useEffect(() => {
+        if (!instanceRef.current)
+            return;
+        instanceRef.current.layout();
+    }, [$height]);
+    react_1.default.useEffect(() => {
+        const instance = instanceRef.current;
+        if (!instance ||
+            isReadOnly ||
+            isShortcutStoreDisabled ||
+            isShortcutDisabled)
+            return;
+        const isMacintosh = ['macos', 'ios'].includes(clientPlatform);
+        const disposables = Object.entries(editorShortcutLabels).flatMap(([event, label], index) => {
+            var _a;
+            const shortcut = shortcuts[event];
+            if (!shortcut || !((_a = shortcutEvents[event]) === null || _a === void 0 ? void 0 : _a.length))
+                return [];
+            const keybinding = (0, shortcuts_1.getMonacoKeybindingFromShortcut)(shortcut, monaco, isMacintosh);
+            if (keybinding === undefined)
+                return [];
+            return [
+                instance.addAction({
+                    id: `oj.${event}`,
+                    label,
+                    keybindings: [keybinding],
+                    contextMenuGroupId: 'oj',
+                    contextMenuOrder: index,
+                    run: () => {
+                        var _a;
+                        const callbacks = (_a = stores_1.useShortcutStore.getState().shortcutEvents[event]) !== null && _a !== void 0 ? _a : [];
+                        for (const callback of callbacks)
+                            callback();
+                    },
+                }),
+            ];
+        });
+        return () => disposables.forEach(disposable => disposable.dispose());
+    }, [
+        isReadOnly,
+        isShortcutStoreDisabled,
+        isShortcutDisabled,
+        clientPlatform,
+        shortcuts,
+        shortcutEvents,
+    ]);
+    return ((0, jsx_runtime_1.jsx)(atoms_1.Container, { ref: ref, "$font": $font, "$height": $height, "$css": (0, styled_components_1.css) `
+        & * {
+          font-family: ${$font};
+        }
+      `, ...props }));
+};
+//# sourceMappingURL=CodeEditor.js.map

package/lib/components/atoms/editors/CodeEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeEditor.js","sourceRoot":"","sources":["../../../../src/components/atoms/editors/CodeEditor.tsx"],"names":[],"mappings":"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"}

package/lib/components/atoms/editors/only_csr.d.ts

@@ -0,0 +1 @@
+export { default as CodeEditor } from './CodeEditor';

package/lib/components/atoms/editors/only_csr.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CodeEditor = void 0;
+var CodeEditor_1 = require("./CodeEditor");
+Object.defineProperty(exports, "CodeEditor", { enumerable: true, get: function () { return __importDefault(CodeEditor_1).default; } });
+//# sourceMappingURL=only_csr.js.map

package/lib/components/atoms/editors/only_csr.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"only_csr.js","sourceRoot":"","sources":["../../../../src/components/atoms/editors/only_csr.tsx"],"names":[],"mappings":";;;;;;AAAA,2CAAqD;AAA5C,yHAAA,OAAO,OAAc"}

package/lib/components/atoms/icons/Icon.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { CSSProperties } from 'styled-components';
+import type { IconType } from '../../../constants/components';
+type Props = {
+    type: IconType;
+    $autoFill?: CSSProperties['fill'];
+} & Omit<React.SVGProps<SVGSVGElement>, 'fill'> & React.ComponentProps<typeof FallbackIcon>;
+declare const FallbackIcon: React.FC<import("../../../types/styles").ThemeCommonProps>;
+declare const _default: ({ type, $autoFill, $css, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/lib/components/atoms/icons/Icon.js

@@ -0,0 +1,61 @@
+'use client';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importDefault(require("react"));
+const fallback_svg_1 = __importDefault(require("../../../assets/icons/fallback.svg"));
+const spinner_outline_svg_1 = __importDefault(require("../../../assets/icons/hero/spinner-outline.svg"));
+const euler_svg_1 = __importDefault(require("../../../assets/icons/primary/euler.svg"));
+const components_1 = require("../../../constants/components");
+const styles_1 = require("../../../utils/styles");
+const iconMap = Object.fromEntries(components_1.iconTypes.map(type => [
+    type,
+    () => type.startsWith('primary/')
+        ? import(`../../../assets/icons/primary/${type.replace('primary/', '')}.svg`)
+        : type.startsWith('hero/')
+            ? import(`../../../assets/icons/hero/${type.replace('hero/', '')}.svg`)
+            : type.startsWith('phosphor/')
+                ? import(`../../../assets/icons/phosphor/${type.replace('phosphor/', '')}.svg`)
+                : type.startsWith('social/')
+                    ? import(`../../../assets/icons/social/${type.replace('social/', '')}.svg`)
+                    : import(`../../../assets/icons/${type}.svg`),
+]));
+const FallbackIcon = (0, styles_1.forwardStyled)(fallback_svg_1.default);
+const PrimaryEulerIcon = (0, styles_1.forwardStyled)(euler_svg_1.default);
+const HeroSpinnerOutlineIcon = (0, styles_1.forwardStyled)(spinner_outline_svg_1.default);
+const cachedIcons = new Map();
+cachedIcons.set('hero/spinner-outline', HeroSpinnerOutlineIcon);
+cachedIcons.set('primary/euler', PrimaryEulerIcon);
+exports.default = ({ type, $autoFill = styles_1.theme.color.base.extra.black, $css, ...props }) => {
+    const [Icon, setIcon] = react_1.default.useState(cachedIcons.get(type) || FallbackIcon);
+    const [config, setConfig] = react_1.default.useState({
+        fillRule: 'fill',
+    });
+    react_1.default.useEffect(() => {
+        if (!(type in iconMap))
+            return;
+        if (cachedIcons.has(type)) {
+            setIcon(() => cachedIcons.get(type));
+            setConfig(components_1.icons[type]);
+            return;
+        }
+        try {
+            (async () => {
+                const { default: _Icon } = await iconMap[type]();
+                const StyledIcon = react_1.default.memo((0, styles_1.forwardStyled)(_Icon));
+                cachedIcons.set(type, StyledIcon);
+                setIcon(() => StyledIcon);
+                setConfig(components_1.icons[type]);
+            })();
+        }
+        catch (error) {
+            console.error(error);
+            setIcon(() => FallbackIcon);
+        }
+    }, [type]);
+    return config.fillRule == 'fill' ? ((0, jsx_runtime_1.jsx)(Icon, { "$size": "24px", "$fill": $autoFill, "$css": type === 'hero/spinner-outline' ? [styles_1.theme.effect.spinner, $css] : $css, ...props })) : ((0, jsx_runtime_1.jsx)(Icon, { "$size": "24px", "$stroke": $autoFill, "$css": type === 'hero/spinner-outline' ? [styles_1.theme.effect.spinner, $css] : $css, ...props }));
+};
+//# sourceMappingURL=Icon.js.map

package/lib/components/atoms/icons/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../../src/components/atoms/icons/Icon.tsx"],"names":[],"mappings":"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"}

package/lib/components/atoms/icons/LoadingIcon.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import type { LoadingIconSize } from '../../../constants/components';
+import { Container } from '../../../components/atoms';
+type BallContainerProps = {
+    size?: LoadingIconSize;
+    autoFill?: React.ComponentProps<typeof Container>['$background'];
+} & React.ComponentProps<typeof Container>;
+type Props = {
+    size?: LoadingIconSize;
+    autoFill?: BallContainerProps['autoFill'];
+} & React.ComponentProps<typeof Container>;
+declare const _default: React.MemoExoticComponent<({ size, autoFill, ...props }: Props) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

package/lib/components/atoms/icons/LoadingIcon.js

@@ -0,0 +1,36 @@
+'use client';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = require("styled-components");
+const styles_1 = require("../../../utils/styles");
+const atoms_1 = require("../../../components/atoms");
+const configs = {
+    small: { size: 8, gap: 4, height: 32 * 0.8 },
+    medium: { size: 12, gap: 8, height: 52 * 0.8 },
+    large: { size: 16, gap: 12, height: 72 * 0.8 },
+};
+const BallContainer = ({ size = 'medium', autoFill = styles_1.theme.color.palettes.body['border-primary'], $css, ...props }) => ((0, jsx_runtime_1.jsx)(atoms_1.Container, { "$position": "absolute", "$borderRadius": "50%", "$size": configs[size].size, "$background": autoFill, "$css": [
+        (0, styled_components_1.css) `
+        animation: ${(0, styled_components_1.keyframes) `
+          0%, 100% {
+            top: 0;
+          }
+          50% {
+            top: ${configs[size].height - configs[size].size}px;
+          }`} 1.2s ease infinite;
+      `,
+        $css,
+    ], ...props }));
+exports.default = react_1.default.memo(({ size = 'medium', autoFill, ...props }) => ((0, jsx_runtime_1.jsxs)(atoms_1.Container, { "$position": "relative", "$width": configs[size].size * 3 + configs[size].gap * 2, "$height": configs[size].height, ...props, children: [(0, jsx_runtime_1.jsx)(BallContainer, { size: size, autoFill: autoFill, "$left": 0, "$css": (0, styled_components_1.css) `
+        animation-delay: 0.1s;
+      ` }), (0, jsx_runtime_1.jsx)(BallContainer, { size: size, autoFill: autoFill, "$left": configs[size].size + configs[size].gap, "$css": (0, styled_components_1.css) `
+        animation-delay: 0.2s;
+      ` }), (0, jsx_runtime_1.jsx)(BallContainer, { size: size, autoFill: autoFill, "$right": 0, "$css": (0, styled_components_1.css) `
+        animation-delay: 0.3s;
+      ` })] })));
+//# sourceMappingURL=LoadingIcon.js.map

package/lib/components/atoms/icons/LoadingIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingIcon.js","sourceRoot":"","sources":["../../../../src/components/atoms/icons/LoadingIcon.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;AAEb,kDAA0B;AAE1B,yDAAmD;AAInD,2CAAuC;AAEvC,8CAA+C;AAY/C,MAAM,OAAO,GAAG;IACd,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,GAAG,GAAG,EAAE;IAC5C,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,GAAG,GAAG,EAAE;IAC9C,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAG,GAAG,EAAE;CAQ/C,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,EACrB,IAAI,GAAG,QAAQ,EACf,QAAQ,GAAG,cAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAC,EACtD,IAAI,EACJ,GAAG,KAAK,EACW,EAAE,EAAE,CAAC,CACxB,uBAAC,iBAAS,iBACE,UAAU,mBACN,KAAK,WACZ,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,iBACZ,QAAQ,UACf;QACJ,IAAA,uBAAG,EAAA;qBACY,IAAA,6BAAS,EAAA;;;;;mBAKX,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI;YAChD;OACL;QACD,IAAI;KACL,KACG,KAAK,GACT,CACH,CAAC;AAEF,kBAAe,eAAK,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,GAAG,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAS,EAAE,EAAE,CAAC,CAC5E,wBAAC,iBAAS,iBACE,UAAU,YACZ,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,GAAG,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,GAAG,CAAC,aAC7C,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,KACzB,KAAK,aAET,uBAAC,aAAa,IACZ,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,WACX,CAAC,UACF,IAAA,uBAAG,EAAA;;OAER,GACD,EACF,uBAAC,aAAa,IACZ,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,WACX,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,UACvC,IAAA,uBAAG,EAAA;;OAER,GACD,EACF,uBAAC,aAAa,IACZ,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,YACV,CAAC,UACH,IAAA,uBAAG,EAAA;;OAER,GACD,IACQ,CACb,CAAC,CAAC"}

package/lib/components/atoms/icons/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Icon } from './Icon';
+export { default as LoadingIcon } from './LoadingIcon';

package/lib/components/atoms/icons/index.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LoadingIcon = exports.Icon = void 0;
+var Icon_1 = require("./Icon");
+Object.defineProperty(exports, "Icon", { enumerable: true, get: function () { return __importDefault(Icon_1).default; } });
+var LoadingIcon_1 = require("./LoadingIcon");
+Object.defineProperty(exports, "LoadingIcon", { enumerable: true, get: function () { return __importDefault(LoadingIcon_1).default; } });
+//# sourceMappingURL=index.js.map

package/lib/components/atoms/icons/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/atoms/icons/index.tsx"],"names":[],"mappings":";;;;;;AAAA,+BAAyC;AAAhC,6GAAA,OAAO,OAAQ;AACxB,6CAAuD;AAA9C,2HAAA,OAAO,OAAe"}

package/lib/components/atoms/index.d.ts

@@ -0,0 +1,12 @@
+export * from './avatars';
+export * from './badges';
+export * from './buttons';
+export * from './containers';
+export * from './dividers';
+export * from './icons';
+export * from './inputs';
+export * from './lotties';
+export * from './paginations';
+export * from './pickers';
+export * from './recaptchas';
+export * from './texts';

package/lib/components/atoms/index.js

@@ -0,0 +1,29 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./avatars"), exports);
+__exportStar(require("./badges"), exports);
+__exportStar(require("./buttons"), exports);
+__exportStar(require("./containers"), exports);
+__exportStar(require("./dividers"), exports);
+__exportStar(require("./icons"), exports);
+__exportStar(require("./inputs"), exports);
+__exportStar(require("./lotties"), exports);
+__exportStar(require("./paginations"), exports);
+__exportStar(require("./pickers"), exports);
+__exportStar(require("./recaptchas"), exports);
+__exportStar(require("./texts"), exports);
+//# sourceMappingURL=index.js.map

package/lib/components/atoms/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/atoms/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,4CAA0B;AAC1B,2CAAyB;AACzB,4CAA0B;AAC1B,+CAA6B;AAC7B,6CAA2B;AAC3B,0CAAwB;AACxB,2CAAyB;AACzB,4CAA0B;AAC1B,gDAA8B;AAC9B,4CAA0B;AAC1B,+CAA6B;AAC7B,0CAAwB"}

package/lib/components/atoms/inputs/CheckboxInput.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import type { Palette } from '../../../constants/styles';
+declare const _default: React.ForwardRefExoticComponent<{
+    size?: "x_small";
+    value?: boolean;
+    isDisabled?: boolean;
+    onChangeValue?: (value: boolean) => void;
+    palette?: Palette;
+} & Omit<{
+    as?: "auto" | "a" | "link" | "button" | "span";
+    href?: React.ComponentProps<typeof import("../containers/LinkContainer").default>["href"];
+    target?: React.ComponentProps<typeof import("../containers/LinkContainer").default>["target"];
+    rel?: React.ComponentProps<typeof import("../containers/LinkContainer").default>["rel"];
+    replace?: React.ComponentProps<typeof import("../containers/LinkContainer").default>["replace"];
+    scroll?: React.ComponentProps<typeof import("../containers/LinkContainer").default>["scroll"];
+    prefetch?: React.ComponentProps<typeof import("../containers/LinkContainer").default>["prefetch"];
+} & Omit<import("../../../types/components").CommonProps<import("../../../types/components").CommonProps<{
+    as?: "button";
+} & React.HTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement> & import("../../../types/styles").ThemeCommonProps, {
+    as?: "a" | "link";
+    href?: string | null;
+    replace?: boolean;
+    scroll?: boolean;
+    prefetch?: boolean | "auto" | null;
+} & React.AnchorHTMLAttributes<HTMLAnchorElement> & React.RefAttributes<HTMLAnchorElement> & import("../../../types/styles").ThemeCommonProps>, {
+    as?: "div" | "span" | "kbd" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "header" | "footer" | "main" | "section" | "article";
+} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement> & import("../../../types/styles").ThemeCommonProps>, "as">, "ref"> & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement | HTMLSpanElement> & React.RefAttributes<HTMLButtonElement>>;
+export default _default;

package/lib/components/atoms/inputs/CheckboxInput.js

@@ -0,0 +1,25 @@
+'use client';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importDefault(require("react"));
+const styles_1 = require("../../../utils/styles");
+const styles_2 = require("../../../hooks/styles");
+const atoms_1 = require("../../../components/atoms");
+exports.default = (0, styles_1.forwardRef)(({ size = 'x_small', value = false, isDisabled = false, onChangeValue, palette = 'input-checkbox', ...props }, ref) => {
+    const [hoverProps, isHover] = (0, styles_2.useHoverProps)();
+    const onClick = react_1.default.useCallback(() => {
+        if (isDisabled)
+            return;
+        onChangeValue === null || onChangeValue === void 0 ? void 0 : onChangeValue(!value);
+    }, [isDisabled, onChangeValue, value]);
+    return ((0, jsx_runtime_1.jsx)(atoms_1.ClickableContainer, { ref: ref, onClick: onClick, role: "checkbox", "aria-checked": value, "aria-disabled": isDisabled, "$display": "flex", "$justifyContent": "center", "$alignItems": "center", "$size": styles_1.theme.size.height.base[size], "$borderRadius": styles_1.theme.size.borderRadius.x_small, "$border": `1px solid ${styles_1.theme.color.palettes[palette][value ? 'border-selected' : isHover ? 'border-hovered' : 'border-primary']}`, "$background": styles_1.theme.color.palettes[palette][value
+            ? 'background-selected'
+            : isHover
+                ? 'background-hovered'
+                : 'background-primary'], "$cursor": isDisabled ? 'not-allowed' : 'pointer', "$transition": "background, border", ...hoverProps, ...props, children: (0, jsx_runtime_1.jsx)(atoms_1.Icon, { type: "hero/check-outline", "$size": styles_1.theme.size.height.base[size] * 0.8, "$opacity": value ? 1 : 0, "$autoFill": styles_1.theme.color.palettes[palette][value ? 'content-selected' : 'content-primary'] }) }));
+});
+//# sourceMappingURL=CheckboxInput.js.map

package/lib/components/atoms/inputs/CheckboxInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxInput.js","sourceRoot":"","sources":["../../../../src/components/atoms/inputs/CheckboxInput.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;AAEb,kDAA0B;AAI1B,2CAAmD;AAEnD,2CAA+C;AAE/C,8CAA8D;AAU9D,kBAAe,IAAA,mBAAU,EACvB,CACE,EACE,IAAI,GAAG,SAAS,EAChB,KAAK,GAAG,KAAK,EACb,UAAU,GAAG,KAAK,EAClB,aAAa,EACb,OAAO,GAAG,gBAAgB,EAC1B,GAAG,KAAK,EACF,EACR,GAAiC,EACjC,EAAE;IACF,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC,GAAG,IAAA,sBAAa,GAAE,CAAC;IAC9C,MAAM,OAAO,GAAG,eAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACrC,IAAI,UAAU;YAAE,OAAO;QACvB,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,UAAU,EAAE,aAAa,EAAE,KAAK,CAAC,CAAC,CAAC;IAEvC,OAAO,CACL,uBAAC,0BAAkB,IACjB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,IAAI,EAAC,UAAU,kBACD,KAAK,mBACJ,UAAU,cAChB,MAAM,qBACC,QAAQ,iBACZ,QAAQ,WACb,cAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,mBACpB,cAAK,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,aACrC,aAAa,cAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,EAAE,iBAE9H,cAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAC3B,KAAK;YACH,CAAC,CAAC,qBAAqB;YACvB,CAAC,CAAC,OAAO;gBACP,CAAC,CAAC,oBAAoB;gBACtB,CAAC,CAAC,oBAAoB,CAC3B,aAEM,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,iBACnC,oBAAoB,KAC5B,UAAU,KACV,KAAK,YAET,uBAAC,YAAI,IACH,IAAI,EAAC,oBAAoB,WAClB,cAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,cAC/B,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,eAErB,cAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAC3B,KAAK,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,iBAAiB,CAC/C,GAEH,GACiB,CACtB,CAAC;AACJ,CAAC,CACF,CAAC"}

package/lib/components/atoms/inputs/ChipInput.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import type { ChipInputSize, ChipInputType } from '../../../constants/components';
+import type { Palette } from '../../../constants/styles/color';
+import { ClickableContainer, Icon, InputableContainer } from '../../../components/atoms';
+declare const _default: React.ForwardRefExoticComponent<{
+    type?: ChipInputType;
+    size?: ChipInputSize;
+    icon?: React.ComponentProps<typeof Icon>["type"];
+    value?: string;
+    onChangeValue?: (value: string) => void;
+    onEnter?: () => void;
+    onEscape?: () => void;
+    onArrowUp?: () => void;
+    onArrowDown?: () => void;
+    onPopChip?: () => void;
+    onPushChip?: (value: string) => void;
+    onClickClose?: React.ComponentProps<typeof ClickableContainer>["onClick"];
+    placeholder?: React.ComponentProps<typeof InputableContainer>["placeholder"];
+    palette?: Palette;
+} & {
+    as?: "div" | "span" | "kbd" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "header" | "footer" | "main" | "section" | "article";
+} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement> & import("../../../types/styles").ThemeCommonProps>;
+export default _default;

package/lib/components/atoms/inputs/ChipInput.js

@@ -0,0 +1,79 @@
+'use client';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importDefault(require("react"));
+const styles_1 = require("../../../utils/styles");
+const styles_2 = require("../../../hooks/styles");
+const atoms_1 = require("../../../components/atoms");
+exports.default = (0, styles_1.forwardRef)(({ type = 'rounded', size = 'medium', icon = 'hero/magnifying-glass-outline', value, onChangeValue, onEnter, onEscape, onArrowUp, onArrowDown, onPopChip, onPushChip, onClickClose, palette = 'input-text', placeholder, children, ...props }, ref) => {
+    var _a, _b, _c, _d, _e;
+    const [isFocus, setIsFocus] = react_1.default.useState(false);
+    const [closeHoverProps, isCloseHover] = (0, styles_2.useHoverProps)();
+    const handlePushChip = react_1.default.useCallback(() => {
+        const values = (value || '')
+            .split(/[,\/ ]+/)
+            .map(x => x.trim())
+            .filter(x => !!x);
+        values.forEach(x => onPushChip === null || onPushChip === void 0 ? void 0 : onPushChip(x));
+        onChangeValue === null || onChangeValue === void 0 ? void 0 : onChangeValue('');
+    }, [value, onChangeValue, onPushChip]);
+    const onChange = react_1.default.useCallback((event) => onChangeValue === null || onChangeValue === void 0 ? void 0 : onChangeValue(event.target.value), [onChangeValue]);
+    const onFocus = react_1.default.useCallback(() => setIsFocus(true), []);
+    const onBlur = react_1.default.useCallback(() => {
+        setIsFocus(false);
+        handlePushChip();
+    }, [handlePushChip]);
+    const onKeyDown = react_1.default.useCallback((event) => {
+        if (event.nativeEvent.isComposing)
+            return;
+        if (event.code === 'Enter') {
+            event.preventDefault();
+            if (onEnter)
+                onEnter();
+            else
+                handlePushChip();
+        }
+        else if (event.code === 'Backspace' && !value) {
+            event.preventDefault();
+            onPopChip === null || onPopChip === void 0 ? void 0 : onPopChip();
+        }
+        else if (event.key === 'ArrowUp') {
+            event.preventDefault();
+            onArrowUp === null || onArrowUp === void 0 ? void 0 : onArrowUp();
+        }
+        else if (event.key === 'ArrowDown') {
+            event.preventDefault();
+            onArrowDown === null || onArrowDown === void 0 ? void 0 : onArrowDown();
+        }
+        else if (event.key === 'Escape') {
+            event.preventDefault();
+            onEscape === null || onEscape === void 0 ? void 0 : onEscape();
+            event.currentTarget.blur();
+        }
+    }, [
+        handlePushChip,
+        onEnter,
+        onPopChip,
+        onArrowUp,
+        onArrowDown,
+        onEscape,
+        value,
+    ]);
+    react_1.default.useEffect(() => {
+        if (!value)
+            return;
+        if (value.includes(',') || value.includes('/') || value.includes(' ')) {
+            handlePushChip === null || handlePushChip === void 0 ? void 0 : handlePushChip();
+        }
+    }, [value, handlePushChip]);
+    return ((0, jsx_runtime_1.jsxs)(atoms_1.Container, { ref: ref, "$display": "flex", "$position": "relative", "$alignItems": "center", "$height": styles_1.theme.size.height.base[size], "$borderRadius": styles_1.theme.size.borderRadius.small, "$background": (_a = styles_1.theme.color.palettes[palette]) === null || _a === void 0 ? void 0 : _a[isFocus ? 'background-selected' : 'background-primary'], "$border": `1px solid ${(_b = styles_1.theme.color.palettes[palette]) === null || _b === void 0 ? void 0 : _b[isFocus ? 'border-selected' : 'border-primary']}`, "$paddingHorizontal": size === 'large' ? 8 : size === 'medium' ? 6 : 4, "$gap": size === 'large' ? 4 : size === 'medium' ? 2 : 0, "$transition": "background, border", ...props, children: [(0, jsx_runtime_1.jsx)(atoms_1.Icon, { type: icon, "$autoFill": (_c = styles_1.theme.color.palettes[palette]) === null || _c === void 0 ? void 0 : _c[isFocus ? 'content-primary' : 'content-secondary'], "$size": styles_1.theme.size.height.base[size] * 0.6 }), (0, jsx_runtime_1.jsxs)(atoms_1.Container, { "$display": "flex", "$width": 0, "$height": "100%", "$alignItems": "center", "$overflowX": "auto", "$gap": styles_1.theme.size.margin.base.x_small, "$noneScrollbarDisplay": true, "$flexGrow": true, children: [children, (0, jsx_runtime_1.jsx)(atoms_1.InputableContainer, { value: value, onChange: onChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, placeholder: placeholder, "$minWidth": styles_1.theme.size.margin.base.large, "$height": "100%", "$fieldSizing": "content", "$color": (_d = styles_1.theme.color.palettes[palette]) === null || _d === void 0 ? void 0 : _d['content-primary'], "$flexGrow": true, "$css": size === 'large'
+                            ? styles_1.theme.text.medium
+                            : size === 'medium'
+                                ? styles_1.theme.text.small
+                                : styles_1.theme.text.x_small })] }), !!onClickClose && ((0, jsx_runtime_1.jsx)(atoms_1.ClickableContainer, { onClick: onClickClose, "$display": value || children ? 'flex' : 'none', "$position": "relative", "$alignItems": "center", "$size": styles_1.theme.size.height.base[size] * 0.6, ...closeHoverProps, children: (0, jsx_runtime_1.jsx)(atoms_1.Icon, { type: "hero/x-mark-outline", "$autoFill": (_e = styles_1.theme.color.palettes[palette]) === null || _e === void 0 ? void 0 : _e[isCloseHover ? 'content-primary' : 'content-secondary'], "$size": styles_1.theme.size.height.base[size] * 0.6 }) }))] }));
+});
+//# sourceMappingURL=ChipInput.js.map