@shuriken-ui/tailwind 2.0.0-next.9 → 2.0.1

package/README.md

@@ -1,8 +1,8 @@
 <p align="center">
   <picture>
-    <source media="(prefers-color-scheme: dark)" srcset="https://user-images.githubusercontent.com/3911343/232132279-8d8bf0ad-b1d7-4802-984e-a696763dc6cd.png">
-    <source media="(prefers-color-scheme: light)" srcset="https://user-images.githubusercontent.com/3911343/232132309-62971744-dcdb-429c-aa93-6ba0c1caac42.png">
-    <img alt="Shuriken UI logo" src="https://user-images.githubusercontent.com/3911343/232132309-62971744-dcdb-429c-aa93-6ba0c1caac42.png">
+    <source media="(prefers-color-scheme: dark)" srcset="https://github.com/shuriken-ui/.github/assets/86636408/278e3026-1997-4e01-9457-20772adbce31">
+    <source media="(prefers-color-scheme: light)" srcset="https://github.com/shuriken-ui/.github/assets/86636408/06f9d8e2-38aa-45b2-b91e-1c891a20e271">
+    <img alt="Shuriken UI logo" src="https://github.com/shuriken-ui/.github/assets/86636408/06f9d8e2-38aa-45b2-b91e-1c891a20e271">
   </picture>
 </p>
 
@@ -34,7 +34,8 @@ The simplest way to register Shuriken UI is to use `withShurikenUI` helper funct
 import { withShurikenUI } from '@shuriken-ui/tailwind'
 
 export default withShurikenUI({
-  // your config
+  // your tailwind config
+  content: [],
 })
 ```
 
@@ -47,8 +48,45 @@ import type { Config } from 'tailwindcss'
 import preset from '@shuriken-ui/tailwind/preset'
 
 export default {
-  presets: [shurikenUIPreset],
-  // your config
+  // your tailwind config, with the preset
+  content: [],
+  presets: [preset],
+} satisfies Config
+```
+
+
+Also, you can import only the components and utils you needs.
+
+```ts
+// tailwind.config.ts
+import type { Config } from 'tailwindcss'
+import { fontFamily } from 'tailwindcss/defaultTheme'
+import colors from 'tailwindcss/colors'
+
+import { input, button } from '@shuriken-ui/tailwind/plugins'
+
+export default {
+  // your tailwind config, with only the components you need
+  plugins: [input, button],
+  theme: {
+    fontFamily: {
+      sans: fontFamily.sans,
+      heading: fontFamily.sans,
+      alt: fontFamily.sans,
+      mono: fontFamily.mono,
+    },
+    extend: {
+      colors: {
+        primary: colors.violet,
+        'primary-invert': colors.white,
+        muted: colors.slate,
+        info: colors.sky,
+        success: colors.teal,
+        warning: colors.amber,
+        danger: colors.rose,
+      },
+    },
+  },
 } satisfies Config
 ```
 
@@ -60,7 +98,7 @@ Shuriken UI is fully customizable. You can override components by using the `the
 export default withShurikenUI({
   theme: {
     extend: {
-      shurikenUi: {
+      nui: {
         // your customizations
       },
     },

package/dist/config.cjs

@@ -1,12 +1,14 @@
 'use strict';
 
 const preset = require('./preset.cjs');
-require('tailwindcss/defaultTheme');
-require('tailwindcss/colors');
 require('@tailwindcss/typography');
 require('@tailwindcss/container-queries');
+require('./plugins/index.cjs');
 require('tailwindcss/plugin');
 require('defu');
+require('./themes.cjs');
+require('tailwindcss/colors');
+require('tailwindcss/defaultTheme');
 
 const config = {
   content: [],

package/dist/config.mjs

@@ -1,10 +1,12 @@
 import { preset } from './preset.mjs';
-import 'tailwindcss/defaultTheme';
-import 'tailwindcss/colors';
 import '@tailwindcss/typography';
 import '@tailwindcss/container-queries';
+import './plugins/index.mjs';
 import 'tailwindcss/plugin';
 import 'defu';
+import './themes.mjs';
+import 'tailwindcss/colors';
+import 'tailwindcss/defaultTheme';
 
 const config = {
   content: [],

package/dist/index.cjs

@@ -1,12 +1,14 @@
 'use strict';
 
 const preset = require('./preset.cjs');
-require('tailwindcss/defaultTheme');
-require('tailwindcss/colors');
 require('@tailwindcss/typography');
 require('@tailwindcss/container-queries');
+require('./plugins/index.cjs');
 require('tailwindcss/plugin');
 require('defu');
+require('./themes.cjs');
+require('tailwindcss/colors');
+require('tailwindcss/defaultTheme');
 
 function withShurikenUI(config) {
   if (preset.hasPreset(config)) {

package/dist/index.d.cts

@@ -1,9 +1,11 @@
-import { S as ShurikenUIConfig } from './shared/tailwind.d65f80d7.cjs';
-export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.d65f80d7.cjs';
+import { S as ShurikenUIConfig } from './shared/tailwind.60db5be7.cjs';
+export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.60db5be7.cjs';
 import 'tailwindcss/types/config';
 import 'tailwindcss';
-import '@tailwindcss/typography';
 
+/**
+ * Inject the shuriken-ui preset into a tailwind config if not already present
+ */
 declare function withShurikenUI(config: ShurikenUIConfig): ShurikenUIConfig;
 
 export { withShurikenUI };

package/dist/index.d.mts

@@ -1,9 +1,11 @@
-import { S as ShurikenUIConfig } from './shared/tailwind.d65f80d7.mjs';
-export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.d65f80d7.mjs';
+import { S as ShurikenUIConfig } from './shared/tailwind.60db5be7.mjs';
+export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.60db5be7.mjs';
 import 'tailwindcss/types/config';
 import 'tailwindcss';
-import '@tailwindcss/typography';
 
+/**
+ * Inject the shuriken-ui preset into a tailwind config if not already present
+ */
 declare function withShurikenUI(config: ShurikenUIConfig): ShurikenUIConfig;
 
 export { withShurikenUI };

package/dist/index.d.ts

@@ -1,9 +1,11 @@
-import { S as ShurikenUIConfig } from './shared/tailwind.d65f80d7.js';
-export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.d65f80d7.js';
+import { S as ShurikenUIConfig } from './shared/tailwind.60db5be7.js';
+export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.60db5be7.js';
 import 'tailwindcss/types/config';
 import 'tailwindcss';
-import '@tailwindcss/typography';
 
+/**
+ * Inject the shuriken-ui preset into a tailwind config if not already present
+ */
 declare function withShurikenUI(config: ShurikenUIConfig): ShurikenUIConfig;
 
 export { withShurikenUI };

package/dist/index.mjs

@@ -1,11 +1,13 @@
 import { hasPreset, preset } from './preset.mjs';
 export { createPreset } from './preset.mjs';
-import 'tailwindcss/defaultTheme';
-import 'tailwindcss/colors';
 import '@tailwindcss/typography';
 import '@tailwindcss/container-queries';
+import './plugins/index.mjs';
 import 'tailwindcss/plugin';
 import 'defu';
+import './themes.mjs';
+import 'tailwindcss/colors';
+import 'tailwindcss/defaultTheme';
 
 function withShurikenUI(config) {
   if (hasPreset(config)) {