@react-fabric/core 1.0.0-beta.8 → 1.0.1

package/dist/cjs/components/card/Card.module.css

@@ -1 +0,0 @@
-@layer comp{.cardWrapper.selected{&:before{border-bottom:1rem solid transparent;border-inline-end:1rem solid transparent;border-inline-start:1rem solid theme(colors.accent.500);border-start-start-radius:var(--rounding-cap);border-top:1rem solid theme(colors.accent.500);content:""}&:after,&:before{inset-inline-start:-4px;position:absolute;top:-4px;z-index:5}&:after{color:theme(colors.white);content:"✓";line-height:1;padding:4px}}.card{background-color:var(--fabric-bg);box-shadow:0 0 0 1px theme(borderColor.muted);&>*{background-color:transparent}& .cardCover{&.dark>.cardCoverContent,&.inheritScheme:has([data-colorset=dark])>.cardCoverContent{background-image:linear-gradient(180deg,#0000 0,#0006);color:var(--white);text-shadow:0 0 2px var(--black)}&.inheritScheme:has([data-colorset=light])>.cardCoverContent,&.light>.cardCoverContent{background-image:linear-gradient(180deg,#fff0 0,#fff6);color:var(--black);text-shadow:0 0 2px var(--white)}}& .cardBody{padding:1rem}&.clickable{box-shadow:0 0 0 1px theme(borderColor.dimmed),0 1px 2px 0 var(--fabric-shadow);transition:box-shadow 0ms;&:has(.cardBody:hover):not(:has([data-inner-clickable=true]:hover)){box-shadow:0 0 0 1px theme(borderColor.dimmed),0 1px 4px 0 var(--fabric-shadow),0 8px 16px 0 color-mix(in lab,var(--fabric-shadow) 35%,#0000);transition-delay:.15s}&:has(.cardBody:active):not(:has([data-inner-clickable=true]:hover)){box-shadow:0 0 0 1px theme(borderColor.dimmed);transform:translateY(1px);transition-delay:0ms}& .cardBody{cursor:pointer;&:after{background-image:linear-gradient(175deg,hsla(0,0%,100%,.05),transparent 18%,transparent 72%,rgb(0 0 0/5%));content:"";inset:0;pointer-events:none;position:absolute;z-index:5}}}}}@layer util{.card{& .cardBody{&>*{background-color:transparent;grid-area:unset}}& .cardCover{&>[data-ref=image],&>[data-ref=video]{inset:0;position:absolute;z-index:0}& .cardCoverContent{&>*{flex:0 0 auto}}}}}

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

@@ -1 +0,0 @@
-@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:0 .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.module.css

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

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

@@ -1 +0,0 @@
-@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/icon/Icon.module.css

@@ -1 +0,0 @@
-@layer comp{.icon{height:1em;position:relative;vertical-align:-.125em;width:1em;&>i,&>img,&>svg{border-radius:inherit;display:block;height:1em;line-height:1;object-fit:cover;overflow:hidden;pointer-events:none;width:1em;fill:currentcolor}&>i:before{line-height:1}&[data-clickable=true]{opacity:.75;&:hover{background-color:theme(colors.text/10%);opacity:.9}&:active{opacity:.5}}}[dir=rtl] .icon[data-flip=true]{transform:scaleX(-1)}}

package/dist/cjs/components/media/Media.module.css

@@ -1 +0,0 @@
-@layer comp{.mediaContainer{&.mediaReel{&:after,&:before{background-image:linear-gradient(90deg,#222c 0,#222c .25rem,#fff8 0,#fff8 .75rem,#222c 0,#222c 1rem);background-position:50%;background-repeat:repeat-x;background-size:1rem;border:.125rem solid #222c;content:"";height:.5rem;inset-inline:0;position:absolute}&:before{top:0}&:after{bottom:0}}& .mediaControls{& [data-ref=button]{margin:0;&>:first-child{background-color:theme(colors.black/50%);color:#fff;&:hover{background-color:theme(colors.black/80%);color:theme(colors.primary.600)}}}& .mediaControlAction>:first-child{background-color:theme(colors.black/70%)}& .mediaControlAction+.mediaControlAction{margin-top:8px}}}}@layer util{& .mediaControls{&:hover{& .mediaControlPlaceholder{display:none}}&:not(:hover){& .mediaControlAction{display:none}}}}

package/dist/cjs/components/menu/Menu.module.css

@@ -1 +0,0 @@
-@layer comp{.menuItem{--color:theme(colors.primary.DEFAULT);&[data-color=accent]{--color:theme(colors.accent.DEFAULT)}&[data-color=info]{--color:theme(colors.info.DEFAULT)}&[data-color=danger]{--color:theme(colors.danger.DEFAULT)}&[data-color=success]{--color:theme(colors.success.DEFAULT)}&[data-color=warning]{--color:theme(colors.warning.DEFAULT)}}}@layer var{.menuItem{color:color-mix(in lab,var(--color) 80%,var(--fabric-text));>*{pointer-events:none}&[data-focus=true]{background-color:color(from var(--color) srgb r g b/15%)}&:active{background-color:color(from var(--color) srgb r g b/35%)}&[data-open=true]{background-color:color(from var(--color) srgb r g b/10%)}&.active,&:global(.active){background-color:color(from var(--color) srgb r g b/20%);pointer-events:none;&>div{box-shadow:4px 0 0 var(--color) inset;:global([dir=rtl]) &{box-shadow:-4px 0 0 var(--color) inset}}}&.disabled{color:theme(textColor.tint.500);opacity:.5;pointer-events:none;&>label~*{display:none}}}.menuIcon{font-size:1.25em;padding:.3em;&.minimal{font-size:1.5em;font-weight:500;padding:.375em}}:global(.menu-list.hide-icons) .menuIcon{width:.125em}}

package/dist/cjs/components/meter/Meter.module.css

@@ -1 +0,0 @@
-@layer comp{.meter{& .meterBar{flex:1 1 1rem;height:.5em;line-height:1;max-width:12rem;min-width:1rem;&:after{width:var(--width)}}&>label{font-size:max(.75rem,.5em);line-height:1}& .meterBar[data-active=true]{&:first-child,&:nth-child(2),&:nth-child(3),&:nth-child(4),&:nth-child(5),&:nth-child(6){&:after{background-color:currentColor;opacity:.85}}&:first-child{color:#eb5e28}&:nth-child(2){color:#f9a03f}&:nth-child(3){color:#f3c053}&:nth-child(4){color:#a1c349}&:nth-child(5){color:#87a330}&:nth-child(6){color:#6a8532}}&[class*=text-accent] .meterBar[data-active=true],&[class*=text-danger] .meterBar[data-active=true],&[class*=text-info] .meterBar[data-active=true],&[class*=text-primary] .meterBar[data-active=true],&[class*=text-success] .meterBar[data-active=true],&[class*=text-warning] .meterBar[data-active=true]{color:currentColor;&:first-child:after{opacity:.2}&:nth-child(2):after{opacity:.35}&:nth-child(3):after{opacity:.5}&:nth-child(4):after{opacity:.65}&:nth-child(5):after{opacity:.8}&:nth-child(6):after{opacity:.95}}}}

package/dist/cjs/components/panel/Panel.module.css

@@ -1 +0,0 @@
-@layer comp{.panel{background-color:theme(colors.bg);grid-template:"head" auto "content" 1fr/1fr;&>*{background-color:transparent}&:global(.fixed){box-shadow:0 0 18px theme(boxShadowColor.base)}& .panelHeader{background-color:theme(backgroundColor.dimmed)}& .panelAction{padding:.25rem}& .panelBody{grid-template:"head head head" auto ". loader ." auto "side-s content side-e" 1fr "foot foot foot" auto/auto 1fr auto}}}@layer util{.panelGroup{&>.panel{&[data-collapsed=true]{flex:0 0 auto}&[data-collapsed=false]{flex:1 1 auto;min-height:15rem;[data-ref=panelCollapse]{color:var(--tint);opacity:.25;pointer-events:none}}}&>.panel:not(:first-child){border-start-end-radius:0;border-start-start-radius:0}&>.panel:not(:last-child){border-bottom:1px solid theme(backgroundColor.base);border-end-end-radius:0;border-end-start-radius:0}}[data-ref=asideBody]>.panelGroup>.panel{border-radius:0;outline:0}}

package/dist/cjs/components/progress/Progress.module.css

@@ -1 +0,0 @@
-@layer comp{.progressbar{box-shadow:inset 0 0 4px 0 theme(boxShadowColor.dimmed);height:1em;&>div:last-child{width:calc(var(--progress)*1%);&:after{color:var(--white);content:attr(data-label);font-size:.5em;inset-block:0;inset-inline-start:0;line-height:.5em;padding:.75em;position:absolute;text-align:center;vertical-align:middle;width:calc((100/var(--progress))*100%)}}.progressTrack{transition:width .5s;width:calc(var(--progress)*1%)}&>div:first-child{font-size:.5em;line-height:.5em;padding:.75em}}.progressAnimate{background-image:var(--progress-gradient);background-size:1rem 1rem;& :global{animation:progress .75s linear infinite}}}

package/dist/cjs/components/tabpanel/TabPanel.module.css

@@ -1 +0,0 @@
-@layer comp{.tabPanel{--color:theme(colors.primary.500);&>.tabList{grid-area:tablist;&>.tabButton{&[data-color=accent]{--color:theme(colors.accent.500)}&[data-color=info]{--color:theme(colors.info.500)}&[data-color=danger]{--color:theme(colors.danger.500)}&[data-color=success]{--color:theme(colors.success.500)}&[data-color=warning]{--color:theme(colors.warning.500)}&:not(:global(.active)):hover{background-color:theme(colors.tint.100/50%);color:color-mix(in lab,var(--color) 65%,var(--fabric-text))}&:global(.active){--active-color:var(--color);color:color-mix(in lab,var(--color) 65%,var(--fabric-text));font-weight:500}}}&[data-variant=outline]{&>.tabList>.tabButton:global(.active){--active-color:theme(backgroundColor.base);--active-border:0 0 0 1px theme(borderColor.base) inset;background-color:theme(backgroundColor.base)}}&[data-variant=solid]{&>.tabList>.tabButton:global(.active){background-color:var(--color);color:theme(colors.white)}}&[data-variant=soft]{&>.tabList>.tabButton:global(.active){background-color:color-mix(in lab,var(--color) 20%,var(--fabric-bg))}}&[data-orientation=top]{grid-template:"tablist" auto "content" 1fr/1fr;padding-inline:2px;&[data-variant=outline]>.tabList,&[data-variant=soft]>.tabList,&[data-variant=solid]>.tabList{box-shadow:inset 0 -1px 0 theme(borderColor.dimmed)}}&[data-orientation=bottom]{grid-template:"content" 1fr "tablist" auto/1fr;padding-inline:2px;&[data-variant=outline]>.tabList,&[data-variant=soft]>.tabList,&[data-variant=solid]>.tabList{box-shadow:inset 0 1px 0 theme(borderColor.dimmed)}}&[data-orientation=start]{grid-template:"tablist content" 1fr/auto 1fr;padding-block:2px;&[data-variant=outline]>.tabList,&[data-variant=soft]>.tabList,&[data-variant=solid]>.tabList{box-shadow:inset -1px 0 0 theme(borderColor.dimmed)}}&[data-orientation=end]{grid-template:"content tablist" 1fr/1fr auto;padding-block:2px;&[data-variant=outline]>.tabList,&[data-variant=soft]>.tabList,&[data-variant=solid]>.tabList{box-shadow:inset 1px 0 0 theme(borderColor.dimmed)}}}}@layer util{.tabPanel{&>.tabList>.tabButton:global(.active){pointer-events:none}&[data-orientation=top]>.tabList{&>.tabButton:global(.active){box-shadow:0 -2px 0 var(--active-color) inset,var(--active-border,0 0 0 transparent)}}&[data-orientation=bottom]>.tabList{&>.tabButton:global(.active){box-shadow:0 2px 0 var(--active-color) inset,var(--active-border,0 0 0 transparent)}}&[data-orientation=start]>.tabList{&>.tabButton:global(.active){box-shadow:-2px 0 0 var(--active-color) inset,var(--active-border,0 0 0 transparent)}}&[data-orientation=end]>.tabList{&>.tabButton:global(.active){box-shadow:2px 0 0 var(--active-color) inset,var(--active-border,0 0 0 transparent)}}&[data-orientation=top]>.tabList>.tabButton{border-end-end-radius:0;border-end-start-radius:0;margin-top:2px;margin-inline:1px}&[data-orientation=bottom]>.tabList>.tabButton{border-start-end-radius:0;border-start-start-radius:0;margin-bottom:2px;margin-inline:1px}&[data-orientation=start]>.tabList>.tabButton{border-end-end-radius:0;border-start-end-radius:0;margin-block:1px;margin-inline-start:2px}&[data-orientation=end]>.tabList>.tabButton{border-end-start-radius:0;border-start-start-radius:0;margin-block:1px;margin-inline-end:2px}}}

package/dist/cjs/context/NotificationCenter.js

@@ -1,254 +0,0 @@
-'use strict';
-
-var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator');
-var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _regeneratorRuntime = require('@babel/runtime/regenerator');
-var utilities = require('@react-fabric/utilities');
-var react = require('react');
-var reactDom = require('react-dom');
-var Alert = require('../overlays/alert/Alert.js');
-var Message = require('../overlays/message/Message.js');
-var Toast = require('../overlays/toast/Toast.js');
-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; }
-/** ***************** refactor props *******************/
-var makeProps = function makeProps(obj) {
-  if (utilities.isString(obj)) {
-    return {
-      message: obj
-    };
-  } else if (utilities.isObject(obj)) {
-    return _objectSpread({}, obj);
-  }
-  return {
-    message: ""
-  };
-};
-var NotificationManager = function NotificationManager(_ref) {
-  var onLoad = _ref.onLoad;
-  var refItems = react.useRef({
-    toasts: {},
-    messages: {},
-    alerts: {}
-  });
-  var _useState = react.useState({}),
-    _useState2 = _slicedToArray(_useState, 2),
-    messages = _useState2[0],
-    setMessages = _useState2[1];
-  var _useState3 = react.useState({}),
-    _useState4 = _slicedToArray(_useState3, 2),
-    toasts = _useState4[0],
-    setToasts = _useState4[1];
-  var _useState5 = react.useState({}),
-    _useState6 = _slicedToArray(_useState5, 2),
-    alerts = _useState6[0],
-    setAlerts = _useState6[1];
-  var updateMessages = react.useRef(function () {
-    setMessages(_objectSpread({}, refItems.current.messages));
-  });
-  var updateToasts = react.useRef(function () {
-    setToasts(_objectSpread({}, refItems.current.toasts));
-  });
-  var updateAlerts = react.useRef(function () {
-    setAlerts(_objectSpread({}, refItems.current.alerts));
-  });
-  var handleCloseAll = react.useRef(function () {
-    Object.values(refItems.current.messages).forEach(function (msg) {
-      var _msg$;
-      return (_msg$ = msg[1]) === null || _msg$ === void 0 ? void 0 : _msg$.call(msg, false);
-    });
-    Object.values(refItems.current.toasts).forEach(function (msg) {
-      var _msg$2;
-      return (_msg$2 = msg[1]) === null || _msg$2 === void 0 ? void 0 : _msg$2.call(msg, false);
-    });
-    Object.values(refItems.current.alerts).forEach(function (msg) {
-      var _msg$3;
-      return (_msg$3 = msg[1]) === null || _msg$3 === void 0 ? void 0 : _msg$3.call(msg, false);
-    });
-    refItems.current.messages = {};
-    refItems.current.toasts = {};
-    refItems.current.alerts = {};
-    updateMessages.current();
-    updateToasts.current();
-    updateAlerts.current();
-  });
-  var openNotification = react.useRef( /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(map, update, Notif, props) {
-      var timeout,
-        timerRef,
-        obj,
-        _args = arguments;
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            timeout = _args.length > 4 && _args[4] !== undefined ? _args[4] : 5000;
-            timerRef = null;
-            obj = makeProps(props);
-            _context.next = 5;
-            return new Promise(function (resolve) {
-              var key = utilities.uuid();
-              var handleClose = function handleClose() {
-                var b = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-                clearTimeout(timerRef);
-                setTimeout(function () {
-                  // eslint-disable-next-line @typescript-eslint/no-dynamic-delete
-                  delete map[key];
-                  update();
-                  resolve(b);
-                }, 250);
-              };
-              map[key] = [/*#__PURE__*/jsxRuntime.jsx("div", {
-                children: /*#__PURE__*/jsxRuntime.jsx(Notif, _objectSpread(_objectSpread({}, obj), {}, {
-                  onClose: handleClose,
-                  onCloseAll: handleCloseAll.current
-                }))
-              }, key), handleClose];
-              update();
-              if (obj.type !== "confirm" && timeout > 0) {
-                timerRef = setTimeout(handleClose, timeout);
-              }
-            });
-          case 5:
-            return _context.abrupt("return", _context.sent);
-          case 6:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    }));
-    return function (_x, _x2, _x3, _x4) {
-      return _ref2.apply(this, arguments);
-    };
-  }());
-  var showMessage = react.useRef( /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(props) {
-      var timeout,
-        _args2 = arguments;
-      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
-          case 0:
-            timeout = _args2.length > 1 && _args2[1] !== undefined ? _args2[1] : 5000;
-            _context2.next = 3;
-            return openNotification.current(refItems.current.messages, updateMessages.current, Message.Message, props, timeout);
-          case 3:
-            return _context2.abrupt("return", _context2.sent);
-          case 4:
-          case "end":
-            return _context2.stop();
-        }
-      }, _callee2);
-    }));
-    return function (_x5) {
-      return _ref3.apply(this, arguments);
-    };
-  }());
-  var showToast = react.useRef( /*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(props) {
-      var timeout,
-        _args3 = arguments;
-      return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-        while (1) switch (_context3.prev = _context3.next) {
-          case 0:
-            timeout = _args3.length > 1 && _args3[1] !== undefined ? _args3[1] : 5000;
-            _context3.next = 3;
-            return openNotification.current(refItems.current.toasts, updateToasts.current, Toast.Toast, props, timeout);
-          case 3:
-            return _context3.abrupt("return", _context3.sent);
-          case 4:
-          case "end":
-            return _context3.stop();
-        }
-      }, _callee3);
-    }));
-    return function (_x6) {
-      return _ref4.apply(this, arguments);
-    };
-  }());
-  var showAlert = react.useRef( /*#__PURE__*/function () {
-    var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(props) {
-      return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-        while (1) switch (_context4.prev = _context4.next) {
-          case 0:
-            _context4.next = 2;
-            return openNotification.current(refItems.current.alerts, updateAlerts.current, Alert.Alert, props, 0);
-          case 2:
-            return _context4.abrupt("return", _context4.sent);
-          case 3:
-          case "end":
-            return _context4.stop();
-        }
-      }, _callee4);
-    }));
-    return function (_x7) {
-      return _ref5.apply(this, arguments);
-    };
-  }());
-  var showError = react.useRef( /*#__PURE__*/function () {
-    var _ref6 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5(props) {
-      return _regeneratorRuntime.wrap(function _callee5$(_context5) {
-        while (1) switch (_context5.prev = _context5.next) {
-          case 0:
-            _context5.next = 3;
-            return openNotification.current(refItems.current.toasts, Toast.Toast, _objectSpread(_objectSpread({}, makeProps(props)), {}, {
-              color: "danger"
-            }), 0);
-          case 3:
-            return _context5.abrupt("return", _context5.sent);
-          case 4:
-          case "end":
-            return _context5.stop();
-        }
-      }, _callee5);
-    }));
-    return function (_x8) {
-      return _ref6.apply(this, arguments);
-    };
-  }());
-  react.useEffect(function () {
-    onLoad({
-      showMessage: showMessage.current,
-      showToast: showToast.current,
-      showAlert: showAlert.current,
-      showError: showError.current,
-      closeAll: handleCloseAll.current
-    });
-  }, []);
-  return /*#__PURE__*/jsxRuntime.jsxs(react.Fragment, {
-    children: [/*#__PURE__*/reactDom.createPortal( /*#__PURE__*/jsxRuntime.jsx("div", {
-      style: {
-        zIndex: "var(--z-overlay)"
-      },
-      className: "ruf-container__overlays pointer-events-none fixed inset-0 p-4 bg-transparent",
-      children: Object.values(alerts).map(function (_ref7) {
-        var _ref8 = _slicedToArray(_ref7, 1),
-          el = _ref8[0];
-        return el;
-      })
-    }), document.body), /*#__PURE__*/reactDom.createPortal( /*#__PURE__*/jsxRuntime.jsx("div", {
-      style: {
-        zIndex: "var(--z-notifications)"
-      },
-      className: "ruf-container__notifs flex flex-nowrap pointer-events-none fixed inset-0 p-2 bg-transparent flex-col-reverse items-center justify-end",
-      children: Object.values(messages).map(function (_ref9) {
-        var _ref10 = _slicedToArray(_ref9, 1),
-          el = _ref10[0];
-        return el;
-      })
-    }), document.body), /*#__PURE__*/reactDom.createPortal( /*#__PURE__*/jsxRuntime.jsx("div", {
-      style: {
-        zIndex: "var(--z-notifications)"
-      },
-      className: "ruf-container__toasts flex flex-nowrap pointer-events-none fixed inset-0 p-4 bg-transparent flex-col items-end justify-end overflow-auto scroll-hide",
-      children: Object.values(toasts).map(function (_ref11) {
-        var _ref12 = _slicedToArray(_ref11, 1),
-          el = _ref12[0];
-        return el;
-      })
-    }), document.body)]
-  });
-};
-
-exports.NotificationManager = NotificationManager;

