@sjsf/basic-theme - npm Package Compare versions

Comparing version 2.0.0-next.6 to 2.0.0-next.7

dist/components/label.svelte

+<script lang="ts" module>
+  import type { HTMLLabelAttributes } from "svelte/elements";
+
+  declare module "@sjsf/form" {
+    interface UiOptions {
+      /**
+       * Overrides the attributes of the field label.
+       */
+      labelAttributes?: HTMLLabelAttributes;
+    }
+  }
+</script>
+
+<script lang="ts">
+  import type { ComponentProps } from "@sjsf/form";
+
+  const { title, config }: ComponentProps["label"] = $props();
+</script>
+
+<label
+  style="font-weight: bold;"
+  for={config.id}
+  {...config.uiOptions?.labelAttributes}
+>
+  {title}
+  {#if config.required}
+    <span>*</span>
+  {/if}
+</label>

dist/components/label.svelte.d.ts

+import type { HTMLLabelAttributes } from "svelte/elements";
+declare module "@sjsf/form" {
+    interface UiOptions {
+        /**
+         * Overrides the attributes of the field label.
+         */
+        labelAttributes?: HTMLLabelAttributes;
+    }
+}
+declare const Label: import("svelte").Component<import("@sjsf/form/fields/components").ComponentCommonProps & {
+    title: string;
+}, {}, "">;
+type Label = ReturnType<typeof Label>;
+export default Label;

dist/components/errors-list.svelte

@@ -17,3 +17,3 @@ <script lang="ts" module>
 
-  const { errors, forId, config }: ComponentProps["errorsList"] = $props();
+  const { errors, config }: ComponentProps["errorsList"] = $props();
 </script>
@@ -23,3 +23,3 @@
   style="color: red;"
-  data-errors-for={forId}
+  data-errors-for={config.id}
   {...config.uiOptions?.errorsList}
@@ -26,0 +26,0 @@ >

dist/components/errors-list.svelte.d.ts

@@ -10,6 +10,4 @@ import type { HTMLAttributes } from "svelte/elements";
 }
-declare const ErrorsList: import("svelte").Component<import("@sjsf/form/fields/components").ComponentCommonProps & {
-    forId: string;
-}, {}, "">;
+declare const ErrorsList: import("svelte").Component<import("@sjsf/form/fields/components").ComponentCommonProps, {}, "">;
 type ErrorsList = ReturnType<typeof ErrorsList>;
 export default ErrorsList;

dist/components/exports.d.ts

@@ -6,4 +6,5 @@ export { default as form } from "./form.svelte";
 export { default as title } from "./title.svelte";
+export { default as label } from "./label.svelte";
 export { default as description } from "./description.svelte";
 export { default as help } from "./help.svelte";
 export { default as errorsList } from "./errors-list.svelte";

dist/components/exports.js

@@ -6,4 +6,5 @@ export { default as form } from "./form.svelte";
 export { default as title } from "./title.svelte";
+export { default as label } from "./label.svelte";
 export { default as description } from "./description.svelte";
 export { default as help } from "./help.svelte";
 export { default as errorsList } from "./errors-list.svelte";

dist/components/title.svelte

 <script lang="ts" module>
-  import type { HTMLAttributes, HTMLLabelAttributes } from "svelte/elements";
+  import type { HTMLAttributes } from "svelte/elements";
 
@@ -7,8 +7,4 @@ declare module "@sjsf/form" {
       /**
-       * Overrides the attributes of the field title.
+       * Overrides the attributes of the field title
        */
-      labelAttributes?: HTMLLabelAttributes;
-      /**
-       * Overrides the attributes if the section title
-       */
       titleAttributes?: HTMLAttributes<HTMLDivElement>;
@@ -22,24 +18,10 @@ }
 
-  const { title, type, forId, required, config }: ComponentProps["title"] =
-    $props();
+  const { title, config, type }: ComponentProps["title"] = $props();
 </script>
 
