@trackunit/css-tailwind 0.0.17 → 0.0.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/css-tailwind",
-  "version": "0.0.17",
+  "version": "0.0.20",
   "main": "./index.cjs",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",

package/tailwind-base.generated.js

@@ -153,21 +153,141 @@ var import_plugin2 = __toESM(require_plugin());
 // libs/css/component-tokens/src/component-tokens/ComponentTokenDefinition.ts
 var AsComponentTokenDefinition = (designTokens) => designTokens;
 
+// libs/css/component-tokens/src/component-tokens/components/Button.tokens.ts
+var ButtonTokenDefinition = AsComponentTokenDefinition({
+  DEFAULT: {
+    "secondary-color": { backgroundColor: "rgb(var(--color-secondary-200))", color: "rgb(var(--color-secondary-600))" },
+    border: { borderRadius: "var(--border-radius-lg)" },
+    height: { height: "auto" },
+    width: { width: "auto", minWidth: "auto" }
+  },
+  "theme-marketing": {
+    "secondary-color": { backgroundColor: "rgb(var(--color-secondary-600))", color: "rgb(var(--color-secondary-50))" },
+    border: { borderRadius: "50px" },
+    height: { height: "55px" },
+    width: { width: "min-content", minWidth: "158px" }
+  }
+});
+
 // libs/css/component-tokens/src/component-tokens/components/Card.tokens.ts
 var CardTokenDefinition = AsComponentTokenDefinition({
   DEFAULT: {
     border: { borderColor: "rgb(var(--color-slate-200))", borderRadius: "var(--border-radius-DEFAULT)" },
-    shadow: { boxShadow: "var(--box-shadow-DEFAULT)" }
+    "popover-border": { borderRadius: "var(--border-radius-DEFAULT)" },
+    shadow: { boxShadow: "var(--box-shadow-DEFAULT)" },
+    spacing: { gap: "var(--spacing-3)", padding: "var(--spacing-3)" },
+    "spacing-sm": { gap: "var(--spacing-4)", padding: "var(--spacing-4)" },
+    "spacing-md": { gap: "var(--spacing-4)", padding: "var(--spacing-6)" }
   },
   "theme-marketing": {
     border: { borderColor: "rgba(0, 0, 0, 0)", borderRadius: "2rem" },
-    shadow: { boxShadow: "0px 20px 48px rgba(73, 55, 54, 0.1)" }
+    "popover-border": { borderRadius: "1rem" },
+    shadow: { boxShadow: "0px 20px 48px rgba(73, 55, 54, 0.1)" },
+    spacing: { gap: "var(--spacing-1)", padding: "var(--spacing-1)" },
+    "spacing-sm": { gap: "var(--spacing-1)", padding: "var(--spacing-1)" },
+    "spacing-md": { gap: "var(--spacing-1)", padding: "var(--spacing-1)" }
+  }
+});
+
+// libs/css/component-tokens/src/component-tokens/components/Popover/Popover.tokens.ts
+var PopoverTokenDefinition = AsComponentTokenDefinition({
+  DEFAULT: {
+    border: { borderRadius: "var(--border-radius-DEFAULT)" }
+  },
+  "theme-marketing": {
+    border: { borderRadius: "1rem" }
+  }
+});
+var Popover_tokens_default = PopoverTokenDefinition;
+
+// libs/css/component-tokens/src/component-tokens/components/Popover/PopoverListItem.tokens.ts
+var PopoverListItemTokenDefinition = AsComponentTokenDefinition({
+  DEFAULT: {
+    border: { borderRadius: "var(--border-radius-DEFAULT)" }
+  },
+  "theme-marketing": {
+    border: { borderRadius: "1rem" }
+  }
+});
+var PopoverListItem_tokens_default = PopoverListItemTokenDefinition;
+
+// libs/css/component-tokens/src/component-tokens/components/Search.tokens.ts
+var SearchTokenDefinition = AsComponentTokenDefinition({
+  DEFAULT: {
+    width: { width: "9rem" },
+    background: { backgroundColor: "" },
+    borderless: { borderStyle: "hidden" },
+    "focus-hover": {
+      borderWidth: "1px",
+      borderBottomWidth: "1px",
+      borderColor: "rgb(var(--color-gray-400))",
+      borderBottomColor: "rgb(var(--color-gray-400))",
+      backgroundColor: "rgb(var(--color-slate-50))"
+    },
+    border: {
+      borderStyle: "solid",
+      borderWidth: "1px",
+      borderBottomWidth: "1px",
+      borderColor: "rgb(var(--color-gray-200))",
+      borderBottomColor: "rgb(var(--color-gray-200))",
+      borderRadius: "0.5rem"
+    },
+    "focus-within": {
+      borderColor: "rgb(var(--color-slate-400))",
+      boxShadow: "var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)"
+    },
+    widen: { borderBottomColor: "rgb(var(--color-white-DEFAULT))" },
+    "widen-focus": { borderBottomColor: "rgb(var(--color-black-DEFAULT))" },
+    prefix: {
+      color: "rgb(var(--color-slate-400))",
+      cursor: "default"
+    }
+  },
+  "theme-marketing": {
+    width: { width: "0px" },
+    background: { backgroundColor: "transparent" },
+    borderless: {
+      borderStyle: "hidden"
+    },
+    "focus-hover": {
+      borderWidth: "0px",
+      borderBottomWidth: "2px",
+      borderColor: "rgb(var(--color-black-DEFAULT))",
+      borderBottomColor: "rgb(var(--color-black-DEFAULT))",
+      backgroundColor: "transparent"
+    },
+    border: {
+      borderStyle: "solid",
+      borderWidth: "0px",
+      borderBottomWidth: "2px",
+      borderColor: "rgb(var(--color-white-DEFAULT))",
+      borderBottomColor: "rgb(var(--color-black-DEFAULT))",
+      borderRadius: "0px"
+    },
+    "focus-within": {
+      borderColor: "none",
+      boxShadow: "none"
+    },
+    widen: {
+      borderBottomColor: "rgb(var(--color-white-DEFAULT))"
+    },
+    "widen-focus": {
+      borderBottomColor: "rgb(var(--color-black-DEFAULT))"
+    },
+    prefix: {
+      color: "rgb(var(--color-slate-600))",
+      cursor: "pointer"
+    }
   }
 });
 
 // libs/css/component-tokens/src/component-tokens/ComponentTokens.ts
 var componentTokenDefinitions = {
-  card: CardTokenDefinition
+  card: CardTokenDefinition,
+  button: ButtonTokenDefinition,
+  search: SearchTokenDefinition,
+  popover: Popover_tokens_default,
+  popoverListItem: PopoverListItem_tokens_default
 };
 
 // libs/css/component-tokens/src/component-tokens/ComponentTokenVariablesByThemeName.ts
