@ncds/ui-admin 1.7.0 → 1.8.1

package/dist/temp/src/components/table/Table.js

@@ -0,0 +1,199 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronDown, ChevronSelectorVertical, ChevronUp } from '@ncds/ui-admin-icon';
+import classNames from 'classnames';
+import { Children, forwardRef, useEffect, useRef, } from 'react';
+// ──────────────────────────────────────────────
+// $table-header-height 와 동기화 — sticky thead가 차지하는 높이를 maxHeight에 보상
+const TABLE_HEADER_HEIGHT = 40;
+// 스크롤바 트랙 상하 여백 합계 (top 8px + bottom 8px) — SCSS &--fixed-header &__scrollbar 오프셋과 동기화
+const SCROLLBAR_TRACK_OFFSET = 16;
+const SCROLLBAR_THUMB_MIN_HEIGHT = 40;
+// Sort Icons (@ncds/ui-admin-icon)
+// ──────────────────────────────────────────────
+const SORT_ICONS = {
+    none: ChevronSelectorVertical,
+    asc: ChevronUp,
+    desc: ChevronDown,
+};
+const ARIA_SORT_MAP = {
+    asc: 'ascending',
+    desc: 'descending',
+    none: 'none',
+};
+// ──────────────────────────────────────────────
+// Sub-components
+// ──────────────────────────────────────────────
+const Header = ({ children, className }) => (_jsx("thead", { className: classNames('ncua-table__header', className), children: children }));
+Header.displayName = 'Table.Header';
+const Body = ({ children, className }) => (_jsx("tbody", { className: classNames('ncua-table__body', className), children: children }));
+Body.displayName = 'Table.Body';
+const Row = forwardRef(({ children, className, selected, status, ...rest }, ref) => (_jsx("tr", { ref: ref, className: classNames('ncua-table__row', className, {
+        'ncua-table__row--selected': selected,
+        'ncua-table__row--warning': status === 'warning',
+        'ncua-table__row--error': status === 'error',
+    }), ...rest, children: children })));
+Row.displayName = 'Table.Row';
+const HeaderCell = forwardRef(({ children, className, sortDirection, onSort, width, style, ...rest }, ref) => {
+    const isSortable = sortDirection !== undefined && onSort !== undefined;
+    const SortIcon = isSortable ? SORT_ICONS[sortDirection] : undefined;
+    return (_jsx("th", { ref: ref, className: classNames('ncua-table__header-cell', className, {
+            'ncua-table__header-cell--sortable': isSortable,
+        }), style: { ...style, width }, "aria-sort": isSortable ? ARIA_SORT_MAP[sortDirection] : undefined, onClick: isSortable ? onSort : undefined, ...rest, children: isSortable && SortIcon ? (_jsxs("span", { className: "ncua-table__header-cell-inner", children: [_jsx("span", { className: "ncua-table__header-cell-text", children: children }), _jsx("span", { className: "ncua-table__sort-icon", children: _jsx(SortIcon, { width: 16, height: 16 }) })] })) : (children) }));
+});
+HeaderCell.displayName = 'Table.HeaderCell';
+const Cell = forwardRef(({ children, className, isHeader, ...rest }, ref) => {
+    if (isHeader) {
+        return (_jsx("th", { ref: ref, scope: "row", className: classNames('ncua-table__cell', className), ...rest, children: children }));
+    }
+    return (_jsx("td", { ref: ref, className: classNames('ncua-table__cell', className), ...rest, children: children }));
+});
+Cell.displayName = 'Table.Cell';
+const Footer = ({ children, className }) => (_jsx("div", { className: classNames('ncua-table__footer', className), children: children }));
+Footer.displayName = 'Table.Footer';
+const Pagination = ({ children, className }) => (_jsx("div", { className: classNames('ncua-table__pagination', className), children: children }));
+Pagination.displayName = 'Table.Pagination';
+const ColGroup = ({ widths }) => {
+    const resolveColWidth = (width) => {
+        if (width === 'auto')
+            return undefined;
+        if (typeof width === 'number')
+            return `${width}px`;
+        return width;
+    };
+    return (_jsx("colgroup", { children: widths.map((width, index) => (
+        // biome-ignore lint/suspicious/noArrayIndexKey: colgroup columns never reorder or change
+        _jsx("col", { style: { width: resolveColWidth(width) } }, index))) }));
+};
+ColGroup.displayName = 'Table.ColGroup';
+const Empty = ({ colSpan, children }) => (_jsx("tr", { children: _jsx("td", { colSpan: colSpan, className: "ncua-table__empty", role: "status", "aria-live": "polite", children: children || '등록된 게시물이 없습니다.' }) }));
+Empty.displayName = 'Table.Empty';
+const categorizeChild = (child, result) => {
+    if (!child || typeof child !== 'object' || !('type' in child)) {
+        result.tableContent.push(child);
+        return;
+    }
+    if (child.type === Footer) {
+        result.footerContent.push(child);
+    }
+    else if (child.type === Pagination) {
+        result.paginationContent.push(child);
+    }
+    else if (child.type === Header) {
+        result.headerContent.push(child);
+    }
+    else if (child.type === ColGroup) {
+        result.colGroupContent.push(child);
+    }
+    else {
+        result.tableContent.push(child);
+    }
+};
+const sortChildren = (children) => {
+    const result = {
+        headerContent: [],
+        colGroupContent: [],
+        tableContent: [],
+        footerContent: [],
+        paginationContent: [],
+    };
+    Children.forEach(children, (child) => {
+        categorizeChild(child, result);
+    });
+    return result;
+};
+// ──────────────────────────────────────────────
+// Main Table component
+// ──────────────────────────────────────────────
+const TableComponent = forwardRef(({ type = 'horizontal', fixedHeader = false, maxHeight, hoverable = true, selectable = false, children, className, ...rest }, ref) => {
+    const tableClasses = classNames('ncua-table', className, {
+        'ncua-table--horizontal': type === 'horizontal',
+        'ncua-table--vertical': type === 'vertical',
+        'ncua-table--fixed-header': fixedHeader,
+        'ncua-table--hoverable': hoverable && type === 'horizontal',
+        'ncua-table--selectable': selectable,
+    });
+    const { headerContent, colGroupContent, tableContent, footerContent, paginationContent } = sortChildren(children);
+    const scrollStyle = fixedHeader && maxHeight
+        ? {
+            maxHeight: typeof maxHeight === 'number'
+                ? `${maxHeight + TABLE_HEADER_HEIGHT}px`
+                : `calc(${maxHeight} + ${TABLE_HEADER_HEIGHT}px)`,
+        }
+        : undefined;
+    // Custom scrollbar refs (used only in fixed-header mode)
+    const scrollContainerRef = useRef(null);
+    const scrollAreaRef = useRef(null);
+    const thumbRef = useRef(null);
+    useEffect(() => {
+        if (!fixedHeader || !maxHeight)
+            return;
+        const scrollEl = scrollContainerRef.current;
+        const thumbEl = thumbRef.current;
+        if (!scrollEl || !thumbEl)
+            return;
+        const update = () => {
+            const { scrollTop, scrollHeight, clientHeight } = scrollEl;
+            if (scrollHeight <= clientHeight) {
+                thumbEl.style.height = '0';
+                return;
+            }
+            const trackHeight = (scrollAreaRef.current?.clientHeight ?? clientHeight) - TABLE_HEADER_HEIGHT - SCROLLBAR_TRACK_OFFSET;
+            const thumbHeight = Math.max(SCROLLBAR_THUMB_MIN_HEIGHT, (clientHeight / scrollHeight) * trackHeight);
+            const thumbTop = (scrollTop / (scrollHeight - clientHeight)) * (trackHeight - thumbHeight);
+            thumbEl.style.height = `${thumbHeight}px`;
+            thumbEl.style.transform = `translateY(${thumbTop}px)`;
+        };
+        scrollEl.addEventListener('scroll', update, { passive: true });
+        const observer = new ResizeObserver(update);
+        observer.observe(scrollEl);
+        update();
+        return () => {
+            scrollEl.removeEventListener('scroll', update);
+            observer.disconnect();
+        };
+    }, [fixedHeader, maxHeight]);
+    const handleThumbMouseDown = (e) => {
+        e.preventDefault();
+        const scrollEl = scrollContainerRef.current;
+        const thumbEl = thumbRef.current;
+        const areaEl = scrollAreaRef.current;
+        if (!scrollEl || !thumbEl)
+            return;
+        areaEl?.setAttribute('data-dragging', '');
+        const startY = e.clientY;
+        const startScrollTop = scrollEl.scrollTop;
+        const { scrollHeight, clientHeight } = scrollEl;
+        const thumbHeight = thumbEl.offsetHeight;
+        const scrollRatio = (scrollHeight - clientHeight) / (clientHeight - thumbHeight);
+        const onMove = (ev) => {
+            scrollEl.scrollTop = startScrollTop + (ev.clientY - startY) * scrollRatio;
+        };
+        const onUp = () => {
+            areaEl?.removeAttribute('data-dragging');
+            document.removeEventListener('mousemove', onMove);
+            document.removeEventListener('mouseup', onUp);
+        };
+        document.addEventListener('mousemove', onMove);
+        document.addEventListener('mouseup', onUp);
+    };
+    if (fixedHeader && maxHeight) {
+        return (_jsxs("div", { ref: ref, className: "ncua-table-wrapper", children: [_jsxs("div", { className: tableClasses, ...rest, children: [_jsxs("div", { ref: scrollAreaRef, className: "ncua-table__scroll-area", children: [_jsx("div", { ref: scrollContainerRef, className: "ncua-table__scroll-container", style: scrollStyle, children: _jsxs("table", { className: "ncua-table__table", role: "table", children: [colGroupContent, headerContent, tableContent] }) }), _jsx("div", { className: "ncua-table__scrollbar", "aria-hidden": "true", children: _jsx("div", { ref: thumbRef, className: "ncua-table__scrollbar-thumb", onMouseDown: handleThumbMouseDown }) })] }), footerContent] }), paginationContent] }));
+    }
+    const tableElement = (_jsxs("table", { className: "ncua-table__table", role: "table", children: [colGroupContent, headerContent, tableContent] }));
+    return (_jsxs("div", { ref: ref, className: "ncua-table-wrapper", children: [_jsxs("div", { className: tableClasses, ...rest, children: [tableElement, footerContent] }), paginationContent] }));
+});
+TableComponent.displayName = 'Table';
+// ──────────────────────────────────────────────
+// Compound export
+// ──────────────────────────────────────────────
+export const Table = Object.assign(TableComponent, {
+    Header,
+    Body,
+    Row,
+    HeaderCell,
+    Cell,
+    Footer,
+    Pagination,
+    ColGroup,
+    Empty,
+});

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