-{#if type === "field"}
-  <label
-    style="font-weight: bold;"
-    for={forId}
-    {...config.uiOptions?.labelAttributes}
-  >
-    {title}
-    {#if required}
-      <span>*</span>
-    {/if}
-  </label>
-{:else}
-  <div
-    style="font-weight: bold; font-size: larger;"
-    {...config.uiOptions?.titleAttributes}
-  >
-    {title}
-  </div>
-{/if}
+<div
+  style="font-weight: bold; font-size: {type === 'field' ? 'unset' : 'larger'};"
+  {...config.uiOptions?.titleAttributes}
+>
+  {title}
+</div>

dist/components/title.svelte.d.ts

@@ -1,11 +0,7 @@
-import type { HTMLAttributes, HTMLLabelAttributes } from "svelte/elements";
+import type { HTMLAttributes } from "svelte/elements";
 declare module "@sjsf/form" {
     interface UiOptions {
         /**
-         * Overrides the attributes of the field title.
+         * Overrides the attributes of the field title
          */
-        labelAttributes?: HTMLLabelAttributes;
-        /**
-         * Overrides the attributes if the section title
-         */
         titleAttributes?: HTMLAttributes<HTMLDivElement>;
@@ -17,6 +13,4 @@ }
     title: string;
-    forId: string;
-    required: boolean;
 }, {}, "">;
 type Title = ReturnType<typeof Title>;
 export default Title;

dist/index.d.ts

@@ -1,1 +0,1 @@
-export declare const theme: import("@sjsf/form/lib/resolver").Resolver<import("@sjsf/form/lib/resolver").Chain<Record<"stringField" | "numberField" | "integerField" | "booleanField" | "objectField" | "arrayField" | "tupleField" | "nullField" | "oneOfField" | "anyOfField" | "arrayItemField" | "objectPropertyField" | keyof import("@sjsf/form/fields/resolver/definitions").ExtraFields, any>, Record<"form" | "button" | "submitButton" | "fieldTemplate" | "objectTemplate" | "objectPropertyTemplate" | "arrayTemplate" | "arrayItemTemplate" | "multiFieldTemplate" | "layout" | "textWidget" | "numberWidget" | "selectWidget" | "checkboxWidget" | "title" | "description" | "help" | "errorsList" | keyof import("./definitions.js").ExtraWidgets, any>>, import("@sjsf/form/lib/resolver").Chain<typeof import("@sjsf/form/fields/exports") & Pick<import("@sjsf/form").ComponentDefinitions, keyof import("@sjsf/form/fields/resolver/definitions").ExtraFields>, typeof import("@sjsf/form/templates/exports") & typeof import("./components/exports.js") & typeof import("./widgets/exports.js") & Pick<import("@sjsf/form").ComponentDefinitions, keyof import("./definitions.js").ExtraWidgets>>>;
+export declare const theme: import("@sjsf/form/lib/resolver").Resolver<import("@sjsf/form/lib/resolver").Chain<Record<"stringField" | "numberField" | "integerField" | "booleanField" | "objectField" | "arrayField" | "tupleField" | "nullField" | "oneOfField" | "anyOfField" | "arrayItemField" | "objectPropertyField" | keyof import("@sjsf/form/fields/resolver/definitions").ExtraFields, any>, Record<"form" | "button" | "submitButton" | "fieldTemplate" | "objectTemplate" | "objectPropertyTemplate" | "arrayTemplate" | "arrayItemTemplate" | "multiFieldTemplate" | "layout" | "textWidget" | "numberWidget" | "selectWidget" | "checkboxWidget" | "title" | "label" | "description" | "help" | "errorsList" | keyof import("./definitions.js").ExtraWidgets, any>>, import("@sjsf/form/lib/resolver").Chain<typeof import("@sjsf/form/fields/exports") & Pick<import("@sjsf/form").ComponentDefinitions, keyof import("@sjsf/form/fields/resolver/definitions").ExtraFields>, typeof import("@sjsf/form/templates/exports") & typeof import("./components/exports.js") & typeof import("./widgets/exports.js") & Pick<import("@sjsf/form").ComponentDefinitions, keyof import("./definitions.js").ExtraWidgets>>>;

dist/specs.js

@@ -10,6 +10,15 @@ import { s } from "testing/demo";
 export const specs = {
-    radio: [s.enumeration, { "ui:components": { selectWidget: "radioWidget" } }],
+    radio: [
+        s.enumeration,
+        {
+            "ui:components": { selectWidget: "radioWidget" },
+            "ui:options": { useLabel: false },
+        },
+    ],
     multiSelect: [
         s.uniqueArray,
-        { "ui:components": { checkboxesWidget: "multiSelectWidget" } },
+        {
+            "ui:components": { checkboxesWidget: "multiSelectWidget" },
+            "ui:options": { useLabel: true },
+        },
     ],
@@ -16,0 +25,0 @@ textarea: [s.text, { "ui:components": { textWidget: "textareaWidget" } }],

package.json

 {
   "name": "@sjsf/basic-theme",
-  "version": "2.0.0-next.6",
+  "version": "2.0.0-next.7",
   "description": "Basic theme for svelte-jsonschema-form",
@@ -29,3 +29,3 @@ "license": "MIT",
     "svelte": "^5.25.0",
-    "@sjsf/form": "^2.0.0-next.6"
+    "@sjsf/form": "^2.0.0-next.7"
   },
@@ -36,8 +36,8 @@ "devDependencies": {
     "@tsconfig/svelte": "^5.0.4",
-    "svelte": "^5.25.3",
+    "svelte": "^5.25.6",
     "svelte-check": "^4.1.5",
     "vite": "6.2.2",
     "vitest": "3.0.9",
-    "@sjsf/form": "2.0.0-next.6",
-    "testing": "0.1.0-next.6"
+    "@sjsf/form": "2.0.0-next.7",
+    "testing": "0.1.0-next.7"
   },
@@ -44,0 +44,0 @@ "types": "./dist/index.d.ts",

No alert changes

Improved metrics

Total package byte prevSize

38786

1.97%

Number of package files

72

2.86%

Lines of code

438

4.04%

No dependency changes