@nlabs/gothamjs
Version:
Platform
124 lines (123 loc) • 9.93 kB
JavaScript
import { FormProvider, useForm } from "react-hook-form";
import { TextField } from "./TextField.js";
import { gothamColors } from "../../utils/colorUtils.js";
import { jsx } from "react/jsx-runtime";
const meta = {
argTypes: {
borderColor: {
control: "select",
defaultValue: "secondary",
description: "The color of the border",
options: gothamColors
},
borderType: {
control: "select",
defaultValue: "underline",
description: "The type of border of the text field",
options: ["solid", "rounded", "none", "underline"]
},
hasError: {
control: "boolean",
defaultValue: false,
description: "Whether the text field has an error"
},
labelColor: {
control: "select",
defaultValue: "white",
description: "The color of the label",
options: gothamColors
},
multiline: {
control: "boolean",
defaultValue: false,
description: "Whether the text field is multiline"
},
pattern: {
control: "text",
description: "The pattern of the text field"
},
placeholderColor: {
control: "select",
defaultValue: "secondary",
description: "The color of the placeholder",
options: gothamColors
},
rows: {
control: "number",
defaultValue: 1,
description: "The number of rows of the text field"
},
textColor: {
control: "select",
defaultValue: "white",
description: "The color of the text",
options: gothamColors
}
},
component: TextField,
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/TextField"
};
var TextField_stories_default = meta;
const Default = {
args: {
borderColor: "secondary",
borderType: "underline",
disabled: false,
error: false,
label: "Default TextField",
labelColor: "black",
name: "default",
placeholder: "Textfield placeholder",
placeholderColor: "secondary",
required: true
}
};
const Multiline = {
args: {
borderColor: "secondary",
borderType: "solid",
disabled: false,
error: false,
label: "Default TextField",
labelColor: "black",
multiline: true,
name: "default",
placeholder: "Description",
placeholderColor: "secondary",
required: true,
rows: 1,
textColor: "black"
}
};
const WithPattern = {
args: {
disabled: false,
label: "Email TextField",
name: "email",
pattern: "[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,}$",
placeholder: "Enter email address"
}
};
export {
Default,
Multiline,
WithPattern,
TextField_stories_default as default
};
//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvVGV4dEZpZWxkL1RleHRGaWVsZC5zdG9yaWVzLnRzeCJdLAogICJzb3VyY2VzQ29udGVudCI6IFsiaW1wb3J0IHtGb3JtUHJvdmlkZXIsIHVzZUZvcm19IGZyb20gJ3JlYWN0LWhvb2stZm9ybSc7XG5cbmltcG9ydCB7VGV4dEZpZWxkfSBmcm9tICcuL1RleHRGaWVsZC5qcyc7XG5pbXBvcnQge2dvdGhhbUNvbG9yc30gZnJvbSAnLi4vLi4vdXRpbHMvY29sb3JVdGlscy5qcyc7XG5cbmltcG9ydCB0eXBlIHtNZXRhLCBTdG9yeU9ian0gZnJvbSAnQG5sYWJzL2xleC9zdG9yeWJvb2snO1xuXG5jb25zdCBtZXRhOiBNZXRhPHR5cGVvZiBUZXh0RmllbGQ+ID0ge1xuICBhcmdUeXBlczoge1xuICAgIGJvcmRlckNvbG9yOiB7XG4gICAgICBjb250cm9sOiAnc2VsZWN0JyxcbiAgICAgIGRlZmF1bHRWYWx1ZTogJ3NlY29uZGFyeScsXG4gICAgICBkZXNjcmlwdGlvbjogJ1RoZSBjb2xvciBvZiB0aGUgYm9yZGVyJyxcbiAgICAgIG9wdGlvbnM6IGdvdGhhbUNvbG9yc1xuICAgIH0sXG4gICAgYm9yZGVyVHlwZToge1xuICAgICAgY29udHJvbDogJ3NlbGVjdCcsXG4gICAgICBkZWZhdWx0VmFsdWU6ICd1bmRlcmxpbmUnLFxuICAgICAgZGVzY3JpcHRpb246ICdUaGUgdHlwZSBvZiBib3JkZXIgb2YgdGhlIHRleHQgZmllbGQnLFxuICAgICAgb3B0aW9uczogWydzb2xpZCcsICdyb3VuZGVkJywgJ25vbmUnLCAndW5kZXJsaW5lJ11cbiAgICB9LFxuICAgIGhhc0Vycm9yOiB7XG4gICAgICBjb250cm9sOiAnYm9vbGVhbicsXG4gICAgICBkZWZhdWx0VmFsdWU6IGZhbHNlLFxuICAgICAgZGVzY3JpcHRpb246ICdXaGV0aGVyIHRoZSB0ZXh0IGZpZWxkIGhhcyBhbiBlcnJvcidcbiAgICB9LFxuICAgIGxhYmVsQ29sb3I6IHtcbiAgICAgIGNvbnRyb2w6ICdzZWxlY3QnLFxuICAgICAgZGVmYXVsdFZhbHVlOiAnd2hpdGUnLFxuICAgICAgZGVzY3JpcHRpb246ICdUaGUgY29sb3Igb2YgdGhlIGxhYmVsJyxcbiAgICAgIG9wdGlvbnM6IGdvdGhhbUNvbG9yc1xuICAgIH0sXG4gICAgbXVsdGlsaW5lOiB7XG4gICAgICBjb250cm9sOiAnYm9vbGVhbicsXG4gICAgICBkZWZhdWx0VmFsdWU6IGZhbHNlLFxuICAgICAgZGVzY3JpcHRpb246ICdXaGV0aGVyIHRoZSB0ZXh0IGZpZWxkIGlzIG11bHRpbGluZSdcbiAgICB9LFxuICAgIHBhdHRlcm46IHtcbiAgICAgIGNvbnRyb2w6ICd0ZXh0JyxcbiAgICAgIGRlc2NyaXB0aW9uOiAnVGhlIHBhdHRlcm4gb2YgdGhlIHRleHQgZmllbGQnXG4gICAgfSxcbiAgICBwbGFjZWhvbGRlckNvbG9yOiB7XG4gICAgICBjb250cm9sOiAnc2VsZWN0JyxcbiAgICAgIGRlZmF1bHRWYWx1ZTogJ3NlY29uZGFyeScsXG4gICAgICBkZXNjcmlwdGlvbjogJ1RoZSBjb2xvciBvZiB0aGUgcGxhY2Vob2xkZXInLFxuICAgICAgb3B0aW9uczogZ290aGFtQ29sb3JzXG4gICAgfSxcbiAgICByb3dzOiB7XG4gICAgICBjb250cm9sOiAnbnVtYmVyJyxcbiAgICAgIGRlZmF1bHRWYWx1ZTogMSxcbiAgICAgIGRlc2NyaXB0aW9uOiAnVGhlIG51bWJlciBvZiByb3dzIG9mIHRoZSB0ZXh0IGZpZWxkJ1xuICAgIH0sXG4gICAgdGV4dENvbG9yOiB7XG4gICAgICBjb250cm9sOiAnc2VsZWN0JyxcbiAgICAgIGRlZmF1bHRWYWx1ZTogJ3doaXRlJyxcbiAgICAgIGRlc2NyaXB0aW9uOiAnVGhlIGNvbG9yIG9mIHRoZSB0ZXh0JyxcbiAgICAgIG9wdGlvbnM6IGdvdGhhbUNvbG9yc1xuICAgIH1cbiAgfSxcbiAgY29tcG9uZW50OiBUZXh0RmllbGQsXG4gIGRlY29yYXRvcnM6IFtcbiAgICAoU3RvcnkpID0+IHtcbiAgICAgIGNvbnN0IG1ldGhvZHMgPSB1c2VGb3JtKCk7XG4gICAgICByZXR1cm4gKFxuICAgICAgICA8Rm9ybVByb3ZpZGVyIHsuLi5tZXRob2RzfT5cbiAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT1cInAtNCBtYXgtdy1tZFwiPlxuICAgICAgICAgICAgPFN0b3J5IC8+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvRm9ybVByb3ZpZGVyPlxuICAgICAgKTtcbiAgICB9XG4gIF0sXG4gIHBhcmFtZXRlcnM6IHtcbiAgICBiYWNrZ3JvdW5kczoge1xuICAgICAgZGVmYXVsdDogJ2xpZ2h0JyxcbiAgICAgIHZhbHVlczogW1xuICAgICAgICB7bmFtZTogJ2xpZ2h0JywgdmFsdWU6ICcjZmZmZmZmJ30sXG4gICAgICAgIHtuYW1lOiAnZGFyaycsIHZhbHVlOiAnIzFhMWExYSd9XG4gICAgICBdXG4gICAgfSxcbiAgICBsYXlvdXQ6ICdjZW50ZXJlZCdcbiAgfSxcbiAgdGl0bGU6ICdDb21wb25lbnRzL1RleHRGaWVsZCdcbn07XG5cbmV4cG9ydCBkZWZhdWx0IG1ldGE7XG50eXBlIFN0b3J5ID0gU3RvcnlPYmo8dHlwZW9mIFRleHRGaWVsZD47XG5cbmV4cG9ydCBjb25zdCBEZWZhdWx0OiBTdG9yeSA9IHtcbiAgYXJnczoge1xuICAgIGJvcmRlckNvbG9yOiAnc2Vjb25kYXJ5JyxcbiAgICBib3JkZXJUeXBlOiAndW5kZXJsaW5lJyxcbiAgICBkaXNhYmxlZDogZmFsc2UsXG4gICAgZXJyb3I6IGZhbHNlLFxuICAgIGxhYmVsOiAnRGVmYXVsdCBUZXh0RmllbGQnLFxuICAgIGxhYmVsQ29sb3I6ICdibGFjaycsXG4gICAgbmFtZTogJ2RlZmF1bHQnLFxuICAgIHBsYWNlaG9sZGVyOiAnVGV4dGZpZWxkIHBsYWNlaG9sZGVyJyxcbiAgICBwbGFjZWhvbGRlckNvbG9yOiAnc2Vjb25kYXJ5JyxcbiAgICByZXF1aXJlZDogdHJ1ZVxuICB9XG59O1xuXG5leHBvcnQgY29uc3QgTXVsdGlsaW5lOiBTdG9yeSA9IHtcbiAgYXJnczoge1xuICAgIGJvcmRlckNvbG9yOiAnc2Vjb25kYXJ5JyxcbiAgICBib3JkZXJUeXBlOiAnc29saWQnLFxuICAgIGRpc2FibGVkOiBmYWxzZSxcbiAgICBlcnJvcjogZmFsc2UsXG4gICAgbGFiZWw6ICdEZWZhdWx0IFRleHRGaWVsZCcsXG4gICAgbGFiZWxDb2xvcjogJ2JsYWNrJyxcbiAgICBtdWx0aWxpbmU6IHRydWUsXG4gICAgbmFtZTogJ2RlZmF1bHQnLFxuICAgIHBsYWNlaG9sZGVyOiAnRGVzY3JpcHRpb24nLFxuICAgIHBsYWNlaG9sZGVyQ29sb3I6ICdzZWNvbmRhcnknLFxuICAgIHJlcXVpcmVkOiB0cnVlLFxuICAgIHJvd3M6IDEsXG4gICAgdGV4dENvbG9yOiAnYmxhY2snXG4gIH1cbn07XG5cbmV4cG9ydCBjb25zdCBXaXRoUGF0dGVybjogU3RvcnkgPSB7XG4gIGFyZ3M6IHtcbiAgICBkaXNhYmxlZDogZmFsc2UsXG4gICAgbGFiZWw6ICdFbWFpbCBUZXh0RmllbGQnLFxuICAgIG5hbWU6ICdlbWFpbCcsXG4gICAgcGF0dGVybjogJ1thLXowLTkuXyUrLV0rQFthLXowLTkuLV0rXFxcXC5bYS16XXsyLH0kJyxcbiAgICBwbGFjZWhvbGRlcjogJ0VudGVyIGVtYWlsIGFkZHJlc3MnXG4gIH1cbn07Il0sCiAgIm1hcHBpbmdzIjogIkFBQUEsU0FBUSxjQUFjLGVBQWM7QUFFcEMsU0FBUSxpQkFBZ0I7QUFDeEIsU0FBUSxvQkFBbUI7QUErRGY7QUEzRFosTUFBTSxPQUErQjtBQUFBLEVBQ25DLFVBQVU7QUFBQSxJQUNSLGFBQWE7QUFBQSxNQUNYLFNBQVM7QUFBQSxNQUNULGNBQWM7QUFBQSxNQUNkLGFBQWE7QUFBQSxNQUNiLFNBQVM7QUFBQSxJQUNYO0FBQUEsSUFDQSxZQUFZO0FBQUEsTUFDVixTQUFTO0FBQUEsTUFDVCxjQUFjO0FBQUEsTUFDZCxhQUFhO0FBQUEsTUFDYixTQUFTLENBQUMsU0FBUyxXQUFXLFFBQVEs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