{"id":18258621,"url":"https://github.com/whizzes/svelte-forms","last_synced_at":"2025-04-04T19:31:50.765Z","repository":{"id":65231573,"uuid":"587497564","full_name":"whizzes/svelte-forms","owner":"whizzes","description":"Form utilities for Svelte","archived":false,"fork":false,"pushed_at":"2024-10-14T08:51:03.000Z","size":1019,"stargazers_count":5,"open_issues_count":6,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-20T17:21:21.098Z","etag":null,"topics":["forms","library","svelte","utility"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/@whizzes/svelte-forms","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/whizzes.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-01-10T22:16:25.000Z","updated_at":"2024-07-16T09:11:47.000Z","dependencies_parsed_at":"2023-01-15T18:01:08.714Z","dependency_job_id":"c6c441f8-a9c3-4adb-98bb-1abfb327d9da","html_url":"https://github.com/whizzes/svelte-forms","commit_stats":null,"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whizzes%2Fsvelte-forms","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whizzes%2Fsvelte-forms/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whizzes%2Fsvelte-forms/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whizzes%2Fsvelte-forms/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/whizzes","download_url":"https://codeload.github.com/whizzes/svelte-forms/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247237679,"owners_count":20906329,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["forms","library","svelte","utility"],"created_at":"2024-11-05T10:33:18.428Z","updated_at":"2025-04-04T19:31:45.756Z","avatar_url":"https://github.com/whizzes.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv\u003e\n  \u003ch1 align=\"center\"\u003eSvelte Forms\u003c/h1\u003e\n  \u003ch4 align=\"center\"\u003e\n    Utilities for Svelte Forms Management\n  \u003c/h4\u003e\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n[![Discord](https://img.shields.io/discord/1011702194925490186?color=blue\u0026label=discord\u0026logo=discord)](https://discord.gg/yde6mcgs2C)\n![Build](https://github.com/whizzes/svelte-forms/workflows/build/badge.svg)\n![Tests](https://github.com/whizzes/svelte-forms/workflows/test/badge.svg)\n![Lint](https://github.com/whizzes/svelte-forms/workflows/lint/badge.svg)\n![Publish](https://github.com/whizzes/svelte-forms/workflows/publish/badge.svg)\n[![Version](https://img.shields.io/npm/v/@whizzes/svelte-forms.svg?style=flat)](https://www.npmjs.com/package/@whizzes/svelte-forms)\n[![Downloads](https://img.shields.io/npm/dm/@whizzes/svelte-forms.svg?style=flat)](https://www.npmjs.com/package/@whizzes/svelte-forms)\n\n\u003c/div\u003e\n\n## Installation\n\n```bash\n# npm\nnpm install @whizzes/svelte-forms\n\n# yarn\nyarn add @whizzes/svelte-forms\n\n# pnpm\npnpm add @whizzes/svelte-forms\n```\n\n## Examples\n\n### Creating a new form\n\n```svelte\n\u003cscript lang=\"ts\"\u003e\n  import * as Sentry from '@sentry/browser';\n  import { newForm } from '@whizzes/svelte-forms';\n  import * as Yup from 'yup';\n\n  import { EmailAlreadyTaken } from '$lib/errors';\n  import { agentService } from '$lib/services/agent';\n  import { notificationStore } from '$lib/stores/notification';\n\n  const { handleSubmit, values, errors, isSubmitting } = newForm({\n    initialValues: {\n      name: 'James'\n      lastName: 'Bond',\n      nickname: 'Agent 007',\n      email: 'james.bond@agent007.com',\n    },\n    validationSchema: Yup.object({\n      name: Yup.string().required(),\n      lastName: Yup.string().required(),\n      nickname: Yup.string().required(),\n      email: Yup.string().email().required(),\n    }),\n    onSubmit: async (values, helpers) =\u003e {\n      try {\n        await agentService.register(values);\n      } catch (error) {\n        if (error instanceof EmailAlreadyTaken) {\n          helpers.setFieldError(\n            'email',\n            'The email is already taken!');\n          return;\n        }\n\n        Sentry.captureException(error);\n\n        notificationStore.displayError({\n          text: 'An error ocurred registering an agent.'\n        });\n      }\n    },\n  });\n\u003c/script\u003e\n\n\u003cform\u003e\n  \u003cdiv\u003e\n    \u003clabel\u003eName\u003c/label\u003e\n    \u003cinput type=\"text\" name=\"name\" bind:value={$values.name} /\u003e\n    \u003cp class:hidden={!$errors.name}\u003e\u003c/p\u003e\n  \u003c/div\u003e\n  \u003cdiv\u003e\n    \u003clabel\u003eLast Name\u003c/label\u003e\n    \u003cinput type=\"text\" name=\"lastName\" bind:value={$values.lastName} /\u003e\n    \u003cp class:hidden={!$errors.lastName}\u003e\u003c/p\u003e\n  \u003c/div\u003e\n  \u003cdiv\u003e\n    \u003clabel\u003eNickname\u003c/label\u003e\n    \u003cinput type=\"text\" name=\"nickname\" bind:value={$values.nickname} /\u003e\n    \u003cp class:hidden={!$errors.nickname}\u003e\u003c/p\u003e\n  \u003c/div\u003e\n  \u003cdiv\u003e\n    \u003clabel\u003eEmail\u003c/label\u003e\n    \u003cinput type=\"text\" name=\"email\" bind:value={$values.email} /\u003e\n    \u003cp class:hidden={!$errors.email}\u003e\u003c/p\u003e\n  \u003c/div\u003e\n  \u003cbutton type=\"submit\" class:disabled={$isSubmitting} disabled={$isSubmitting}\u003e\n    Create Account\n  \u003c/button\u003e\n\u003c/form\u003e\n```\n\n## Releasing\n\nWhenever a tag is pushed a new release is created an the package is\npublished to the NPM registry using GitHub Actions.\n\nBump the current version using `npm` as follows:\n\n```sh\n# for versions with breaking changes use `major`\nnpm version major\n\n# for versions with non-breaking changes use `minor`\nnpm version minor\n\n# for patch versions use `patch`\nnpm version patch\n```\n\nThen push the repository including tag metadata as follows\n\n```sh\ngit push origin main --follow-tags\n```\n\n## Contributions\n\nAny contribution to this package is welcome! Don't hesitate on opening a\nPR or creating an issue!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwhizzes%2Fsvelte-forms","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwhizzes%2Fsvelte-forms","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwhizzes%2Fsvelte-forms/lists"}