@@ -0,0 +1 @@
+export * from './Table';

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

@@ -0,0 +1 @@
+export * from './Table';

package/dist/temp/src/components/table/types.d.ts

@@ -0,0 +1,47 @@
+import type { ComponentProps, ReactNode } from 'react';
+export type TableType = 'horizontal' | 'vertical';
+export type SortDirection = 'asc' | 'desc' | 'none';
+export type RowStatus = 'warning' | 'error';
+export type TableProps = Omit<ComponentProps<'div'>, 'ref'> & {
+    type?: TableType;
+    fixedHeader?: boolean;
+    maxHeight?: string | number;
+    hoverable?: boolean;
+    selectable?: boolean;
+    children: ReactNode;
+};
+export type TableHeaderProps = {
+    children: ReactNode;
+    className?: string;
+};
+export type TableBodyProps = {
+    children: ReactNode;
+    className?: string;
+};
+export type TableRowProps = Omit<ComponentProps<'tr'>, 'ref'> & {
+    selected?: boolean;
+    status?: RowStatus;
+};
+export type TableHeaderCellProps = Omit<ComponentProps<'th'>, 'ref'> & {
+    sortDirection?: SortDirection;
+    onSort?: () => void;
+    width?: string | number;
+};
+export type TableCellProps = Omit<ComponentProps<'td'>, 'ref'> & {
+    isHeader?: boolean;
+};
+export type TableFooterProps = {
+    children: ReactNode;
+    className?: string;
+};
+export type TablePaginationProps = {
+    children: ReactNode;
+    className?: string;
+};
+export type TableColGroupProps = {
+    widths: (string | number)[];
+};
+export type TableEmptyProps = {
+    colSpan: number;
+    children?: ReactNode;
+};