@@ -564,8 +684,12 @@ var animations = {
   animation: {
     copy: "copy 1s 1",
     "fade-out-slow": "fadeOut 3s ease-in-out forwards",
-    "fade-in-fast": "fadeIn 0.3s ease-in-out forwards",
-    "fade-out-fast": "fadeOut 0.3s ease-in-out forwards",
+    "fade-in-fast": "fadeIn 0.2s ease-in-out forwards",
+    "fade-out-fast": "fadeOut 0.2s ease-in-out forwards",
+    "slide-in-left": "slideInLeft 0.2s ease-in-out forwards",
+    "slide-in-right": "slideInRight 0.2s ease-in-out forwards",
+    "slide-in-top": "slideInTop 0.2s ease-in-out forwards",
+    "slide-in-bottom": "slideInBottom 0.2s ease-in-out forwards",
     "ping-sm": "pingSm 1s cubic-bezier(0, 0, 0.2, 1) infinite"
   },
   keyframes: {
@@ -584,6 +708,22 @@ var animations = {
       "0%": { opacity: "0" },
       "100%": { opacity: "1" }
     },
+    slideInLeft: {
+      "0%": { transform: "translate(-100%)" },
+      "100%": { transform: "translate(0%)" }
+    },
+    slideInRight: {
+      "0%": { transform: "translate(100%)" },
+      "100%": { transform: "translate(0%)" }
+    },
+    slideInBottom: {
+      "0%": { transform: "translate(0, 100%)" },
+      "100%": { transform: "translate(0, 0%)" }
+    },
+    slideInTop: {
+      "0%": { transform: "translate(0, -100%)" },
+      "100%": { transform: "translate(0, 0%)" }
+    },
     pingSm: {
       "75%, 100%": {
         transform: "scale(1.5)",
@@ -809,7 +949,49 @@ var tailwindBaseConfig = {
         popover: withCustomPropertyValueAsComment("--z-popover"),
         toast: withCustomPropertyValueAsComment("--z-toast")
       }
-    })
+    }),
+    variables: {
+      "theme-marketing": {
+        color: {
+          primary: {
+            50: "254 236 235",
+            100: "254 236 235",
+            200: "254 217 215",
+            300: "253 180 176",
+            400: "251 142 136",
+            500: "250 104 97",
+            600: "249 66 58",
+            700: "238 19 7",
+            800: "178 14 5",
+            900: "119 9 4"
+          },
+          secondary: {
+            50: "238 243 246",
+            100: "238 243 246",
+            200: "222 231 237",
+            300: "189 208 219",
+            400: "155 184 202",
+            500: "122 160 184",
+            600: "89 137 166",
+            700: "71 109 133",
+            800: "53 82 100",
+            900: "36 55 66"
+          },
+          accent: {
+            50: "255 246 240",
+            100: "255 246 240",
+            200: "255 238 224",
+            300: "255 223 199",
+            400: "255 206 168",
+            500: "255 191 143",
+            600: "255 173 112",
+            700: "255 134 41",
+            800: "219 95 0",
+            900: "148 64 0"
+          }
+        }
+      }
+    }
   },
   plugins: [CssTailwindCustomPropertiesPlugin, src_default]
 };