@nlabs/gothamjs
Version:
Platform
137 lines (136 loc) • 10.4 kB
JavaScript
import { FormProvider, useForm } from "react-hook-form";
import { RadioField } from "./RadioField.js";
import { gothamColors } from "../../utils/colorUtils.js";
import { jsx } from "react/jsx-runtime";
const meta = {
argTypes: {
color: {
control: "select",
description: "The color of the radio group",
options: gothamColors
},
defaultValue: {
control: "text",
description: "The default selected value"
},
label: {
control: "text",
description: "The label text for the radio group"
},
name: {
control: "text",
description: "The name of the radio group"
},
optionClass: {
control: "text",
description: "The class name for the radio options"
},
options: {
control: "object",
description: "Array of radio options"
}
},
component: RadioField,
decorators: [
(Story) => {
const methods = useForm();
return /* @__PURE__ */ jsx(FormProvider, { ...methods, children: /* @__PURE__ */ jsx("div", { className: "p-4 max-w-md", children: /* @__PURE__ */ jsx(Story, {}) }) });
}
],
parameters: {
backgrounds: {
default: "light",
values: [
{ name: "light", value: "#ffffff" },
{ name: "dark", value: "#1a1a1a" }
]
},
layout: "centered"
},
title: "Components/RadioField"
};
var RadioField_stories_default = meta;
const defaultOptions = [
{
description: "This is the first option description",
id: "option1",
label: "First Option",
value: "1"
},
{
description: "This is the second option description",
id: "option2",
label: "Second Option",
value: "2"
},
{
description: "This is the third option description",
id: "option3",
label: "Third Option",
value: "3"
}
];
const Default = {
args: {
label: "Choose a Color",
name: "colorSelection",
options: [
{
id: "red",
label: "Red",
value: "red"
},
{
id: "blue",
label: "Blue",
value: "blue"
},
{
id: "green",
label: "Green",
value: "green"
}
]
}
};
const WithDefaultValue = {
args: {
defaultValue: "2",
label: "Select an Option",
name: "radioGroupWithDefault",
options: defaultOptions
}
};
const WithLongDescriptions = {
args: {
label: "Select a Plan",
name: "planSelection",
options: [
{
description: "Perfect for individuals and small projects. Includes basic features and support.",
id: "basic",
label: "Basic Plan",
value: "basic"
},
{
description: "Ideal for growing businesses. Includes advanced features, priority support, and team collaboration tools.",
id: "pro",
label: "Professional Plan",
value: "pro"
},
{
description: "Enterprise-grade solution with all features, dedicated support, and custom integrations.",
id: "enterprise",
label: "Enterprise Plan",
value: "enterprise"
}
]
}
};
export {
Default,
WithDefaultValue,
WithLongDescriptions,
RadioField_stories_default as default
};
//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvUmFkaW9GaWVsZC9SYWRpb0ZpZWxkLnN0b3JpZXMudHN4Il0sCiAgInNvdXJjZXNDb250ZW50IjogWyJpbXBvcnQge0Zvcm1Qcm92aWRlciwgdXNlRm9ybX0gZnJvbSAncmVhY3QtaG9vay1mb3JtJztcblxuaW1wb3J0IHtSYWRpb0ZpZWxkfSBmcm9tICcuL1JhZGlvRmllbGQuanMnO1xuaW1wb3J0IHtnb3RoYW1Db2xvcnN9IGZyb20gJy4uLy4uL3V0aWxzL2NvbG9yVXRpbHMuanMnO1xuXG5pbXBvcnQgdHlwZSB7TWV0YSwgU3RvcnlPYmp9IGZyb20gJ0BubGFicy9sZXgvc3Rvcnlib29rJztcblxuY29uc3QgbWV0YTogTWV0YTx0eXBlb2YgUmFkaW9GaWVsZD4gPSB7XG4gIGFyZ1R5cGVzOiB7XG4gICAgY29sb3I6IHtcbiAgICAgIGNvbnRyb2w6ICdzZWxlY3QnLFxuICAgICAgZGVzY3JpcHRpb246ICdUaGUgY29sb3Igb2YgdGhlIHJhZGlvIGdyb3VwJyxcbiAgICAgIG9wdGlvbnM6IGdvdGhhbUNvbG9yc1xuICAgIH0sXG4gICAgZGVmYXVsdFZhbHVlOiB7XG4gICAgICBjb250cm9sOiAndGV4dCcsXG4gICAgICBkZXNjcmlwdGlvbjogJ1RoZSBkZWZhdWx0IHNlbGVjdGVkIHZhbHVlJ1xuICAgIH0sXG4gICAgbGFiZWw6IHtcbiAgICAgIGNvbnRyb2w6ICd0ZXh0JyxcbiAgICAgIGRlc2NyaXB0aW9uOiAnVGhlIGxhYmVsIHRleHQgZm9yIHRoZSByYWRpbyBncm91cCdcbiAgICB9LFxuICAgIG5hbWU6IHtcbiAgICAgIGNvbnRyb2w6ICd0ZXh0JyxcbiAgICAgIGRlc2NyaXB0aW9uOiAnVGhlIG5hbWUgb2YgdGhlIHJhZGlvIGdyb3VwJ1xuICAgIH0sXG4gICAgb3B0aW9uQ2xhc3M6IHtcbiAgICAgIGNvbnRyb2w6ICd0ZXh0JyxcbiAgICAgIGRlc2NyaXB0aW9uOiAnVGhlIGNsYXNzIG5hbWUgZm9yIHRoZSByYWRpbyBvcHRpb25zJ1xuICAgIH0sXG4gICAgb3B0aW9uczoge1xuICAgICAgY29udHJvbDogJ29iamVjdCcsXG4gICAgICBkZXNjcmlwdGlvbjogJ0FycmF5IG9mIHJhZGlvIG9wdGlvbnMnXG4gICAgfVxuICB9LFxuICBjb21wb25lbnQ6IFJhZGlvRmllbGQsXG4gIGRlY29yYXRvcnM6IFtcbiAgICAoU3RvcnkpID0+IHtcbiAgICAgIGNvbnN0IG1ldGhvZHMgPSB1c2VGb3JtKCk7XG4gICAgICByZXR1cm4gKFxuICAgICAgICA8Rm9ybVByb3ZpZGVyIHsuLi5tZXRob2RzfT5cbiAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT1cInAtNCBtYXgtdy1tZFwiPlxuICAgICAgICAgICAgPFN0b3J5IC8+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvRm9ybVByb3ZpZGVyPlxuICAgICAgKTtcbiAgICB9XG4gIF0sXG4gIHBhcmFtZXRlcnM6IHtcbiAgICBiYWNrZ3JvdW5kczoge1xuICAgICAgZGVmYXVsdDogJ2xpZ2h0JyxcbiAgICAgIHZhbHVlczogW1xuICAgICAgICB7bmFtZTogJ2xpZ2h0JywgdmFsdWU6ICcjZmZmZmZmJ30sXG4gICAgICAgIHtuYW1lOiAnZGFyaycsIHZhbHVlOiAnIzFhMWExYSd9XG4gICAgICBdXG4gICAgfSxcbiAgICBsYXlvdXQ6ICdjZW50ZXJlZCdcbiAgfSxcbiAgdGl0bGU6ICdDb21wb25lbnRzL1JhZGlvRmllbGQnXG59O1xuXG5leHBvcnQgZGVmYXVsdCBtZXRhO1xudHlwZSBTdG9yeSA9IFN0b3J5T2JqPHR5cGVvZiBSYWRpb0ZpZWxkPjtcblxuY29uc3QgZGVmYXVsdE9wdGlvbnMgPSBbXG4gIHtcbiAgICBkZXNjcmlwdGlvbjogJ1RoaXMgaXMgdGhlIGZpcnN0IG9wdGlvbiBkZXNjcmlwdGlvbicsXG4gICAgaWQ6ICdvcHRpb24xJyxcbiAgICBsYWJlbDogJ0ZpcnN0IE9wdGlvbicsXG4gICAgdmFsdWU6ICcxJ1xuICB9LFxuICB7XG4gICAgZGVzY3JpcHRpb246ICdUaGlzIGlzIHRoZSBzZWNvbmQgb3B0aW9uIGRlc2NyaXB0aW9uJyxcbiAgICBpZDogJ29wdGlvbjInLFxuICAgIGxhYmVsOiAnU2Vjb25kIE9wdGlvbicsXG4gICAgdmFsdWU6ICcyJ1xuICB9LFxuICB7XG4gICAgZGVzY3JpcHRpb246ICdUaGlzIGlzIHRoZSB0aGlyZCBvcHRpb24gZGVzY3JpcHRpb24nLFxuICAgIGlkOiAnb3B0aW9uMycsXG4gICAgbGFiZWw6ICdUaGlyZCBPcHRpb24nLFxuICAgIHZhbHVlOiAnMydcbiAgfVxuXTtcblxuXG5leHBvcnQgY29uc3QgRGVmYXVsdDogU3RvcnkgPSB7XG4gIGFyZ3M6IHtcbiAgICBsYWJlbDogJ0Nob29zZSBhIENvbG9yJyxcbiAgICBuYW1lOiAnY29sb3JTZWxlY3Rpb24nLFxuICAgIG9wdGlvbnM6IFtcbiAgICAgIHtcbiAgICAgICAgaWQ6ICdyZWQnLFxuICAgICAgICBsYWJlbDogJ1JlZCcsXG4gICAgICAgIHZhbHVlOiAncmVkJ1xuICAgICAgfSxcbiAgICAgIHtcbiAgICAgICAgaWQ6ICdibHVlJyxcbiAgICAgICAgbGFiZWw6ICdCbHVlJyxcbiAgICAgICAgdmFsdWU6ICdibHVlJ1xuICAgICAgfSxcbiAgICAgIHtcbiAgICAgICAgaWQ6ICdncmVlbicsXG4gICAgICAgIGxhYmVsOiAnR3JlZW4nLFxuICAgICAgICB2YWx1ZTogJ2dyZWVuJ1xuICAgICAgfVxuICAgIF1cbiAgfVxufTtcblxuZXhwb3J0IGNvbnN0IFdpdGhEZWZhdWx0VmFsdWU6IFN0b3J5ID0ge1xuICBhcmdzOiB7XG4gICAgZGVmYXVsdFZhbHVlOiAnMicsXG4gICAgbGFiZWw6ICdTZWxlY3QgYW4gT3B0aW9uJyxcbiAgICBuYW1lOiAncmFkaW9Hcm91cFdpdGhEZWZhdWx0JyxcbiAgICBvcHRpb25zOiBkZWZhdWx0T3B0aW9uc1xuICB9XG59O1xuXG5leHBvcnQgY29uc3QgV2l0aExvbmdEZXNjcmlwdGlvbnM6IFN0b3J5ID0ge1xuICBhcmdzOiB7XG4gICAgbGFiZWw6ICdTZWxlY3QgYSBQbGFuJyxcbiAgICBuYW1lOiAncGxhblNlbGVjdGlvbicsXG4gICAgb3B0aW9uczogW1xuICAgICAge1xuICAgICAgICBkZXNjcmlwdGlvbjogJ1BlcmZlY3QgZm9yIGluZGl2aWR1YWxzIGFuZCBzbWFsbCBwcm9qZWN0cy4gSW5jbHVkZXMgYmFzaWMgZmVhdHVyZXMgYW5kIHN1cHBvcnQuJyxcbiAgICAgICAgaWQ6ICdiYXNpYycsXG4gICAgICAgIGxhYmVsOiAnQmFzaWMgUGxhbicsXG4gICAgICAgIHZhbHVlOiAnYmFzaWMnXG4gICAgICB9LFxuICAgICAge1xuICAgICAgICBkZXNjcmlwdGlvbjogJ0lkZWFsIGZvciBncm93aW5nIGJ1c2luZXNzZXMuIEluY2x1ZGVzIGFkdmFuY2VkIGZlYXR1cmVzLCBwcmlvcml0eSBzdXBwb3J0LCBhbmQgdGVhbSBjb2xsYWJvcmF0aW9uIHRvb2xzLicsXG4gICAgICAgIGlkOiAncHJvJyxcbiAgICAgICAgbGFiZWw6ICdQcm9mZXNzaW9uYWwgUGxhbicsXG4gICAgICAgIHZhbHVlOiAncHJvJ1xuICAgICAgfSxcbiAgICAgIHtcbiAgICAgICAgZGVzY3JpcHRpb246ICdFbnRlcnByaXNlLWdyYWRlIHNvbHV0aW9uIHdpdGggYWxsIGZlYXR1cmVzLCBkZWRpY2F0ZWQgc3VwcG9ydCwgYW5kIGN1c3RvbSBpbnRlZ3JhdGlvbnMuJyxcbiAgICAgICAgaWQ6ICdlbnRlcnByaXNlJyxcbiAgICAgICAgbGFiZWw6ICdFbnRlcnByaXNlIFBsYW4nLFxuICAgICAgICB2YWx1ZTogJ2VudGVycHJpc2UnXG4gICAgICB9XG4gICAgXVxuICB9XG59O1xuIl0sCiAgIm1hcHBpbmdzIjogIkFBQUEsU0FBUSxjQUFjLGVBQWM7QUFFcEMsU0FBUSxrQkFBaUI7QUFDekIsU0FBUSxvQkFBbUI7QUF1Q2Y7QUFuQ1osTUFBTSxPQUFnQztBQUFBLEVBQ3BDLFVBQVU7QUFBQSxJQUNSLE9BQU87QUFBQSxNQUNMLFNBQVM7QUFBQSxN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