@react-fabric/core 1.0.0-beta.0

package/dist/cjs/components/chip/Chip.js

@@ -0,0 +1,94 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var classNames = require('classnames');
+var react = require('react');
+var useEffectDebugger = require('../../hooks/useEffectDebugger.js');
+var getColor = require('../../utils/getColor.js');
+require('@react-fabric/utilities');
+var Icon = require('../icon/Icon.js');
+var Chip_module = require('./Chip.module.css');
+var jsxRuntime = require('react/jsx-runtime');
+
+var _excluded = ["ref", "children", "className", "size", "color", "variant", "icon", "iconBg", "iconColor", "rtlFlip", "disabled", "onClick", "onIconClick", "onRemove", "rounded", "stopPropagation", "as"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var SizeMap = {
+  xs: "0.625rem",
+  sm: "0.875rem",
+  md: "1.125rem",
+  lg: "1.5rem",
+  xl: "2rem"
+};
+var Chip = function Chip(_ref) {
+  var ref = _ref.ref,
+    children = _ref.children,
+    className = _ref.className,
+    size = _ref.size,
+    color = _ref.color,
+    variant = _ref.variant,
+    icon = _ref.icon,
+    iconBg = _ref.iconBg,
+    iconColor = _ref.iconColor,
+    rtlFlip = _ref.rtlFlip,
+    disabled = _ref.disabled,
+    onClick = _ref.onClick,
+    onIconClick = _ref.onIconClick,
+    onRemove = _ref.onRemove,
+    rounded = _ref.rounded,
+    stopPropagation = _ref.stopPropagation,
+    as = _ref.as,
+    aria = _objectWithoutProperties(_ref, _excluded);
+  /** ***************** style map *******************/
+  var styles = useEffectDebugger.useMemoDebugger(function () {
+    var s = {};
+    if (color) {
+      s.color = getColor.getColor(color);
+    }
+    if (size && !(size in SizeMap)) {
+      s.fontSize = size;
+    }
+    if (size && size in SizeMap) {
+      s.fontSize = SizeMap[size];
+    }
+    return s;
+  }, [color, size], "Chip styles");
+  var clickHandler = react.useCallback(function (e) {
+    if (stopPropagation) e.stopPropagation();
+    onClick === null || onClick === void 0 || onClick(e);
+  }, [onClick, stopPropagation]);
+  var removeHandler = react.useCallback(function (e) {
+    if (stopPropagation) e.stopPropagation();
+    onRemove === null || onRemove === void 0 || onRemove(e);
+  }, [onRemove, stopPropagation]);
+  var E = as !== null && as !== void 0 ? as : "div";
+  return /*#__PURE__*/jsxRuntime.jsxs(E, _objectSpread(_objectSpread({
+    ref: ref,
+    role: "term",
+    className: classNames(Chip_module.chip, className, color && getColor.getColorClass(color), "select-none inline-flex flex-nowrap items-center max-w-72 text-sm leading-none rounded", rounded && "rounded-full", !!onClick && Chip_module.clickable, disabled && Chip_module.disabled),
+    style: styles,
+    "data-variant": variant,
+    "data-inner-clickable": !!onClick,
+    onClick: clickHandler
+  }, aria), {}, {
+    children: [icon && /*#__PURE__*/jsxRuntime.jsx(Icon.Icon, {
+      className: classNames(Chip_module.chipIcon, "m-1"),
+      icon: icon,
+      bg: iconBg,
+      onClick: onIconClick,
+      color: iconColor,
+      rtlFlip: rtlFlip
+    }), children && /*#__PURE__*/jsxRuntime.jsx("label", {
+      className: classNames(Chip_module.chipLabel, "leading-none truncate"),
+      children: children
+    }), onRemove && /*#__PURE__*/jsxRuntime.jsx("span", {
+      role: "none",
+      className: classNames(Chip_module.chipRemove, "cursor-pointer pe-1 opacity-65 hover:opacity-90"),
+      onClick: removeHandler,
+      children: "\xD7"
+    })]
+  }));
+};
+
+exports.Chip = Chip;

package/dist/cjs/components/chip/Chip.module.css

@@ -0,0 +1 @@
+@layer comp{.chip{--blank-gradient:linear-gradient(180deg,#00000005 0%,#0000 10%);background-image:var(--blank-gradient);color:theme(colors.tint.500);outline:1px solid color-mix(in lab,currentcolor 20%,var(--fabric-bg));outline-offset:-1px;&>.chipLabel{padding:.25em .5em}&>.chipIcon{&+.chipLabel{margin-inline-start:-.5em}}&.clickable{background-image:var(--click-gradient);cursor:pointer;&.disabled{opacity:.5;pointer-events:none}}}}@layer var{.chip{background-color:color-mix(in lab,currentcolor 10%,var(--fabric-bg));height:unset;padding:unset;&[data-variant=outline]{box-shadow:0 0 2px color-mix(in lab,currentcolor 50%,var(--tint)) inset;outline-color:color-mix(in lab,currentcolor 50%,var(--fabric-bg))}>*{color:color-mix(in lab,currentcolor 50%,var(--fabric-text))}&.clickable{&:hover{background-color:color-mix(in lab,currentcolor 20%,var(--fabric-bg))}&:active,&[data-dropdown-open=true]{background-color:color-mix(in lab,currentcolor 15%,var(--fabric-bg));background-image:var(--active-gradient)}&[data-dropdown-open=true]{pointer-events:none}}&[data-variant=solid]{background-color:color-mix(in lab,currentcolor 35%,var(--fabric-bg));outline-color:color-mix(in lab,currentcolor 50%,var(--fabric-bg));&>*{color:color-mix(in lab,currentcolor 5%,var(--fabric-text))}&.clickable{&:hover{background-color:color-mix(in lab,currentcolor 45%,var(--fabric-bg))}&:active,&[data-dropdown-open=true]{background-color:color-mix(in lab,currentcolor 30%,var(--fabric-bg))}}}}}

package/dist/cjs/components/collapsable/Collapsable.js

@@ -0,0 +1,84 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _toArray = require('@babel/runtime/helpers/toArray');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var classNames = require('classnames');
+var react = require('react');
+var icons = require('../../types/icons.js');
+var Icon = require('../icon/Icon.js');
+var Collapsable_module = require('./Collapsable.module.css');
+var jsxRuntime = require('react/jsx-runtime');
+
+var _excluded = ["ref", "className", "bodyClassName", "headerClassName", "children", "iconAlign", "iconClosed", "iconOpen", "open", "onClose", "onOpen"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Collapsable = function Collapsable(_ref) {
+  var ref = _ref.ref,
+    className = _ref.className,
+    bodyClassName = _ref.bodyClassName,
+    headerClassName = _ref.headerClassName,
+    children = _ref.children,
+    iconAlign = _ref.iconAlign,
+    _ref$iconClosed = _ref.iconClosed,
+    iconClosed = _ref$iconClosed === void 0 ? icons.CoreIcons.chevronRight : _ref$iconClosed,
+    _ref$iconOpen = _ref.iconOpen,
+    iconOpen = _ref$iconOpen === void 0 ? icons.CoreIcons.chevronDown : _ref$iconOpen,
+    open = _ref.open;
+    _ref.onClose;
+    _ref.onOpen;
+    var aria = _objectWithoutProperties(_ref, _excluded);
+  var _useState = react.useState(open),
+    _useState2 = _slicedToArray(_useState, 2),
+    openState = _useState2[0],
+    setOpenState = _useState2[1];
+  var headRef = react.useRef(null);
+  var bodyRef = react.useRef(null);
+  react.useImperativeHandle(ref, function () {
+    return {
+      button: headRef,
+      body: bodyRef,
+      open: !!openState
+    };
+  }, [openState]);
+  react.useEffect(function () {
+    setOpenState(open);
+  }, [open]);
+  var _useMemo = react.useMemo(function () {
+      var _Children$toArray = react.Children.toArray(children),
+        _Children$toArray2 = _toArray(_Children$toArray),
+        h = _Children$toArray2[0],
+        b = _Children$toArray2.slice(1);
+      return [h, b];
+    }, [children]),
+    _useMemo2 = _slicedToArray(_useMemo, 2),
+    head = _useMemo2[0],
+    body = _useMemo2[1];
+  return /*#__PURE__*/jsxRuntime.jsxs("div", _objectSpread(_objectSpread({
+    className: classNames(Collapsable_module.collapsable, className)
+  }, aria), {}, {
+    children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+      role: "none",
+      ref: headRef,
+      className: classNames(Collapsable_module.collapsableHead, "flex gap-1 flex-nowrap py-2 font-medium cursor-pointer items-center select-none hover:opacity-70", headerClassName, iconAlign === "end" ? "flex-row-reverse" : "flex-row"),
+      onClick: function onClick() {
+        return setOpenState(!openState);
+      },
+      children: [/*#__PURE__*/jsxRuntime.jsx(Icon.Icon, {
+        size: "1.125em",
+        icon: openState ? iconOpen : iconClosed,
+        rtlFlip: true
+      }), /*#__PURE__*/jsxRuntime.jsx("div", {
+        className: "flex-1 px-2",
+        children: head
+      })]
+    }), openState && /*#__PURE__*/jsxRuntime.jsx("div", {
+      ref: bodyRef,
+      className: classNames(Collapsable_module.collapsableBody, bodyClassName),
+      children: body
+    })]
+  }));
+};
+
+exports.Collapsable = Collapsable;

package/dist/cjs/components/collapsable/Collapsable.module.css

@@ -0,0 +1 @@
+@layer comp{.collapsable{&+&{border-top:1px solid theme(borderColor.base)}}}

package/dist/cjs/components/divider/Divider.js

@@ -0,0 +1,65 @@
+'use strict';
+
+var classNames = require('classnames');
+var react = require('react');
+var getColor = require('../../utils/getColor.js');
+require('@react-fabric/utilities');
+var jsxRuntime = require('react/jsx-runtime');
+
+/*
+ * React Fabric
+ * @version: 1.0.0
+ *
+ *
+ * The MIT License (MIT)
+ * Copyright (c) 2024 Adarsh Pastakia
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
+ * and associated documentation files (the "Software"), to deal in the Software without restriction,
+ * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
+ * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial
+ * portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
+ * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+ * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+ * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+var Divider = function Divider(_ref) {
+  var children = _ref.children,
+    color = _ref.color,
+    vertical = _ref.vertical,
+    fill = _ref.fill,
+    _ref$align = _ref.align,
+    align = _ref$align === void 0 ? "start" : _ref$align,
+    className = _ref.className;
+  var Rule = react.useCallback(function (_ref2) {
+    var flex = _ref2.flex,
+      className = _ref2.className;
+    return /*#__PURE__*/jsxRuntime.jsx("hr", {
+      style: {
+        flex: flex
+      },
+      className: classNames(className, vertical && "vertical", !flex && "self-stretch", vertical ? "mx-1" : "my-1", color && getColor.getBorderClass(color + "-200"))
+    });
+  }, [color, vertical]);
+  return children ? /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: classNames("flex flex-nowrap items-center", vertical && "flex-col", className),
+    children: [/*#__PURE__*/jsxRuntime.jsx(Rule, {
+      flex: align === "start" ? "0 0 1rem" : "1 1 1em"
+    }), /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: classNames("px-2 whitespace-nowrap", vertical ? "mx-1" : "my-1", fill && getColor.getBgClass((color !== null && color !== void 0 ? color : "tint") + "-200"), !fill && getColor.getColorClass((color !== null && color !== void 0 ? color : "tint") + "-600"), "rounded-full text-[0.75em]", vertical && "origin-center -rotate-90 z-1"),
+      children: children
+    }), /*#__PURE__*/jsxRuntime.jsx(Rule, {
+      flex: align === "end" ? "0 0 1rem" : "1 1 1em"
+    })]
+  }) : /*#__PURE__*/jsxRuntime.jsx(Rule, {
+    className: className
+  });
+};
+
+exports.Divider = Divider;

