@ncds/ui-admin 0.0.32 → 0.0.34

package/dist/temp/docusaurus/src/components/demos/ModalDemo.d.ts

@@ -0,0 +1,27 @@
+import { IconName } from '@ncds/ui-admin-icon';
+import { FeaturedIconColor, FeaturedIconTheme } from '../FeaturedIcon';
+export interface ModalDemoProps {
+    title?: string;
+    subtitle?: string;
+    size?: 'sm' | 'md' | 'lg' | 'xl';
+    hideCloseButton?: boolean;
+    closeOnBackdropClick?: boolean;
+    closeOnEsc?: boolean;
+    hasContent?: boolean;
+    featuredIconName?: IconName;
+    featuredIconColor?: FeaturedIconColor;
+    featuredIconTheme?: FeaturedIconTheme;
+    cancelButtonText?: string;
+    confirmButtonText?: string;
+    showCancelButton?: boolean;
+    showConfirmButton?: boolean;
+    headerAlign?: 'left' | 'center' | 'horizontal';
+    actionsLayout?: 'vertical' | 'horizontal' | 'checkbox';
+    actionsAlign?: 'center' | 'right' | 'stretch';
+    showHeaderDivider?: boolean;
+    showActionsDivider?: boolean;
+    showCheckbox?: boolean;
+    checkboxLabel?: string;
+}
+export default function ModalDemo({ title, subtitle, hideCloseButton, featuredIconName, featuredIconColor, featuredIconTheme, size, closeOnBackdropClick, closeOnEsc, hasContent, cancelButtonText, confirmButtonText, showCancelButton, showConfirmButton, headerAlign, actionsLayout, actionsAlign, showActionsDivider, showCheckbox, checkboxLabel, showHeaderDivider, }: ModalDemoProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ModalDemo.d.ts.map

package/dist/temp/docusaurus/src/components/demos/ModalDemo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalDemo.d.ts","sourceRoot":"","sources":["../../../../../../docusaurus/src/components/demos/ModalDemo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAG/C,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAGvE,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,QAAQ,CAAC;IAC5B,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,YAAY,CAAC;IAC/C,aAAa,CAAC,EAAE,UAAU,GAAG,YAAY,GAAG,UAAU,CAAC;IACvD,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IAC9C,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,KAA2B,EAC3B,QAAQ,EACR,eAAuB,EACvB,gBAAgB,EAChB,iBAAiB,EACjB,iBAAiB,EACjB,IAAW,EACX,oBAA2B,EAC3B,UAAiB,EACjB,UAAiB,EACjB,gBAAuB,EACvB,iBAAwB,EACxB,gBAAuB,EACvB,iBAAwB,EACxB,WAAoB,EACpB,aAA0B,EAC1B,YAAwB,EACxB,kBAA0B,EAC1B,YAAoB,EACpB,aAA0B,EAC1B,iBAAyB,GAC1B,EAAE,cAAc,2CAiGhB"}

package/dist/temp/docusaurus/src/components/demos/ModalDemo.js

@@ -0,0 +1,51 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from 'react';
+import { Button } from '../Button';
+import { Modal } from '../Modal';
+import Checkbox from '../Checkbox';
+export default function ModalDemo(_a) {
+    var _b = _a.title, title = _b === void 0 ? '제목은 한문장으로 입력해주세요.' : _b, subtitle = _a.subtitle, _c = _a.hideCloseButton, hideCloseButton = _c === void 0 ? false : _c, featuredIconName = _a.featuredIconName, featuredIconColor = _a.featuredIconColor, featuredIconTheme = _a.featuredIconTheme, _d = _a.size, size = _d === void 0 ? 'md' : _d, _e = _a.closeOnBackdropClick, closeOnBackdropClick = _e === void 0 ? true : _e, _f = _a.closeOnEsc, closeOnEsc = _f === void 0 ? true : _f, _g = _a.hasContent, hasContent = _g === void 0 ? true : _g, _h = _a.cancelButtonText, cancelButtonText = _h === void 0 ? '취소' : _h, _j = _a.confirmButtonText, confirmButtonText = _j === void 0 ? '확인' : _j, _k = _a.showCancelButton, showCancelButton = _k === void 0 ? true : _k, _l = _a.showConfirmButton, showConfirmButton = _l === void 0 ? true : _l, _m = _a.headerAlign, headerAlign = _m === void 0 ? 'left' : _m, _o = _a.actionsLayout, actionsLayout = _o === void 0 ? 'vertical' : _o, _p = _a.actionsAlign, actionsAlign = _p === void 0 ? 'stretch' : _p, _q = _a.showActionsDivider, showActionsDivider = _q === void 0 ? false : _q, _r = _a.showCheckbox, showCheckbox = _r === void 0 ? false : _r, _s = _a.checkboxLabel, checkboxLabel = _s === void 0 ? '다시 보지 않기' : _s, _t = _a.showHeaderDivider, showHeaderDivider = _t === void 0 ? false : _t;
+    var _u = useState(false), isOpen = _u[0], setIsOpen = _u[1];
+    var _v = useState(false), isChecked = _v[0], setIsChecked = _v[1];
+    var handleCancel = function () {
+        setIsOpen(false);
+    };
+    var handleConfirm = function () {
+        setIsOpen(false);
+    };
+    var handleCheckboxChange = function (e) {
+        setIsChecked(e.target.checked);
+    };
+    // Close modal when component unmounts
+    useEffect(function () {
+        return function () {
+            setIsOpen(false);
+        };
+    }, []);
+    var renderActions = function () {
+        if (showCheckbox && actionsLayout === 'checkbox') {
+            var checkboxContent = (_jsxs(_Fragment, { children: [_jsx(Checkbox, { text: checkboxLabel, checked: isChecked, onChange: handleCheckboxChange }), _jsx(Button, { size: "xs", label: "\uC124\uC815", onClick: function () { }, hierarchy: "link" })] }));
+            return (_jsxs(Modal.Actions, __assign({ layout: "checkbox", align: actionsAlign, showDivider: showActionsDivider, checkboxContent: checkboxContent }, { children: [showCancelButton && _jsx(Button, { label: cancelButtonText, onClick: handleCancel, hierarchy: "secondary-gray" }), showConfirmButton && _jsx(Button, { label: confirmButtonText, onClick: handleConfirm, hierarchy: "primary" })] })));
+        }
+        // Standard layout without checkbox
+        return (_jsxs(Modal.Actions, __assign({ layout: actionsLayout, align: actionsAlign, showDivider: showActionsDivider }, { children: [showCancelButton && (_jsx(Button, { size: "sm", label: cancelButtonText, onClick: handleCancel, hierarchy: "secondary-gray" })), showConfirmButton && (_jsx(Button, { size: "sm", label: confirmButtonText, onClick: handleConfirm, hierarchy: "primary" }))] })));
+    };
+    return (_jsxs("div", { children: [_jsx(Button, { label: "\uBAA8\uB2EC \uC5F4\uAE30", hierarchy: "primary", onClick: function () { return setIsOpen(true); } }), _jsxs(Modal, __assign({ isOpen: isOpen, onClose: function () { return setIsOpen(false); }, size: size, closeOnBackdropClick: closeOnBackdropClick, closeOnEsc: closeOnEsc }, { children: [_jsx(Modal.Header, { onClose: function () { return setIsOpen(false); }, hideCloseButton: hideCloseButton, title: title, subtitle: subtitle, align: headerAlign, showDivider: showHeaderDivider, featuredIcon: featuredIconName && featuredIconColor && featuredIconTheme
+                            ? {
+                                name: featuredIconName,
+                                color: featuredIconColor,
+                                theme: featuredIconTheme,
+                            }
+                            : undefined }), hasContent && (_jsxs(Modal.Content, { children: [_jsx("p", { children: "\uBAA8\uB2EC \uB0B4\uC6A9\uC744 \uC774\uACF3\uC5D0 \uC791\uC131\uD569\uB2C8\uB2E4." }), _jsx("p", { children: "\uC704\uC758 \uCEE8\uD2B8\uB864\uC744 \uD1B5\uD574 \uB2E4\uC591\uD55C \uC124\uC815\uC744 \uBCC0\uACBD\uD574\uBCF4\uC138\uC694." })] })), renderActions()] }))] }));
+}

package/dist/temp/docusaurus/src/components/demos/NotificationDemo.d.ts

@@ -0,0 +1,48 @@
+import { NotificationAction, NotificationColor } from '../Notification';
+export interface NotificationDemoProps {
+    title: string;
+    supportingText?: string;
+    color?: NotificationColor;
+    type?: 'floating' | 'full-width';
+    onClose?: boolean;
+    className?: string;
+    actionCount?: number;
+    actions?: NotificationAction[];
+}
+declare const NotificationDemo: {
+    ({ title, supportingText, color, type, onClose, className, actionCount, actions, }: NotificationDemoProps): import("react/jsx-runtime").JSX.Element;
+    controls: ({
+        name: string;
+        type: string;
+        description: string;
+        options?: undefined;
+        itemType?: undefined;
+    } | {
+        name: string;
+        type: string;
+        options: string[];
+        description: string;
+        itemType?: undefined;
+    } | {
+        name: string;
+        type: string;
+        description: string;
+        itemType: {
+            type: string;
+            fields: ({
+                name: string;
+                type: string;
+                description: string;
+                options?: undefined;
+            } | {
+                name: string;
+                type: string;
+                options: string[];
+                description: string;
+            })[];
+        };
+        options?: undefined;
+    })[];
+};
+export default NotificationDemo;
+//# sourceMappingURL=NotificationDemo.d.ts.map

package/dist/temp/docusaurus/src/components/demos/NotificationDemo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationDemo.d.ts","sourceRoot":"","sources":["../../../../../../docusaurus/src/components/demos/NotificationDemo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAEtF,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B,IAAI,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAC;CAChC;AAED,QAAA,MAAM,gBAAgB;wFASnB,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BvB,CAAC;AAqDF,eAAe,gBAAgB,CAAC"}

package/dist/temp/docusaurus/src/components/demos/NotificationDemo.js

@@ -0,0 +1,77 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Notification } from '../Notification';
+var NotificationDemo = function (_a) {
+    var title = _a.title, supportingText = _a.supportingText, _b = _a.color, color = _b === void 0 ? 'neutral' : _b, _c = _a.type, type = _c === void 0 ? 'floating' : _c, _d = _a.onClose, onClose = _d === void 0 ? true : _d, className = _a.className, _e = _a.actionCount, actionCount = _e === void 0 ? 0 : _e, _f = _a.actions, actions = _f === void 0 ? [] : _f;
+    var handleClose = onClose ? function () { return console.log('Notification closed'); } : undefined;
+    // 액션 목록 생성
+    var actionsList = actions.length > 0
+        ? actions
+        : Array.from({ length: actionCount }, function (_, index) { return ({
+            label: index === 0 ? '취소' : '확인',
+            onClick: function () { return console.log("".concat(index === 0 ? '취소' : '확인', " \uBC84\uD2BC \uD074\uB9AD")); },
+            hierarchy: 'link',
+        }); });
+    return (_jsx("div", __assign({ style: { width: '100%', maxWidth: type === 'floating' ? '398px' : '100%', margin: '0 auto' } }, { children: _jsx(Notification, { title: title, supportingText: supportingText, color: color, type: type, onClose: handleClose, className: className, actions: actionsList }) })));
+};
+NotificationDemo.controls = [
+    {
+        name: 'title',
+        type: 'string',
+        description: '알림 제목을 지정합니다.',
+    },
+    {
+        name: 'supportingText',
+        type: 'string',
+        description: '알림 설명을 제공합니다.',
+    },
+    {
+        name: 'color',
+        type: 'select',
+        options: ['neutral', 'error', 'warning', 'success'],
+        description: '알림의 색상을 지정합니다.',
+    },
+    {
+        name: 'type',
+        type: 'select',
+        options: ['floating', 'full-width'],
+        description: '알림의 표시 방식을 지정합니다.',
+    },
+    {
+        name: 'onClose',
+        type: 'boolean',
+        description: '닫기 버튼 표시 여부를 지정합니다.',
+    },
+    {
+        name: 'actions',
+        type: 'array',
+        description: '버튼의 속성을 지정합니다.',
+        itemType: {
+            type: 'object',
+            fields: [
+                {
+                    name: 'label',
+                    type: 'string',
+                    description: '버튼에 표시될 텍스트',
+                },
+                {
+                    name: 'hierarchy',
+                    type: 'select',
+                    options: ['link-gray', 'link'],
+                    description: '버튼의 스타일',
+                },
+            ],
+        },
+    },
+];
+export default NotificationDemo;

