Docs: Export buttton only writes the explicit settings, and converts to selected color space

[dimfeld]

Resolves #318

I also added a "Copy Full Theme" menu item which retains the old behavior. Seems like it's kind of inconsistent though... when you start from a Skeleton theme then you seem to get the full exported theme, but when you start from a Daisy theme then the export is much shorter. I figure you will have a good idea of why that is :) Or maybe the skeleton themes are just including a whole bunch of variables that aren't used? Not totally sure. We may want to just remove this button.

This also changes the list of ColorFields to be data-driven since I was already creating an array of theme keys anyway as part of this.

[changeset-bot]

⚠️ No Changeset found

Latest commit: 8396f06

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
svelte-ux	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Apr 1, 2024 4:13am

[techniq]

I was passing any unmapped property from Daisy/Skeleton in case there was something you might still want applied (font-face, border radius, etc). I later decided this isn't great, but haven't had a chance to clean this up. In that same work, I plan to rounded-base and rounded-container and map those from Daisy/Skeleton. Currently being tracked in #250, but I needed to think through where I wanted to use base (field, button, etc) vs container (card, ...).

I don't have much time right now, but I noticed with the new copy it does not include "color-scheme": "dark". I can't remember if I handle "dark" theme special or if this is still required.

Before

{
  "light": {
    "color-scheme": "light",
    "primary": "oklch(49.12% 0.3096 275.75)",
    "secondary": "oklch(69.71% 0.329 342.55)",
    "secondary-content": "oklch(98.71% 0.0106 342.55)",
    "accent": "oklch(76.76% 0.184 183.61)",
    "neutral": "#2B3440",
    "neutral-content": "#D7DDE4",
    "surface-100": "oklch(100% 0 0)",
    "surface-200": "#F2F2F2",
    "surface-300": "#E5E6E6",
    "surface-content": "#1f2937"
  },
  "dark": {
    "color-scheme": "dark",
    "primary": "oklch(65.69% 0.196 275.75)",
    "secondary": "oklch(74.8% 0.26 342.55)",
    "accent": "oklch(74.51% 0.167 183.61)",
    "neutral": "#2a323c",
    "neutral-content": "#A6ADBB",
    "surface-100": "#1d232a",
    "surface-200": "#191e24",
    "surface-300": "#15191e",
    "surface-content": "#A6ADBB"
  }
}

After

{
  "light": {
    "primary": "hsl(257.4075 100% 50%)",
    "secondary": "hsl(310.4453 100% 50%)",
    "accent": "hsl(173.4835 100% 42.1865%)",
    "neutral": "hsl(214.2857 19.6262% 20.9804%)",
    "surface-100": "hsl(180 100% 100%)",
    "surface-200": "hsl(0 0% 94.902%)",
    "surface-300": "hsl(180 1.9608% 90%)"
  },
  "dark": {
    "primary": "hsl(234.8208 100% 72.6713%)",
    "secondary": "hsl(313.3209 100% 66.1653%)",
    "accent": "hsl(173.7346 100% 40.1728%)",
    "neutral": "hsl(213.3333 17.6471% 20%)",
    "surface-100": "hsl(212.3077 18.3099% 13.9216%)",
    "surface-200": "hsl(212.7273 18.0328% 11.9608%)",
    "surface-300": "hsl(213.3333 17.6471% 10%)"
  }
}

[techniq]

Actually I just looked in my Strava / Github analysis projects and we don't have to be explicit for dark anymore (just for additional dark themes) so we should be good.

[dimfeld]

Added color-scheme back

[techniq]

Thanks @dimfeld. I'll probably remove "Copy Full Theme" in the future once border radius theming is implemented as I can't think of a good reason to keep it (and reduce confusion)