package/dist/cjs/components/dropdown/Dropdown.js

@@ -0,0 +1,180 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var react = require('@floating-ui/react');
+var utilities = require('@react-fabric/utilities');
+var classNames = require('classnames');
+var react$1 = require('react');
+var Dropdown_module = require('./Dropdown.module.css');
+var jsxRuntime = require('react/jsx-runtime');
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var DropdownElement = function DropdownElement(_ref) {
+  var _refs$domReference$cu, _refs$domReference$cu2;
+  var ref = _ref.ref,
+    children = _ref.children,
+    showArrow = _ref.showArrow,
+    closeOnClick = _ref.closeOnClick,
+    _ref$fitToParent = _ref.fitToParent,
+    fitToParent = _ref$fitToParent === void 0 ? true : _ref$fitToParent,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? "bottom" : _ref$placement,
+    onClose = _ref.onClose,
+    onOpen = _ref.onOpen,
+    disabled = _ref.disabled,
+    plainDropdown = _ref.plainDropdown,
+    dropdownEvent = _ref.dropdownEvent,
+    dropdownClassName = _ref.dropdownClassName;
+  var arrowRef = react$1.useRef(null);
+  var _useState = react$1.useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
+  var tree = react.useFloatingTree();
+  var _useMemo = react$1.useMemo(function () {
+      return react$1.Children.toArray(children);
+    }, [children]),
+    _useMemo2 = _slicedToArray(_useMemo, 2),
+    anchor = _useMemo2[0],
+    panel = _useMemo2[1];
+  var _useFloating = react.useFloating({
+      open: isOpen,
+      onOpenChange: function onOpenChange(open, _, reason) {
+        var _ref2;
+        if (reason === "reference-press") return;
+        setIsOpen(open);
+        (_ref2 = open ? onOpen : onClose) === null || _ref2 === void 0 || _ref2();
+      },
+      strategy: "fixed",
+      placement: placement,
+      whileElementsMounted: react.autoUpdate,
+      middleware: [react.shift({
+        padding: 8
+      }), react.flip(), showArrow && react.offset(9), showArrow && react.arrow({
+        element: arrowRef
+      })]
+    }),
+    refs = _useFloating.refs,
+    floatingStyles = _useFloating.floatingStyles,
+    context = _useFloating.context;
+  var handler = dropdownEvent === "hover" ? react.useHover : react.useClick;
+  var click = handler(context, {
+    enabled: !disabled,
+    handleClose: react.safePolygon({
+      blockPointerEvents: true
+    })
+  });
+  var dismiss = react.useDismiss(context, {
+    referencePress: true
+  });
+  var _useInteractions = react.useInteractions([dismiss, click]),
+    getReferenceProps = _useInteractions.getReferenceProps,
+    getFloatingProps = _useInteractions.getFloatingProps;
+  var minWidth = react$1.useMemo(function () {
+    if (fitToParent) {
+      var _refs$reference$curre, _refs$reference$curre2;
+      var el = // @ts-expect-error ignore
+      (_refs$reference$curre = (_refs$reference$curre2 = refs.reference.current) === null || _refs$reference$curre2 === void 0 ? void 0 : _refs$reference$curre2.closest('[data-ref="buttonGroup"]')) !== null && _refs$reference$curre !== void 0 ? _refs$reference$curre : refs.reference.current;
+      return el === null || el === void 0 ? void 0 : el.offsetWidth;
+    }
+    return undefined;
+  }, [refs, isOpen, fitToParent]);
+  var tryClosing = react$1.useCallback(function (e) {
+    var _refs$floating$curren, _refs$floating$curren2;
+    if (!((_refs$floating$curren = refs.floating.current) !== null && _refs$floating$curren !== void 0 && _refs$floating$curren.contains(e.target.closest("[data-dropdown-dismiss='false']"))) && (!!closeOnClick || (_refs$floating$curren2 = refs.floating.current) !== null && _refs$floating$curren2 !== void 0 && _refs$floating$curren2.contains(e.target.closest("[data-dropdown-dismiss='true']")))) {
+      setTimeout(function () {
+        setIsOpen(false);
+        onClose === null || onClose === void 0 || onClose();
+      }, 100);
+    }
+  }, [closeOnClick, onClose]);
+  var innerRef = react$1.useMemo(function () {
+    return utilities.mergeRefs(ref, anchor.props.ref, refs.setReference);
+  }, [ref, anchor.props.ref, refs.setReference]);
+  react$1.useEffect(function () {
+    disabled && setIsOpen(false);
+  }, [disabled]);
+  react$1.useEffect(function () {
+    if (!tree) return;
+    function handleTreeClick() {
+      setIsOpen(false);
+    }
+    tree.events.on("close", handleTreeClick);
+    return function () {
+      tree.events.off("close", handleTreeClick);
+    };
+  }, [tree]);
+  if (!anchor || !panel) throw Error("Dropdown requires two elements [Anchor, Panel]");
+  return /*#__PURE__*/jsxRuntime.jsxs(react$1.Fragment, {
+    children: [/*#__PURE__*/react$1.cloneElement(anchor, _objectSpread(_objectSpread({}, getReferenceProps({
+      onClick: function onClick(e) {
+        var _anchor$props$onClick, _anchor$props;
+        (_anchor$props$onClick = (_anchor$props = anchor.props).onClick) === null || _anchor$props$onClick === void 0 || _anchor$props$onClick.call(_anchor$props, e);
+        e.stopPropagation();
+      }
+    })), {}, {
+      "data-dropdown-open": isOpen ? true : undefined,
+      ref: innerRef
+    })), isOpen && /*#__PURE__*/jsxRuntime.jsxs(react.FloatingPortal, {
+      root: (_refs$domReference$cu = (_refs$domReference$cu2 = refs.domReference.current) === null || _refs$domReference$cu2 === void 0 ? void 0 : _refs$domReference$cu2.closest(".theme-base")) !== null && _refs$domReference$cu !== void 0 ? _refs$domReference$cu : undefined,
+      children: [/*#__PURE__*/jsxRuntime.jsx(react.FloatingOverlay, {}), /*#__PURE__*/jsxRuntime.jsx(react.FloatingFocusManager, {
+        context: context,
+        modal: true,
+        children: /*#__PURE__*/jsxRuntime.jsxs("div", _objectSpread(_objectSpread({
+          ref: function ref(el) {
+            var _el$querySelector;
+            refs.setFloating(el);
+            el === null || el === void 0 || (_el$querySelector = el.querySelector("input,textarea,button")) === null || _el$querySelector === void 0 || _el$querySelector.focus();
+          },
+          style: _objectSpread({
+            minWidth: minWidth,
+            zIndex: "var(--z-popover)"
+          }, floatingStyles)
+        }, getFloatingProps({
+          onClick: function onClick(e) {
+            return e.stopPropagation();
+          }
+        })), {}, {
+          children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+            role: "none",
+            className: classNames(Dropdown_module.dropdownBody, dropdownClassName, !plainDropdown && "shadow-lg bg-base ring-1 ring-tint-100", "rounded-capped overflow-auto scroll-thin grid max-h-[70vh]"),
+            onMouseUpCapture: tryClosing,
+            children: panel
+          }), showArrow && /*#__PURE__*/jsxRuntime.jsx(react.FloatingArrow, {
+            ref: arrowRef,
+            context: context,
+            strokeWidth: 0.5,
+            className: "fill-base stroke-muted"
+          })]
+        }))
+      })]
+    })]
+  });
+};
+var Dropdown = function Dropdown(props) {
+  return /*#__PURE__*/jsxRuntime.jsx(react.FloatingTree, {
+    children: /*#__PURE__*/jsxRuntime.jsx(DropdownElement, _objectSpread({}, props))
+  });
+};
+var DropdownDismiss = function DropdownDismiss(_ref3) {
+  var children = _ref3.children,
+    _ref3$dismiss = _ref3.dismiss,
+    dismiss = _ref3$dismiss === void 0 ? true : _ref3$dismiss;
+  var tree = react.useFloatingTree();
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    role: "none",
+    className: "contents",
+    "data-dropdown-dismiss": dismiss,
+    onMouseUp: function onMouseUp() {
+      return dismiss && setTimeout(function () {
+        return tree === null || tree === void 0 ? void 0 : tree.events.emit("close");
+      }, 50);
+    },
+    children: children
+  });
+};
+
+exports.Dropdown = Dropdown;
+exports.DropdownDismiss = DropdownDismiss;

