@shipengine/formik-giger 0.2.0

package/README.md

@@ -0,0 +1,44 @@
+# `@packlink/formik-giger`
+
+Bindings for using [Formik](https://github.com/formium/formik) with [Giger](https://github.com/packlink-dev/giger).
+
+## Usage
+
+Check [stories](https://github.com/packlink-dev/giger/tree/master/packages/integrations/formik/src/stories) for examples on how to integrate this package in your application.
+
+### FormField
+
+With Design team we think about a "global" solution for the spaces (margin / paddings) at the `Input` component ([Giger](https://ui-components.packlink.com/?path=/story/components-forms-input--input-type-text)) so thats why `FormField` component exists, this component accepts any children (Input, Select, etc) and a [message interface](https://github.com/packlink-dev/giger/blob/master/src/components/Form/FormField/FormField.tsx#L10) so we can forget to declare the Input + FieldMessage paddings across Packlink.
+
+This component (FormField - Phavior) it's easy to use:
+
+```js
+import { Field } from 'formik';
+import { FormField, Input } from '@packlink/formik-giger';
+
+<FormField name="username">
+    <Field component={Input} label="username" />
+</FormField>;
+```
+
+This way, (just like the other Input, TextArea ... components inside this package) Formik will handle the onChange, onBlur handlers among other things.
+Plus: this will render the error message when there is an error, but you can also pass a custom message to render:
+
+```js
+import { Field } from 'formik';
+import { FieldMessageType } from '@shipengine/giger';
+import { FormField, Input } from '@packlink/formik-giger';
+
+<FormField
+    name="username"
+    message={{
+        type: FieldMessageType.INFO,
+        content: 'Use a valid username',
+    }}
+>
+    <Field component={Input} label="username" />
+</FormField>;
+```
+
+Take in mind that **errors are top priority** that means that an error will always be rendered before any custom message you may pass.
+When the error it's gone, the default message will render.

package/package.json

@@ -0,0 +1,53 @@
+{
+    "name": "@shipengine/formik-giger",
+    "version": "0.2.0",
+    "description": "A package providing formik bindings for Giger",
+    "homepage": "https://github.com/shipengine/giger",
+    "sideEffects": false,
+    "license": "ISC",
+    "main": "dist/lib/index.js",
+    "module": "dist/esm/index.js",
+    "types": "dist/lib/index.d.ts",
+    "typings": "dist/lib/index.d.ts",
+    "files": [
+        "dist"
+    ],
+    "source": "src/index.ts",
+    "publishConfig": {
+        "access": "restricted"
+    },
+    "lint-staged": {
+        "**/*.ts?(x)": "yarn run lint"
+    },
+    "browserslist": [
+        "extends @packlink/browserslist-config"
+    ],
+    "scripts": {
+        "start": "packlink-scripts start --rollup",
+        "build": "packlink-scripts build --rollup",
+        "lint": "yarn type-check && packlink-scripts lint",
+        "lint:ci": "yarn type-check && packlink-scripts lint",
+        "type-check": "tsc --noEmit",
+        "test": "node --expose-gc ../../../node_modules/.bin/packlink-scripts test --maxWorkers=40% --logHeapUsage",
+        "test:ci": "node --expose-gc ../../../node_modules/.bin/packlink-scripts test --ci --runInBand --coverage --logHeapUsage",
+        "postpublish": "packlink-scripts metrics"
+    },
+    "devDependencies": {
+        "@shipengine/giger": "^0.2.0",
+        "formik": "^2.4.2",
+        "test-utils": "^2.7.0",
+        "yup": "0.32.11"
+    },
+    "dependencies": {
+        "@babel/runtime": "^7.21.0",
+        "@types/flat": "^5.0.2",
+        "flat": "^5.0.2"
+    },
+    "peerDependencies": {
+        "@emotion/react": "^11.10.6",
+        "@shipengine/giger": ">=0.1.0",
+        "formik": ">=2.2.9",
+        "react": "^16.14.0 || ^17.0.0 || ^18.0.0"
+    },
+    "gitHead": "11d8ba1d2a7c2c827319a33a0963175692abd5d2"
+}