package/dist/temp/src/components/table/types.js

@@ -0,0 +1 @@
+export {};

package/dist/temp/src/components/tag/Tag.js

@@ -1,48 +1,36 @@
-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 { XClose } from '@ncds/ui-admin-icon';
 import classNames from 'classnames';
 import { useCallback, useRef, useState } from 'react';
 import { COLOR } from '../../../constant/color';
 import { Dot } from '../dot';
-var MARGIN = 10;
-var DEFAULT_TOOLTIP_WIDTH = 200;
-var DEFAULT_TOOLTIP_HEIGHT = 60;
+const MARGIN = 10;
+const DEFAULT_TOOLTIP_WIDTH = 200;
+const DEFAULT_TOOLTIP_HEIGHT = 60;
 // 위치 계산 로직
-var calculateOptimalPosition = function (triggerElement, tooltipElement) {
-    var triggerRect = triggerElement.getBoundingClientRect();
-    var tooltipRect = tooltipElement.getBoundingClientRect();
-    var viewportWidth = window.innerWidth, viewportHeight = window.innerHeight;
-    var tooltipWidth = tooltipRect.width || DEFAULT_TOOLTIP_WIDTH;
-    var tooltipHeight = tooltipRect.height || DEFAULT_TOOLTIP_HEIGHT;
-    var spaces = {
+const calculateOptimalPosition = (triggerElement, tooltipElement) => {
+    const triggerRect = triggerElement.getBoundingClientRect();
+    const tooltipRect = tooltipElement.getBoundingClientRect();
+    const { innerWidth: viewportWidth, innerHeight: viewportHeight } = window;
+    const tooltipWidth = tooltipRect.width || DEFAULT_TOOLTIP_WIDTH;
+    const tooltipHeight = tooltipRect.height || DEFAULT_TOOLTIP_HEIGHT;
+    const spaces = {
         top: triggerRect.top,
         bottom: viewportHeight - triggerRect.bottom,
         left: triggerRect.left,
         right: viewportWidth - triggerRect.right,
     };
     // 위/아래 공간을 먼저 확인하고 우선순위 결정
-    var hasTopSpace = spaces.top >= tooltipHeight + MARGIN;
+    const hasTopSpace = spaces.top >= tooltipHeight + MARGIN;
     // 위쪽 공간이 있으면 top 우선, 없으면 bottom 우선
-    var positions = hasTopSpace
+    const positions = hasTopSpace
         ? ['top-right', 'top-left', 'bottom-right', 'bottom-left']
         : ['bottom-right', 'bottom-left', 'top-right', 'top-left'];
-    for (var _i = 0, positions_1 = positions; _i < positions_1.length; _i++) {
-        var position = positions_1[_i];
-        var isTop = position.includes('top');
-        var isRight = position.includes('right');
-        var hasVerticalSpace = isTop ? spaces.top >= tooltipHeight + MARGIN : spaces.bottom >= tooltipHeight + MARGIN;
-        var hasHorizontalSpace = isRight
+    for (const position of positions) {
+        const isTop = position.includes('top');
+        const isRight = position.includes('right');
+        const hasVerticalSpace = isTop ? spaces.top >= tooltipHeight + MARGIN : spaces.bottom >= tooltipHeight + MARGIN;
+        const hasHorizontalSpace = isRight
             ? spaces.right >= tooltipWidth + MARGIN // right 정렬: 툴팁이 오른쪽으로 펼쳐짐
             : spaces.left >= tooltipWidth + MARGIN; // left 정렬: 툴팁이 왼쪽으로 펼쳐짐
         if (hasVerticalSpace && hasHorizontalSpace) {
@@ -50,61 +38,59 @@ var calculateOptimalPosition = function (triggerElement, tooltipElement) {
         }
     }
     // 모든 조건이 맞지 않으면 공간이 더 많은 쪽으로
-    var fallbackPosition = hasTopSpace ? 'top-right' : 'bottom-right';
+    const fallbackPosition = hasTopSpace ? 'top-right' : 'bottom-right';
     return fallbackPosition;
 };
-var Tag = function (_a) {
-    var _b = _a.size, size = _b === void 0 ? 'sm' : _b, icon = _a.icon, text = _a.text, count = _a.count, close = _a.close, onButtonClick = _a.onButtonClick, _c = _a.maxLength, maxLength = _c === void 0 ? 20 : _c;
-    var _d = useState(false), isTooltipVisible = _d[0], setIsTooltipVisible = _d[1];
-    var _e = useState('top-right'), calculatedPosition = _e[0], setCalculatedPosition = _e[1];
-    var tagRef = useRef(null);
-    var tooltipRef = useRef(null);
-    var iconSize = {
+const Tag = ({ size = 'sm', icon, text, count, close, onButtonClick, maxLength = 20 }) => {
+    const [isTooltipVisible, setIsTooltipVisible] = useState(false);
+    const [calculatedPosition, setCalculatedPosition] = useState('top-right');
+    const tagRef = useRef(null);
+    const tooltipRef = useRef(null);
+    const iconSize = {
         sm: 14,
         md: 16,
     };
     // 텍스트 길이 체크 및 말줄임 처리
-    var shouldTruncate = text.length > maxLength;
-    var displayText = shouldTruncate ? "".concat(text.slice(0, maxLength - 2), "...") : text;
-    var handleMouseEnter = useCallback(function () {
+    const shouldTruncate = text.length > maxLength;
+    const displayText = shouldTruncate ? `${text.slice(0, maxLength - 2)}...` : text;
+    const handleMouseEnter = useCallback(() => {
         if (shouldTruncate) {
             setIsTooltipVisible(true);
             // 간단한 위치 계산 - 기본값 사용
             if (tagRef.current && tooltipRef.current) {
-                var optimalPosition = calculateOptimalPosition(tagRef.current, tooltipRef.current);
+                const optimalPosition = calculateOptimalPosition(tagRef.current, tooltipRef.current);
                 setCalculatedPosition(optimalPosition);
             }
             else {
                 // ref가 없으면 다음 렌더링 사이클에서 시도
-                setTimeout(function () {
+                setTimeout(() => {
                     if (tagRef.current) {
                         // tooltipRef가 없어도 tagRef만으로 계산
-                        var dummyTooltipElement = document.createElement('div');
-                        dummyTooltipElement.style.width = "".concat(DEFAULT_TOOLTIP_WIDTH, "px");
-                        dummyTooltipElement.style.height = "".concat(DEFAULT_TOOLTIP_HEIGHT, "px");
-                        var optimalPosition = calculateOptimalPosition(tagRef.current, dummyTooltipElement);
+                        const dummyTooltipElement = document.createElement('div');
+                        dummyTooltipElement.style.width = `${DEFAULT_TOOLTIP_WIDTH}px`;
+                        dummyTooltipElement.style.height = `${DEFAULT_TOOLTIP_HEIGHT}px`;
+                        const optimalPosition = calculateOptimalPosition(tagRef.current, dummyTooltipElement);
                         setCalculatedPosition(optimalPosition);
                     }
                 }, 0);
             }
         }
     }, [shouldTruncate]);
-    var handleMouseLeave = useCallback(function () {
+    const handleMouseLeave = useCallback(() => {
         setIsTooltipVisible(false);
     }, []);
-    var sideSlotRender = function (slot) {
-        var _a;
+    const sideSlotRender = (slot) => {
         if (slot.type === 'icon') {
-            var SlotIcon = slot.icon;
+            const SlotIcon = slot.icon;
             return _jsx(SlotIcon, { width: iconSize[size], height: iconSize[size], color: slot.color });
         }
         if (slot.type === 'dot') {
-            return _jsx(Dot, { color: slot.color, size: (_a = slot.size) !== null && _a !== void 0 ? _a : 'sm' });
+            return _jsx(Dot, { color: slot.color, size: slot.size ?? 'sm' });
         }
         return slot.children;
     };
-    return (_jsxs("span", __assign({ ref: tagRef, className: classNames('ncua-tag', "ncua-tag--".concat(size), {
+    return (_jsxs("span", { ref: tagRef, className: classNames('ncua-tag', `ncua-tag--${size}`, {
             'ncua-tag--truncated': shouldTruncate,
-        }), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave }, { children: [icon && sideSlotRender(icon), _jsx("span", __assign({ className: "ncua-tag__text" }, { children: displayText })), count && _jsx("span", __assign({ className: "ncua-tag__count" }, { children: count })), close && (_jsx("button", __assign({ type: "button", className: "ncua-tag__close", onClick: onButtonClick }, { children: _jsx(XClose, { color: COLOR.gray300, width: iconSize[size], height: iconSize[size] }) }))), shouldTruncate && isTooltipVisible && (_jsx("span", __assign({ ref: tooltipRef, className: classNames('ncua-tag__tooltip', "ncua-tag__tooltip--".concat(calculatedPosition)) }, { children: _jsx("span", __assign({ className: "ncua-tag__tooltip-content" }, { children: text })) })))] })));
+        }), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [icon && sideSlotRender(icon), _jsx("span", { className: "ncua-tag__text", children: displayText }), count && _jsx("span", { className: "ncua-tag__count", children: count }), close && (_jsx("button", { type: "button", className: "ncua-tag__close", onClick: onButtonClick, children: _jsx(XClose, { color: COLOR.gray300, width: iconSize[size], height: iconSize[size] }) })), shouldTruncate && isTooltipVisible && (_jsx("span", { ref: tooltipRef, className: classNames('ncua-tag__tooltip', `ncua-tag__tooltip--${calculatedPosition}`), children: _jsx("span", { className: "ncua-tag__tooltip-content", children: text }) }))] }));
 };
 export { Tag };

package/dist/temp/src/components/textarea/Textarea.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { forwardRef, useEffect, useRef, useState } from 'react';
+import { HintText } from '../shared/hintText/HintText';
+import { Label } from '../shared/label/Label';
+export const Textarea = forwardRef(({ className, size = 'xs', label, required, disabled, hintText, characterCount, destructive, ...props }, ref) => {
+    const textareaRef = useRef(null);
+    const [textCount, setTextCount] = useState(0);
+    const shouldShowHintArea = hintText || characterCount;
+    useEffect(() => {
+        if (textareaRef.current && characterCount) {
+            setTextCount(textareaRef.current.value.length);
+            const handleInput = () => {
+                setTextCount(textareaRef.current?.value.length ?? 0);
+            };
+            textareaRef.current.addEventListener('input', handleInput);
+            return () => {
+                textareaRef.current?.removeEventListener('input', handleInput);
+            };
+        }
+    }, [characterCount]);
+    return (_jsxs("div", { className: classNames('ncua-input', 'ncua-input--textarea', `ncua-input--textarea--${size}`, {
+            destructive: destructive,
+            'is-disabled': disabled,
+        }, className), children: [label && (_jsx(Label, { htmlFor: props.id, isRequired: required, children: label })), _jsx("textarea", { ref: (node) => {
+                    if (typeof ref === 'function') {
+                        ref(node);
+                    }
+                    else if (ref) {
+                        ref.current = node;
+                    }
+                    textareaRef.current = node;
+                }, className: "ncua-input__textarea", disabled: disabled, ...props }), shouldShowHintArea && (_jsxs("div", { className: "ncua-input__text-count-wrap", children: [hintText && (_jsx(HintText, { as: "div", destructive: destructive, children: hintText })), characterCount && (_jsx("div", { className: "ncua-input__text-count", children: _jsxs("span", { className: "ncua-input__text-count-text", children: [_jsx("span", { className: "ncua-input__text-count-text-count", children: textCount }), "/", props.maxLength ?? 0] }) }))] }))] }));
+});

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

@@ -0,0 +1 @@
+export * from './Textarea';

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

@@ -0,0 +1 @@
+export * from './Textarea';

package/dist/temp/src/components/toggle/Toggle.js

@@ -1,30 +1,7 @@
-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);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from 'classnames';
-export var Toggle = function (_a) {
-    var _b = _a.size, size = _b === void 0 ? 'sm' : _b, _c = _a.text, text = _c === void 0 ? '' : _c, _d = _a.supportText, supportText = _d === void 0 ? '' : _d, _e = _a.disabled, disabled = _e === void 0 ? false : _e, onChange = _a.onChange, className = _a.className, props = __rest(_a, ["size", "text", "supportText", "disabled", "onChange", "className"]);
-    return (_jsxs("label", __assign({ className: classNames('ncua-toggle', "ncua-toggle--".concat(size), {
+export const Toggle = ({ size = 'sm', text = '', supportText = '', disabled = false, onChange, className, ...props }) => {
+    return (_jsxs("label", { className: classNames('ncua-toggle', `ncua-toggle--${size}`, {
             'ncua-toggle--disabled': disabled,
-        }, className) }, { children: [_jsx("input", __assign({ type: "checkbox", className: "ncua-toggle__input", checked: props === null || props === void 0 ? void 0 : props.checked, disabled: disabled, onChange: onChange }, props)), _jsx("span", __assign({ className: "ncua-toggle__switch" }, { children: _jsx("span", { className: "ncua-toggle__slider" }) })), text && (_jsxs("span", __assign({ className: "ncua-toggle__text-wrapper" }, { children: [_jsx("span", __assign({ className: "ncua-toggle__text" }, { children: text })), supportText && _jsx("span", __assign({ className: "ncua-toggle__support-text" }, { children: supportText }))] })))] })));
+        }, className), children: [_jsx("input", { type: "checkbox", className: "ncua-toggle__input", checked: props?.checked, disabled: disabled, onChange: onChange, ...props }), _jsx("span", { className: "ncua-toggle__switch", children: _jsx("span", { className: "ncua-toggle__slider" }) }), text && (_jsxs("span", { className: "ncua-toggle__text-wrapper", children: [_jsx("span", { className: "ncua-toggle__text", children: text }), supportText && _jsx("span", { className: "ncua-toggle__support-text", children: supportText })] }))] }));
 };