@radui/ui 0.0.3 → 0.0.5

package/dist/components/Tabs.js

@@ -0,0 +1,231 @@
+'use client';
+import React, { useState } from 'react';
+
+function _iterableToArrayLimit(r, l) {
+  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (null != t) {
+    var e,
+      n,
+      i,
+      u,
+      a = [],
+      f = !0,
+      o = !1;
+    try {
+      if (i = (t = t.call(r)).next, 0 === l) {
+        if (Object(t) !== t) return;
+        f = !1;
+      } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
+    } catch (r) {
+      o = !0, n = r;
+    } finally {
+      try {
+        if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
+      } finally {
+        if (o) throw n;
+      }
+    }
+    return a;
+  }
+}
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+var RAD_UI_CLASS_PREFIX = 'rad-ui';
+var customClassSwitcher = function customClassSwitcher(customRootClass) {
+  var componentName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  // applies a custom root class the user provides, else applies the default rad-ui classes to the component
+  // rad ui's classes are based on this logic
+
+  // add dashes between capitalized words
+  var componentClassName = componentName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+  if (customRootClass) return customRootClass;
+  if (componentName) return "".concat(RAD_UI_CLASS_PREFIX, "-").concat(componentClassName);
+  return '';
+};
+
+var _excluded$2 = ["tab", "setActiveTab", "activeTab", "className", "customRootClass"];
+var COMPONENT_NAME$3 = 'TabTrigger';
+var TabTrigger = function TabTrigger(_ref) {
+  var tab = _ref.tab,
+    setActiveTab = _ref.setActiveTab,
+    activeTab = _ref.activeTab,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    customRootClass = _ref.customRootClass,
+    props = _objectWithoutProperties(_ref, _excluded$2);
+  var rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME$3);
+  var isActive = activeTab === tab.value;
+  var handleClick = function handleClick(tab) {
+    setActiveTab(tab.value);
+  };
+  return /*#__PURE__*/React.createElement("button", _extends({
+    role: "tab",
+    className: "".concat(rootClass, " ").concat(isActive ? 'active' : '', " ").concat(className)
+  }, props, {
+    onClick: function onClick() {
+      return handleClick(tab);
+    }
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "".concat(rootClass, "-inner")
+  }, tab.label));
+};
+TabTrigger.displayName = 'TabTrigger';
+
+var COMPONENT_NAME$2 = 'TabList';
+var TabList = function TabList(_ref) {
+  var _ref$tabs = _ref.tabs,
+    tabs = _ref$tabs === void 0 ? [] : _ref$tabs,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    setActiveTab = _ref.setActiveTab,
+    activeTab = _ref.activeTab,
+    _ref$customRootClass = _ref.customRootClass,
+    customRootClass = _ref$customRootClass === void 0 ? '' : _ref$customRootClass;
+  var rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME$2);
+  return /*#__PURE__*/React.createElement("div", {
+    role: "tablist",
+    "aria-orientation": "horizontal",
+    "aria-label": "todo",
+    className: "".concat(rootClass, " ").concat(className)
+  }, tabs.map(function (tab, index) {
+    return /*#__PURE__*/React.createElement(TabTrigger, {
+      activeTab: activeTab,
+      setActiveTab: setActiveTab,
+      key: index,
+      tab: tab,
+      index: index
+    });
+  }));
+};
+TabList.displayName = COMPONENT_NAME$2;
+
+var COMPONENT_NAME$1 = 'TabContent';
+var TabContent = function TabContent(_ref) {
+  var _ref$tabs = _ref.tabs,
+    tabs = _ref$tabs === void 0 ? [] : _ref$tabs,
+    activeTab = _ref.activeTab,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    _ref$customRootClass = _ref.customRootClass,
+    customRootClass = _ref$customRootClass === void 0 ? '' : _ref$customRootClass;
+  var rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME$1);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(rootClass, " ").concat(className)
+  }, tabs.map(function (tab, index) {
+    if (tab.value === activeTab) {
+      return /*#__PURE__*/React.createElement("div", {
+        key: index
+      }, tab.content);
+    }
+    return null;
+  }));
+};
+TabContent.displayName = COMPONENT_NAME$1;
+
+var _excluded$1 = ["children", "customRootClass", "className", "color"];
+var COMPONENT_NAME = 'TabRoot';
+var TabRoot = function TabRoot(_ref) {
+  var children = _ref.children,
+    _ref$customRootClass = _ref.customRootClass,
+    customRootClass = _ref$customRootClass === void 0 ? '' : _ref$customRootClass,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? undefined : _ref$color,
+    props = _objectWithoutProperties(_ref, _excluded$1);
+  var rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME);
+  if (color) {
+    props['data-accent-color'] = color;
+  }
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: "".concat(rootClass, " ").concat(className)
+  }, props), children);
+};
+TabRoot.displayName = COMPONENT_NAME;
+
+var _excluded = ["tabs"];
+var Tabs = function Tabs(_ref) {
+  var _ref$tabs = _ref.tabs,
+    tabs = _ref$tabs === void 0 ? [] : _ref$tabs,
+    props = _objectWithoutProperties(_ref, _excluded);
+  // This should be a value <`tabs.value`> that is passed in from the parent component
+  var _useState = useState(tabs[0].value || ''),
+    _useState2 = _slicedToArray(_useState, 2),
+    activeTab = _useState2[0],
+    setActiveTab = _useState2[1];
+  return /*#__PURE__*/React.createElement(TabRoot, props, /*#__PURE__*/React.createElement(TabList, {
+    activeTab: activeTab,
+    setActiveTab: setActiveTab,
+    tabs: tabs
+  }), /*#__PURE__*/React.createElement(TabContent, {
+    activeTab: activeTab,
+    tabs: tabs
+  }));
+};
+Tabs.List = TabList;
+Tabs.Content = TabContent;
+Tabs.Root = TabRoot;
+
+export { Tabs as default };

