@sjsf-lab/beercss-theme - npm Package Compare versions

Comparing version 3.2.2 to 3.3.0

dist/extra-widgets/checkboxes.svelte

@@ -20,11 +20,10 @@ <script lang="ts" module>
 		value = $bindable(),
-		options
+		options,
+		mapped = multipleOptions({
+			mapper: () => idMapper(options),
+			value: () => value,
+			update: (v) => (value = v)
+		})
 	}: ComponentProps['checkboxesWidget'] = $props();
 
-	const mapped = multipleOptions({
-		mapper: () => idMapper(options),
-		value: () => value,
-		update: (v) => (value = v)
-	});
-
 	const ctx = getFormContext();
@@ -43,3 +42,3 @@
 				bind:group={mapped.current}
-				value={option.id}
+				value={option.mappedValue ?? option.id}
 				id={option.id}
@@ -46,0 +45,0 @@ disabled={option.disabled || attributes.disabled}

dist/extra-widgets/checkboxes.svelte.d.ts

@@ -8,4 +8,4 @@ import type { HTMLAttributes } from 'svelte/elements';
 import '@sjsf/basic-theme/extra-widgets/checkboxes.svelte';
-declare const Checkboxes: import("svelte").Component<import("@sjsf/form/fields/widgets").WidgetCommonProps<import("@sjsf/form/core").SchemaArrayValue> & import("@sjsf/form/fields/widgets").Options, {}, "value">;
+declare const Checkboxes: import("svelte").Component<import("@sjsf/form/fields/widgets").WidgetCommonProps<import("@sjsf/form/core").SchemaArrayValue> & import("@sjsf/form/fields/widgets").MultiSelectOptions, {}, "value">;
 type Checkboxes = ReturnType<typeof Checkboxes>;
 export default Checkboxes;

dist/extra-widgets/radio.svelte

@@ -16,10 +16,14 @@ <script lang="ts" module>
 
-	let { config, handlers, value = $bindable(), options }: ComponentProps['radioWidget'] = $props();
+	let {
+		config,
+		handlers,
+		value = $bindable(),
+		options,
+		mapped = singleOption({
+			mapper: () => idMapper(options),
+			value: () => value,
+			update: (v) => (value = v)
+		})
+	}: ComponentProps['radioWidget'] = $props();
 
-	const mapped = singleOption({
-		mapper: () => idMapper(options),
-		value: () => value,
-		update: (v) => (value = v)
-	});
-
 	const ctx = getFormContext();
@@ -36,3 +40,3 @@
 				bind:group={mapped.current}
-				value={option.id}
+				value={option.mappedValue ?? option.id}
 				id={option.id}
@@ -39,0 +43,0 @@ disabled={option.disabled || attributes.disabled}

dist/extra-widgets/radio.svelte.d.ts

@@ -8,4 +8,4 @@ import type { HTMLAttributes } from 'svelte/elements';
 import '@sjsf/basic-theme/extra-widgets/radio.svelte';
-declare const Radio: import("svelte").Component<import("@sjsf/form/fields/widgets").WidgetCommonProps<import("@sjsf/form").SchemaValue> & import("@sjsf/form/fields/widgets").Options, {}, "value">;
+declare const Radio: import("svelte").Component<import("@sjsf/form/fields/widgets").WidgetCommonProps<import("@sjsf/form").SchemaValue> & import("@sjsf/form/fields/widgets").SingleSelectOptions, {}, "value">;
 type Radio = ReturnType<typeof Radio>;
 export default Radio;

dist/widgets/select.svelte

 <script lang="ts">
 	import { getFormContext, selectAttributes, type ComponentProps } from '@sjsf/form';
-	import { singleOption, idMapper, UNDEFINED_ID } from '@sjsf/form/options.svelte';
+	import { singleOption, idMapper, EMPTY_VALUE } from '@sjsf/form/options.svelte';
 	import '@sjsf/basic-theme/widgets/select.svelte';
 
-	let { value = $bindable(), options, config, handlers }: ComponentProps['selectWidget'] = $props();
+	let {
+		value = $bindable(),
+		options,
+		config,
+		handlers,
+		mapped = singleOption({
+			mapper: () => idMapper(options),
+			value: () => value,
+			update: (v) => (value = v)
+		}),
+		clearable = config.schema.default === undefined
+	}: ComponentProps['selectWidget'] = $props();
 
-	const mapped = singleOption({
-		mapper: () => idMapper(options),
-		value: () => value,
-		update: (v) => (value = v)
-	});
-
 	const ctx = getFormContext();
@@ -20,7 +25,7 @@
 <select {...attributes} bind:value={mapped.current}>
-	{#if config.schema.default === undefined}
-		<option value={UNDEFINED_ID}>{attributes.placeholder}</option>
+	{#if clearable}
+		<option value={EMPTY_VALUE}>{attributes.placeholder}</option>
 	{/if}
 	{#each options as option (option.id)}
-		<option value={option.id} disabled={option.disabled}>
+		<option value={option.mappedValue ?? option.id} disabled={option.disabled}>
 			{option.label}
@@ -27,0 +32,0 @@ </option>

dist/widgets/select.svelte.d.ts

 import '@sjsf/basic-theme/widgets/select.svelte';
-declare const Select: import("svelte").Component<import("@sjsf/form/fields/widgets").WidgetCommonProps<import("@sjsf/form").SchemaValue> & import("@sjsf/form/fields/widgets").Options, {}, "value">;
+declare const Select: import("svelte").Component<import("@sjsf/form/fields/widgets").WidgetCommonProps<import("@sjsf/form").SchemaValue> & import("@sjsf/form/fields/widgets").SingleSelectOptions, {}, "value">;
 type Select = ReturnType<typeof Select>;
 export default Select;

package.json

 {
   "name": "@sjsf-lab/beercss-theme",
-  "version": "3.2.2",
+  "version": "3.3.0",
   "description": "The Beer CSS v3 based theme for svelte-jsonschema-form",
@@ -28,2 +28,3 @@ "license": "MIT",
   "exports": {
+    "./package.json": "./package.json",
     "./components/*": {
@@ -51,6 +52,6 @@ "types": "./dist/components/*.d.ts",
   "dependencies": {
-    "@sjsf/basic-theme": "^3.2.2"
+    "@sjsf/basic-theme": "^3.5.0"
   },
   "peerDependencies": {
-    "@sjsf/form": "^3.2.2",
+    "@sjsf/form": "^3.5.0",
     "beercss": "^3.13.0 || ^4.0.0",
@@ -60,10 +61,10 @@ "svelte": "^5.34.8"
   "devDependencies": {
-    "@tailwindcss/vite": "^4.1.18",
-    "ajv": "^8.17.1",
-    "beercss": "^4.0.7",
-    "globals": "17.3.0",
-    "svelte": "^5.51.0",
-    "@sjsf/ajv8-validator": "3.2.2",
-    "@sjsf/form": "3.2.2",
-    "theme-testing": "1.0.21"
+    "@tailwindcss/vite": "^4.2.2",
+    "ajv": "^8.18.0",
+    "beercss": "^4.0.20",
+    "globals": "17.4.0",
+    "svelte": "^5.55.1",
+    "@sjsf/ajv8-validator": "3.5.0",
+    "@sjsf/form": "3.5.0",
+    "theme-testing": "1.0.26"
   },
@@ -70,0 +71,0 @@ "svelte": "./dist/index.js",

No alert changes

Improved metrics

Total package byte prevSize

33047

0.54%

Dependency changes

• Updated

  @sjsf/basic-theme@^3.5.0