@spark-ui/form-field - npm Package Compare versions

Comparing version 0.3.2 to 0.4.0

CHANGELOG.md

@@ -6,2 +6,8 @@ # Change Log
 
+# [0.4.0](https://github.com/adevinta/spark/compare/@spark-ui/form-field@0.3.2...@spark-ui/form-field@0.4.0) (2023-06-21)
+
+### Features
+
+- update form field spacing ([5ef4773](https://github.com/adevinta/spark/commit/5ef4773c27867d83bd6b21ba1f1d2589ca773065))
+
 ## [0.3.2](https://github.com/adevinta/spark/compare/@spark-ui/form-field@0.3.1...@spark-ui/form-field@0.3.2) (2023-06-19)
@@ -8,0 +14,0 @@

dist/index.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),N=require("@radix-ui/react-id"),x=require("@spark-ui/slot"),m=require("class-variance-authority"),y=require("@spark-ui/label"),g=e.createContext(null),R=()=>{const a=e.useContext(g);if(!a)throw Error("useFormField must be used within a FormField provider");return a},M=({id:a,name:r,isInvalid:i,isRequired:s,children:l})=>{const d=N.useId(),[o,t]=e.useState([]),n=o.length>0?o.join(" "):void 0,c=e.useCallback(F=>{t(f=>[...f,F])},[]),u=e.useCallback(F=>{t(f=>f.filter(C=>C!==F))},[]),w=e.useMemo(()=>({id:a,labelId:d,name:r,isInvalid:i,isRequired:s,description:n,onMessageIdAdd:c,onMessageIdRemove:u}),[a,d,r,n,i,s,c,u]);return e.createElement(g.Provider,{value:w},l)};M.displayName="FormFieldProvider";const h=e.forwardRef(({className:a,name:r,isInvalid:i=!1,isRequired:s=!1,asChild:l=!1,...d},o)=>{const t=N.useId(),n=l?x.Slot:"div";return e.createElement(M,{id:t,name:r,isRequired:s,isInvalid:i},e.createElement(n,{ref:o,"data-spark-component":"form-field",className:m.cx(a,"flex flex-col gap-xl"),...d}))});h.displayName="FormField";const v=e.forwardRef(({id:a,className:r,...i},s)=>{const{onMessageIdAdd:l,onMessageIdRemove:d}=R(),o=N.useId(),t=a||o;return e.useEffect(()=>(l(t),()=>{d(t)}),[t,l,d]),e.createElement("span",{ref:s,id:t,"data-spark-component":"form-field-message",className:m.cx(r,"text-caption"),...i})});v.displayName="FormField.Message";const b=e.forwardRef(({className:a,...r},i)=>{const{isInvalid:s}=R();return s?e.createElement(v,{ref:i,"data-spark-component":"form-field-error-message","aria-live":"polite",className:m.cx(a,"text-error"),...r}):null});b.displayName="FormField.ErrorMessage";const q=e.forwardRef(({className:a,...r},i)=>e.createElement(v,{ref:i,"data-spark-component":"form-field-helper-message",className:m.cx(a,"text-neutral"),...r}));q.displayName="FormField.HelperMessage";const p=e.forwardRef((a,r)=>e.createElement(y.Label.RequiredIndicator,{ref:r,...a}));p.displayName="FormField.RequiredIndicator";const E=e.forwardRef(({htmlFor:a,className:r,children:i,requiredIndicator:s=e.createElement(p,null),asChild:l,...d},o)=>{const t=R(),{labelId:n,isRequired:c}=t,u=l?void 0:a||t.id;return e.createElement(y.Label,{ref:o,id:n,"data-spark-component":"form-field-label",htmlFor:u,className:m.cx(r,"flex items-center gap-sm"),asChild:l,...d},e.createElement(x.Slottable,null,i),c&&s)});E.displayName="FormField.Label";const S=()=>{const{id:a,name:r,description:i,labelId:s,isRequired:l,isInvalid:d}=e.useContext(g)||{};return{id:a,name:r,description:i,labelId:s,isRequired:l,isInvalid:d}},I=({children:a})=>{const{id:r,name:i,isInvalid:s,labelId:l,isRequired:d,description:o}=S();return e.createElement(e.Fragment,null,a({id:r,labelId:l,name:i,isRequired:d,isInvalid:s,description:o}))};I.displayName="FormField.State",E.displayName="FormField.Label",I.displayName="FormField.State",b.displayName="FormField.ErrorMessage",q.displayName="FormField.HelperMessage",p.displayName="FormField.RequiredIndicator";const k=Object.assign(h,{Label:E,State:I,ErrorMessage:b,HelperMessage:q,RequiredIndicator:p});exports.FormField=k,exports.useFormFieldState=S;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),N=require("@radix-ui/react-id"),y=require("@spark-ui/slot"),m=require("class-variance-authority"),x=require("@spark-ui/label"),g=e.createContext(null),R=()=>{const a=e.useContext(g);if(!a)throw Error("useFormField must be used within a FormField provider");return a},M=({id:a,name:r,isInvalid:i,isRequired:s,children:l})=>{const d=N.useId(),[o,t]=e.useState([]),n=o.length>0?o.join(" "):void 0,c=e.useCallback(F=>{t(f=>[...f,F])},[]),u=e.useCallback(F=>{t(f=>f.filter(C=>C!==F))},[]),w=e.useMemo(()=>({id:a,labelId:d,name:r,isInvalid:i,isRequired:s,description:n,onMessageIdAdd:c,onMessageIdRemove:u}),[a,d,r,n,i,s,c,u]);return e.createElement(g.Provider,{value:w},l)};M.displayName="FormFieldProvider";const h=e.forwardRef(({className:a,name:r,isInvalid:i=!1,isRequired:s=!1,asChild:l=!1,...d},o)=>{const t=N.useId(),n=l?y.Slot:"div";return e.createElement(M,{id:t,name:r,isRequired:s,isInvalid:i},e.createElement(n,{ref:o,"data-spark-component":"form-field",className:m.cx(a,"flex flex-col gap-sm"),...d}))});h.displayName="FormField";const v=e.forwardRef(({id:a,className:r,...i},s)=>{const{onMessageIdAdd:l,onMessageIdRemove:d}=R(),o=N.useId(),t=a||o;return e.useEffect(()=>(l(t),()=>{d(t)}),[t,l,d]),e.createElement("span",{ref:s,id:t,"data-spark-component":"form-field-message",className:m.cx(r,"text-caption"),...i})});v.displayName="FormField.Message";const b=e.forwardRef(({className:a,...r},i)=>{const{isInvalid:s}=R();return s?e.createElement(v,{ref:i,"data-spark-component":"form-field-error-message","aria-live":"polite",className:m.cx(a,"text-error"),...r}):null});b.displayName="FormField.ErrorMessage";const q=e.forwardRef(({className:a,...r},i)=>e.createElement(v,{ref:i,"data-spark-component":"form-field-helper-message",className:m.cx(a,"text-neutral"),...r}));q.displayName="FormField.HelperMessage";const p=e.forwardRef((a,r)=>e.createElement(x.Label.RequiredIndicator,{ref:r,...a}));p.displayName="FormField.RequiredIndicator";const E=e.forwardRef(({htmlFor:a,className:r,children:i,requiredIndicator:s=e.createElement(p,null),asChild:l,...d},o)=>{const t=R(),{labelId:n,isRequired:c}=t,u=l?void 0:a||t.id;return e.createElement(x.Label,{ref:o,id:n,"data-spark-component":"form-field-label",htmlFor:u,className:m.cx(r,"flex items-center gap-sm"),asChild:l,...d},e.createElement(y.Slottable,null,i),c&&s)});E.displayName="FormField.Label";const S=()=>{const{id:a,name:r,description:i,labelId:s,isRequired:l,isInvalid:d}=e.useContext(g)||{};return{id:a,name:r,description:i,labelId:s,isRequired:l,isInvalid:d}},I=({children:a})=>{const{id:r,name:i,isInvalid:s,labelId:l,isRequired:d,description:o}=S();return e.createElement(e.Fragment,null,a({id:r,labelId:l,name:i,isRequired:d,isInvalid:s,description:o}))};I.displayName="FormField.State",E.displayName="FormField.Label",I.displayName="FormField.State",b.displayName="FormField.ErrorMessage",q.displayName="FormField.HelperMessage",p.displayName="FormField.RequiredIndicator";const k=Object.assign(h,{Label:E,State:I,ErrorMessage:b,HelperMessage:q,RequiredIndicator:p});exports.FormField=k,exports.useFormFieldState=S;

package.json

 {
   "name": "@spark-ui/form-field",
-  "version": "0.3.2",
+  "version": "0.4.0",
   "description": "Provide context to your form elements",
@@ -34,3 +34,3 @@ "publishConfig": {
   },
-  "gitHead": "1d1417174698b32efc62b5d23537ea1b44b0f98b"
+  "gitHead": "518915fb9cc4304b8d4af80bd4aa927c798c179d"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

18227

increased by1.45%

No dependency changes