package/dist/temp/docusaurus/src/components/demos/SliderDemo.d.ts

@@ -0,0 +1,18 @@
+import { SliderLabelPosition } from '../Slider';
+export type SliderDemoProps = {
+    min: number;
+    max: number;
+    step: number;
+    singleValue: number;
+    useRange: boolean;
+    rangeStart: number;
+    rangeEnd: number;
+    labelPosition: SliderLabelPosition;
+    disabled: boolean;
+};
+declare const SliderDemo: {
+    ({ min, max, step, singleValue, useRange, rangeStart, rangeEnd, labelPosition, disabled, }: SliderDemoProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default SliderDemo;
+//# sourceMappingURL=SliderDemo.d.ts.map

package/dist/temp/docusaurus/src/components/demos/SliderDemo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderDemo.d.ts","sourceRoot":"","sources":["../../../../../../docusaurus/src/components/demos/SliderDemo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAU,mBAAmB,EAAE,MAAM,WAAW,CAAC;AAExD,MAAM,MAAM,eAAe,GAAG;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,aAAa,EAAE,mBAAmB,CAAC;IACnC,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,QAAA,MAAM,UAAU;gGAUb,eAAe;;CAuBjB,CAAC;AAIF,eAAe,UAAU,CAAC"}

package/dist/temp/docusaurus/src/components/demos/SliderDemo.js

@@ -0,0 +1,24 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from 'react';
+import { Slider } from '../Slider';
+var SliderDemo = function (_a) {
+    var min = _a.min, max = _a.max, step = _a.step, singleValue = _a.singleValue, useRange = _a.useRange, rangeStart = _a.rangeStart, rangeEnd = _a.rangeEnd, labelPosition = _a.labelPosition, disabled = _a.disabled;
+    var _b = useState(useRange ? [rangeStart, rangeEnd] : singleValue), value = _b[0], setValue = _b[1];
+    useEffect(function () {
+        setValue(useRange ? [rangeStart, rangeEnd] : singleValue);
+    }, [useRange, singleValue, rangeStart, rangeEnd]);
+    return (_jsxs("div", __assign({ style: { padding: '20px 0', width: '100%' } }, { children: [_jsx("div", __assign({ style: { marginBottom: '10px' } }, { children: useRange ? "\uD604\uC7AC \uAC12: ".concat(Array.isArray(value) ? "".concat(value[0], " - ").concat(value[1]) : value) : "\uD604\uC7AC \uAC12: ".concat(value) })), _jsx(Slider, { min: min, max: max, step: step, value: value, onChange: setValue, labelPosition: labelPosition, disabled: disabled })] })));
+};
+SliderDemo.displayName = 'SliderDemo';
+export default SliderDemo;

package/dist/temp/docusaurus/src/components/demos/index.d.ts

@@ -0,0 +1,8 @@
+export { default as SliderDemo } from './SliderDemo';
+export { default as DropdownDemo } from './DropdownDemo';
+export { default as ModalDemo } from './ModalDemo';
+export { default as FeaturedIconDemo } from './FeaturedIconDemo';
+export { default as NotificationDemo } from './NotificationDemo';
+export { default as DividerDemo } from './DividerDemo';
+export { default as DotDemo } from './DotDemo';
+//# sourceMappingURL=index.d.ts.map

package/dist/temp/docusaurus/src/components/demos/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../docusaurus/src/components/demos/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC"}

package/dist/temp/docusaurus/src/components/demos/index.js

@@ -0,0 +1,7 @@
+export { default as SliderDemo } from './SliderDemo';
+export { default as DropdownDemo } from './DropdownDemo';
+export { default as ModalDemo } from './ModalDemo';
+export { default as FeaturedIconDemo } from './FeaturedIconDemo';
+export { default as NotificationDemo } from './NotificationDemo';
+export { default as DividerDemo } from './DividerDemo';
+export { default as DotDemo } from './DotDemo';

package/dist/temp/docusaurus/src/components/index.d.ts

@@ -0,0 +1,2 @@
+export { default as InteractiveExample } from './InteractiveExample';
+//# sourceMappingURL=index.d.ts.map

package/dist/temp/docusaurus/src/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../docusaurus/src/components/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/temp/docusaurus/src/components/index.js

@@ -0,0 +1,2 @@
+// Export components
+export { default as InteractiveExample } from './InteractiveExample';

package/dist/temp/docusaurus/src/pages/index.d.ts

@@ -0,0 +1,4 @@
+import type { ReactNode } from 'react';
+import '../css/custom.scss';
+export default function Home(): ReactNode;
+//# sourceMappingURL=index.d.ts.map

package/dist/temp/docusaurus/src/pages/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../docusaurus/src/pages/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,oBAAoB,CAAC;AAE5B,MAAM,CAAC,OAAO,UAAU,IAAI,IAAI,SAAS,CAQxC"}

package/dist/temp/docusaurus/src/pages/index.js

@@ -0,0 +1,10 @@
+import { useHistory } from '@docusaurus/router';
+import { useEffect } from 'react';
+import '../css/custom.scss';
+export default function Home() {
+    var history = useHistory();
+    useEffect(function () {
+        history.push('/design-system/ncds-admin/docs/intro');
+    }, [history]);
+    return null;
+}

package/dist/temp/docusaurus/src/step-guide-example/BasicExample.d.ts

@@ -0,0 +1,3 @@
+declare const BasicExample: () => import("react/jsx-runtime").JSX.Element;
+export default BasicExample;
+//# sourceMappingURL=BasicExample.d.ts.map

package/dist/temp/docusaurus/src/step-guide-example/BasicExample.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasicExample.d.ts","sourceRoot":"","sources":["../../../../../docusaurus/src/step-guide-example/BasicExample.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,YAAY,+CAgDjB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/temp/docusaurus/src/step-guide-example/BasicExample.js

@@ -0,0 +1,47 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { loadScript } from './util';
+import { ExampleContainer } from './component/ExampleContainer';
+import { useEffect } from 'react';
+var BasicExample = function () {
+    useEffect(function () {
+        var _a = loadScript(), script = _a.script, link = _a.link;
+        return function () {
+            document.body.removeChild(script);
+            document.head.removeChild(link);
+        };
+    }, []);
+    var handleClickSample = function () {
+        window.stepGuide({
+            el: document.body,
+            options: {
+                steps: [
+                    {
+                        title: 'Step 1',
+                        description: 'Step 1 description',
+                        element: '#step1',
+                        position: 'bottom',
+                    },
+                    {
+                        title: 'Step 2',
+                        description: 'Step 2 description',
+                        element: '#step2',
+                        position: 'bottom',
+                    },
+                ],
+            },
+        });
+    };
+    return (_jsx(ExampleContainer, __assign({ title: "\uAE30\uBCF8 \uC608\uC81C", description: "`options.steps` \uBC30\uC5F4\uC758 \uC694\uC18C\uC758 `title`, `description`, `element`, `position` \uC18D\uC131\uC744 \uCD94\uAC00\uD558\uC5EC \uD234\uD301\uC744 \uD45C\uC2DC\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4.", handleClickSample: handleClickSample }, { children: _jsxs("div", __assign({ style: { display: 'flex', gap: '20px' } }, { children: [_jsx("div", __assign({ id: "step1", style: { background: '#fff', padding: '20px', border: '1px solid #ccc' } }, { children: "\uCCAB \uBC88\uC9F8 \uB2E8\uACC4" })), _jsx("div", __assign({ id: "step2", style: { background: '#fff', padding: '20px', border: '1px solid #ccc' } }, { children: "\uB450 \uBC88\uC9F8 \uB2E8\uACC4" }))] })) })));
+};
+export default BasicExample;

package/dist/temp/docusaurus/src/step-guide-example/ClickableDim.d.ts

@@ -0,0 +1,3 @@
+declare const ClickableDim: () => import("react/jsx-runtime").JSX.Element;
+export default ClickableDim;
+//# sourceMappingURL=ClickableDim.d.ts.map

package/dist/temp/docusaurus/src/step-guide-example/ClickableDim.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClickableDim.d.ts","sourceRoot":"","sources":["../../../../../docusaurus/src/step-guide-example/ClickableDim.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,YAAY,+CAiDjB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/temp/docusaurus/src/step-guide-example/ClickableDim.js

@@ -0,0 +1,48 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ExampleContainer } from './component/ExampleContainer';
+import { loadScript } from './util';
+import { useEffect } from 'react';
+var ClickableDim = function () {
+    useEffect(function () {
+        var _a = loadScript(), script = _a.script, link = _a.link;
+        return function () {
+            document.body.removeChild(script);
+            document.head.removeChild(link);
+        };
+    }, []);
+    var handleClickSample = function () {
+        window.stepGuide({
+            el: document.body,
+            options: {
+                clickableDim: true,
+                steps: [
+                    {
+                        title: 'Step 1',
+                        description: 'Step 1 description',
+                        element: '#step1-click',
+                        position: 'bottom',
+                    },
+                    {
+                        title: 'Step 2',
+                        description: 'Step 2 description',
+                        element: '#step2-click',
+                        position: 'bottom',
+                    },
+                ],
+            },
+        });
+    };
+    return (_jsx(ExampleContainer, __assign({ title: "\uD074\uB9AD \uAC00\uB2A5\uD55C Dim", description: "`options.clickableDim` \uC18D\uC131\uC744 `true`\uB85C \uC124\uC815\uD558\uBA74 Dim click\uC2DC \uB2E4\uC74C \uC2A4\uD15D\uC73C\uB85C \uC774\uB3D9\uD569\uB2C8\uB2E4.", handleClickSample: handleClickSample }, { children: _jsxs("div", __assign({ style: { display: 'flex', gap: '20px' } }, { children: [_jsx("div", __assign({ id: "step1-click", style: { background: '#fff', padding: '20px', border: '1px solid #ccc' } }, { children: "\uCCAB \uBC88\uC9F8 \uB2E8\uACC4" })), _jsx("div", __assign({ id: "step2-click", style: { background: '#fff', padding: '20px', border: '1px solid #ccc' } }, { children: "\uB450 \uBC88\uC9F8 \uB2E8\uACC4" }))] })) })));
+};
+export default ClickableDim;

package/dist/temp/docusaurus/src/step-guide-example/CustomStyle.d.ts

@@ -0,0 +1,3 @@
+declare const CustomStyle: () => import("react/jsx-runtime").JSX.Element;
+export default CustomStyle;
+//# sourceMappingURL=CustomStyle.d.ts.map

package/dist/temp/docusaurus/src/step-guide-example/CustomStyle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomStyle.d.ts","sourceRoot":"","sources":["../../../../../docusaurus/src/step-guide-example/CustomStyle.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,WAAW,+CA6DhB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/temp/docusaurus/src/step-guide-example/CustomStyle.js

@@ -0,0 +1,50 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ExampleContainer } from './component/ExampleContainer';
+import { loadScript } from './util';
+import { useEffect } from 'react';
+var CustomStyle = function () {
+    useEffect(function () {
+        var _a = loadScript(), script = _a.script, link = _a.link;
+        return function () {
+            document.body.removeChild(script);
+            document.head.removeChild(link);
+        };
+    }, []);
+    var handleClickSample = function () {
+        window.stepGuide({
+            el: document.body,
+            options: {
+                buttonLabel: {
+                    prev: '이전',
+                    next: '다음',
+                    done: '종료',
+                },
+                steps: [
+                    {
+                        title: 'Step 1',
+                        description: 'Step 1 description',
+                        element: '#name',
+                        position: 'bottom',
+                        customStyle: {
+                            height: '87px',
+                            backgroundColor: 'rgba(255, 0, 0, 0.3)',
+                        },
+                    },
+                ],
+            },
+        });
+    };
+    return (_jsx(ExampleContainer, __assign({ title: "\uCEE4\uC2A4\uD140 \uC2A4\uD0C0\uC77C", description: "`options.steps` \uBC30\uC5F4\uC758 \uC694\uC18C\uC758 `customStyle` \uC18D\uC131\uC744 \uCD94\uAC00\uD558\uC5EC \uD234\uD301\uC758 \uC2A4\uD0C0\uC77C\uC744 \uCEE4\uC2A4\uD140\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4.", handleClickSample: handleClickSample }, { children: _jsx("div", __assign({ style: { display: 'flex', gap: '20px', marginBlockStart: '20px' } }, { children: _jsxs("table", { children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", __assign({ id: "name" }, { children: "\uC774\uB984" })), _jsx("th", { children: "\uB098\uC774" }), _jsx("th", { children: "\uC131\uBCC4" })] }) }), _jsx("tbody", { children: _jsxs("tr", { children: [_jsx("td", { children: "\uD64D\uAE38\uB3D9" }), _jsx("td", { children: "20" }), _jsx("td", { children: "\uB0A8\uC790" })] }) })] }) })) })));
+};
+export default CustomStyle;

package/dist/temp/docusaurus/src/step-guide-example/EndCallback.d.ts

@@ -0,0 +1,3 @@
+declare const EndCallback: () => import("react/jsx-runtime").JSX.Element;
+export default EndCallback;
+//# sourceMappingURL=EndCallback.d.ts.map

package/dist/temp/docusaurus/src/step-guide-example/EndCallback.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EndCallback.d.ts","sourceRoot":"","sources":["../../../../../docusaurus/src/step-guide-example/EndCallback.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,WAAW,+CAkEhB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/temp/docusaurus/src/step-guide-example/EndCallback.js

@@ -0,0 +1,62 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { loadScript } from './util';
+import { ExampleContainer } from './component/ExampleContainer';
+import { useEffect } from 'react';
+var EndCallback = function () {
+    useEffect(function () {
+        var _a = loadScript(), script = _a.script, link = _a.link;
+        return function () {
+            document.body.removeChild(script);
+            document.head.removeChild(link);
+        };
+    }, []);
+    var handleClickSample = function () {
+        window.stepGuide({
+            el: document.body,
+            options: {
+                isExitOnCompleteButtonClick: true,
+                onExit: function () {
+                    alert('종료');
+                },
+                buttonLabel: {
+                    prev: '이전',
+                    next: '다음',
+                    done: '종료',
+                },
+                steps: [
+                    {
+                        title: '첫 번째 단계',
+                        description: '현재 1/3 단계입니다.',
+                        element: '#step1-no-target',
+                        position: 'bottom',
+                    },
+                    {
+                        title: '두 번째 단계',
+                        description: '현재 2/3 단계입니다.',
+                        element: '#step2-no-target',
+                        position: 'bottom',
+                    },
+                    {
+                        title: '마지막 단계',
+                        description: '현재 3/3 단계입니다.',
+                        element: '#step3-no-target',
+                        position: 'bottom',
+                    },
+                ],
+            },
+        });
+    };
+    return (_jsx(ExampleContainer, __assign({ title: "\uC885\uB8CC \uD6C4 \uCF5C\uBC31 \uD568\uC218 \uD638\uCD9C", description: "`options.onExit` \uC18D\uC131\uC744 \uC124\uC815\uD558\uBA74 \uC885\uB8CC \uD6C4 \uCF5C\uBC31 \uD568\uC218\uB97C \uD638\uCD9C\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4.", handleClickSample: handleClickSample }, { children: _jsxs("div", __assign({ style: { display: 'flex', gap: '20px', marginBlockStart: '20px' } }, { children: [_jsx("div", __assign({ id: "step1-no-target", style: { background: '#fff', padding: '20px', border: '1px solid #ccc' } }, { children: "\uCCAB \uBC88\uC9F8 \uB2E8\uACC4" })), _jsx("div", __assign({ id: "step2-no-target", style: { background: '#fff', padding: '20px', border: '1px solid #ccc' } }, { children: "\uB450 \uBC88\uC9F8 \uB2E8\uACC4" })), _jsx("div", __assign({ id: "step3-no-target", style: { background: '#fff', padding: '20px', border: '1px solid #ccc' } }, { children: "\uB9C8\uC9C0\uB9C9 \uB2E8\uACC4" }))] })) })));
+};
+export default EndCallback;

package/dist/temp/docusaurus/src/step-guide-example/GoToStep.d.ts

@@ -0,0 +1,3 @@
+declare const GoToStep: () => import("react/jsx-runtime").JSX.Element;
+export default GoToStep;
+//# sourceMappingURL=GoToStep.d.ts.map

package/dist/temp/docusaurus/src/step-guide-example/GoToStep.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GoToStep.d.ts","sourceRoot":"","sources":["../../../../../docusaurus/src/step-guide-example/GoToStep.tsx"],"names":[],"mappings":"AAKA,QAAA,MAAM,QAAQ,+CAyEb,CAAC;AAEF,eAAe,QAAQ,CAAC"}