@grantbii/design-system 1.0.41 → 1.0.43

package/core/molecules/RadioButtons.d.ts

@@ -1,7 +1,9 @@
 import { DetailedHTMLProps, InputHTMLAttributes } from "react";
 import { Option } from "../foundations";
+export type RadioOption = Option & DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
 type RadioButtonProps = {
-    options: Option[];
-} & DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
-declare const RadioButtons: ({ options, name, ...radioButtonProps }: RadioButtonProps) => import("react/jsx-runtime").JSX.Element;
+    name: string;
+    options: RadioOption[];
+};
+declare const RadioButtons: ({ name, options }: RadioButtonProps) => import("react/jsx-runtime").JSX.Element;
 export default RadioButtons;

package/core/molecules/RadioButtons.js

@@ -13,9 +13,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { createElement as _createElement } from "react";
 import styled from "styled-components";
 import { RadioButton } from "../atoms";
-const RadioButtons = (_a) => {
-    var { options, name } = _a, radioButtonProps = __rest(_a, ["options", "name"]);
-    return (_jsx(RadioGroup, { children: options.map(({ label, value }) => (_createElement(RadioButton, Object.assign({}, radioButtonProps, { key: `${name}-radio-button`, id: `${name}-radio-button`, name: name, label: label, value: value })))) }));
+const RadioButtons = ({ name, options }) => {
+    return (_jsx(RadioGroup, { children: options.map((_a) => {
+            var { value } = _a, props = __rest(_a, ["value"]);
+            return (_createElement(RadioButton, Object.assign({}, props, { key: `${value}-radio-button`, id: `${value}-radio-button`, value: value, name: name })));
+        }) }));
 };
 export default RadioButtons;
 const RadioGroup = styled.div `

package/core/molecules/index.d.ts

@@ -1,2 +1,2 @@
 export { default as Modal, useModal } from "./Modal";
-export { default as RadioButtons } from "./RadioButtons";
+export { default as RadioButtons, type RadioOption } from "./RadioButtons";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grantbii/design-system",
-  "version": "1.0.41",
+  "version": "1.0.43",
   "description": "Grantbii's Design System",
   "homepage": "https://design.grantbii.com",
   "repository": {

package/stories/molecules/RadioButtons.stories.d.ts

@@ -3,4 +3,5 @@ import { Meta, StoryObj } from "@storybook/nextjs-vite";
 declare const meta: Meta<typeof RadioButtons>;
 export default meta;
 type Story = StoryObj<typeof meta>;
-export declare const TextOnly: Story;
+export declare const NoneSelectedByDefault: Story;
+export declare const OneSelectedByDefault: Story;

package/stories/molecules/RadioButtons.stories.js

@@ -8,12 +8,38 @@ const meta = {
     },
 };
 export default meta;
-export const TextOnly = {
+export const NoneSelectedByDefault = {
     args: {
         name: "location ",
         options: [
-            { label: "Singapore", value: "Singapore" },
-            { label: "Hong Kong", value: "Hong Kong" },
+            {
+                label: "Singapore",
+                value: "Singapore",
+                onChange: () => alert("Selected Singapore!"),
+            },
+            {
+                label: "Hong Kong",
+                value: "Hong Kong",
+                onChange: () => alert("Selected Hong Kong!"),
+            },
+        ],
+    },
+};
+export const OneSelectedByDefault = {
+    args: {
+        name: "location ",
+        options: [
+            {
+                label: "Singapore",
+                value: "Singapore",
+                onChange: () => alert("Selected Singapore!"),
+                defaultChecked: true,
+            },
+            {
+                label: "Hong Kong",
+                value: "Hong Kong",
+                onChange: () => alert("Selected Hong Kong!"),
+            },
         ],
     },
 };