@ceed/cds 0.0.125 → 0.0.127

package/dist/components/Accordions/Accordions.js

@@ -0,0 +1,72 @@
+"use strict";
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Accordions = exports.Accordion = exports.AccordionDetails = exports.AccordionSummary = void 0;
+var react_1 = __importDefault(require("react"));
+var joy_1 = require("@mui/joy");
+var framer_motion_1 = require("framer-motion");
+var MotionAccordionSummary = (0, framer_motion_1.motion)(joy_1.AccordionSummary);
+var AccordionSummary = MotionAccordionSummary;
+exports.AccordionSummary = AccordionSummary;
+AccordionSummary.displayName = "AccordionSummary";
+var MotionAccordionDetails = (0, framer_motion_1.motion)(joy_1.AccordionDetails);
+var AccordionDetails = MotionAccordionDetails;
+exports.AccordionDetails = AccordionDetails;
+AccordionDetails.displayName = "AccordionDetails";
+var MotionAccordion = (0, framer_motion_1.motion)(joy_1.Accordion);
+function Accordion(props) {
+    // prop destruction
+    var summary = props.summary, details = props.details, variant = props.variant, color = props.color, innerProps = __rest(props, ["summary", "details", "variant", "color"]);
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    var inheritedVariant = variant === "solid" ? "solid" : undefined;
+    // effects
+    // handlers
+    return (react_1.default.createElement(MotionAccordion, __assign({ variant: inheritedVariant, color: color }, innerProps),
+        react_1.default.createElement(AccordionSummary, { variant: inheritedVariant, color: color }, summary),
+        react_1.default.createElement(AccordionDetails, { variant: inheritedVariant, color: color }, details)));
+}
+exports.Accordion = Accordion;
+Accordion.displayName = "Accordion";
+var MotionAccordions = (0, framer_motion_1.motion)(joy_1.AccordionGroup);
+function Accordions(props) {
+    // prop destruction
+    var variant = props.variant, color = props.color, items = props.items, innerProps = __rest(props, ["variant", "color", "items"]);
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (react_1.default.createElement(MotionAccordions, __assign({ variant: variant, color: color }, innerProps), items.map(function (item, index) { return (react_1.default.createElement(Accordion, { summary: item.summary, details: item.details, index: index, variant: variant, color: color })); })));
+}
+exports.Accordions = Accordions;
+Accordions.displayName = "Accordions";

package/dist/components/Accordions/index.js

@@ -0,0 +1,19 @@
+"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 });
+var Accordions_1 = require("./Accordions");
+__exportStar(require("./Accordions"), exports);
+exports.default = Accordions_1.Accordions;

package/dist/components/Autocomplete/Autocomplete.js

