Pass object of classes through Select-like fields to Field instances

[brandonmcconnell]

This PR does a few things

• adds a function normalizeClasses to normalize classes when they can be a string or an object, essentially converting strings to objects (e.g. 'p-2' ➞ { root: 'p-2' })

  Before
  <Component classes={typeof className === 'string' ? { root: className } : className} />
  After
  <Component classes={normalizeClasses(className)} />

• adds a function clsMerge for merging groups of classes without property-by-property consolidation

  Before
  <Component classes={{ root: cls(settingsClasses.root, 'grid', classes.root), field: cls(settingsClasses.field, 'flex', classes.field) }} />
  After
  <Component classes={clsMerge(settingsClasses, { root: 'grid', field: 'flex' }, classes)} />

• passes the classes objects down to the TextField component from the Select and MultiSelect components

• fixes a TypeError caused by a faulty ReturnType from entries() and removes a related @ts-expect-error

[changeset-bot]

🦋 Changeset detected

Latest commit: 90f9c8f

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
svelte-ux	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another 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	Jul 2, 2024 6:03pm

[techniq]

Related (just tagging)

• Analyze all component class / classes handling #245
• Fix SelectField MenuOption icons and non-collapsing toggle button. #155

[techniq]

Thanks @brandonmcconnell. I couldn't spot any regressions. I know in #155 and #245 there was some difficulty, but I think this approach handles it. If you get a minute, could you read through those and see if there is something I'm overlooking. I'm going to go ahead and merge and release as I couldn't spot any regressions. Thanks!

[techniq]

@brandonmcconnell Actually, the classes order should be (see docs):

• Base component classes
• Variant specific classes
• settings() classes (context)
• classes prop
• class prop

Is there a reason you changed the order here?

https://github.com/techniq/svelte-ux/pull/419/files#diff-1a2b7f4ea38036f799f83b1e1c468169f4eaf5568691973cb9c006c3995c2c2eR157-R161

[brandonmcconnell]

@techniq Ah, I mistakenly thought that the h-full was meant to override settings, but understanding that the settings are user-set, I can see that was a regression. Quick OR patching this incoming.

[brandonmcconnell]

PR opened: #421