@shuriken-ui/tailwind 3.1.3 → 4.0.0-alpha.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shuriken-ui/tailwind",
-  "version": "3.1.3",
+  "version": "4.0.0-alpha.2",
   "license": "MIT",
   "author": "Css Ninja <hello@cssninja.io> (https://cssninja.io)",
   "repository": "shuriken-ui/tailwind",
@@ -19,43 +19,48 @@
     "module"
   ],
   "type": "module",
-  "main": "./dist/index.cjs",
-  "types": "./dist/index.d.ts",
+  "main": "./src/index.css",
   "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs"
-    },
-    "./preset": {
-      "types": "./dist/preset.d.ts",
-      "import": "./dist/preset.mjs",
-      "require": "./dist/preset.cjs"
-    },
-    "./config": {
-      "types": "./dist/config.d.ts",
-      "import": "./dist/config.mjs",
-      "require": "./dist/config.cjs"
-    },
-    "./colors": {
-      "types": "./dist/colors.d.ts",
-      "import": "./dist/colors.mjs",
-      "require": "./dist/colors.cjs"
-    },
-    "./themes": {
-      "types": "./dist/themes.d.ts",
-      "import": "./dist/themes.mjs",
-      "require": "./dist/themes.cjs"
-    },
-    "./plugins": {
-      "types": "./dist/plugins/index.d.ts",
-      "import": "./dist/plugins/index.mjs",
-      "require": "./dist/plugins/index.cjs"
-    }
+    ".": "./src/index.css",
+    "./theme.css": "./src/theme.css",
+    "./*.css": "./src/css/*.css"
   },
   "files": [
-    "dist"
+    "src/index.css",
+    "src/theme.css",
+    "src/css"
   ],
+  "dependencies": {
+    "@tailwindcss/container-queries": "^0.1.1",
+    "@tailwindcss/typography": "^0.5.15",
+    "tailwindcss": "^4.0.0 || 4.0.0-alpha.31"
+  },
+  "devDependencies": {
+    "@open-wc/lit-helpers": "0.7.0",
+    "@storybook/addon-essentials": "^8.4.2",
+    "@storybook/addon-links": "^8.4.2",
+    "@storybook/addon-themes": "^8.4.2",
+    "@storybook/blocks": "^8.4.2",
+    "@storybook/web-components": "^8.4.2",
+    "@storybook/web-components-vite": "^8.4.2",
+    "@types/node": "22.9.0",
+    "@typescript-eslint/eslint-plugin": "^8.13.0",
+    "@vitest/coverage-v8": "^2.1.4",
+    "@vitest/ui": "^2.1.4",
+    "chromatic": "^11.16.5",
+    "defu": "^6.1.4",
+    "glob": "^11.0.0",
+    "jiti": "^2.4.0",
+    "jsdom": "^25.0.1",
+    "lit": "^3.2.1",
+    "npm-run-all": "^4.1.5",
+    "standard-version": "^9.5.0",
+    "storybook": "^8.4.2",
+    "typescript": "^5.6.3",
+    "unbuild": "^2.0.0",
+    "vitest": "^2.1.4",
+    "vitest-axe": "1.0.0-pre.2"
+  },
   "scripts": {
     "dev": "storybook dev -p 6006",
     "build": "unbuild",
@@ -68,62 +73,8 @@
     "test": "run-s lint:eslint lint:prettier test:vitest",
     "test:vitest": "vitest",
     "coverage": "vitest run --coverage",
-    "prepack": "pnpm run build",
     "release": "run-s test release:*",
     "release:standard-version": "standard-version",
-    "release:publish": "git push --follow-tags origin main && npm publish",
-    "prepare": "simple-git-hooks"
-  },
-  "dependencies": {
-    "@tailwindcss/container-queries": "^0.1.1",
-    "@tailwindcss/typography": "^0.5.10",
-    "defu": "^6.1.4",
-    "tailwindcss": "^3.4.1"
-  },
-  "devDependencies": {
-    "@commitlint/cli": "^18.4.4",
-    "@commitlint/config-conventional": "^18.4.4",
-    "@open-wc/lit-helpers": "0.6.0",
-    "@storybook/addon-essentials": "^8.0.5",
-    "@storybook/addon-links": "^8.0.5",
-    "@storybook/addon-themes": "^8.0.5",
-    "@storybook/blocks": "^8.0.5",
-    "@storybook/web-components": "^8.0.5",
-    "@storybook/web-components-vite": "^8.0.5",
-    "@types/node": "20.11.0",
-    "@typescript-eslint/eslint-plugin": "^6.18.1",
-    "@vitest/coverage-v8": "^1.1.3",
-    "@vitest/ui": "^1.1.3",
-    "autoprefixer": "^10.4.16",
-    "chromatic": "^10.2.1",
-    "commitlint": "^18.4.4",
-    "eslint": "8.56.0",
-    "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-storybook": "^0.8.0",
-    "eslint-plugin-tailwindcss": "3.13.1",
-    "eslint-plugin-unicorn": "^50.0.1",
-    "jsdom": "^23.2.0",
-    "lint-staged": "^15.2.0",
-    "lit": "^3.1.1",
-    "npm-run-all": "^4.1.5",
-    "postcss": "^8.4.33",
-    "prettier": "^3.1.1",
-    "simple-git-hooks": "^2.9.0",
-    "standard-version": "^9.5.0",
-    "storybook": "^8.0.5",
-    "typescript": "^5.3.3",
-    "unbuild": "^2.0.0",
-    "vitest": "^1.1.3",
-    "vitest-axe": "1.0.0-pre.2"
-  },
-  "simple-git-hooks": {
-    "pre-commit": "pnpm lint-staged",
-    "commit-msg": "pnpm commitlint -e -V "
-  },
-  "lint-staged": {
-    "*.ts?(x)": [
-      "prettier --parser=typescript --write",
-      "eslint -c .eslintrc.cjs --fix --ext .ts"
-    ]
+    "release:publish": "git push --follow-tags origin main && npm publish"
   }