package/dist/components/Text.js

@@ -0,0 +1,80 @@
+'use client';
+import React from 'react';
+
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+
+var RAD_UI_CLASS_PREFIX = 'rad-ui';
+var customClassSwitcher = function customClassSwitcher(customRootClass) {
+  var componentName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  // applies a custom root class the user provides, else applies the default rad-ui classes to the component
+  // rad ui's classes are based on this logic
+
+  // add dashes between capitalized words
+  var componentClassName = componentName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+  if (customRootClass) return customRootClass;
+  if (componentName) return "".concat(RAD_UI_CLASS_PREFIX, "-").concat(componentClassName);
+  return '';
+};
+
+var _excluded = ["children", "customRootClass", "className"];
+
+// Can be rendered as p, label, div, span, etc.
+// TODO: Add as prop support
+// TODO: Add a core reusable function to check and render an as prop
+
+var COMPONENT_NAME = 'Text';
+var Text = function Text(_ref) {
+  var children = _ref.children,
+    _ref$customRootClass = _ref.customRootClass,
+    customRootClass = _ref$customRootClass === void 0 ? '' : _ref$customRootClass,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME);
+  return /*#__PURE__*/React.createElement("p", _extends({
+    className: "".concat(rootClass, " ").concat(className)
+  }, props), children);
+};
+Text.displayName = COMPONENT_NAME;
+
+export { Text as default };

package/dist/{TextArea.js → components/TextArea.js}

@@ -1,7 +1,8 @@
 'use client';
 import React from 'react';
 