@@ -0,0 +1,280 @@
+"use strict";
+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 __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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Autocomplete = void 0;
+var react_1 = __importStar(require("react"));
+var joy_1 = require("@mui/joy");
+// @ts-ignore: ESM import 해야만 프레이머에서 정상적으로 동작한다. https://github.com/mui/material-ui/issues/35233
+var Close_js_1 = __importDefault(require("@mui/icons-material/esm/Close.js"));
+var react_virtual_1 = require("@tanstack/react-virtual");
+var base_1 = require("@mui/base");
+var FormControl_1 = __importDefault(require("../FormControl"));
+var FormLabel_1 = __importDefault(require("../FormLabel"));
+var FormHelperText_1 = __importDefault(require("../FormHelperText"));
+var Chip_1 = __importDefault(require("../Chip"));
+var IconButton_1 = __importDefault(require("../IconButton"));
+var Stack_1 = __importDefault(require("../Stack"));
+var AutocompletePopper = (0, joy_1.styled)(base_1.Popper, {
+    name: "Autocomplete",
+    slot: "Popper",
+})(function (_a) {
+    var theme = _a.theme;
+    return ({
+        zIndex: theme.zIndex.tooltip,
+    });
+});
+var AutocompleteListBox = react_1.default.forwardRef(function (props, ref) {
+    // prop destruction
+    var anchorEl = props.anchorEl, open = props.open, modifiers = props.modifiers, children = props.children, _a = props.ownerState, loading = _a.loading, _b = _a.size, fontSize = _b === void 0 ? "md" : _b, innerProps = __rest(props, ["anchorEl", "open", "modifiers", "children", "ownerState"]);
+    // state, ref, querystring hooks
+    var parentRef = (0, react_1.useRef)(null);
+    // lib hooks
+    // NOTE: 부분 grouping은 불가능하다.
+    var isGrouped = children[0].every(function (child) { return child.hasOwnProperty("group"); });
+    var renderTargets = (function () {
+        if (loading) {
+            return [children[1]];
+        }
+        if (children[0].length === 0) {
+            return [children[2]];
+        }
+        if (isGrouped) {
+            return children[0].flatMap(function (child) { return __spreadArray([
+                react_1.default.createElement(joy_1.ListSubheader, { key: child.key, component: "li" }, child.group)
+            ], child.children, true); });
+        }
+        return children[0];
+    })();
+    var virtualizer = (0, react_virtual_1.useVirtualizer)({
+        count: renderTargets.length,
+        // TODO: 하드코딩된 option height, autocomplete size에 대응하거나 동적 사이즈를 적용해야한다.
+        estimateSize: function () { return 36; },
+        getScrollElement: function () { return parentRef.current; },
+        overscan: 5,
+    });
+    // form hooks
+    // query hooks
+    // calculated values
+    var items = virtualizer.getVirtualItems();
+    // effects
+    (0, react_1.useEffect)(function () {
+        if (open) {
+            virtualizer.measure();
+        }
+    }, [open, virtualizer]);
+    // handlers
+    return (react_1.default.createElement(AutocompletePopper, { ref: ref, anchorEl: anchorEl, open: open, modifiers: modifiers },
+        react_1.default.createElement(joy_1.AutocompleteListbox, __assign({}, innerProps),
+            react_1.default.createElement("div", { ref: parentRef, style: { overflow: "auto" } },
+                react_1.default.createElement("div", { style: {
+                        height: "".concat(virtualizer.getTotalSize(), "px"),
+                        position: "relative",
+                    } }, items.map(function (_a) {
+                    var index = _a.index, size = _a.size, start = _a.start, key = _a.key;
+                    return react_1.default.cloneElement(renderTargets[index], {
+                        key: key,
+                        style: {
+                            position: "absolute",
+                            top: 0,
+                            left: 0,
+                            width: "100%",
+                            fontSize: "var(--ceed-fontSize-".concat(fontSize, ")"),
+                            height: "".concat(size, "px"),
+                            transform: "translateY(".concat(start, "px)"),
+                            overflow: "visible",
+                        },
+                        children: (react_1.default.createElement("div", { style: {
+                                textOverflow: "ellipsis",
+                                textWrap: "nowrap",
+                                overflow: "hidden",
+                                width: "100%",
+                            } }, renderTargets[index].props.children)),
+                    });
+                }))))));
+});
+var AutocompleteDeleteSize = {
+    sm: "20px",
+    md: "24px",
+    lg: "28px",
+};
+var AutocompleteTagDelete = (0, joy_1.styled)(IconButton_1.default, {
+    name: "Autocomplete",
+    slot: "tagDelete",
+})(function (_a) {
+    var theme = _a.theme, _b = _a.size, size = _b === void 0 ? "md" : _b;
+    return ({
+        width: AutocompleteDeleteSize[size],
+        height: AutocompleteDeleteSize[size],
+        minWidth: AutocompleteDeleteSize[size],
+        minHeight: AutocompleteDeleteSize[size],
+        borderRadius: "50%",
+    });
+});
+function Autocomplete(props) {
+    // prop destruction
+    var label = props.label, error = props.error, helperText = props.helperText, color = props.color, size = props.size, disabled = props.disabled, required = props.required, onChange = props.onChange, onChangeComplete = props.onChangeComplete, innerProps = __rest(props, ["label", "error", "helperText", "color", "size", "disabled", "required", "onChange", "onChangeComplete"]);
+    // lib hooks
+    // state, ref, querystring hooks
+    var _a = (0, react_1.useState)(props.value || props.defaultValue), _value = _a[0], setValue = _a[1];
+    // form hooks
+    // query hooks
+    // calculated values
+    var options = (0, react_1.useMemo)(function () {
+        return props.options.map(function (option) {
+            if (typeof option !== "object") {
+                return {
+                    value: option,
+                    label: option,
+                };
+            }
+            return option;
+        });
+    }, [props.options]);
+    var optionMap = (0, react_1.useMemo)(function () {
+        var map = new Map();
+        options.forEach(function (option) {
+            map.set(option.value, option);
+        });
+        return map;
+    }, [options]);
+    var value = (0, react_1.useMemo)(function () {
+        if (props.loading) {
+            return {
+                value: "",
+                label: "",
+                startDecorator: (react_1.default.createElement(joy_1.CircularProgress, { size: "sm", color: "neutral", variant: "plain", thickness: 3 })),
+            };
+        }
+        if (_value === null || _value === undefined) {
+            // NOTE: value가 undefined면 uncontrolled로 취급된다.
+            return null;
+        }
+        var convertValue = function (targetValue) {
+            var _a;
+            if (typeof targetValue !== "object") {
+                return (_a = optionMap.get(targetValue)) !== null && _a !== void 0 ? _a : targetValue;
+            }
+            // NOTE: value값이 같은 object가 넘어오면 선택된 option으로, Autocomplete에서 선택된 태그로 보여아한다.
+            return optionMap.get(targetValue.value);
+        };
+        if (Array.isArray(_value)) {
+            return _value.map(convertValue);
+        }
+        return convertValue(_value);
+    }, [_value, optionMap, props.loading]);
+    var applySize = (0, react_1.useCallback)(function (node) {
+        return react_1.default.isValidElement(node) && !props.loading
+            ? react_1.default.cloneElement(node, __assign({ size: size }))
+            : node;
+    }, [size, props.loading]);
+    var startDecorator = (0, react_1.useMemo)(function () {
+        return applySize((value === null || value === void 0 ? void 0 : value.startDecorator) || props.startDecorator);
+    }, [value, applySize, props.startDecorator]);
+    var endDecorator = (0, react_1.useMemo)(function () {
+        return applySize((value === null || value === void 0 ? void 0 : value.endDecorator) || props.endDecorator);
+    }, [value, applySize, props.endDecorator]);
+    // effects
+    // handlers
+    var handleChange = function (event, value) {
+        setValue(value);
+        var newValue = value;
+        var _value = Array.isArray(newValue)
+            ? newValue.map(function (value) { return value.value; })
+            : newValue === null || newValue === void 0 ? void 0 : newValue.value;
+        onChange === null || onChange === void 0 ? void 0 : onChange(__assign(__assign({}, event), { target: __assign(__assign({}, event.target), { 
+                // @ts-expect-error NOTE: multiple이 true일 때, value는 배열이다.
+                value: _value }) }));
+        if ((Array.isArray(newValue) &&
+            newValue.map(function (value) { return optionMap.get(value.value); })) ||
+            optionMap.get(newValue === null || newValue === void 0 ? void 0 : newValue.value)) {
+            onChangeComplete === null || onChangeComplete === void 0 ? void 0 : onChangeComplete(__assign(__assign({}, event), { target: __assign(__assign({}, event.target), { 
+                    // @ts-expect-error NOTE: multiple이 true일 때, value는 배열이다.
+                    value: _value }) }));
+        }
+    };
+    var autocomplete = (react_1.default.createElement(joy_1.Autocomplete, __assign({}, innerProps, { required: required, onChange: handleChange, color: error ? "danger" : color, value: value, options: options, size: size, disabled: disabled, startDecorator: startDecorator, endDecorator: endDecorator, getOptionLabel: function (option) { var _a; return "".concat((_a = option.value) !== null && _a !== void 0 ? _a : ""); }, renderTags: function (tags, getTagProps) {
+            return tags.map(function (tag, index) {
+                var _a = getTagProps({ index: index }), onClick = _a.onClick, rest = __rest(_a, ["onClick"]);
+                return applySize(react_1.default.createElement(Chip_1.default, __assign({ color: "primary" }, rest),
+                    react_1.default.createElement(Stack_1.default, { direction: "row", alignItems: "center", gap: 2, py: 0.5 },
+                        tag.value,
+                        applySize(react_1.default.createElement(AutocompleteTagDelete, { color: "primary", variant: "soft", onClick: onClick },
+                            react_1.default.createElement(Close_js_1.default, null))))));
+            });
+        }, slots: {
+            listbox: AutocompleteListBox,
+        }, renderOption: function (props, option) { return (react_1.default.createElement(joy_1.AutocompleteOption, __assign({}, props),
+            option.startDecorator && (react_1.default.createElement(joy_1.ListItemDecorator, { sx: function (theme) { return ({
+                    marginInlineEnd: "var(--Input-gap, ".concat(theme.spacing(1), ")"),
+                }); } }, applySize(option.startDecorator))),
+            applySize(option.label),
+            option.endDecorator && (react_1.default.createElement(joy_1.ListItemDecorator, { sx: function (theme) { return ({
+                    marginInlineStart: "var(--Input-gap, ".concat(theme.spacing(1), ")"),
+                }); } }, applySize(option.endDecorator))))); }, 
+        // TODO: Post React 18 update - validate this conversion, look like a hidden bug
+        renderGroup: function (params) { return params; } })));
+    if (label) {
+        return (react_1.default.createElement(FormControl_1.default, { required: required, color: color, size: size, error: error, disabled: disabled },
+            react_1.default.createElement(FormLabel_1.default, null, label),
+            autocomplete,
+            helperText && react_1.default.createElement(FormHelperText_1.default, null, helperText)));
+    }
+    return autocomplete;
+}
+exports.Autocomplete = Autocomplete;

