@steedos/service-plugin-amis 2.3.3 → 2.4.0-beta.2

package/main/default/client/amis.render.client.js

@@ -73,9 +73,15 @@
             waitForThing(window, 'assetsLoaded'),
             waitForThing(window, 'amis'),
         ]).then(()=>{
-            window.React = window.__React;
-            window.ReactDOM = window.__ReactDOM;
+            // window.React = window.__React;
+            // window.ReactDOM = window.__ReactDOM;
             const AmisRenderers = [];
+            let amisLib = amisRequire('amis');
+            const registerMap = {
+              renderer: amisLib.Renderer,
+              formitem: amisLib.FormItem,
+              options: amisLib.OptionsControl,
+            };
 
             const amisComps = lodash.filter(Builder.registry['meta-components'], function(item){ return item.componentName && item.amis?.render});
             
@@ -103,13 +109,35 @@
                               return amisReact.createElement(amisReact.Fragment, null, amisReact.createElement(amisReact.Fragment, null, schema && render ? render('body', schema) : ''), amisReact.createElement(amisReact.Fragment, null, render ? render('body', body) : ''));
                             }
                           }
-                        amisRequire("amis").Renderer(
-                            {
-                                type: comp.amis?.render.type,
-                                weight: comp.amis?.render.weight,
-                                autoVar: true,
-                            }
-                        )(AmisWrapper);
+                        // 注册amis渲染器
+                        let asset = comp.amis.render;
+                        if (!registerMap[asset.usage]) {
+                          console.error(
+                            `自定义组件注册失败，不存在${asset.usage}自定义组件类型。`, comp
+                          );
+                        } else {
+                          registerMap[asset.usage]({
+                            test: new RegExp(`(^|\/)${asset.type}`),
+                            type: asset.type,
+                            weight: asset.weight,
+                            autoVar: true,
+                          })(AmisWrapper);
+                          // 记录当前创建的amis自定义组件
+                          console.info('注册了一个自定义amis组件:', {
+                            type: asset.type,
+                            weight: asset.weight,
+                            component: AmisWrapper,
+                            framework: asset.framework,
+                            usage: asset.usage,
+                          });
+                        }
+                        // amisRequire("amis").Renderer(
+                        //     {
+                        //         type: comp.amis?.render.type,
+                        //         weight: comp.amis?.render.weight,
+                        //         autoVar: true,
+                        //     }
+                        // )(AmisWrapper);
                     } catch(e){console.error(e)}
                 }
             });
@@ -151,7 +179,30 @@
               
                 return pathname + search + hash;
               };
-
+            const isCurrentUrl = (to, ctx)=>{
+              try {
+                if (!to) {
+                  return false;
+                }
+                const pathname = window.location.pathname;
+                const link = normalizeLink(to, {
+                  ...location,
+                  pathname,
+                  hash: ''
+                });
+              
+                if (!~link.indexOf('http') && ~link.indexOf(':')) {
+                  let strict = ctx && ctx.strict;
+                  return match(link, {
+                    decode: decodeURIComponent,
+                    strict: typeof strict !== 'undefined' ? strict : true
+                  })(pathname);
+                }
+                return decodeURI(pathname) === link || decodeURI(pathname).startsWith(`${link}/`);
+              } catch (error) {
+                console.error(`error`, error)
+              }
+            }
             const AmisEnv = {
                 // getModalContainer: (props)=>{
                 //     let div = document.querySelector("#amisModalContainer");
@@ -189,6 +240,7 @@
                 }
                 },
                 theme: 'antd',