-const TextArea = _ref => {
+var TextArea = function TextArea(_ref) {
+  _ref.children;
   return /*#__PURE__*/React.createElement("textarea", null);
 };
 

package/dist/{Tooltip.js → components/Tooltip.js}

@@ -3,6 +3,33 @@ import * as React$1 from 'react';
 import { useLayoutEffect, useEffect, useRef, useState } from 'react';
 import * as ReactDOM from 'react-dom';
 
+function _iterableToArrayLimit(r, l) {
+  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (null != t) {
+    var e,
+      n,
+      i,
+      u,
+      a = [],
+      f = !0,
+      o = !1;
+    try {
+      if (i = (t = t.call(r)).next, 0 === l) {
+        if (Object(t) !== t) return;
+        f = !1;
+      } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
+    } catch (r) {
+      o = !0, n = r;
+    } finally {
+      try {
+        if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
+      } finally {
+        if (o) throw n;
+      }
+    }
+    return a;
+  }
+}
 function _extends$1() {
   _extends$1 = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
@@ -17,17 +44,66 @@ function _extends$1() {
   };
   return _extends$1.apply(this, arguments);
 }
-
-const RAD_UI_CLASS_PREFIX = 'rad-ui';
-const customClassSwitcher = function (customRootClass) {
-  let componentName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+var RAD_UI_CLASS_PREFIX = 'rad-ui';
+var customClassSwitcher = function customClassSwitcher(customRootClass) {
+  var componentName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
   // applies a custom root class the user provides, else applies the default rad-ui classes to the component
   // rad ui's classes are based on this logic
 
   // add dashes between capitalized words
-  const componentClassName = componentName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+  var componentClassName = componentName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
   if (customRootClass) return customRootClass;
-  if (componentName) return `${RAD_UI_CLASS_PREFIX}-${componentClassName}`;
+  if (componentName) return "".concat(RAD_UI_CLASS_PREFIX, "-").concat(componentClassName);
   return '';
 };
 
@@ -2633,80 +2709,86 @@ function useRole(context, props) {
   }, [enabled, role, ariaRole, open, floatingId, referenceId, isNested]);
 }
 
+var _excluded$1 = ["popperName", "customRootClass", "className", "children", "open", "hoverDelay", "showArrow", "pop"];
+
 // TODO : Use Floating Portal?
 // TODO : Collisions dont seem to be working as expected, need to investigate
 
