@radui/ui 0.0.3 → 0.0.5

package/dist/Tabs.js

@@ -1,146 +0,0 @@
-'use client';
-import React, { useState } from 'react';
-
-const RAD_UI_CLASS_PREFIX = 'rad-ui';
-const customClassSwitcher = function (customRootClass) {
-  let 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();
-  if (customRootClass) return customRootClass;
-  if (componentName) return `${RAD_UI_CLASS_PREFIX}-${componentClassName}`;
-  return '';
-};
-
-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);
-}
-
-const COMPONENT_NAME$3 = 'TabTrigger';
-const TabTrigger = _ref => {
-  let {
-    tab,
-    setActiveTab,
-    activeTab,
-    className = '',
-    customRootClass,
-    ...props
-  } = _ref;
-  const rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME$3);
-  const isActive = activeTab === tab.value;
-  const handleClick = tab => {
-    setActiveTab(tab.value);
-  };
-  return /*#__PURE__*/React.createElement("button", _extends({
-    role: "tab",
-    className: `${rootClass} ${isActive ? 'active' : ''} ${className}`
-  }, props, {
-    onClick: () => handleClick(tab)
-  }), /*#__PURE__*/React.createElement("span", {
-    className: `${rootClass}-inner`
-  }, tab.label));
-};
-TabTrigger.displayName = 'TabTrigger';
-
-const COMPONENT_NAME$2 = 'TabList';
-const TabList = _ref => {
-  let {
-    tabs = [],
-    className = '',
-    setActiveTab,
-    activeTab,
-    customRootClass = ''
-  } = _ref;
-  const rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME$2);
-  return /*#__PURE__*/React.createElement("div", {
-    role: "tablist",
-    "aria-orientation": "horizontal",
-    "aria-label": "todo",
-    className: `${rootClass} ${className}`
-  }, tabs.map((tab, index) => {
-    return /*#__PURE__*/React.createElement(TabTrigger, {
-      activeTab: activeTab,
-      setActiveTab: setActiveTab,
-      key: index,
-      tab: tab,
-      index: index
-    });
-  }));
-};
-TabList.displayName = COMPONENT_NAME$2;
-
-const COMPONENT_NAME$1 = 'TabContent';
-const TabContent = _ref => {
-  let {
-    tabs = [],
-    activeTab,
-    className = '',
-    customRootClass = ''
-  } = _ref;
-  const rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME$1);
-  return /*#__PURE__*/React.createElement("div", {
-    className: `${rootClass} ${className}`
-  }, tabs.map((tab, index) => {
-    if (tab.value === activeTab) {
-      return /*#__PURE__*/React.createElement("div", {
-        key: index
-      }, tab.content);
-    }
-    return null;
-  }));
-};
-TabContent.displayName = COMPONENT_NAME$1;
-
-const COMPONENT_NAME = 'TabRoot';
-const TabRoot = _ref => {
-  let {
-    children,
-    customRootClass = '',
-    className = '',
-    color = undefined,
-    ...props
-  } = _ref;
-  const rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME);
-  if (color) {
-    props['data-accent-color'] = color;
-  }
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: `${rootClass} ${className}`
-  }, props), children);
-};
-TabRoot.displayName = COMPONENT_NAME;
-
-const Tabs = _ref => {
-  let {
-    tabs = [],
-    ...props
-  } = _ref;
-  // This should be a value <`tabs.value`> that is passed in from the parent component
-  const [activeTab, setActiveTab] = useState(tabs[0].value || '');
-  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/Text.js

@@ -1,51 +0,0 @@
-'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);
-}
-
-const RAD_UI_CLASS_PREFIX = 'rad-ui';
-const customClassSwitcher = function (customRootClass) {
-  let 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();
-  if (customRootClass) return customRootClass;
-  if (componentName) return `${RAD_UI_CLASS_PREFIX}-${componentClassName}`;
-  return '';
-};
-
-// 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
-
-const COMPONENT_NAME = 'Text';
-const Text = _ref => {
-  let {
-    children,
-    customRootClass = '',
-    className = '',
-    ...props
-  } = _ref;
-  const rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME);
-  return /*#__PURE__*/React.createElement("p", _extends({
-    className: `${rootClass} ${className}`
-  }, props), children);
-};
-Text.displayName = COMPONENT_NAME;
-
-export { Text as default };

package/dist/themes/main.css/default.css

@@ -1,2 +0,0 @@
-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-avatar{width:32px;height:32px;border-radius:8px}.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)}.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/main.css/default.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["default.scss"],"names":[],"mappings":"AAAA,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,CAGlB,eACI,UAAU,CACV,WAAW,CACX,iBAAkB,CAGtB,wBACI,YAAa,CACb,kBAAmB,CACnB,sBAAuB,CACvB,oCAAqC,CACrC,+CAAgD,CAGpD,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":["button: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.rad-ui-avatar{\n    width:32px;\n    height:32px;\n    border-radius: 8px;\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}\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}"]}