-}
+}

package/src/css/accordion.css

@@ -0,0 +1,175 @@
+/* generated using "pnpm jiti scripts/generate-utilities.ts" */
+/* @utility nui-accordion */
+
+@utility nui-accordion {
+  &:not(:last-child) {
+    @apply border-b-0;
+  }
+  @apply w-full block overflow-hidden;
+  @apply bg-white dark:bg-muted-800;
+  @apply hover:bg-muted-50/60 dark:hover:bg-muted-800/60;
+  @apply border border-muted-300 dark:border-muted-700;
+  @apply transition-colors duration-300;
+
+  .nui-accordion-detail[open]:not(:first-child) {
+    @apply border-t border-muted-300 dark:border-muted-700;
+  }
+
+  .nui-accordion-detail .nui-accordion-dot {
+    @apply bg-muted-200 dark:bg-muted-700;
+  }
+
+  &.nui-accordion-chevron, &.nui-accordion-plus {
+    .nui-accordion-header {
+      @apply px-4 py-3;
+    }
+  }
+
+  + .nui-accordion {
+    @apply !border-t-0;
+  }
+}
+@utility nui-accordion-summary {
+  @apply cursor-pointer list-none outline-none;
+}
+@utility nui-accordion-header {
+  @apply flex items-center justify-between;
+
+  .nui-accordion-header-inner {
+    @apply text-muted-800 dark:text-white;
+  }
+}
+@utility nui-accordion-dot {
+  @apply ms-2 h-3 w-3 rounded-full;
+  @apply transition-colors duration-300;
+}
+@utility nui-icon-outer {
+  @apply ms-2 flex items-center justify-center;
+  @apply h-8 w-8 rounded-full;
+  @apply border border-transparent dark:border-transparent;
+  @apply bg-white dark:bg-muted-700/60;
+  @apply transition-all duration-300;
+}
+@utility nui-chevron-icon {
+  @apply text-muted-400 h-4 w-4;
+  @apply transition-transform duration-300;
+}
+@utility nui-plus-icon {
+  @apply text-muted-400 h-4 w-4;
+  @apply transition-transform duration-300;
+}
+@utility nui-accordion-content {
+  @apply px-4 pb-4;
+  @apply font-sans text-sm text-muted-500 dark:text-muted-400;
+}
+@utility nui-accordion-default {
+  @apply bg-white dark:bg-muted-800;
+  @apply hover:bg-muted-50/60 dark:hover:bg-muted-800/60;
+  @apply border border-muted-300 dark:border-muted-700;
+}
+@utility nui-accordion-default-contrast {
+  @apply bg-white dark:bg-muted-950;
+  @apply hover:bg-muted-50/60 dark:hover:bg-muted-950/60;
+  @apply border border-muted-300 dark:border-muted-800;
+}
+@utility nui-accordion-muted {
+  @apply bg-muted-100 dark:bg-muted-800;
+  @apply hover:bg-muted-100/60 dark:hover:bg-muted-800/60;
+  @apply border border-muted-200 dark:border-muted-700;
+}
+@utility nui-accordion-muted-contrast {
+  @apply bg-muted-100 dark:bg-muted-950;
+  @apply hover:bg-muted-100/60 dark:hover:bg-muted-950/60;
+  @apply border border-muted-200 dark:border-muted-800;
+}
+@utility nui-dot-default {
+  .nui-accordion-detail[open] .nui-accordion-dot {
+    @apply bg-muted-400 dark:bg-muted-700;
+  }
+}
+@utility nui-dot-primary {
+  .nui-accordion-detail[open] .nui-accordion-dot {
+    @apply bg-primary-500 dark:bg-primary-500;
+  }
+}
+@utility nui-dot-info {
+  .nui-accordion-detail[open] .nui-accordion-dot {
+    @apply bg-info-500 dark:bg-info-500;
+  }
+}
+@utility nui-dot-success {
+  .nui-accordion-detail[open] .nui-accordion-dot {
+    @apply bg-success-500 dark:bg-success-500;
+  }
+}
+@utility nui-dot-warning {
+  .nui-accordion-detail[open] .nui-accordion-dot {
+    @apply bg-warning-500 dark:bg-warning-500;
+  }
+}
+@utility nui-dot-danger {
+  .nui-accordion-detail[open] .nui-accordion-dot {
+    @apply bg-danger-500 dark:bg-danger-500;
+  }
+}
+@utility nui-dot-dark {
+  .nui-accordion-detail[open] .nui-accordion-dot {
+    @apply bg-muted-900 dark:bg-muted-100;
+  }
+}
+@utility nui-dot-black {
+  .nui-accordion-detail[open] .nui-accordion-dot {
+    @apply bg-black dark:bg-white;
+  }
+}
+@utility nui-accordion-dot {
+  .nui-accordion-header {
+    @apply p-4;
+  }
+}
+@utility nui-accordion-chevron {
+  .nui-accordion-detail[open] .nui-icon-outer {
+    @apply rotate-180;
+  }
+}
+@utility nui-accordion-plus {
+  .nui-accordion-detail[open] .nui-icon-outer {
+    @apply rotate-45;
+  }
+}
+@utility nui-accordion-straight {
+  &.nui-accordion:first-child {
+    @apply rounded-t-none;
+  }
+
+  &.nui-accordion:last-child {
+    @apply rounded-b-none;
+  }
+}
+@utility nui-accordion-rounded-sm {
+  &.nui-accordion:first-child {
+    @apply rounded-t-md;
+  }
+
+  &.nui-accordion:last-child {
+    @apply rounded-b-md;
+  }
+}
+@utility nui-accordion-rounded-md {
+  &.nui-accordion:first-child {
+    @apply rounded-t-lg;
+  }
+
+  &.nui-accordion:last-child {
+    @apply rounded-b-lg;
+  }
+}
+@utility nui-accordion-rounded-lg {
+  &.nui-accordion:first-child {
+    @apply rounded-t-xl;
+  }
+
+  &.nui-accordion:last-child {
+    @apply rounded-b-xl;
+  }
+}