package/dist/cjs/components/dropdown/Dropdown.module.css

@@ -0,0 +1 @@
+@layer var{.dropdownBody{grid-template:1fr/1fr;& [data-ref=card],& [data-ref=panelGroup],& [data-ref=panel]{border-inline:0;border-top:0;box-shadow:none;grid-area:unset;outline:0}}}

package/dist/cjs/components/dropdown/DropdownTool.js

@@ -0,0 +1,26 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var classNames = require('classnames');
+var Icon = require('../icon/Icon.js');
+var Dropdown = require('./Dropdown.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+var _excluded = ["children", "className", "groupHover"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var DropdownTool = function DropdownTool(_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    groupHover = _ref.groupHover,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/jsxRuntime.jsxs(Dropdown.Dropdown, _objectSpread(_objectSpread({}, props), {}, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(Icon.Icon, {
+      icon: "mdi mdi-menu-down",
+      className: classNames(className, "outline bg-base flex-content pointer-events-auto cursor-pointer", groupHover && "hidden group-hover:inline-block data-[dropdown-open]:inline-block")
+    }), children]
+  }));
+};
+
+exports.DropdownTool = DropdownTool;

package/dist/cjs/components/empty/EmptyContent.js

@@ -0,0 +1,92 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var utilities = require('@react-fabric/utilities');
+var classNames = require('classnames');
+var react = require('react');
+var Icon = require('../icon/Icon.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+var _excluded = ["children", "title", "message", "icon", "className", "size"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var SizeMap = {
+  "": "1rem",
+  sm: "0.875rem",
+  md: "1.125rem"
+};
+var DefaultIcon = function DefaultIcon() {
+  return /*#__PURE__*/jsxRuntime.jsxs("svg", {
+    version: "1.1",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [/*#__PURE__*/jsxRuntime.jsx("path", {
+      opacity: "0.5",
+      fill: "currentColor",
+      d: "M106.1,296.01c-0.46,0-0.92-0.05-1.37-0.14c-0.45-0.09-0.89-0.22-1.31-0.4c-0.42-0.17-0.83-0.39-1.21-0.64c-0.38-0.26-0.74-0.55-1.06-0.87c-0.33-0.33-0.62-0.68-0.87-1.07c-0.26-0.38-0.47-0.78-0.65-1.21c-0.17-0.42-0.31-0.86-0.4-1.31c-0.09-0.45-0.13-0.91-0.13-1.36c0-0.46,0.04-0.92,0.13-1.37s0.23-0.89,0.4-1.31c0.18-0.42,0.39-0.83,0.65-1.21c0.25-0.38,0.54-0.74,0.87-1.06c0.32-0.33,0.68-0.62,1.06-0.87s0.79-0.47,1.21-0.65c0.42-0.17,0.86-0.31,1.31-0.4c0.9-0.18,1.83-0.18,2.73,0c0.45,0.09,0.89,0.23,1.31,0.4c0.43,0.18,0.83,0.4,1.21,0.65s0.74,0.54,1.07,0.87c0.32,0.32,0.61,0.68,0.87,1.06c0.25,0.38,0.47,0.79,0.64,1.21s0.31,0.86,0.4,1.31s0.14,0.91,0.14,1.37c0,0.45-0.05,0.91-0.14,1.36c-0.09,0.45-0.23,0.89-0.4,1.31c-0.17,0.43-0.39,0.83-0.64,1.21c-0.26,0.39-0.55,0.74-0.87,1.07c-0.33,0.32-0.69,0.61-1.07,0.87c-0.38,0.25-0.78,0.47-1.21,0.64c-0.42,0.18-0.86,0.31-1.31,0.4S106.55,296.01,106.1,296.01z"
+    }), /*#__PURE__*/jsxRuntime.jsx("path", {
+      opacity: "0.5",
+      fill: "currentColor",
+      d: "M475.5,458.25H36.5c-8.78,0-16.58-4.58-20.86-12.24c-4.28-7.67-4.09-16.71,0.51-24.19l70.18-114.04c2.03-3.29,6.34-4.32,9.63-2.29c3.29,2.03,4.32,6.34,2.29,9.63L28.07,429.16c-1.91,3.1-1.99,6.84-0.21,10.02s5.01,5.07,8.64,5.07H475.5c3.64,0,6.87-1.9,8.64-5.07s1.7-6.92-0.21-10.02l-219.5-356.7c-1.84-3-4.92-4.71-8.43-4.71s-6.59,1.72-8.43,4.71L124.24,272.88c-2.03,3.29-6.34,4.32-9.63,2.29c-3.29-2.03-4.32-6.34-2.29-9.63L235.64,65.13C240.03,58,247.64,53.75,256,53.75s15.97,4.25,20.36,11.38l219.5,356.7c4.6,7.48,4.79,16.52,0.51,24.19C492.08,453.67,484.28,458.25,475.5,458.25z"
+    }), /*#__PURE__*/jsxRuntime.jsx("path", {
+      opacity: "0.5",
+      fill: "currentColor",
+      d: "M354.79,279.28c-1.85,0-3.65-0.75-4.95-2.05c-0.33-0.32-0.62-0.68-0.87-1.07c-0.26-0.37-0.47-0.78-0.65-1.2c-0.17-0.43-0.31-0.87-0.4-1.31c-0.09-0.45-0.13-0.91-0.13-1.37c0-0.46,0.04-0.92,0.13-1.37c0.09-0.44,0.23-0.89,0.4-1.31c0.18-0.42,0.39-0.83,0.65-1.21c0.25-0.38,0.54-0.74,0.87-1.06c1.62-1.63,4.04-2.37,6.31-1.91c0.45,0.09,0.89,0.22,1.31,0.4c0.43,0.17,0.83,0.39,1.21,0.64c0.39,0.25,0.74,0.55,1.06,0.87c0.33,0.32,0.62,0.68,0.88,1.06c0.25,0.38,0.46,0.79,0.64,1.21c0.18,0.42,0.31,0.87,0.4,1.31c0.09,0.45,0.14,0.91,0.14,1.37c0,0.46-0.05,0.92-0.14,1.37c-0.09,0.44-0.22,0.88-0.4,1.31c-0.18,0.42-0.39,0.83-0.64,1.2c-0.26,0.39-0.55,0.75-0.88,1.07c-0.32,0.32-0.67,0.61-1.06,0.87c-0.38,0.25-0.78,0.47-1.21,0.64c-0.42,0.18-0.86,0.31-1.31,0.4C355.7,279.23,355.24,279.28,354.79,279.28z"
+    }), /*#__PURE__*/jsxRuntime.jsx("path", {
+      opacity: "0.5",
+      fill: "currentColor",
+      d: "M403.86,423.48H108.14c-10.56,0-20.31-5.72-25.46-14.94c-5.15-9.21-4.91-20.52,0.62-29.51l147.86-240.29c5.35-8.69,14.63-13.88,24.84-13.88s19.49,5.19,24.84,13.88l68.87,111.91c2.03,3.29,1,7.6-2.29,9.63c-3.29,2.02-7.6,1-9.63-2.29l-68.87-111.91c-2.78-4.52-7.61-7.22-12.91-7.22s-10.13,2.7-12.91,7.22L95.22,386.37c-2.88,4.67-3,10.55-0.32,15.34c2.68,4.79,7.75,7.77,13.24,7.77h295.72c5.49,0,10.56-2.98,13.24-7.77c2.68-4.79,2.55-10.67-0.32-15.34l-54.14-87.97c-2.03-3.29-1-7.6,2.29-9.63c3.29-2.02,7.61-1,9.63,2.29l54.14,87.97c5.53,8.99,5.77,20.3,0.62,29.51C424.17,417.76,414.42,423.48,403.86,423.48z"
+    }), /*#__PURE__*/jsxRuntime.jsx("path", {
+      fill: "currentColor",
+      d: "M270.12,335.13h-28.24c-6.17,0-11.22-4.83-11.5-10.99l-0.5-11.01c-0.18-3.86,2.81-7.14,6.67-7.31 c3.85-0.21,7.14,2.81,7.31,6.67l0.4,8.64h23.49l5.23-114.15h-33.96l3.79,82.55c0.18,3.86-2.81,7.14-6.67,7.31 c-0.11,0.01-0.22,0.01-0.33,0.01c-3.72,0-6.81-2.93-6.99-6.68l-3.91-85.15c-0.14-3.13,1.01-6.22,3.17-8.48 c2.16-2.26,5.2-3.56,8.33-3.56h39.17c3.13,0,6.16,1.3,8.33,3.56c2.16,2.26,3.32,5.35,3.17,8.48l-5.46,119.12 C281.34,330.3,276.29,335.13,270.12,335.13z"
+    }), /*#__PURE__*/jsxRuntime.jsx("path", {
+      fill: "currentColor",
+      d: "M268.47,394.55h-24.94c-4.83,0-9.39-2.12-12.5-5.81s-4.44-8.54-3.63-13.3l2.69-15.79 c1.34-7.89,8.13-13.61,16.13-13.61h19.56c8,0,14.78,5.73,16.13,13.61l2.69,15.79c0.81,4.76-0.51,9.61-3.63,13.3 S273.3,394.55,268.47,394.55z M246.22,360.04c-1.15,0-2.13,0.83-2.33,1.96l-2.69,15.79c-0.16,0.94,0.26,1.61,0.52,1.92 c0.26,0.31,0.85,0.84,1.8,0.84h24.94c0.95,0,1.54-0.53,1.8-0.84c0.26-0.31,0.68-0.98,0.52-1.92L268.11,362 c-0.19-1.14-1.17-1.96-2.33-1.96H246.22z"
+    })]
+  });
+};
+var EmptyContent = function EmptyContent(_ref) {
+  var children = _ref.children,
+    title = _ref.title,
+    message = _ref.message,
+    icon = _ref.icon,
+    className = _ref.className,
+    size = _ref.size,
+    test = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/jsxRuntime.jsxs("div", _objectSpread(_objectSpread({
+    className: classNames("p-6 flex flex-col items-center area-content", className),
+    style: size && {
+      fontSize: SizeMap[size]
+    }
+  }, test), {}, {
+    children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+      className: "leading-none",
+      style: {
+        fontSize: "4em"
+      },
+      children: [utilities.isString(icon) && /*#__PURE__*/jsxRuntime.jsx(Icon.Icon, {
+        icon: icon
+      }), /*#__PURE__*/react.isValidElement(icon) && icon, !icon && /*#__PURE__*/jsxRuntime.jsx(DefaultIcon, {})]
+    }), title && /*#__PURE__*/jsxRuntime.jsx("p", {
+      className: "font-medium text-center text-dimmed",
+      style: {
+        fontSize: "1.5em"
+      },
+      children: title
+    }), /*#__PURE__*/jsxRuntime.jsx("p", {
+      className: "font-medium text-center text-muted",
+      style: {
+        fontSize: "0.875em"
+      },
+      children: message
+    }), /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "flex gap-1 pt-6",
+      children: children
+    })]
+  }));
+};
+
+exports.EmptyContent = EmptyContent;