package/dist/components/Autocomplete/index.js

@@ -0,0 +1,19 @@
+"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 });
+var Autocomplete_1 = require("./Autocomplete");
+__exportStar(require("./Autocomplete"), exports);
+exports.default = Autocomplete_1.Autocomplete;

package/dist/components/Box/Box.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Box = void 0;
+var joy_1 = require("@mui/joy");
+var framer_motion_1 = require("framer-motion");
+var MotionBox = (0, framer_motion_1.motion)(joy_1.Box);
+var Box = MotionBox;
+exports.Box = Box;
+Box.displayName = "Box";

package/dist/components/Box/index.js

@@ -0,0 +1,19 @@
+"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 });
+var Box_1 = require("./Box");
+__exportStar(require("./Box"), exports);
+exports.default = Box_1.Box;

package/dist/components/Breadcrumbs/Breadcrumbs.js

@@ -0,0 +1,96 @@
+"use strict";
+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 __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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Breadcrumbs = void 0;
+var react_1 = __importDefault(require("react"));
+var joy_1 = require("@mui/joy");
+var Menu_1 = __importStar(require("../Menu"));
+var Dropdown_1 = __importDefault(require("../Dropdown"));
+var Typography_1 = __importDefault(require("../Typography"));
+function Breadcrumbs(props) {
+    // prop destruction
+    var crumbs = props.crumbs, size = props.size, _a = props.startCrumbCount, startCrumbCount = _a === void 0 ? 1 : _a, _b = props.endCrumbCount, endCrumbCount = _b === void 0 ? 3 : _b, _c = props.slots, _d = _c === void 0 ? { link: joy_1.Link } : _c, Link = _d.link, restSlots = __rest(_d, ["link"]), _e = props.slotProps, _f = _e === void 0 ? {
+        link: { color: "neutral" },
+    } : _e, linkProps = _f.link, restSlotProps = __rest(_f, ["link"]), innerProps = __rest(props, ["crumbs", "size", "startCrumbCount", "endCrumbCount", "slots", "slotProps"]);
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    var _endCrumbCount = Math.max(1, endCrumbCount);
+    var Crumb = function (props) {
+        if (props.type === "link" && Link) {
+            return (react_1.default.createElement(Link, __assign({ to: props.linkHref, href: props.linkHref }, linkProps), props.label));
+        }
+        else {
+            return react_1.default.createElement(Typography_1.default, null, props.label);
+        }
+    };
+    var frontCrumbs = crumbs
+        .slice(0, startCrumbCount)
+        .map(function (crumb) { return react_1.default.createElement(Crumb, __assign({}, crumb)); });
+    var backCrumbs = (startCrumbCount + _endCrumbCount > crumbs.length
+        ? crumbs.slice(startCrumbCount)
+        : crumbs.slice(-_endCrumbCount)).map(function (crumb) { return react_1.default.createElement(Crumb, __assign({}, crumb)); });
+    var collapsedCrumbs = crumbs
+        .slice(startCrumbCount, -_endCrumbCount)
+        .map(function (crumb) { return (react_1.default.createElement(Menu_1.MenuItem, null,
+        react_1.default.createElement(Crumb, __assign({}, crumb)))); });
+    // effects
+    // handlers
+    return (react_1.default.createElement(joy_1.Breadcrumbs, __assign({ size: size, slots: restSlots, slotProps: restSlotProps }, innerProps),
+        frontCrumbs,
+        collapsedCrumbs.length && (react_1.default.createElement(Dropdown_1.default, null,
+            react_1.default.createElement(Menu_1.MenuButton, { size: size, variant: "plain" }, "..."),
+            react_1.default.createElement(Menu_1.default, { size: size }, collapsedCrumbs))),
+        backCrumbs));
+}
+exports.Breadcrumbs = Breadcrumbs;
+Breadcrumbs.displayName = "Breadcrumbs";

package/dist/components/Breadcrumbs/index.js

@@ -0,0 +1,19 @@
+"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 });
+var Breadcrumbs_1 = require("./Breadcrumbs");
+__exportStar(require("./Breadcrumbs"), exports);
+exports.default = Breadcrumbs_1.Breadcrumbs;

package/dist/components/Button/Button.js

@@ -0,0 +1,54 @@
+"use strict";
+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 __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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Button = void 0;
+var react_1 = __importStar(require("react"));
+var joy_1 = require("@mui/joy");
+var framer_motion_1 = require("framer-motion");
+var MotionButton = (0, framer_motion_1.motion)(joy_1.Button);
+var Button = (0, react_1.forwardRef)(function (props, ref) {
+    // prop destruction
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (react_1.default.createElement(MotionButton, __assign({ ref: ref }, props)));
+});
+exports.Button = Button;
+Button.displayName = "Button";

package/dist/components/Button/index.js

@@ -0,0 +1,19 @@
+"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 });
+var Button_1 = require("./Button");
+__exportStar(require("./Button"), exports);
+exports.default = Button_1.Button;