Next release (#167)

* Link npm downloads badge to npm package page * 🕰️ NEW: formatDate (#137) * re init my mess dates * update for consistency * moving format to intl * tests with also fr local * dico * dateDisplay update * Humm * tmp rename to format_fns * realignement & doc update * add a playground * Month & monthYear * DateField * Date Range * Month done * rmv all usage of dateDisplay * Nice nice nice * casing * enums casing * oups, need to comment fr for now in the doc * formats * okay with date of week * update docs * add changeset * rmv dateDisplay * cleanup * dico * keep Day default * rmv useless * Okay, adding DayTime & TimeOnly * of course, updating doc is always good :) * Swtich default to use Tokens enum * Design tokens / Theme support (with dark mode) (#146) * Squash all theme changes into single commit * Add changeset * Enter prerelease mode and version packages * Add Kbd component. Show keyboard shortcuts on ThemeButton menu * Read themes/colors from tailwind config, including Daisy UI (with mapping). Supports generating optional colors and further extension and flexability. * Process daisy themes to generate lightThemes/darkThemes based on color-scheme value * Add changeset * Version bump to 0.58.0-next.1 * Add styles (with daisy) as top-level export * Version bump to 0.58.0-next.2 * Add commonjs and esm versions of daisy module * Version bump to 0.58.0-next.3 * Remove daisy from top-level exports * Version bump to 0.58.0-next.4 * Rename `error` / `error-content` to `danger` / `danger-content` * Fix pnpm-lock.yaml using `pnpm install` (ERR_PNPM_ERR_PNPM_UNEXPECTED_PKG_CONTENT_IN_STORE The lockfile is broken! Resolution step will be performed to fix it.) * Add `accent` and `neutral` theme colors * Cleanup * Update some leftover `error` => `danger` color references * Extra tailwind plugin into multiple files for better readability * Use darker "-content" color for default `fill` variant (distinguish from `fill-light`) * Simplify naming and impl. of foregroundColor() and add lightenColor() (to match darkenColor()) * Register 100-900 shades for all semantic and state colors. Replace color-mix() usage (including Tailwind *-mix-* utils) with new shades * Use lib/styles/themes for types as well * Replace SvelteComponentTyped with SvelteComponent * Version bump to 0.58.0-next.5 * Cleanup * Remove unused css files * Simplify * Support changing colorSpace (rgb, hsl, or oklch) * Improve theme page preview and add menu item * Improve default border color * Fix handling of hsl() color space by clamping to RGB values (to not exceed 100% saturation or lightness). Matches rgb() color * Version bump to 0.58.0-next.6 * Use same surface-content/20% outline color as border color * Remove explicit border colors that match default (border-surface-content/20) and replace some border-surface-### with default (surface-content/20) * Version bump to 0.58.0-next.7 * Change "theme" to "classes" in Settings (#172) * Rename settings `theme` to `classes` in preparation for adding theme support * Rename getComponentTheme to getComponentClasses * Add svelte settings to .prettierrc (#173) * Theme store (#174) * Move theme management to a store that lives in the context * changeset * Use cross-framework-compatible browser value * handle post-load changes in prefers-color-scheme * better browser stub-out * Move culori to be a regular dependency so that all package managers will install it (#175) * add ThemeInit component that place script inside <head> tag (#176) * add ThemeInit component that place script inside <head> tag * Fix bug * proper sorting * instantiate ThemeInit inside Settings component * add comment about stringified function * Version bump to 0.58.0-next.8 * Improve dark scheme icon * Rename `ThemeButton` to `ThemeSelect` * Add `ThemeSwitch` component to toggle between light/dark theme * Generate `-50` shade for an option lighter than `-100` * Update Settings component to expose each settings value as its own component prop (#177) * Format project (fix lint failure) * Update tailwind plugin to only generate shade colors if not present in theme (ex. Skeleton provides the shades 100-900). Map `{color}-500` to `{color}` if not defined. Generate neutral color if not defined * Map Skeleton themes to Svelte UX themes * Switch Daisy UI themes back as the default (for now, until a more robust solution is available) * refacto peer dev (#201) * refacto peer dev * @changesets/cli is only for library developers * rehype-slug is only for the `svelte-ux` doc it can go to devDep * @fortawesome/free-solid-svg-icons is only in the doc * Move format function definitions onto settings to avoid calling getSettings after component initialization (#191) * move format functions onto settings object * update uses of formatting functions to fit new settings paradigm * start transferring to store-based locale settings * checkpoint * update templates, add back custom date formatting * upadte format samples * update number tests * clean up custom variant a bit, improve format function type definition * remove date and number subformatters * fixes * fix missing style * better label * allow setting locale to one not explicitly supported * fix a few old format calls * add function type possibility to column format * [formatNumber] Fix default style handling and update tests * Locale support cleanup (#202) * fix circular reference * remove knownLocales * fix date tests * add locale exports, hide exports of a few internal-only functions * changeset * Format last qol for next (#203) * add WeekStartsOn defaults depending on the locale * init a Language Select comp * Theme generator (#192) * Rename `cssVars` action to `styleVars` and do not prefix properties with `--` by default (more flexible) * [SelectField] Fix toggling display of options menu using toggleIcon. Ignore toggling when clicking on SelectField border. Support hiding toggleIcon (`<SelectField toggleIcon={null} /> * [SelectField] Add `stepper` prop to iterate through options (like `MenuField`) * [MenuField] Expose `selected` option via prop (similar to `SelectField`) * [SelectField Add stepper example * Move `processThemeColors()` from tailwind plugin to $lib/styles/theme to allow calling at runtime (theme generator frontend). Add types * Update skeleton.ts to match skeleton.cjs (to be removed) * Beginning work of theme generator * Read themes from `themes.json` file for both tailwind config and theme selector. Remove daisy/skeleton commonjs modules. Add `getThemeNames` to split based on `color-scheme`. Ultimately simplifies a lot * Add "Copy all" daisy and skeleton options * Use <ThemeSelect> or <ThemeSwitch> based on more than 1 light/dark theme * Fix skeleton dark themes after refactor * Add explicit daisy themeName list to hopefully fix build (similar to skeleton) * Set initial theme selections (fix reactivity infinite loop) * [SelectField] Use `selectValue(...)` instead of `value = ...` so `change` is dispatched (and other consistent updating) * Change light/dark preview based on which input was last changed * Support overriding doc themes wtih generator (custom) themes * Fix setting `prefers-color-scheme: dark` override * Use a local copy of Skeleton themes to fix Cloudflare build (work around Node.js runtime issue) * Improve handling of `-50` shade when `-100` exists (ex. Skeleton) * Update site dark/light mode with preview for better experience (previewing and applying) * Support custom Ior exisitng) theme editing * Add state colors and support showing/hiding optoinal colors * Add "Copy all themes" menu item * [ColorField] Support `hex` entry * Register all themes (daisy + skeleton) * Format files (fix lint error) * Add changeset * Version bump to 0.58.0-next.9 * Add ThemeSwitch to top-level exports * pass through existing locale stores if they are passed into settings (#205) * make DateField format and mask reactive to locale changes (#206) * make DateField format and mask reactive to locale changes * Make Input component reactive to changes in mask * fix getPeriodTypeName calls (#207) * [ColorField] Make color swatch look clickable * [TableOfContents] Support changing icon * [Popover|Menu|popover] Support `resize` width or height only * [ThemeSelect] Improve width (consistent when switching between light/dark, and fix width on mobile) * [MenuButton] Support hiding `menuIcon` and dispatch `change` event * Collapse app header actions into menu on small viewports. Resolves #185 * Small docs design refinements * [LanguageSelect] Use code instead of flag for selection display * Responsive tweaks * Update examles to use `fill-light" instead of "fill" for default color buttons (after darkening "fill") * Update all light/dark mode toggles to be light/dark (and not dark/light). Update theme page to initialize/sync showDarkMode based on the current setting * Feat/date range weekstarton (#208) * add fr translation & use the "week" to fit the weekstartOn * range & fr & reactivity * adding more translation * internal var name * typeHelpers * fix my typo 🙈 * Update localization settings and translations (#211) * Increase the z-index of the docs header to fix some examples (ex. AppBar) stacking above * Refine theme page layout * Add `isolate` to `<main>` allow modals (Dialog, Drawer, etc) to stack above high z-index elements when portal'd to the bottom of the DOM (outside of `<main>` * Version bump to 0.58.0-next.10 * Support passing a custom formatter function as `format` argument to format() / formatWithLocale() * Version bump to 0.58.0-next.11 * Comment out `$env/dynamic/private` usage unti SvelteKit is upgraded to `2.3.2+` to fix Safari issue * Restore using `$env/dynamic/private` (doesn't appear to solve Safari issue) * update SvelteKit and Vite dependencies (#215) * update SvelteKit and Vite dependencies * move sveld back to deps * Handle `weekInfo` across different browsers (fix Safari). Closes #214 * Change PeriodType values (0 = unqualified DoW, 1-7 = Sun-Sat). Fix DateRange bi-week periodType. Add tests for `hasDayOfWeek()`, `getDayOfWeek()`, and `replaceDayOfWeek()` (#217) * Version bump to 0.58.0-next.12 * Update all dependencies except vitest * Remove typedoc (since not actively using) * Format projecdt after updating prettier (fix lint errors) * [DateRange] Update selection when only changing period type (from/to * Add changeset * Version bump to 0.58.0-next.13 * Run svelte-migrate for Kit v2 (#218) * Upgrade vitest to 1.2 (#219) * Replace `sveltePreprocess` with `vitePreprocess` in docs. Closes #57 * Remove broken classname * Use a separate settings() context on format() page to not try to update site context. Fixes error when setting to anything other than `en` and `fr` * Add `sumObjects` array util * Add jsdoc * Remove unused prop accessor arg * Reduce the font size of the Tailwind typography/prose headers * [Kbd] Set the text color * Update Getting Started and Customization docs * Fix ThemeSwitch SSR behavior by using `dark` class to define positioning and icon display (#228) * Add TODOs * Replace red/green with danger/success * Fix overriding `elevation-#` classes. Add `elevation-none` to remove `elevation-#`. Closes #233 (#236) * [Appbar] Add `menuIcon` prop and slot. Closes #235 (#239) * [MultiSelect] Add `autoFocusSearch` to opt into functionality, which `MultiSelectMenu` maintains (#241) * [DateRange] Remove `scrollIntoView` for date selection components (month, year) (#242) * Add ability to set default props on some components (#230) * Add defaultProps to settings, with labelPlacement setting * Allow per-component defaults as well * remove global default props * Update docs and calls to settings * alter getComponentSettings return to make it easier to combine with restProps * udpate changeset * clean up imports * fixes * format * support `rounded` on Buttons * Fix getComponentClasses() with string (root-only) classes. Ex. `AppBar: { classes: '...' }` * Refine customization docs * Remove types in lib/types/options.ts to libs/types/index.ts * Support `size` and `color` default settings * Proper use of resolveComponentClasses from both call sites --------- Co-authored-by: Sean Lynch <[email protected]> * feat(DateField): Add support for `class` and `classes` props (#244) * feat(DateField): Add support for `class` and `classes` props, add `DateField` class, pass `$$restProps` * Remove unnecessary `NonNullable` * Fix DateField example with locale dictionary * Add default light/dark themes if none are provided * Do not require defining `color-scheme` for light/dark mode (but still support being explicit) * [ThemeSelect] Opt into adding keyboard shortcuts. Also fixes double registration on customization page * [DateField] Fix input value when clearing value * Replace any `.` (index) imports * Fix getting started tailwind plugin path * Change layerchart version in template to `latest` version --------- Co-authored-by: JYC <[email protected]> Co-authored-by: Daniel Imfeld <[email protected]> Co-authored-by: Brandon McConnell <[email protected]>
techniq · Feb 12, 2024 · 92cdcaa · 92cdcaa
1 parent 2bd45a4
commit 92cdcaa
Show file tree

Hide file tree

Showing 284 changed files with 12,047 additions and 51,050 deletions.
diff --git a/.changeset/angry-ads-carry.md b/.changeset/angry-ads-carry.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+Update dependencies (except vitest)
diff --git a/.changeset/angry-zebras-remember.md b/.changeset/angry-zebras-remember.md
@@ -0,0 +1,5 @@
+---
+'svelte-ux': patch
+---
+
+Add styles (with daisy) as top-level export
diff --git a/.changeset/chilled-dingos-sell.md b/.changeset/chilled-dingos-sell.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": minor
+---
+
+Update Settings component to expose each settings key as a component prop
diff --git a/.changeset/clever-avocados-hope.md b/.changeset/clever-avocados-hope.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": minor
+---
+
+Add ability to set a default values for labelPlacement and variant props
diff --git a/.changeset/cool-hotels-own.md b/.changeset/cool-hotels-own.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[SelectField] Add `stepper` prop to iterate through options (like `MenuField`)
diff --git a/.changeset/eight-bottles-eat.md b/.changeset/eight-bottles-eat.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[TableOfContents] Support changing icon
diff --git a/.changeset/fair-trees-sparkle.md b/.changeset/fair-trees-sparkle.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[MenuField] Expose `selected` option via prop (similar to `SelectField`)
diff --git a/.changeset/fluffy-news-worry.md b/.changeset/fluffy-news-worry.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": minor
+---
+
+Add `sumObjects` array util
diff --git a/.changeset/for-you-sean.md b/.changeset/for-you-sean.md
@@ -0,0 +1,7 @@
+---
+'svelte-ux': minor
+---
+
+- Rename settings `theme` argument to `classes`
+- Rename getTheme to getClasses and getComponentTheme to getComponentClasses
+
diff --git a/.changeset/friendly-pets-reflect.md b/.changeset/friendly-pets-reflect.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+Add ThemeInit component to prevent flash of unstyled content when SSR is enabled
diff --git a/.changeset/healthy-files-search.md b/.changeset/healthy-files-search.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[MenuButton] Support hiding `menuIcon` and dispatch `change` event
diff --git a/.changeset/light-pianos-refuse.md b/.changeset/light-pianos-refuse.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+Rename `ThemeButton` to `ThemeSelect`
diff --git a/.changeset/light-ways-dress.md b/.changeset/light-ways-dress.md
@@ -0,0 +1,5 @@
+---
+'svelte-ux': minor
+---
+
+BREAKING: removed `dateDisplay()` in favor of `format()`
diff --git a/.changeset/modern-pumpkins-march.md b/.changeset/modern-pumpkins-march.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+Add a store to manage the current theme
diff --git a/.changeset/moody-cows-pull.md b/.changeset/moody-cows-pull.md
@@ -0,0 +1,5 @@
+---
+'svelte-ux': patch
+---
+
+Support passing a custom formatter function as `format` argument to format() / formatWithLocale()
diff --git a/.changeset/nice-cats-know.md b/.changeset/nice-cats-know.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+Fix ThemeSwitch SSR behavior by using `dark` class to define positioning and icon display
diff --git a/.changeset/ninety-beers-return.md b/.changeset/ninety-beers-return.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[MultiSelect] Add `autoFocusSearch` to opt into functionality, which `MultiSelectMenu` maintains
diff --git a/.changeset/ninety-carpets-cross.md b/.changeset/ninety-carpets-cross.md
@@ -0,0 +1,5 @@
+---
+'svelte-ux': patch
+---
+
+add locale management of date leveraging intl
diff --git a/.changeset/pre.json b/.changeset/pre.json
@@ -0,0 +1,38 @@
+{
+  "mode": "pre",
+  "tag": "next",
+  "initialVersions": {
+    "create-svelte-ux": "0.2.1",
+    "svelte-ux": "0.57.1"
+  },
+  "changesets": [
+    "angry-ads-carry",
+    "angry-zebras-remember",
+    "beige-papayas-study",
+    "chilled-dingos-sell",
+    "cool-hotels-own",
+    "eight-bottles-eat",
+    "fair-trees-sparkle",
+    "for-you-sean",
+    "friendly-pets-reflect",
+    "healthy-files-search",
+    "light-pianos-refuse",
+    "light-ways-dress",
+    "modern-pumpkins-march",
+    "moody-cows-pull",
+    "ninety-carpets-cross",
+    "quick-avocados-hope",
+    "quick-carrots-grab",
+    "rare-flowers-flash",
+    "selfish-hounds-dance",
+    "shiny-hornets-study",
+    "shy-peaches-ring",
+    "sixty-walls-rest",
+    "sour-cougars-beg",
+    "strong-flies-provide",
+    "tidy-gifts-yawn",
+    "wicked-melons-fold",
+    "yellow-nails-vanish",
+    "yellow-oranges-fly"
+  ]
+}
diff --git a/.changeset/quick-carrots-grab.md b/.changeset/quick-carrots-grab.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": minor
+---
+
+Add theme selection/creation page and simplify loading themes
diff --git a/.changeset/rare-flowers-flash.md b/.changeset/rare-flowers-flash.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+Map Skeleton themes to Svelte UX themes
diff --git a/.changeset/selfish-hounds-dance.md b/.changeset/selfish-hounds-dance.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[SelectField] Fix toggling display of options menu using toggleIcon. Support hiding toggleIcon (`<SelectField toggleIcon={null} />
diff --git a/.changeset/shaggy-cars-approve.md b/.changeset/shaggy-cars-approve.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[DateRange] Remove `scrollIntoView` for date selection components (month, year)
diff --git a/.changeset/shiny-schools-ring.md b/.changeset/shiny-schools-ring.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[DateField] Fix input value when clearing value
diff --git a/.changeset/silver-penguins-jam.md b/.changeset/silver-penguins-jam.md
@@ -0,0 +1,5 @@
+---
+'svelte-ux': minor
+---
+
+Add support for passing `class` and `classes` props to the DateField component
diff --git a/.changeset/six-drinks-smash.md b/.changeset/six-drinks-smash.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+Fix overriding `elevation-#` classes. Add `elevation-none` to remove `elevation-#`
diff --git a/.changeset/sixty-walls-rest.md b/.changeset/sixty-walls-rest.md
@@ -0,0 +1,6 @@
+---
+"svelte-ux": minor
+---
+
+- Add locale settings to settings object, and allow dynamically changing the current locale.
+- Move format function to be a store on the settings object, which updates when the locale changes.
diff --git a/.changeset/sour-cougars-beg.md b/.changeset/sour-cougars-beg.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": minor
+---
+
+Change PeriodType values (0 = unqualified DoW, 1-7 = Sun-Sat)
diff --git a/.changeset/spicy-toys-hug.md b/.changeset/spicy-toys-hug.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[Appbar] Add `menuIcon` prop and slot
diff --git a/.changeset/strong-flies-provide.md b/.changeset/strong-flies-provide.md
@@ -0,0 +1,5 @@
+---
+'svelte-ux': minor
+---
+
+Support `ux.themes` tailwind config, including Daisy UI
diff --git a/.changeset/tidy-gifts-yawn.md b/.changeset/tidy-gifts-yawn.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+[Popover|Menu|popover] Support `resize` width or height only
diff --git a/.changeset/wicked-melons-fold.md b/.changeset/wicked-melons-fold.md
@@ -0,0 +1,5 @@
+---
+"svelte-ux": patch
+---
+
+Add `ThemeSwitch` component to toggle between light/dark theme
diff --git a/.changeset/yellow-nails-vanish.md b/.changeset/yellow-nails-vanish.md
@@ -0,0 +1,5 @@
+---
+'svelte-ux': minor
+---
+
+Rename `cssVars` action to `styleVars` and do not prefix properties with `--` by default (more flexible)
diff --git a/.changeset/yellow-oranges-fly.md b/.changeset/yellow-oranges-fly.md
@@ -0,0 +1,6 @@
+---
+'create-svelte-ux': minor
+'svelte-ux': minor
+---
+
+Theme support
diff --git a/.gitignore b/.gitignore
@@ -6,5 +6,6 @@ coverage/
 .idea/
 .svelte-kit/
 .env
+.DS_Store
 
 test-*
diff --git a/.prettierrc b/.prettierrc
@@ -1,5 +1,14 @@
 {
   "singleQuote": true,
   "printWidth": 100,
-  "trailingComma": "es5"
+  "trailingComma": "es5",
+  "plugins": ["prettier-plugin-svelte"],
+  "overrides": [
+    {
+      "files": "*.svelte",
+      "options": {
+        "parser": "svelte"
+      }
+    }
+  ]
 }
diff --git a/README.md b/README.md
@@ -6,7 +6,7 @@
 ![](https://img.shields.io/github/license/techniq/svelte-ux?style=flat)
 [![](https://img.shields.io/github/actions/workflow/status/techniq/svelte-ux/ci.yml?style=flat)](https://github.com/techniq/svelte-ux/actions/workflows/ci.yml)
 [![](https://img.shields.io/npm/v/svelte-ux?style=flat)](https://www.npmjs.com/package/svelte-ux)
-![npm](https://img.shields.io/npm/dw/svelte-ux?style=flat&color=orange)
+[![](https://img.shields.io/npm/dw/svelte-ux?style=flat&color=orange)](https://www.npmjs.com/package/svelte-ux)
 
 [![](https://img.shields.io/badge/Open_in-SvelteLab-black?logo=svelte&color=%23FF3E00)](https://www.sveltelab.dev/?provider=github&owner=techniq&repo=svelte-ux&branch=main&path=%2Fpackages%2Fcreate-svelte-ux%2Ftemplates%2Fstarter) [![](https://img.shields.io/badge/Open_in-StackBlitz-black?logo=stackblitz&color=%231269D3)](https://stackblitz.com/github/techniq/svelte-ux/tree/main/packages/create-svelte-ux/templates/starter) [![](https://img.shields.io/badge/Open_in-CodeSandbox-black?logo=codesandbox&color=%23151515)](https://codesandbox.io/p/sandbox/github/techniq/svelte-ux/tree/main/packages/create-svelte-ux/templates/starter)
 

diff --git a/packages/create-svelte-ux/CHANGELOG.md b/packages/create-svelte-ux/CHANGELOG.md
@@ -1,5 +1,11 @@
 # create-svelte-ux
 
+## 0.3.0-next.0
+
+### Minor Changes
+
+- Theme support ([#146](https://github.com/techniq/svelte-ux/pull/146))
+
 ## 0.2.1
 
 ### Patch Changes

diff --git a/packages/create-svelte-ux/package.json b/packages/create-svelte-ux/package.json
@@ -1,6 +1,6 @@
 {
   "name": "create-svelte-ux",
-  "version": "0.2.1",
+  "version": "0.3.0-next.0",
   "description": "A CLI for creating new Svelte UX projects",
   "repository": {
     "type": "git",
@@ -18,12 +18,12 @@
   },
   "dependencies": {
     "@clack/prompts": "^0.7.0",
-    "@kitql/helpers": "^0.8.3",
+    "@kitql/helpers": "^0.8.8",
     "commander": "^11.1.0"
   },
   "devDependencies": {
-    "@types/node": "^20.9.2",
-    "prettier": "^3.1.0"
+    "@types/node": "^20.11.2",
+    "prettier": "^3.2.2"
   },
   "files": [
     "fragments",

diff --git a/packages/create-svelte-ux/templates/layerchart/package.json b/packages/create-svelte-ux/templates/layerchart/package.json
@@ -41,6 +41,6 @@
 	},
 	"dependencies": {
 		"dotenv": "16.3.1",
-		"layerchart": "^0.27.0"
+		"layerchart": "latest"
 	}
 }
diff --git a/packages/create-svelte-ux/templates/layerchart/src/routes/+layout.svelte b/packages/create-svelte-ux/templates/layerchart/src/routes/+layout.svelte
@@ -5,8 +5,8 @@
 	import '../app.postcss';
 
 	settings({
-		theme:{
-			AppBar: 'bg-accent-500 text-white shadow-md',
+		classes: {
+			AppBar: 'bg-primary text-white shadow-md',
 			AppLayout: {
 				nav: 'bg-neutral-800'
 			},

diff --git a/packages/create-svelte-ux/templates/layerchart/src/routes/+page.svelte b/packages/create-svelte-ux/templates/layerchart/src/routes/+page.svelte
@@ -9,15 +9,15 @@
 			href="https://svelte-ux.techniq.dev"
 			target="_blank"
 			variant="fill-light"
-			color="accent"
+			color="primary"
 		>
 			Documentation
 		</Button>
 		<Button
 			href="https://svelte-ux.techniq.dev/customization"
 			target="_blank"
 			variant="fill-light"
-			color="accent"
+			color="primary"
 		>
 			Customization
 		</Button>

diff --git a/packages/create-svelte-ux/templates/layerchart/src/routes/chart/+page.svelte b/packages/create-svelte-ux/templates/layerchart/src/routes/chart/+page.svelte
@@ -22,7 +22,7 @@
 			<Svg>
 				<Axis placement="left" grid rule />
 				<Axis placement="bottom" format={(d) => format(d, PeriodType.Day, 'short')} rule />
-				<Area line={{ class: 'stroke-2 stroke-accent-500' }} class="fill-accent-500/30" />
+				<Area line={{ class: 'stroke-2 stroke-primary' }} class="fill-primary/30" />
 				<Highlight points lines />
 			</Svg>
 

diff --git a/packages/create-svelte-ux/templates/layerchart/tailwind.config.cjs b/packages/create-svelte-ux/templates/layerchart/tailwind.config.cjs
@@ -9,11 +9,7 @@ const config = {
 		'./node_modules/layerchart/**/*.{svelte,js}'
 	],
 	theme: {
-		extend: {
-			colors: {
-				accent: colors.blue
-			}
-		}
+		extend: {}
 	},
 	variants: {
 		extend: {}

diff --git a/packages/create-svelte-ux/templates/minimal/tailwind.config.cjs b/packages/create-svelte-ux/templates/minimal/tailwind.config.cjs
@@ -5,11 +5,7 @@ const svelte_ux = require('svelte-ux/plugins/tailwind.cjs');
 const config = {
 	content: ['./src/**/*.{html,svelte}', './node_modules/svelte-ux/**/*.{svelte,js}'],
 	theme: {
-		extend: {
-			colors: {
-				accent: colors.blue
-			}
-		}
+		extend: {}
 	},
 	variants: {
 		extend: {}
-Original file line number
+Diff line change
@@ Expand Up / @@ -6,5 +6,6 @@ coverage/ @@
     .idea/
     .svelte-kit/
     .env
+    .DS_Store
     test-*