+                isCurrentUrl: isCurrentUrl,
             };
 
             const AmisRender = function (props) {
@@ -196,6 +248,15 @@
                 const schema = props.schema;
                 const data = props.data;
                 const name = props.name;
+
+                if(SteedosUI.refs[schema.name]){
+                  if(SteedosUI.refs[schema.name].unmount){
+                    SteedosUI.refs[schema.name].unmount()
+                  }else{
+                    console.log(`not find amis scope unmount`)
+                  }
+                }
+
                 if(props.pageType === 'form'){
                     env = Object.assign({
                         getModalContainer: ()=>{
@@ -219,7 +280,10 @@
                   }
 
                 React.useEffect(()=>{
-                    amisRequire('amis/embed').embed(`.steedos-amis-render-scope-${name}`,schema, {data, name, locale: getAmisLng()}, Object.assign({}, AmisEnv, env))
+                    const amisScope = amisRequire('amis/embed').embed(`.steedos-amis-render-scope-${name}`,schema, {data, name, locale: getAmisLng()}, Object.assign({}, AmisEnv, env))
+                    if(window.SteedosUI && schema.name){
+                      SteedosUI.refs[schema.name] = amisScope;
+                    }
                   }, [])
                 return React.createElement("div", {
                     className: "amis-scope"
@@ -230,21 +294,23 @@
 
             const initMonaco = ()=>{
 
-                const { detect } = require('detect-browser');
+                // const { detect } = require('detect-browser');
 
-                const browser = detect();
+                // const browser = detect();
 
-                // 低于86版的chrome 不支持code类型字段及功能
-                if (browser && browser.name === 'chrome' && Number(browser.version.split(".")[0]) < 86) {
-                    return Promise.resolve(true)
-                }
+                // // 低于86版的chrome 不支持code类型字段及功能
+                // if (browser && browser.name === 'chrome' && Number(browser.version.split(".")[0]) < 86) {
+                //     return Promise.resolve(true)
+                // }
 
-                // 手机版暂不支持code类型字段.
-                if(Meteor.isCordova){
-                    return Promise.resolve(true)
-                }else{
-                    return Builder.initMonaco()
-                }
+                // // 手机版暂不支持code类型字段.
+                // if(Meteor.isCordova){
+                //     return Promise.resolve(true)
+                // }else{
+                //     return Builder.initMonaco()
+                // }
+
+                return Promise.resolve(true)
             }
             //Amis SDK 中已清理了monaco, 所以这里需要提前注册,否则会导致amis code类型报错
             initMonaco().catch((err)=>{

package/main/default/client/load.assets.client.js

@@ -1,3 +1,10 @@
+/*
+ * @Author: baozhoutao@steedos.com
+ * @Date: 2022-12-09 18:23:36
+ * @LastEditors: baozhoutao@steedos.com
+ * @LastEditTime: 2022-12-17 14:35:49
+ * @Description: 
+ */
 // 解决多个react 问题. 注册组件时, 使用 amis 自带的 react , 运行 steedos 相关组件时, 使用 全局 react
 window.addEventListener('message', function (event) {
     const { data } = event;
@@ -7,8 +14,8 @@ window.addEventListener('message', function (event) {
             Promise.all([
                 waitForThing(window, 'amis'),
             ]).then(()=>{
-                window.__React = window.React;
-                window.__ReactDOM = window.ReactDOM;
+                // window.__React = window.React;
+                // window.__ReactDOM = window.ReactDOM;
                 window.React = amisRequire('react');
                 window.ReactDOM = amisRequire('react-dom');
                 window.ReactDom = window.ReactDOM;

package/main/default/client/tailwind.client.js

@@ -1,16 +1,35 @@
 try {
   // 加载 tailwind
-  if(typeof BigInt === 'undefined') {
-      let tailwindStyle = document.createElement("link");
-      tailwindStyle.setAttribute("rel", "stylesheet");
-      tailwindStyle.setAttribute("type", "text/css");
-      tailwindStyle.setAttribute("href", Steedos.absoluteUrl("/tailwind/tailwind.css"));
-      document.getElementsByTagName("head")[0].appendChild(tailwindStyle);
-  }else{
-    let tailwindScript = document.createElement("script");
-    tailwindScript.setAttribute("src", Steedos.absoluteUrl('/tailwind/tailwind.js'));
-    document.getElementsByTagName("head")[0].appendChild(tailwindScript);
+  // if(typeof BigInt === 'undefined') {
+  //     let tailwindStyle = document.createElement("link");
+  //     tailwindStyle.setAttribute("rel", "stylesheet");
+  //     tailwindStyle.setAttribute("type", "text/css");
+  //     tailwindStyle.setAttribute("href", Steedos.absoluteUrl("/tailwind/tailwind.css"));
+  //     document.getElementsByTagName("head")[0].appendChild(tailwindStyle);
+  // }else{
+  //   let tailwindScript = document.createElement("script");
+  //   tailwindScript.setAttribute("src", Steedos.absoluteUrl('/tailwind/tailwind.js'));
+  //   document.getElementsByTagName("head")[0].appendChild(tailwindScript);
+  // }
+
+  const head = document.head || document.getElementsByTagName('head')[0]
+
+  let tailwindBase = document.createElement("link");
+  tailwindBase.setAttribute("rel", "stylesheet");
+  tailwindBase.setAttribute("type", "text/css");
+  tailwindBase.setAttribute("href", Steedos.absoluteUrl("/tailwind/tailwind-base.css"));
+
+  if (head.firstChild) {
+    head.insertBefore(tailwindBase, head.firstChild)
+  } else {
+    head.appendChild(tailwindBase)
   }
+
+  let tailwindStyle = document.createElement("link");
+  tailwindStyle.setAttribute("rel", "stylesheet");
+  tailwindStyle.setAttribute("type", "text/css");
+  tailwindStyle.setAttribute("href", Steedos.absoluteUrl("/tailwind/tailwind-steedos.css"));
+  head.appendChild(tailwindStyle)
 } catch (error) {
   console.error(error)
 };

package/main/default/pages/apps_form.page.amis.json

@@ -533,13 +533,7 @@
         "body"
     ],
     "data": {
-        "objectName": "apps",
-        "context": {
-            "rootUrl": "http://127.0.0.1:5800",
-            "tenantId": "hKdnwE55WcnWveYxS",
-            "userId": "62ede4f62161e377e35de58c",
-            "authToken": "770a0b9e5b4fc2f8d6317ca109b0c087d3d160da669ac0218c044e15db1da0e74dd7e16c03b9f7e1640539"
-        }
+        "objectName": "apps"
     },
     "id": "u:953fda4052b6",
     "bodyClassName": "p-0",

package/main/default/pages/generate_object_tabs.page.amis.json

@@ -75,7 +75,6 @@
     ],
     "data": {
         "context": {
-            "rootUrl": "http://127.0.0.1:5800"
         }
     },
     "id": "u:3b0de7e88def",

package/main/default/pages/object_layouts.page.amis.json

@@ -896,10 +896,7 @@
         "body"
     ],
     "data": {
-        "objectName": "object_layouts",
-        "context": {
-            "rootUrl": "http://127.0.0.1:5800"
-        }
+        "objectName": "object_layouts"
     },
     "bodyClassName": "p-0",
     "name": "page_edit_${recordId}",

package/main/default/pages/space_user_info_record.page.amis.json

@@ -592,12 +592,7 @@
         "initialValues": {},
         "appId": "builder",
         "title": "",
-        "context": {
-            "rootUrl": "https://5000-steedos-steedosplatform-uwiv6wkdp2o.ws-us73.gitpod.io",
-            "tenantId": "e4YD58Xx68PQNPD2G",
-            "userId": "62ea04550167020d189ce439",
-            "authToken": "077c2bb0f4a7c594572fceb47086e2ebd439c6689852b2264c2b20905a38f0f2fbe3491ce3aebfd1872bd5"
-        }
+        "context": "${context}"
     },
     "id": "u:b80a805eb7fa"
 }

package/main/default/services/amis.service.js

@@ -2,7 +2,7 @@
  * @Author: baozhoutao@steedos.com
  * @Date: 2022-05-19 11:38:30
  * @LastEditors: baozhoutao@steedos.com
- * @LastEditTime: 2022-05-23 10:01:02
+ * @LastEditTime: 2022-12-01 16:20:59
  * @Description: 
  */
 const AmisSchema = require('./utils/amis-schema');

package/package.json

@@ -1,9 +1,12 @@
 {
   "name": "@steedos/service-plugin-amis",
-  "version": "2.3.3",
+  "version": "2.4.0-beta.2",
   "main": "package.service.js",
   "scripts": {
-    "build": "node .scripts/build.tailwind.js"
+    "build": "yarn build:tailwind-base && yarn build:tailwind",
+    "build:tailwind-cdn": "node .scripts/build.tailwind.js",
+    "build:tailwind-base": "tailwindcss -i ./src/styles/tailwind-base.css -o ./public/tailwind/tailwind-base.css",
+    "build:tailwind": "tailwindcss -i ./src/styles/tailwind.css -o ./public/tailwind/tailwind-steedos.css"
   },
   "license": "MIT",
   "private": false,
@@ -13,5 +16,5 @@
   "dependencies": {
     "@steedos-widgets/amis-lib": "^1.0.10"
   },
-  "gitHead": "9d46ca700b9fc9586b66bcc8410684ff7343f5fb"
+  "gitHead": "4bbd9ee44a8cc1e75db2027c135b9e208b93964a"
 }

package/public/amis/amis.css

@@ -104,4 +104,8 @@ body{
 
 .ant-message{
     z-index: 2600;
+}
+
+.page-list-view-root .amis-scope .antd-Table-headToolbar{
+    display: none;
 }

package/public/tailwind/tailwind-base.css

@@ -0,0 +1,514 @@
+/*
+! tailwindcss v3.2.4 | MIT License | https://tailwindcss.com
+*/
+
+/*
+1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
+2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
+*/
+
+*,
+::before,
+::after {
+  box-sizing: border-box;
+  /* 1 */
+  border-width: 0;
+  /* 2 */
+  border-style: solid;
+  /* 2 */
+  border-color: #e5e7eb;
+  /* 2 */
+}
+
+::before,
+::after {
+  --tw-content: '';
+}
+
+/*
+1. Use a consistent sensible line-height in all browsers.
+2. Prevent adjustments of font size after orientation changes in iOS.
+3. Use a more readable tab size.
+4. Use the user's configured `sans` font-family by default.
+5. Use the user's configured `sans` font-feature-settings by default.
+*/
+
+html {
+  line-height: 1.5;
+  /* 1 */
+  -webkit-text-size-adjust: 100%;
+  /* 2 */
+  -moz-tab-size: 4;
+  /* 3 */
+  -o-tab-size: 4;
+     tab-size: 4;
+  /* 3 */
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  /* 4 */
+  font-feature-settings: normal;
+  /* 5 */
+}
+
+/*
+1. Remove the margin in all browsers.
+2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
+*/
+
+body {
+  margin: 0;
+  /* 1 */
+  line-height: inherit;
+  /* 2 */
+}
+
+/*
+1. Add the correct height in Firefox.
+2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
+3. Ensure horizontal rules are visible by default.
+*/
+
+hr {
+  height: 0;
+  /* 1 */
+  color: inherit;
+  /* 2 */
+  border-top-width: 1px;
+  /* 3 */
+}
+
+/*
+Add the correct text decoration in Chrome, Edge, and Safari.
+*/
+
+abbr:where([title]) {
+  -webkit-text-decoration: underline dotted;
+          text-decoration: underline dotted;
+}
+
+/*
+Remove the default font size and weight for headings.
+*/
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-size: inherit;
+  font-weight: inherit;
+}
+
+/*
+Reset links to optimize for opt-in styling instead of opt-out.
+*/
+
+a {
+  color: inherit;
+  text-decoration: inherit;
+}
+
+/*
+Add the correct font weight in Edge and Safari.
+*/
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/*
+1. Use the user's configured `mono` font family by default.
+2. Correct the odd `em` font sizing in all browsers.
+*/
+
+code,
+kbd,
+samp,
+pre {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  /* 1 */
+  font-size: 1em;
+  /* 2 */
+}
+
+/*
+Add the correct font size in all browsers.
+*/
+
+small {
+  font-size: 80%;
+}
+
+/*
+Prevent `sub` and `sup` elements from affecting the line height in all browsers.
+*/
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/*
+1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
+2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
+3. Remove gaps between table borders by default.
+*/
+
+table {
+  text-indent: 0;
+  /* 1 */
+  border-color: inherit;
+  /* 2 */
+  border-collapse: collapse;
+  /* 3 */
+}
+
+/*
+1. Change the font styles in all browsers.
+2. Remove the margin in Firefox and Safari.
+3. Remove default padding in all browsers.
+*/
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit;
+  /* 1 */
+  font-size: 100%;
+  /* 1 */
+  font-weight: inherit;
+  /* 1 */
+  line-height: inherit;
+  /* 1 */
+  color: inherit;
+  /* 1 */
+  margin: 0;
+  /* 2 */
+  padding: 0;
+  /* 3 */
+}
+
+/*
+Remove the inheritance of text transform in Edge and Firefox.
+*/
+
+button,
+select {
+  text-transform: none;
+}
+
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Remove default button styles.
+*/
+
+button,
+[type='button'],
+[type='reset'],
+[type='submit'] {
+  -webkit-appearance: button;
+  /* 1 */
+  background-color: transparent;
+  /* 2 */
+  background-image: none;
+  /* 2 */
+}
+
+/*
+Use the modern Firefox focus style for all focusable elements.
+*/
+
+:-moz-focusring {
+  outline: auto;
+}
+
+/*
+Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
+*/
+
+:-moz-ui-invalid {
+  box-shadow: none;
+}
+
+/*
+Add the correct vertical alignment in Chrome and Firefox.
+*/
+
+progress {
+  vertical-align: baseline;
+}
+
+/*
+Correct the cursor style of increment and decrement buttons in Safari.
+*/
+
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/*
+1. Correct the odd appearance in Chrome and Safari.
+2. Correct the outline style in Safari.
+*/
+
+[type='search'] {
+  -webkit-appearance: textfield;
+  /* 1 */
+  outline-offset: -2px;
+  /* 2 */
+}
+
+/*
+Remove the inner padding in Chrome and Safari on macOS.
+*/
+
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Change font properties to `inherit` in Safari.
+*/
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  /* 1 */
+  font: inherit;
+  /* 2 */
+}
+
+/*
+Add the correct display in Chrome and Safari.
+*/
+
+summary {
+  display: list-item;
+}
+
+/*
+Removes the default spacing and border for appropriate elements.
+*/
+
+blockquote,
+dl,
+dd,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+figure,
+p,
+pre {
+  margin: 0;
+}
+
+fieldset {
+  margin: 0;
+  padding: 0;
+}
+
+legend {
+  padding: 0;
+}
+
+ol,
+ul,
+menu {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+/*
+Prevent resizing textareas horizontally by default.
+*/
+
+textarea {
+  resize: vertical;
+}
+
+/*
+1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
+2. Set the default placeholder color to the user's configured gray 400 color.
+*/
+
+input::-moz-placeholder, textarea::-moz-placeholder {
+  opacity: 1;
+  /* 1 */
+  color: #9ca3af;
+  /* 2 */
+}
+
+input::placeholder,
+textarea::placeholder {
+  opacity: 1;
+  /* 1 */
+  color: #9ca3af;
+  /* 2 */
+}
+
+/*
+Set the default cursor for buttons.
+*/
+
+button,
+[role="button"] {
+  cursor: pointer;
+}
+
+/*
+Make sure disabled buttons don't get the pointer cursor.
+*/
+
+:disabled {
+  cursor: default;
+}
+
+/*
+1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
+2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
+   This can trigger a poorly considered lint error in some tools but is included by design.
+*/
+
+img,
+svg,
+video,
+canvas,
+audio,
+iframe,
+embed,
+object {
+  display: block;
+  /* 1 */
+  vertical-align: middle;
+  /* 2 */
+}
+
+/*
+Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
+*/
+
+img,
+video {
+  max-width: 100%;
+  height: auto;
+}
+
+/* Make elements with the HTML hidden attribute stay hidden by default */
+
+[hidden] {
+  display: none;
+}
+
+*, ::before, ::after {
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(59 130 246 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}
+
+::backdrop {
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(59 130 246 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}

package/public/tailwind/tailwind-steedos.css

@@ -0,0 +1,390 @@
+/* @tailwind base; */
+
+.container {
+  width: 100%
+}
+
+@media (min-width: 640px) {
+  .container {
+    max-width: 640px
+  }
+}
+
+@media (min-width: 768px) {
+  .container {
+    max-width: 768px
+  }
+}
+
+@media (min-width: 1024px) {
+  .container {
+    max-width: 1024px
+  }
+}
+
+@media (min-width: 1280px) {
+  .container {
+    max-width: 1280px
+  }
+}
+
+@media (min-width: 1536px) {
+  .container {
+    max-width: 1536px
+  }
+}
+
+body.steedos .visible {
+  visibility: visible
+}
+
+body.steedos .collapse {
+  visibility: collapse
+}
+
+body.steedos .static {
+  position: static
+}
+
+body.steedos .fixed {
+  position: fixed
+}
+
+body.steedos .absolute {
+  position: absolute
+}
+
+body.steedos .relative {
+  position: relative
+}
+
+body.steedos .sticky {
+  position: sticky
+}
+
+body.steedos .inset-0 {
+  top: 0px;
+  right: 0px;
+  bottom: 0px;
+  left: 0px
+}
+
+body.steedos .top-0 {
+  top: 0px
+}
+
+body.steedos .z-40 {
+  z-index: 40
+}
+
+body.steedos .z-20 {
+  z-index: 20
+}
+
+body.steedos .col-span-2 {
+  grid-column: span 2 / span 2
+}
+
+body.steedos .m-0 {
+  margin: 0px
+}
+
+body.steedos .m-1 {
+  margin: 0.25rem
+}
+
+body.steedos .mr-4 {
+  margin-right: 1rem
+}
+
+body.steedos .mb-\[-3px\] {
+  margin-bottom: -3px
+}
+
+body.steedos .mt-\[50px\] {
+  margin-top: 50px
+}
+
+body.steedos .mt-0\.5 {
+  margin-top: 0.125rem
+}
+
+body.steedos .mt-0 {
+  margin-top: 0px
+}
+
+body.steedos .-mt-3 {
+  margin-top: -0.75rem
+}
+
+body.steedos .block {
+  display: block
+}
+
+body.steedos .inline {
+  display: inline
+}
+
+body.steedos .flex {
+  display: flex
+}
+
+body.steedos .table {
+  display: table
+}
+
+body.steedos .grid {
+  display: grid
+}
+
+body.steedos .contents {
+  display: contents
+}
+
+body.steedos .hidden {
+  display: none
+}
+
+body.steedos .h-\[50px\] {
+  height: 50px
+}
+
+body.steedos .h-7 {
+  height: 1.75rem
+}
+
+body.steedos .h-10 {
+  height: 2.5rem
+}
+
+body.steedos .h-full {
+  height: 100%
+}
+
+body.steedos .w-full {
+  width: 100%
+}
+
+body.steedos .w-auto {
+  width: auto
+}
+
+body.steedos .w-64 {
+  width: 16rem
+}
+
+body.steedos .w-10 {
+  width: 2.5rem
+}
+
+body.steedos .w-6\/12 {
+  width: 50%
+}
+
+body.steedos .min-w-max {
+  min-width: -moz-max-content;
+  min-width: max-content
+}
+
+body.steedos .flex-none {
+  flex: none
+}
+
+body.steedos .flex-1 {
+  flex: 1 1 0%
+}
+
+body.steedos .-translate-x-0 {
+  --tw-translate-x: -0px;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
+}
+
+body.steedos .transform {
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
+}
+
+body.steedos .flex-col {
+  flex-direction: column
+}
+
+body.steedos .flex-nowrap {
+  flex-wrap: nowrap
+}
+
+body.steedos .items-center {
+  align-items: center
+}
+
+body.steedos .justify-center {
+  justify-content: center
+}
+
+body.steedos .justify-between {
+  justify-content: space-between
+}
+
+body.steedos .gap-x-3 {
+  -moz-column-gap: 0.75rem;
+       column-gap: 0.75rem
+}
+
+body.steedos .overflow-y-auto {
+  overflow-y: auto
+}
+
+body.steedos .border-b-\[3px\] {
+  border-bottom-width: 3px
+}
+
+body.steedos .border-r {
+  border-right-width: 1px
+}
+
+body.steedos .border-solid {
+  border-style: solid
+}
+
+body.steedos .border-sky-500 {
+  --tw-border-opacity: 1;
+  border-color: rgb(14 165 233 / var(--tw-border-opacity))
+}
+
+body.steedos .border-slate-200 {
+  --tw-border-opacity: 1;
+  border-color: rgb(226 232 240 / var(--tw-border-opacity))
+}
+
+body.steedos .bg-white {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity))
+}
+
+body.steedos .p-3 {
+  padding: 0.75rem
+}
+
+body.steedos .p-0 {
+  padding: 0px
+}
+
+body.steedos .p-4 {
+  padding: 1rem
+}
+
+body.steedos .px-4 {
+  padding-left: 1rem;
+  padding-right: 1rem
+}
+
+body.steedos .px-10 {
+  padding-left: 2.5rem;
+  padding-right: 2.5rem
+}
+
+body.steedos .py-2 {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem
+}
+
+body.steedos .pl-4 {
+  padding-left: 1rem
+}
+
+body.steedos .pb-0 {
+  padding-bottom: 0px
+}
+
+body.steedos .pt-2 {
+  padding-top: 0.5rem
+}
+
+body.steedos .pl-1\.5 {
+  padding-left: 0.375rem
+}
+
+body.steedos .pl-1 {
+  padding-left: 0.25rem
+}
+
+body.steedos .text-left {
+  text-align: left
+}
+
+body.steedos .text-center {
+  text-align: center
+}
+
+body.steedos .lowercase {
+  text-transform: lowercase
+}
+
+body.steedos .italic {
+  font-style: italic
+}
+
+body.steedos .leading-5 {
+  line-height: 1.25rem
+}
+
+body.steedos .leading-none {
+  line-height: 1
+}
+
+body.steedos .text-black {
+  --tw-text-opacity: 1;
+  color: rgb(0 0 0 / var(--tw-text-opacity))
+}
+
+body.steedos .underline {
+  text-decoration-line: underline
+}
+
+body.steedos .filter {
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
+}
+
+body.steedos .backdrop-blur {
+  --tw-backdrop-blur: blur(8px);
+  -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+          backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)
+}
+
+body.steedos .transition-colors {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms
+}
+
+body.steedos .duration-500 {
+  transition-duration: 500ms
+}
+
+body.steedos .duration-300 {
+  transition-duration: 300ms
+}
+
+body.steedos .ease-in-out {
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
+}
+
+@media (min-width: 640px) {
+  body.steedos .sm\:flex {
+    display: flex
+  }
+
+  body.steedos .sm\:w-\[220px\] {
+    width: 220px
+  }
+
+  body.steedos .sm\:shadow {
+    --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
+    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
+    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
+  }
+}
+
+@media (min-width: 1024px) {
+  body.steedos .lg\:z-50 {
+    z-index: 50
+  }
+}

package/src/styles/tailwind-base.css

@@ -0,0 +1 @@
+@tailwind base;

package/src/styles/tailwind.css

@@ -0,0 +1,3 @@
+/* @tailwind base; */
+@tailwind components;
+@tailwind utilities;

package/tailwind.config.js

@@ -0,0 +1,24 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+    important: "body.steedos",
+    content: [
+        // '../../creator/**/*.{html,coffee,js,jsx,tsx,json}',
+        '../../services/**/*.{json,client.js}',
+        '../../steedos-packages/**/*.{json,client.js}',
+        '../../packages/**/*.{json,client.js}'
+    ],
+    theme: {
+      fontSize: {
+        xs: '12px',
+        sm: '12px',
+        base: '14px',
+        md: '14px',
+        lg: '16px',
+        xl: '18px',
+      },
+      extend: {
+      },
+    },
+    plugins: [],
+  }
+