-const ARROW_HEIGHT = 7;
-const GAP = 2;
-const Popper = _ref => {
-  let {
-    popperName = '',
-    customRootClass = '',
-    className = '',
-    children,
-    open = false,
-    hoverDelay = 10,
-    showArrow = true,
-    pop = /*#__PURE__*/React.createElement(React.Fragment, null),
-    ...props
-  } = _ref;
-  const rootClass = customClassSwitcher(customRootClass, popperName);
-  const arrowRef = useRef(null);
-  const [isOpen, setIsOpen] = useState(open);
-  const {
-    refs,
-    floatingStyles,
-    context
-  } = useFloating({
-    open: isOpen,
-    middleware: [arrow({
-      element: arrowRef
-    }), offset(ARROW_HEIGHT + GAP),
-    // autoPlacement({
-    //     crossAxis: 'center',
-    //     alignment: 'start',
-    //     autoAlignment: true,
-    //     allowedPlacements: ['top', 'bottom', 'left', 'right'],
-    //     padding: 5,
-    // }),
-    flip()],
-    onOpenChange: setIsOpen,
-    placement: 'top'
-  });
-  const role = useRole(context);
-  const dismiss = useDismiss(context);
-  const hover = useHover(context, {
+var ARROW_HEIGHT = 7;
+var GAP = 2;
+var Popper = function Popper(_ref) {
+  var _ref$popperName = _ref.popperName,
+    popperName = _ref$popperName === void 0 ? '' : _ref$popperName,
+    _ref$customRootClass = _ref.customRootClass,
+    customRootClass = _ref$customRootClass === void 0 ? '' : _ref$customRootClass,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    children = _ref.children,
+    _ref$open = _ref.open,
+    open = _ref$open === void 0 ? false : _ref$open;
+    _ref.hoverDelay;
+    var _ref$showArrow = _ref.showArrow,
+    showArrow = _ref$showArrow === void 0 ? true : _ref$showArrow,
+    _ref$pop = _ref.pop,
+    pop = _ref$pop === void 0 ? /*#__PURE__*/React.createElement(React.Fragment, null) : _ref$pop;
+    _objectWithoutProperties(_ref, _excluded$1);
+  var rootClass = customClassSwitcher(customRootClass, popperName);
+  var arrowRef = useRef(null);
+  var _useState = useState(open),
+    _useState2 = _slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
+  var _useFloating = useFloating({
+      open: isOpen,
+      middleware: [arrow({
+        element: arrowRef
+      }), offset(ARROW_HEIGHT + GAP),
+      // autoPlacement({
+      //     crossAxis: 'center',
+      //     alignment: 'start',
+      //     autoAlignment: true,
+      //     allowedPlacements: ['top', 'bottom', 'left', 'right'],
+      //     padding: 5,
+      // }),
+      flip()],
+      onOpenChange: setIsOpen,
+      placement: 'top'
+    }),
+    refs = _useFloating.refs,
+    floatingStyles = _useFloating.floatingStyles,
+    context = _useFloating.context;
+  var role = useRole(context);
+  var dismiss = useDismiss(context);
+  var hover = useHover(context, {
     // delay: hoverDelay,
   });
-  const {
-    getReferenceProps,
-    getFloatingProps
-  } = useInteractions([hover, role, dismiss]);
+  var _useInteractions = useInteractions([hover, role, dismiss]),
+    getReferenceProps = _useInteractions.getReferenceProps,
+    getFloatingProps = _useInteractions.getFloatingProps;
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", _extends$1({
-    className: `${rootClass}-reference-element ${className}`,
+    className: "".concat(rootClass, "-reference-element ").concat(className),
     ref: refs.setReference
   }, getReferenceProps({
-    onClick: () => {
+    onClick: function onClick() {
       console.log('click');
     }
   })), children), isOpen && /*#__PURE__*/React.createElement("div", _extends$1({
-    className: `${rootClass}-floating-element`,
+    className: "".concat(rootClass, "-floating-element"),
     ref: refs.setFloating,
     style: floatingStyles
   }, getFloatingProps()), showArrow && /*#__PURE__*/React.createElement(FloatingArrow, {
-    className: `rad-ui-arrow ${rootClass}-arrow`,
+    className: "rad-ui-arrow ".concat(rootClass, "-arrow"),
     ref: arrowRef,
     context: context
   }), pop));
 };
 