package/dist/cjs/core/aside/Aside.module.css

@@ -1 +0,0 @@
-@layer comp{.aside{--aside-bg:color-mix(in lab,var(--fabric-bg) 95%,var(--tint));--aside-border:color-mix(in lab,var(--fabric-bg) 75%,var(--tint));background-color:var(--aside-bg);&[data-align=start]{border-inline-end:1px solid var(--aside-border);grid-area:side-s;grid-template:"head resizer" auto "loader resizer" auto "content resizer" 1fr/1fr auto;& .asideHeader{grid-template-areas:"icon title actions collapse";grid-template-columns:auto 1fr auto auto}}&[data-align=end]{border-inline-start:1px solid var(--aside-border);grid-area:side-e;grid-template:"resizer head" auto "resizer loader" auto "resizer content" 1fr/auto 1fr;& .asideHeader{grid-template-areas:"collapse icon title actions";grid-template-columns:auto auto 1fr auto}& .asideCollapse{transform:scaleX(-1)}}& .asideBody{grid-area:content;grid-template:"head" auto "content" 1fr "foot" auto/1fr;&>[data-ref=content]{background-color:transparent}}& .asideHeader{color:theme(colors.primary.600);font-weight:500;&:not(:empty){border-bottom:1px solid var(--aside-border)}}& .asideTitle{grid-area:title}& .asideIcon{grid-area:icon}.asideActions{grid-area:actions}& .asideCollapse{grid-area:collapse;&:hover{background-color:color-mix(in lab,var(--fabric-text) 10%,#0000)}}& .asidePlaceholder{background-color:var(--aside-bg);grid-area:content;z-index:4}& .asideResizer{cursor:col-resize;grid-area:resizer;position:relative;width:.25rem;&:before{border:1px solid theme(colors.tint.700);border-width:0 1.5px;height:32px}&:active:before,&:hover:before{background-color:theme(colors.primary.600);border-color:theme(backgroundColor.base);border-width:0 1.25px;height:100%}}}}@layer util{.asideBody,.asideHeader{height:unset;margin:unset;width:unset}.asideBody{&>[data-ref=content]{background-color:transparent}}.aside[data-collapsed=true]{overflow:visible;position:relative;width:2rem;& .asideBody{background-color:var(--aside-bg);inset:0;position:absolute;transition:transform .15s cubic-bezier(.4,0,.2,1);z-index:-1}& .asideHeader{position:absolute;width:2rem;z-index:5}& .asideTitle{font-size:1rem;grid-area:unset;position:absolute;top:1rem}.asideIcon{margin-inline:2px}& .asideCollapse+.asideIcon,& .asideResizer{display:none}}[dir=ltr] .aside[data-align=start][data-collapsed=true],[dir=rtl] .aside[data-align=end][data-collapsed=true]{& .asideBody{grid-area:unset;right:unset;transform:translateX(-100%)}& .asideTitle{right:calc(2rem + 2px);transform:rotate(-90deg) translateY(2rem);transform-origin:100% 100%}& .asideCollapse{transform:scaleX(-1)}&[data-flyout=true] .asideBody{box-shadow:0 0 1rem 0 var(--fabric-shadow);transform:translateX(2rem);z-index:3}}[dir=ltr] .aside[data-align=end][data-collapsed=true],[dir=rtl] .aside[data-align=start][data-collapsed=true]{& .asideBody{grid-area:unset;left:unset;transform:translateX(100%)}& .asideTitle{left:calc(2rem + 2px);transform:rotate(90deg) translateY(2rem);transform-origin:0 100%}& .asideCollapse{transform:scaleX(1)}&[data-flyout=true] .asideBody{box-shadow:0 0 1rem 0 var(--fabric-shadow);transform:translateX(-2rem);z-index:3}}}

package/dist/cjs/core/boundary/ErrorBoundary.module.css

@@ -1 +0,0 @@
-@layer comp{.errorBoundary{align-self:flex-start;background-color:theme(colors.danger.500);background-image:repeating-linear-gradient(135deg,hsla(0,0%,100%,.5) 0 4px,hsla(0,0%,100%,.2) 4px 8px);grid-area:inherit;margin:1rem;max-height:calc(100% - 2rem);& .boundaryContent{background-color:var(--fabric-bg);grid-template:"icon message" auto "detail detail" auto/auto 1fr}& .boundaryIcon{grid-area:icon}& .boundaryMessage{grid-area:message}& .boundaryDetail{grid-area:detail;grid-template-rows:auto 1fr}}}

package/dist/cjs/core/content/Content.module.css

@@ -1 +0,0 @@
-@layer comp{.content{--fabric-content:color-mix(in lab,var(--fabric-bg) 97%,var(--tint));background-color:var(--fabric-content);overflow:auto;padding:1rem}}@layer util{.content{height:unset;margin:unset;width:unset}}

package/dist/cjs/core/headfoot/HeadFoot.module.css

@@ -1 +0,0 @@
-@layer comp{.headfoot{.buttonWrapper+.buttonWrapper{margin-inline-start:.25rem}}}@layer util{.headfoot{height:unset;margin:unset;width:unset}}

package/dist/cjs/core/page/Page.js

@@ -1,66 +0,0 @@
-'use strict';
-
-var classNames = require('classnames');
-var Animations = require('../../components/animations/Animations.js');
-var Icon = require('../../components/icon/Icon.js');
-var Page_module = require('./Page.module.css');
-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.
- */
-
-/**
- * The page component used typically for routes, is a structured layout used within an application to organize and display content in a sectioned format, ensuring a consistent and intuitive user experience.
- */
-var Page = function Page(_ref) {
-  var children = _ref.children,
-    paper = _ref.paper,
-    title = _ref.title,
-    titleClassName = _ref.titleClassName,
-    icon = _ref.icon,
-    rtlFlip = _ref.rtlFlip,
-    iconBg = _ref.iconBg,
-    iconColor = _ref.iconColor,
-    loading = _ref.loading,
-    testId = _ref["data-testid"],
-    testValue = _ref["data-test-value"];
-  return /*#__PURE__*/jsxRuntime.jsxs("div", {
-    "data-testid": testId,
-    "data-test-value": testValue,
-    "data-loading": loading,
-    className: classNames(Page_module.page, "overflow-hidden grid area-content", paper && "shadow-paper m-[6px] rounded-capped"),
-    children: [title && /*#__PURE__*/jsxRuntime.jsxs("div", {
-      "data-ref": "pageTitle",
-      className: classNames(Page_module.pageTitle, "select-none flex gap-1 items-center justify-center px-1 py-0.5 font-medium text-center", titleClassName),
-      children: [icon && /*#__PURE__*/jsxRuntime.jsx(Icon.Icon, {
-        icon: icon,
-        size: "1.25em",
-        rtlFlip: rtlFlip,
-        bg: iconBg,
-        color: iconColor
-      }), title]
-    }), loading && /*#__PURE__*/jsxRuntime.jsx(Animations.Loading, {}), children]
-  });
-};
-
-exports.Page = Page;

package/dist/cjs/core/page/Page.module.css

@@ -1 +0,0 @@
-@layer comp{.page{--fabric-page:color-mix(in lab,var(--fabric-bg) 94%,var(--tint));--fabric-page-title:color-mix(in lab,var(--fabric-bg) 90%,var(--tint));background-color:var(--fabric-page);grid-template:"title title title" auto "head head head" auto ". loader ." auto "side-s content side-e" 1fr "foot foot foot" auto/auto 1fr auto;.pageTitle{background-color:var(--fabric-page-title);color:theme(colors.primary.600);grid-area:title}}}@layer util{.pageTitle{height:unset;margin:unset;width:unset}}

package/dist/cjs/core/responsive/Responsive.module.css

@@ -1 +0,0 @@
-@layer comp{.row{margin:calc(var(--gutter)*-.5);&+.row{margin-top:calc(var(--gutter)*.5)}}.col{flex:0 0 auto;margin:calc(var(--gutter)*.5);max-width:calc(100% - var(--gutter, 0px));&.stretchContent>*{min-height:100%;min-width:100%}}[data-gutter="0"]{&.container,&.row{--gutter:0px}}[data-gutter=xs]{&.container,&.row{--gutter:2px}}[data-gutter=sm]{&.container,&.row{--gutter:0.25rem}}[data-gutter=md]{&.container,&.row{--gutter:0.75rem}}[data-gutter=lg]{&.container,&.row{--gutter:1rem}}[data-gutter=xl]{&.container,&.row{--gutter:1.5rem}}}

package/dist/cjs/core/section/Section.module.css

@@ -1 +0,0 @@
-@layer comp{.section{grid-template:"head head head" auto "side-s content side-e" 1fr "foot foot foot" auto/auto 1fr auto}}

package/dist/cjs/core/theme/Theme.module.css

@@ -1 +0,0 @@
-@layer comp{.themeProvider{&>*{background-color:theme(backgroundColor.base)}}}

package/dist/cjs/core/viewport/Viewport.module.css

@@ -1 +0,0 @@
-@layer comp{.viewport{--fabric-viewport:color-mix(in lab,var(--fabric-bg) 76%,var(--tint));background-color:var(--fabric-viewport);color:var(--fabric-text);grid-template:"head head head" auto "crumbbar crumbbar crumbbar" auto "side-s content side-e" 1fr "foot foot foot" auto/auto 1fr auto}}

package/dist/cjs/hotkeys/HotKey.js

@@ -1,47 +0,0 @@
-'use strict';
-
-var useEffectDebugger = require('../hooks/useEffectDebugger.js');
-var HotKeyWrapper = require('./HotKeyWrapper.js');
-
-/*
- * 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 HotKey = function HotKey(_ref) {
-  var keyCombo = _ref.keyCombo,
-    global = _ref.global,
-    handler = _ref.handler;
-  var _useHotKeys = HotKeyWrapper.useHotKeys(),
-    addHotKey = _useHotKeys.addHotKey,
-    removeHotKey = _useHotKeys.removeHotKey;
-  useEffectDebugger.useEffectDebugger(function () {
-    addHotKey === null || addHotKey === void 0 || addHotKey(keyCombo, handler !== null && handler !== void 0 ? handler : function () {
-      return undefined;
-    }, global);
-    return function () {
-      return removeHotKey === null || removeHotKey === void 0 ? void 0 : removeHotKey(keyCombo);
-    };
-  }, [addHotKey, global, handler, keyCombo, removeHotKey], "HotKey add");
-  return null;
-};
-
-exports.HotKey = HotKey;

package/dist/cjs/hotkeys/HotKeyLabel.js

@@ -1,52 +0,0 @@
-'use strict';
-
-var useEffectDebugger = require('../hooks/useEffectDebugger.js');
-var commons = require('./commons.js');
-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 HotKeyLabel = function HotKeyLabel(_ref) {
-  var keyCombo = _ref.keyCombo;
-  var label = useEffectDebugger.useMemoDebugger(function () {
-    var item = commons.reduceHotKey({
-      keyCombo: keyCombo
-    });
-    var label = [];
-    if (item.alt) label.push("ALT");
-    if (item.ctrl) label.push("CTRL");
-    if (item.meta) label.push("META");
-    if (item.shift) label.push("SHIFT");
-    if (item.key.toLowerCase() === "tab") label.push("TAB");else if (item.key.toLowerCase() === "space") label.push("SPC");else if (item.key.toLowerCase() === "arrowleft") label.push("LEFT");else if (item.key.toLowerCase() === "arrowright") label.push("RIGHT");else if (item.key.toLowerCase() === "arrowup") label.push("UP");else if (item.key.toLowerCase() === "arrowdown") label.push("DOWN");else if (item.key.toLowerCase() === "enter") label.push("ENTER");else if (item.key.toLowerCase() === "delete") label.push("DEL");else if (item.key.toLowerCase() === "escape") label.push("ESC");else if (item.key.toLowerCase() === "backspace") label.push("BKSPC");else label.push(item.key.toUpperCase());
-    return [/*#__PURE__*/jsxRuntime.jsx("span", {
-      children: label.join(" ")
-    }, "label")];
-  }, [keyCombo], "HotKey label");
-  return /*#__PURE__*/jsxRuntime.jsx("kbd", {
-    className: "hotkey-label inline-flex gap-1 select-none self-center font-mono items-center text-[0.625rem] leading-4 bg-tint-500/10 text-base/50 whitespace-nowrap rounded px-2 mx-1",
-    children: label
-  });
-};
-
-exports.HotKeyLabel = HotKeyLabel;

package/dist/cjs/hotkeys/HotKeyWrapper.js

@@ -1,98 +0,0 @@
-'use strict';
-
-var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
-var react = require('react');
-var useEffectDebugger = require('../hooks/useEffectDebugger.js');
-var commons = require('./commons.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-var HotKeysContext = /*#__PURE__*/react.createContext({});
-var useHotKeys = function useHotKeys() {
-  return react.useContext(HotKeysContext);
-};
-var HotKeyWrapper = /*#__PURE__*/react.memo(function (_ref) {
-  var children = _ref.children;
-  var refEl = react.useRef(null);
-  var keyList = react.useRef([]);
-  var addHotKey = react.useCallback(function (keyCombo, handler) {
-    var global = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
-    return keyList.current = [].concat(_toConsumableArray(keyList.current.filter(function (_ref2) {
-      var _key = _ref2._key;
-      return _key !== keyCombo;
-    })), [commons.reduceHotKey({
-      keyCombo: keyCombo,
-      handler: handler,
-      global: global
-    })]);
-  }, []);
-  var removeHotKey = react.useCallback(function (key) {
-    return keyList.current = _toConsumableArray(keyList.current.filter(function (_ref3) {
-      var _key = _ref3._key;
-      return _key !== key;
-    }));
-  }, []);
-  var handler = react.useCallback(function (items, event) {
-    if (items.length === 0) return;
-    var keyCode = event.key,
-      code = event.code,
-      altKey = event.altKey,
-      ctrlKey = event.ctrlKey,
-      metaKey = event.metaKey,
-      shiftKey = event.shiftKey;
-    if (keyCode !== "Enter" && keyCode !== "Esc" && ["INPUT", "TEXTAREA", "SELECT"].includes(event.target.tagName)) return;
-    var find = items.find(function (_ref4) {
-      var key = _ref4.key,
-        alt = _ref4.alt,
-        ctrl = _ref4.ctrl,
-        meta = _ref4.meta,
-        shift = _ref4.shift;
-      return (key.toLowerCase() === keyCode.toLowerCase() || key.toLowerCase() === code.toLowerCase()) && alt === altKey && ctrl === ctrlKey && meta === metaKey && shift === shiftKey;
-    });
-    if (find !== null && find !== void 0 && find.handler) {
-      find.handler();
-      event.preventDefault();
-      event.stopImmediatePropagation();
-    }
-  }, []);
-  var handleGlobal = react.useCallback(function (event) {
-    handler(keyList.current.filter(function (i) {
-      return i.global;
-    }), event);
-  }, [handler]);
-  var handleHotKey = react.useCallback(function (event) {
-    handler(keyList.current.filter(function (i) {
-      return !i.global;
-    }), event);
-  }, [handler]);
-  useEffectDebugger.useEffectDebugger(function () {
-    var _refEl$current;
-    var el = (_refEl$current = refEl.current) === null || _refEl$current === void 0 ? void 0 : _refEl$current.parentElement;
-    if (el) {
-      el.tabIndex = 0;
-      el.addEventListener("keydown", handleHotKey);
-      document.addEventListener("keydown", handleGlobal);
-      return function () {
-        el.removeEventListener("keydown", handleHotKey);
-        document.removeEventListener("keydown", handleGlobal);
-      };
-    }
-  }, [handleGlobal, handleHotKey], "HotKeyWrapper attach handlers");
-  return /*#__PURE__*/jsxRuntime.jsx(HotKeysContext.Provider, {
-    value: {
-      addHotKey: addHotKey,
-      removeHotKey: removeHotKey
-    },
-    children: /*#__PURE__*/jsxRuntime.jsx("div", {
-      ref: refEl,
-      style: {
-        display: "contents"
-      },
-      children: children
-    })
-  });
-});
-HotKeyWrapper.displayName = "HotKeyProvider";
-
-exports.HotKeyWrapper = HotKeyWrapper;
-exports.HotKeysContext = HotKeysContext;
-exports.useHotKeys = useHotKeys;