@sveltia/ui 0.2.4 → 0.2.5

package/package/components/core/{radio-button.svelte → radio.svelte}

@@ -1,7 +1,7 @@
 <!--
   @component
   @see https://w3c.github.io/aria/#radio
-  @see https://w3c.github.io/aria-practices/#radiobutton
+  @see https://www.w3.org/WAI/ARIA/apg/patterns/radio/
 -->
 <script>
   import { getRandomId } from '../helpers/util';
@@ -19,12 +19,18 @@
   /** @type {string} */
   export let name = '';
 
+  /** @type {string?} */
+  export let label = undefined;
+
   /** @type {string?} */
   export let value = undefined;
 
   /** @type {boolean} */
   export let selected = false;
 
+  /** @type {boolean} */
+  export let disabled = false;
+
   const id = getRandomId('checkbox');
   /** @type {Button} */
   let buttonComponent;
@@ -36,7 +42,7 @@
 
 <!-- svelte-ignore a11y-click-events-have-key-events -->
 <span
-  class="sui radio-button {className}"
+  class="sui radio {className}"
   on:click={(event) => {
     if (!(/** @type {HTMLElement} */ (event.target).matches('button'))) {
       buttonComponent.element.click();
@@ -45,23 +51,32 @@
 >
   <Button
     {id}
+    {disabled}
+    {name}
+    {value}
     role="radio"
     aria-checked={selected}
     aria-labelledby="{id}-label"
     bind:this={buttonComponent}
     on:click={(event) => {
       event.preventDefault();
-      selected = !selected;
+      selected = true;
     }}
   >
     <Icon slot="start-icon" name="circle" />
   </Button>
-  <label id="{id}-label">
-    <slot />
-  </label>
+  {#if $$slots.default || label}
+    <label id="{id}-label">
+      {#if $$slots.default}
+        <slot />
+      {:else}
+        {label}
+      {/if}
+    </label>
+  {/if}
 </span>
 
-<style>.radio-button {
+<style>.radio {
   display: inline-flex;
   align-items: center;
   gap: 8px;
@@ -70,24 +85,34 @@
   -webkit-user-select: none;
   user-select: none;
 }
-.radio-button :global(button) {
+.radio.disabled {
+  cursor: default;
+}
+.radio.disabled label {
+  color: var(--disabled-foreground-color);
+}
+.radio :global(button) {
   justify-content: center;
   overflow: hidden;
   border-width: 2px;
-  border-color: var(--control-border-color);
+  border-color: var(--primary-control-border-color);
   border-radius: 24px;
-  width: 24px;
-  height: 24px;
+  width: 20px;
+  height: 20px;
   color: var(--primary-accent-color-lighter);
   transition: all 200ms;
 }
-.radio-button :global(button) :global(.icon) {
-  font-size: var(--font-size--large);
+.radio :global(button) :global(.icon) {
+  font-size: 14px;
   font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 48;
 }
-.radio-button :global(button[aria-checked="true"]) {
+.radio :global(button[aria-checked="true"]) {
+  border-color: var(--primary-accent-color-lighter);
   color: var(--primary-accent-color-lighter);
 }
-.radio-button :global(button[aria-checked="false"]) {
+.radio :global(button[aria-checked="false"]) {
   color: transparent;
+}
+.radio label {
+  cursor: inherit;
 }</style>

package/package/components/core/radio.svelte.d.ts

@@ -0,0 +1,41 @@
+/** @typedef {typeof __propDef.props}  RadioProps */
+/** @typedef {typeof __propDef.events}  RadioEvents */
+/** @typedef {typeof __propDef.slots}  RadioSlots */
+/**
+ * @see https://w3c.github.io/aria/#radio
+ * @see https://www.w3.org/WAI/ARIA/apg/patterns/radio/
+ */
+export default class Radio extends SvelteComponentTyped<{
+    label?: string;
+    class?: string;
+    disabled?: boolean;
+    name?: string;
+    value?: string;
+    selected?: boolean;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}> {
+}
+export type RadioProps = typeof __propDef.props;
+export type RadioEvents = typeof __propDef.events;
+export type RadioSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        label?: string | null;
+        class?: string;
+        disabled?: boolean;
+        name?: string;
+        value?: string | null;
+        selected?: boolean;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export {};

package/package/components/core/select-button.svelte

@@ -1,8 +1,8 @@
 <!--
   @component
-  A variant of `<RadioButton>`, looking like a normal button.
+  A variant of `<Radio>`, looking like a normal button.
   @see https://w3c.github.io/aria/#radio
-  @see https://w3c.github.io/aria-practices/#radiobutton
+  @see https://www.w3.org/WAI/ARIA/apg/patterns/radio/
 -->
 <script>
   import Button from './button.svelte';

package/package/components/core/select-button.svelte.d.ts

@@ -2,9 +2,9 @@
 /** @typedef {typeof __propDef.events}  SelectButtonEvents */
 /** @typedef {typeof __propDef.slots}  SelectButtonSlots */
 /**
- * A variant of `<RadioButton>`, looking like a normal button.
+ * A variant of `<Radio>`, looking like a normal button.
  * @see https://w3c.github.io/aria/#radio
- * @see https://w3c.github.io/aria-practices/#radiobutton
+ * @see https://www.w3.org/WAI/ARIA/apg/patterns/radio/
  */
 export default class SelectButton extends SvelteComponentTyped<{
     [x: string]: any;

package/package/components/core/slider.svelte

@@ -62,14 +62,10 @@
         return;
       }
 
-      sliderPositions[targetValueIndex] = positionList[index];
-
       if (multiThumb) {
         values[targetValueIndex] = valueList[index];
-        dispatch('change', { values });
       } else {
         value = valueList[index];
-        dispatch('change', { value });
       }
     }
   };
@@ -115,14 +111,10 @@
         return;
       }
 
-      sliderPositions[valueIndex] = positionList[index];
-
       if (multiThumb) {
         values[valueIndex] = valueList[index];
-        dispatch('change', { values });
       } else {
         value = valueList[index];
-        dispatch('change', { value });
       }
     }
   };
@@ -151,6 +143,15 @@
     }
   };
 
+  /**
+   *
+   */
+  const onMouseUp = () => {
+    if (dragging) {
+      dragging = false;
+    }
+  };
+
   /**
    *
    * @param {MouseEvent} event `click` event.
@@ -165,6 +166,20 @@
     }
   };
 
+  /**
+   *
+   */
+  const onValueChange = () => {
+    if (multiThumb) {
+      sliderPositions[0] = positionList[valueList.indexOf(values[0])];
+      sliderPositions[1] = positionList[valueList.indexOf(values[1])];
+      dispatch('change', { values });
+    } else {
+      sliderPositions[0] = positionList[valueList.indexOf(value)];
+      dispatch('change', { value });
+    }
+  };
+
   onMount(() => {
     barWidth = base.clientWidth;
 
@@ -174,17 +189,16 @@
     valueList = new Array(stepCount).fill(0).map((_, index) => index * step + min, 10);
     positionList = new Array(stepCount).fill(0).map((_, index) => index * stepWidth);
 
-    if (multiThumb) {
-      sliderPositions[0] = positionList[valueList.indexOf(values[0])];
-      sliderPositions[1] = positionList[valueList.indexOf(values[1])];
-    } else {
-      sliderPositions[0] = positionList[valueList.indexOf(value)];
-    }
+    onValueChange();
   });
+
+  // @ts-ignore Arguments are triggers
+  $: onValueChange(value, values);
 </script>
 
 <svelte:body
   on:mousemove={onMouseMove}
+  on:mouseup={onMouseUp}
   on:click={() => {
     dragging = false;
   }}
@@ -262,7 +276,7 @@
   width: var(--slider-base-width, 200px);
   height: 8px;
   border-radius: 8px;
-  background-color: var(--control-border-color);
+  background-color: var(--secondary-control-border-color);
 }
 
 .bar {

package/package/components/core/switch.svelte

@@ -1,7 +1,7 @@
 <!--
   @component
   @see https://w3c.github.io/aria/#switch
-  @see https://w3c.github.io/aria-practices/#switch
+  @see https://www.w3.org/WAI/ARIA/apg/patterns/switch/
 -->
 <script>
   /**
@@ -69,7 +69,7 @@ span {
   padding: 2px;
   display: inline-block;
   border-radius: 16px;
-  background-color: var(--control-border-color);
+  background-color: var(--secondary-control-border-color);
   transition: all 200ms;
 }
 span:hover {

package/package/components/core/switch.svelte.d.ts

@@ -3,7 +3,7 @@
 /** @typedef {typeof __propDef.slots}  SwitchSlots */
 /**
  * @see https://w3c.github.io/aria/#switch
- * @see https://w3c.github.io/aria-practices/#switch
+ * @see https://www.w3.org/WAI/ARIA/apg/patterns/switch/
  */
 export default class Switch extends SvelteComponentTyped<{
     label?: string;

package/package/components/core/tab-panel.svelte

@@ -1,7 +1,7 @@
 <!--
   @component
   @see https://w3c.github.io/aria/#tabpanel
-  @see https://w3c.github.io/aria-practices/#tabpanel
+  @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
 -->
 <script>
   /**

package/package/components/core/tab-panel.svelte.d.ts

@@ -3,7 +3,7 @@
 /** @typedef {typeof __propDef.slots}  TabPanelSlots */
 /**
  * @see https://w3c.github.io/aria/#tabpanel
- * @see https://w3c.github.io/aria-practices/#tabpanel
+ * @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
  */
 export default class TabPanel extends SvelteComponentTyped<{
     [x: string]: any;

package/package/components/core/tab.svelte

@@ -1,7 +1,7 @@
 <!--
   @component
   @see https://w3c.github.io/aria/#tab
-  @see https://w3c.github.io/aria-practices/#tabpanel
+  @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
 -->
 <script>
   import Button from './button.svelte';

package/package/components/core/tab.svelte.d.ts

@@ -3,7 +3,7 @@
 /** @typedef {typeof __propDef.slots}  TabSlots */
 /**
  * @see https://w3c.github.io/aria/#tab
- * @see https://w3c.github.io/aria-practices/#tabpanel
+ * @see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
  */
 export default class Tab extends SvelteComponentTyped<{
     [x: string]: any;

package/package/components/core/text-area.svelte

@@ -101,7 +101,7 @@ textarea {
   display: block;
   margin: 0;
   border-width: 1px;
-  border-color: var(--control-border-color);
+  border-color: var(--secondary-control-border-color);
   border-radius: var(--input--medium--border-radius);
   background-color: var(--control-background-color);
   padding: 8px;

package/package/components/core/text-input.svelte

@@ -84,7 +84,7 @@ input {
   display: inline-block;
   flex: auto;
   border-width: 1px;
-  border-color: var(--control-border-color);
+  border-color: var(--secondary-control-border-color);
   border-radius: var(--input--medium--border-radius);
   padding: 0 8px;
   min-width: 0;
@@ -101,7 +101,7 @@ input:focus {
 }
 input:read-only {
   color: var(--tertiary-foreground-color);
-  border-color: var(--control-border-color) !important;
+  border-color: var(--secondary-control-border-color) !important;
 }
 input:disabled {
   background-color: var(--disabled-background-color);
@@ -115,7 +115,7 @@ input ~ :global(button) {
   flex: none;
   margin-left: -1px;
   border-width: 1px;
-  border-color: var(--control-border-color);
+  border-color: var(--secondary-control-border-color);
   height: var(--input--medium--height);
   aspect-ratio: 1/1;
 }

package/package/components/core/toolbar.svelte

@@ -1,7 +1,7 @@
 <!--
   @component
   @see https://w3c.github.io/aria/#toolbar
-  @see https://w3c.github.io/aria-practices/#toolbar
+  @see https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/
 -->
 <script>
   /**

package/package/components/core/toolbar.svelte.d.ts

@@ -3,7 +3,7 @@
 /** @typedef {typeof __propDef.slots}  ToolbarSlots */
 /**
  * @see https://w3c.github.io/aria/#toolbar
- * @see https://w3c.github.io/aria-practices/#toolbar
+ * @see https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/
  */
 export default class Toolbar extends SvelteComponentTyped<{
     [x: string]: any;

package/package/components/helpers/group.js

@@ -76,7 +76,9 @@ class Group {
     });
 
     parent.addEventListener('click', (event) => {
-      this.onClick(event);
+      if (/** @type {HTMLElement} */ (event.target).matches(this.selector)) {
+        this.onClick(event);
+      }
     });
 
     parent.addEventListener('keydown', (event) => {

package/package/components/helpers/popup.js

@@ -107,8 +107,17 @@ class Popup {
       }
     });
 
+    // Close the popup when the backdrop, a menu item or an option is clicked
     this.popupElement.addEventListener('click', (event) => {
-      if (get(this.open) && event.target !== this.anchorElement) {
+      event.stopPropagation();
+
+      // eslint-disable-next-line prefer-destructuring
+      const target = /** @type {HTMLElement} */ (event.target);
+
+      if (
+        get(this.open) &&
+        (target === this.popupElement || target.matches('[role^="menuitem"], [role="option"]'))
+      ) {
         this.open.set(false);
       }
     });

package/package/components/util/app-shell.svelte

@@ -52,8 +52,9 @@
   --foreground-color-2-hsl: var(--base-hue) 5% 20%;
   --foreground-color-3-hsl: var(--base-hue) 5% 40%;
   --foreground-color-4-hsl: var(--base-hue) 5% 60%;
-  --border-color-1-hsl: var(--base-hue) 5% 75%;
-  --border-color-2-hsl: var(--base-hue) 5% 80%;
+  --border-color-1-hsl: var(--base-hue) 5% 30%;
+  --border-color-2-hsl: var(--base-hue) 5% 50%;
+  --border-color-3-hsl: var(--base-hue) 5% 70%;
   --background-color-1-hsl: var(--base-hue) 5% 100%;
   --background-color-2-hsl: var(--base-hue) 5% 98%;
   --background-color-3-hsl: var(--base-hue) 5% 94%;
@@ -81,8 +82,9 @@
   --foreground-color-2-hsl: var(--base-hue) 10% 80%;
   --foreground-color-3-hsl: var(--base-hue) 10% 60%;
   --foreground-color-4-hsl: var(--base-hue) 10% 40%;
-  --border-color-1-hsl: var(--base-hue) 10% 28%;
-  --border-color-2-hsl: var(--base-hue) 10% 24%;
+  --border-color-1-hsl: var(--base-hue) 10% 70%;
+  --border-color-2-hsl: var(--base-hue) 10% 50%;
+  --border-color-3-hsl: var(--base-hue) 10% 30%;
   --background-color-1-hsl: var(--base-hue) 10% 10%;
   --background-color-2-hsl: var(--base-hue) 10% 12%;
   --background-color-3-hsl: var(--base-hue) 10% 16%;
@@ -156,7 +158,8 @@
   );
   --primary-border-color: hsl(var(--border-color-1-hsl));
   --secondary-border-color: hsl(var(--border-color-2-hsl));
-  --control-border-color: hsl(var(--border-color-2-hsl));
+  --primary-control-border-color: hsl(var(--border-color-2-hsl));
+  --secondary-control-border-color: hsl(var(--border-color-3-hsl));
   --danger-border-color: hsl(
     var(--danger-color-hue) var(--alert-border-color-saturation) var(--alert-border-color-lightness)
   );

package/package/index.d.ts

@@ -10,7 +10,7 @@ export { default as Grid } from "./components/composite/grid.svelte";
 export { default as Listbox } from "./components/composite/listbox.svelte";
 export { default as MenuItemGroup } from "./components/composite/menu-item-group.svelte";
 export { default as Menu } from "./components/composite/menu.svelte";
-export { default as RadioButtonGroup } from "./components/composite/radio-button-group.svelte";
+export { default as RadioGroup } from "./components/composite/radio-group.svelte";
 export { default as SelectButtonGroup } from "./components/composite/select-button-group.svelte";
 export { default as Select } from "./components/composite/select.svelte";
 export { default as TabList } from "./components/composite/tab-list.svelte";
@@ -28,7 +28,7 @@ export { default as MenuItem } from "./components/core/menu-item.svelte";
 export { default as NumberInput } from "./components/core/number-input.svelte";
 export { default as Option } from "./components/core/option.svelte";
 export { default as PasswordInput } from "./components/core/password-input.svelte";
-export { default as RadioButton } from "./components/core/radio-button.svelte";
+export { default as Radio } from "./components/core/radio.svelte";
 export { default as RowGroup } from "./components/core/row-group.svelte";
 export { default as Row } from "./components/core/row.svelte";
 export { default as SearchBar } from "./components/core/search-bar.svelte";

package/package/index.js

@@ -44,7 +44,7 @@ export { default as MenuItemGroup } from './components/composite/menu-item-group
 // @ts-ignore
 export { default as Menu } from './components/composite/menu.svelte';
 // @ts-ignore
-export { default as RadioButtonGroup } from './components/composite/radio-button-group.svelte';
+export { default as RadioGroup } from './components/composite/radio-group.svelte';
 // @ts-ignore
 export { default as SelectButtonGroup } from './components/composite/select-button-group.svelte';
 // @ts-ignore
@@ -80,7 +80,7 @@ export { default as Option } from './components/core/option.svelte';
 // @ts-ignore
 export { default as PasswordInput } from './components/core/password-input.svelte';
 // @ts-ignore
-export { default as RadioButton } from './components/core/radio-button.svelte';
+export { default as Radio } from './components/core/radio.svelte';
 // @ts-ignore
 export { default as RowGroup } from './components/core/row-group.svelte';
 // @ts-ignore

package/package/styles/variables.scss

@@ -3,8 +3,9 @@
   --foreground-color-2-hsl: var(--base-hue) 5% 20%; // primary
   --foreground-color-3-hsl: var(--base-hue) 5% 40%; // secondary
   --foreground-color-4-hsl: var(--base-hue) 5% 60%; // tertiary
-  --border-color-1-hsl: var(--base-hue) 5% 75%; // primary
-  --border-color-2-hsl: var(--base-hue) 5% 80%; // secondary/input
+  --border-color-1-hsl: var(--base-hue) 5% 30%; // primary
+  --border-color-2-hsl: var(--base-hue) 5% 50%; // secondary/input
+  --border-color-3-hsl: var(--base-hue) 5% 70%; // tertiary
   --background-color-1-hsl: var(--base-hue) 5% 100%; // content/input
   --background-color-2-hsl: var(--base-hue) 5% 98%; // primary
   --background-color-3-hsl: var(--base-hue) 5% 94%; // secondary
@@ -34,8 +35,9 @@
   --foreground-color-2-hsl: var(--base-hue) 10% 80%; // primary
   --foreground-color-3-hsl: var(--base-hue) 10% 60%; // secondary
   --foreground-color-4-hsl: var(--base-hue) 10% 40%; // tertiary
-  --border-color-1-hsl: var(--base-hue) 10% 28%; // primary
-  --border-color-2-hsl: var(--base-hue) 10% 24%; // secondary/input
+  --border-color-1-hsl: var(--base-hue) 10% 70%; // primary
+  --border-color-2-hsl: var(--base-hue) 10% 50%; // secondary/input
+  --border-color-3-hsl: var(--base-hue) 10% 30%; // tertiary
   --background-color-1-hsl: var(--base-hue) 10% 10%; // content/input
   --background-color-2-hsl: var(--base-hue) 10% 12%; // primary
   --background-color-3-hsl: var(--base-hue) 10% 16%; // secondary
@@ -115,7 +117,8 @@
   // Borders
   --primary-border-color: hsl(var(--border-color-1-hsl));
   --secondary-border-color: hsl(var(--border-color-2-hsl));
-  --control-border-color: hsl(var(--border-color-2-hsl));
+  --primary-control-border-color: hsl(var(--border-color-2-hsl));
+  --secondary-control-border-color: hsl(var(--border-color-3-hsl));
   --danger-border-color: hsl(
     var(--danger-color-hue) var(--alert-border-color-saturation) var(--alert-border-color-lightness)
   );

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltia/ui",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "license": "MIT",
   "type": "module",
   "publishConfig": {
@@ -26,33 +26,33 @@
     "svelte": "^3.55.1"
   },
   "devDependencies": {
-    "@playwright/test": "^1.33.0",
-    "@sveltejs/adapter-auto": "2.0.1",
-    "@sveltejs/kit": "1.16.2",
+    "@playwright/test": "^1.34.3",
+    "@sveltejs/adapter-auto": "2.1.0",
+    "@sveltejs/kit": "1.20.1",
     "@sveltejs/package": "^2.0.2",
     "cspell": "^6.31.1",
-    "eslint": "^8.40.0",
+    "eslint": "^8.42.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jsdoc": "^44.0.0",
-    "eslint-plugin-svelte": "^2.27.4",
+    "eslint-plugin-jsdoc": "^46.2.4",
+    "eslint-plugin-svelte": "^2.30.0",
     "npm-run-all": "^4.1.5",
-    "postcss": "^8.4.23",
+    "postcss": "^8.4.24",
     "postcss-html": "^1.5.0",
     "prettier": "^2.8.8",
-    "prettier-plugin-svelte": "^2.10.0",
+    "prettier-plugin-svelte": "^2.10.1",
     "sass": "^1.62.1",
-    "stylelint": "^15.6.1",
-    "stylelint-config-recommended-scss": "^11.0.0",
+    "stylelint": "^15.6.3",
+    "stylelint-config-recommended-scss": "^12.0.0",
     "stylelint-scss": "^5.0.0",
-    "svelte-check": "^3.3.2",
+    "svelte-check": "^3.4.3",
     "svelte-i18n": "^3.6.0",
-    "svelte-migrate": "^1.1.3",
-    "svelte-preprocess": "^5.0.3",
-    "tslib": "^2.5.0",
-    "vite": "^4.3.5",
-    "vitest": "^0.31.0"
+    "svelte-migrate": "^1.2.1",
+    "svelte-preprocess": "^5.0.4",
+    "tslib": "^2.5.3",
+    "vite": "^4.3.9",
+    "vitest": "^0.31.4"
   },
   "exports": {
     "./package.json": "./package.json",
@@ -96,10 +96,10 @@
       "svelte": "./package/components/composite/menu.svelte",
       "default": "./package/components/composite/menu.svelte"
     },
-    "./components/composite/radio-button-group.svelte": {
-      "types": "./package/components/composite/radio-button-group.svelte.d.ts",
-      "svelte": "./package/components/composite/radio-button-group.svelte",
-      "default": "./package/components/composite/radio-button-group.svelte"
+    "./components/composite/radio-group.svelte": {
+      "types": "./package/components/composite/radio-group.svelte.d.ts",
+      "svelte": "./package/components/composite/radio-group.svelte",
+      "default": "./package/components/composite/radio-group.svelte"
     },
     "./components/composite/select-button-group.svelte": {
       "types": "./package/components/composite/select-button-group.svelte.d.ts",
@@ -186,10 +186,10 @@
       "svelte": "./package/components/core/password-input.svelte",
       "default": "./package/components/core/password-input.svelte"
     },
-    "./components/core/radio-button.svelte": {
-      "types": "./package/components/core/radio-button.svelte.d.ts",
-      "svelte": "./package/components/core/radio-button.svelte",
-      "default": "./package/components/core/radio-button.svelte"
+    "./components/core/radio.svelte": {
+      "types": "./package/components/core/radio.svelte.d.ts",
+      "svelte": "./package/components/core/radio.svelte",
+      "default": "./package/components/core/radio.svelte"
     },
     "./components/core/row-group.svelte": {
       "types": "./package/components/core/row-group.svelte.d.ts",
@@ -341,8 +341,8 @@
       "components/composite/menu.svelte": [
         "./package/components/composite/menu.svelte.d.ts"
       ],
-      "components/composite/radio-button-group.svelte": [
-        "./package/components/composite/radio-button-group.svelte.d.ts"
+      "components/composite/radio-group.svelte": [
+        "./package/components/composite/radio-group.svelte.d.ts"
       ],
       "components/composite/select-button-group.svelte": [
         "./package/components/composite/select-button-group.svelte.d.ts"
@@ -395,8 +395,8 @@
       "components/core/password-input.svelte": [
         "./package/components/core/password-input.svelte.d.ts"
       ],
-      "components/core/radio-button.svelte": [
-        "./package/components/core/radio-button.svelte.d.ts"
+      "components/core/radio.svelte": [
+        "./package/components/core/radio.svelte.d.ts"
       ],
       "components/core/row-group.svelte": [
         "./package/components/core/row-group.svelte.d.ts"