-const COMPONENT_NAME = 'Tooltip';
-const Tooltip = _ref => {
-  let {
-    children,
-    label,
-    ...props
-  } = _ref;
+var _excluded = ["children", "label"];
+var COMPONENT_NAME = 'Tooltip';
+var Tooltip = function Tooltip(_ref) {
+  var children = _ref.children;
+    _ref.label;
+    var props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Popper, _extends$1({
     popperName: COMPONENT_NAME,
     pop: 'hello'

package/dist/themes/default.css

@@ -0,0 +1,2 @@
+.rad-ui-avatar-root{position:relative;display:inline-flex;width:32px;height:32px;border-radius:8px;overflow:hidden}.rad-ui-avatar-root .rad-ui-avatar{display:flex;flex-grow:1;position:relative;z-index:1;width:100%;height:100%}.rad-ui-avatar-root .rad-ui-avatar-fallback{display:flex;align-items:center;justify-content:center;color:var(--rad-ui-color-accent-900);background-color:var(--rad-ui-color-accent-500);position:absolute;top:0;left:0;width:100%;height:100%}a:focus,button:active,button:focus,input:active,input:focus,textarea:active,textarea:focus{outline:1px solid var(--rad-ui-color-accent-300);outline-style:groove}::selection{background-color:var(--rad-ui-color-accent-300);color:var(--rad-ui-color-accent-950)}.rad-ui-button{height:32px;border-radius:4px;display:flex;align-items:center;justify-content:center;padding:0 12px}.button-solid{background-color:var(--rad-ui-color-accent-900);color:#fff}.button-solid:hover{background-color:var(--rad-ui-color-accent-950)}.button-soft{color:var(--rad-ui-color-accent-900);background-color:var(--rad-ui-color-accent-400)}.button-soft:hover{background-color:var(--rad-ui-color-accent-500)}.button-outline{background-color:transparent;color:var(--rad-ui-color-accent-900);border:1px solid var(--rad-ui-color-accent-900)}.button-outline:hover{border-color:var(--rad-ui-color-accent-950)}.button-ghost{background-color:transparent;color:var(--rad-ui-color-accent-900)}.button-ghost:hover{border-color:var(--rad-ui-color-accent-950);background-color:var(--rad-ui-color-accent-300)}.rui-code-root{color:var(--rad-ui-color-accent-950);background-color:var(--rad-ui-color-accent-400);padding:1px 10px;display:inline-block;border-radius:4px;font-size:12px}.rad-ui-block-quote{border-color:var(--rad-ui-color-accent-600);border-left-width:.5rem;padding-left:12px}.rad-ui-tab-list{display:flex;box-shadow:inset 0 -1px 0 0 var(--rad-ui-color-gray-500)}.rad-ui-tab-trigger.active{color:var(--rad-ui-color-accent-950);border-bottom:2px solid var(--rad-ui-color-accent-900)}.rad-ui-tab-trigger{color:var(--rad-ui-color-accent-600);font-family:inherit;padding:10px;display:flex;height:42px;font-size:15px;line-height:1;cursor:pointer}.rad-ui-tab-trigger:hover{color:var(--rad-ui-color-accent-900)}.rad-ui-tab-trigger-inner{padding:4px 8px}.rad-ui-tab-trigger:hover>.rad-ui-tab-trigger-inner{background-color:var(--rad-ui-color-accent-200);border-radius:4px}.rad-ui-tab-content{padding:20px 0;color:var(--rad-ui-color-gray-1000)}.rad-ui-separator{background-color:var(--rad-ui-color-gray-600)}.rad-ui-separator-vertical{margin:0 8px;width:1px}.rad-ui-separator-horizontal{margin:8px 0;height:1px}.rad-ui-badge{background-color:var(--rad-ui-color-accent-300);color:var(--rad-ui-color-accent-950);padding:4px 8px;display:flex;align-items:center;justify-content:center;font-weight:600;border-radius:4px}.rad-ui-h1{font-weight:700;font-size:60px;letter-spacing:-3.5px;line-height:72px}.rad-ui-h2{font-weight:700;font-size:54px;letter-spacing:-3px;line-height:62px}.rad-ui-h3{font-weight:700;font-size:48px;letter-spacing:-2px;line-height:54px}.rad-ui-h4{font-weight:700;font-size:42px;letter-spacing:-1px;line-height:48px}.rad-ui-h5{font-weight:700;font-size:36px;letter-spacing:-.5px;line-height:42px}.rad-ui-h6{font-weight:700;font-size:32px;line-height:36px}.rad-ui-text{font-size:16px;line-height:24px}.rad-ui-link{color:var(--rad-ui-color-accent-800);cursor:pointer}.rad-ui-link:hover{color:var(--rad-ui-color-accent-900);text-decoration:underline;text-decoration-color:var(--rad-ui-color-accent-600)}.rad-ui-callout{padding:16px;border-radius:8px;background-color:var(--rad-ui-color-accent-200);color:var(--rad-ui-color-accent-950);display:flex;align-items:center;font-weight:300;font-size:14px;gap:8px}.rad-ui-tooltip-floating-element{background-color:var(--rad-ui-color-gray-1000);color:var(--rad-ui-color-gray-100);padding:4px 12px;border-radius:8px}.rad-ui-arrow{fill:var(--rad-ui-color-gray-1000)}.rad-ui-kbd{user-select:none;font-weight:400;font-family:inherit;background-color:var(--rad-ui-color-gray-50);color:var(--rad-ui-color-gray-950);display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:4px;border:1px solid var(--rad-ui-color-gray-500);box-shadow:0 0 3px 1px var(--rad-ui-color-gray-400);padding:4px 8px}
+/*# sourceMappingURL=/default.css.map */

package/dist/themes/default.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/avatar.scss","default.scss"],"names":[],"mappings":"AAAA,oBACI,iBAAkB,CAClB,mBAAoB,CACpB,UAAU,CACV,WAAW,CACX,iBAAkB,CAClB,eAAgB,CANpB,mCASQ,YAAa,CACb,WAAY,CACZ,iBAAkB,CAClB,SAAU,CACV,UAAW,CACX,WAAW,CAdnB,4CAkBQ,YAAa,CACb,kBAAmB,CACnB,sBAAuB,CACvB,oCAAqC,CACrC,+CAAgD,CAChD,iBAAkB,CAClB,KAAO,CACP,MAAQ,CACR,UAAW,CACX,WAAW,CCxBnB,2FACI,gDAAiD,CACjD,oBAEqB,CAGzB,YACI,+CAAgD,CAChD,oCAAqC,CAIzC,eACI,WAAY,CACZ,iBAAkB,CAClB,YAAY,CACZ,kBAAkB,CAClB,sBAAsB,CACtB,cAAgB,CAEpB,cACI,+CAAgD,CAChD,UAAY,CAEhB,oBACI,+CAAgD,CAIpD,aACI,oCAAqC,CACrC,+CAAiD,CAErD,mBACI,+CAAiD,CAKrD,gBACI,4BAA6B,CAC7B,oCAAqC,CACrC,+CAAgD,CAEpD,sBACI,2CAA2C,CAI/C,cACI,4BAA6B,CAC7B,oCAAqC,CAEzC,oBACI,2CAA2C,CAC3C,+CAAgD,CAKpD,eACI,oCAAqC,CACrC,+CAAgD,CAChD,gBAAgB,CAChB,oBAAqB,CACrB,iBAAkB,CAClB,cAAc,CAKlB,oBACI,2CAA4C,CAC5C,uBAAyB,CACzB,iBAAiB,CAQrB,iBACI,YAAa,CACb,wDAAyD,CAI7D,2BACI,oCAAqC,CACrC,sDAAsD,CAE1D,oBACI,oCAAqC,CACrC,mBAAoB,CACpB,YAAkB,CAElB,YAAa,CACb,WAAW,CACX,cAAe,CACf,aAAc,CACd,cAAe,CAEnB,0BACI,oCAAqC,CAGzC,0BACI,eAAe,CAEnB,oDACI,+CAAgD,CAChD,iBAAkB,CAGtB,oBACI,cAAgB,CAChB,mCAAqC,CAKzC,kBACI,6CAA8C,CAGlD,2BACI,YAAe,CACf,SAAU,CAGd,6BACI,YAAe,CACf,UAAW,CAIf,cACI,+CAAgD,CAChD,oCAAqC,CACrC,eAAe,CACf,YAAa,CACb,kBAAmB,CACnB,sBAAuB,CACvB,eAAgB,CAChB,iBAAkB,CAItB,WACI,eAAiB,CACjB,cAAe,CACf,qBAAsB,CACtB,gBAAgB,CAGpB,WACI,eAAiB,CACjB,cAAe,CACf,mBAAoB,CACpB,gBAAgB,CAGpB,WACI,eAAiB,CACjB,cAAe,CACf,mBAAoB,CACpB,gBAAgB,CAGpB,WACI,eAAiB,CACjB,cAAe,CACf,mBAAoB,CACpB,gBAAgB,CAGpB,WACI,eAAiB,CACjB,cAAe,CACf,oBAAsB,CACtB,gBAAgB,CAGpB,WACI,eAAiB,CACjB,cAAe,CAEf,gBAAgB,CAGpB,aACI,cAAe,CACf,gBAAiB,CAGrB,aACI,oCAAqC,CACrC,cAAe,CAEnB,mBACI,oCAAqC,CACrC,yBAA2B,CAC3B,oDAAqD,CAGzD,gBACG,YAAY,CACZ,iBAAiB,CAChB,+CAAgD,CAChD,oCAAqC,CACrC,YAAa,CACb,kBAAmB,CACnB,eAAgB,CAChB,cAAe,CACf,OAAO,CAQX,iCACI,8CAA8C,CAC9C,kCAAmC,CACnC,gBAAiB,CACjB,iBAAkB,CAGtB,cACI,kCAAmC,CAGvC,YACI,gBAAiB,CACjB,eAAgB,CAChB,mBAAoB,CACpB,4CAA6C,CAC7C,kCAAmC,CACnC,mBAAoB,CACpB,kBAAmB,CACnB,sBAAuB,CACvB,kBAAmB,CACnB,iBAAkB,CAClB,6CAA8C,CAC9C,mDAAyD,CACzD,eAAgB","file":"default.css","sourceRoot":"../../styles/themes","sourcesContent":[".rad-ui-avatar-root{\n    position: relative;\n    display: inline-flex;\n    width:32px;\n    height:32px;\n    border-radius: 8px;\n    overflow: hidden;\n\n    .rad-ui-avatar{\n        display: flex;\n        flex-grow: 1;\n        position: relative;\n        z-index: 1;\n        width: 100%;\n        height:100%;\n    }\n\n    .rad-ui-avatar-fallback{\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        color: var(--rad-ui-color-accent-900);\n        background-color: var(--rad-ui-color-accent-500);\n        position: absolute;\n        top:0px;\n        left:0px;\n        width: 100%;\n        height:100%;\n    }\n}\n\n\n","@import \"./components/avatar.scss\";\n\n\nbutton:active, button:focus, input:active, input:focus, textarea:active, textarea:focus,a:focus {\n    outline: 1px solid var(--rad-ui-color-accent-300);\n    outline-style:groove;\n\n    /* outline:0 none; */\n}\n\n::selection{\n    background-color: var(--rad-ui-color-accent-300);\n    color: var(--rad-ui-color-accent-950);\n\n}\n\n.rad-ui-button{\n    height: 32px;\n    border-radius: 4px;\n    display:flex;\n    align-items:center;\n    justify-content:center;\n    padding:0px 12px;\n}\n.button-solid{\n    background-color: var(--rad-ui-color-accent-900);\n    color: white;\n}\n.button-solid:hover{\n    background-color: var(--rad-ui-color-accent-950);\n}\n\n/** Soft */\n.button-soft{\n    color: var(--rad-ui-color-accent-900);\n    background-color:  var(--rad-ui-color-accent-400);\n}\n.button-soft:hover{\n    background-color:  var(--rad-ui-color-accent-500);\n}\n\n\n/**Outline */\n.button-outline{\n    background-color: transparent;\n    color: var(--rad-ui-color-accent-900);\n    border: 1px solid var(--rad-ui-color-accent-900);\n}\n.button-outline:hover{\n    border-color:var(--rad-ui-color-accent-950) ;\n}\n\n/**Ghost */\n.button-ghost{\n    background-color: transparent;\n    color: var(--rad-ui-color-accent-900);\n}\n.button-ghost:hover{\n    border-color:var(--rad-ui-color-accent-950) ;\n    background-color: var(--rad-ui-color-accent-300);\n}\n\n\n\n.rui-code-root{\n    color: var(--rad-ui-color-accent-950);\n    background-color: var(--rad-ui-color-accent-400);\n    padding:1px 10px;\n    display: inline-block;\n    border-radius: 4px;\n    font-size:12px;\n}\n\n\n\n.rad-ui-block-quote{\n    border-color: var(--rad-ui-color-accent-600);\n    border-left-width: 0.5rem;\n    padding-left:12px;\n}\n\n\n/** TABS  */\n.rad-ui-tab-root{\n\n}\n.rad-ui-tab-list{\n    display: flex;\n    box-shadow: inset 0 -1px 0 0 var(--rad-ui-color-gray-500);\n}\n\n\n.rad-ui-tab-trigger.active{\n    color: var(--rad-ui-color-accent-950);\n    border-bottom:2px solid var(--rad-ui-color-accent-900);\n}\n.rad-ui-tab-trigger {\n    color: var(--rad-ui-color-accent-600);\n    font-family: inherit;\n    padding: 10px 10px;\n\n    display: flex;\n    height:42px;\n    font-size: 15px;\n    line-height: 1;\n    cursor: pointer;\n}\n.rad-ui-tab-trigger:hover{\n    color: var(--rad-ui-color-accent-900);\n}\n\n.rad-ui-tab-trigger-inner{\n    padding:4px 8px;\n}\n.rad-ui-tab-trigger:hover > .rad-ui-tab-trigger-inner{\n    background-color: var(--rad-ui-color-accent-200);\n    border-radius: 4px;\n}\n\n.rad-ui-tab-content{\n    padding:20px 0px;\n    color : var(--rad-ui-color-gray-1000);\n}\n\n\n/** Separator */\n.rad-ui-separator {\n    background-color: var(--rad-ui-color-gray-600);\n}\n\n.rad-ui-separator-vertical{\n    margin: 0px 8px;\n    width: 1px;\n}\n\n.rad-ui-separator-horizontal{\n    margin: 8px 0px;\n    height: 1px;\n}\n\n/** Badge */\n.rad-ui-badge {\n    background-color: var(--rad-ui-color-accent-300);\n    color: var(--rad-ui-color-accent-950);\n    padding:4px 8px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-weight: 600;\n    border-radius: 4px;\n}\n\n\n.rad-ui-h1{\n    font-weight: bold;\n    font-size: 60px;\n    letter-spacing: -3.5px;\n    line-height:72px;\n}\n\n.rad-ui-h2{\n    font-weight: bold;\n    font-size: 54px;\n    letter-spacing: -3px;\n    line-height:62px;\n}\n\n.rad-ui-h3{\n    font-weight: bold;\n    font-size: 48px;\n    letter-spacing: -2px;\n    line-height:54px;\n}\n\n.rad-ui-h4{\n    font-weight: bold;\n    font-size: 42px;\n    letter-spacing: -1px;\n    line-height:48px;\n}\n\n.rad-ui-h5{\n    font-weight: bold;\n    font-size: 36px;\n    letter-spacing: -0.5px;\n    line-height:42px;\n}\n\n.rad-ui-h6{\n    font-weight: bold;\n    font-size: 32px;\n\n    line-height:36px;\n}\n\n.rad-ui-text{\n    font-size: 16px;\n    line-height: 24px;\n}\n\n.rad-ui-link {\n    color: var(--rad-ui-color-accent-800);\n    cursor: pointer;\n}\n.rad-ui-link:hover {\n    color: var(--rad-ui-color-accent-900);\n    text-decoration: underline ;\n    text-decoration-color: var(--rad-ui-color-accent-600);\n}\n\n.rad-ui-callout {\n   padding:16px;\n   border-radius:8px;\n    background-color: var(--rad-ui-color-accent-200);\n    color: var(--rad-ui-color-accent-950);\n    display: flex;\n    align-items: center;\n    font-weight: 300;\n    font-size: 14px;\n    gap:8px;\n}\n.rad-ui-tooltip{\n    \n}\n.rad-ui-tooltip-reference-element{\n\n}\n.rad-ui-tooltip-floating-element{\n    background-color:var(--rad-ui-color-gray-1000); \n    color: var(--rad-ui-color-gray-100);\n    padding: 4px 12px;\n    border-radius: 8px;\n}\n\n.rad-ui-arrow{\n    fill: var(--rad-ui-color-gray-1000);\n}\n\n.rad-ui-kbd{\n    user-select: none;\n    font-weight: 400;\n    font-family: inherit;\n    background-color: var(--rad-ui-color-gray-50);\n    color: var(--rad-ui-color-gray-950);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    white-space: nowrap;\n    border-radius: 4px;\n    border: 1px solid var(--rad-ui-color-gray-500);\n    box-shadow:  0px 0px 3px 1px var(--rad-ui-color-gray-400);\n    padding: 4px 8px;\n\n    \n}"]}