@sikt/sds-checkbox - npm Package Compare versions

Comparing version 1.0.0 to 2.0.0

dist/cjs/index.d.ts

 /// <reference types="react" />
-import { ChangeEvent, HTMLAttributes, ReactNode } from "react";
+import React from "react";
+import { ChangeEvent, HTMLAttributes } from "react";
 interface CheckboxInputProps extends HTMLAttributes<HTMLInputElement> {
@@ -14,14 +15,4 @@ isChecked?: boolean;
 }
-declare const CheckboxInput: ({ className, name, disabled, isChecked, onChange, label, value, error, ...rest }: CheckboxInputProps) => JSX.Element;
-interface CheckboxFieldsetProps extends HTMLAttributes<HTMLFieldSetElement> {
-    className?: string;
-    legend: string;
-    name?: string;
-    errorText?: string;
-    helpText?: string;
-    children: ReactNode;
-    error?: boolean;
-}
-declare const CheckboxFieldset: ({ className, legend, errorText, helpText, children, error, ...rest }: CheckboxFieldsetProps) => JSX.Element;
-export type { CheckboxInputProps, CheckboxFieldsetProps };
-export { CheckboxInput, CheckboxFieldset };
+declare const CheckboxInput: React.ForwardRefExoticComponent<CheckboxInputProps & React.RefAttributes<HTMLInputElement>>;
+export type { CheckboxInputProps };
+export { CheckboxInput };

dist/cjs/index.js

@@ -1,2 +0,2 @@
-"use strict";var e=require("react/jsx-runtime"),s=require("react"),c=require("clsx");const a=({className:s,...a})=>e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 256 256",className:c("sds-icon",s),"aria-hidden":"true",...a,children:e.jsx("path",{d:"m229.66 77.66-128 128a8 8 0 0 1-11.32 0l-56-56a8 8 0 0 1 11.32-11.32L96 188.69 218.34 66.34a8 8 0 0 1 11.32 11.32Z"})}),l=({className:s,...a})=>e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 256 256",className:c("sds-icon",s),"aria-hidden":"true",...a,children:e.jsx("path",{d:"M236.8 188.09 149.35 36.22a24.76 24.76 0 0 0-42.7 0L19.2 188.09a23.51 23.51 0 0 0 0 23.72A24.35 24.35 0 0 0 40.55 224h174.9a24.35 24.35 0 0 0 21.33-12.19 23.51 23.51 0 0 0 .02-23.72Zm-13.87 15.71a8.5 8.5 0 0 1-7.48 4.2H40.55a8.5 8.5 0 0 1-7.48-4.2 7.59 7.59 0 0 1 0-7.72l87.45-151.87a8.75 8.75 0 0 1 15 0l87.45 151.87a7.59 7.59 0 0 1-.04 7.72ZM120 144v-40a8 8 0 0 1 16 0v40a8 8 0 0 1-16 0Zm20 36a12 12 0 1 1-12-12 12 12 0 0 1 12 12Z"})});exports.CheckboxFieldset=({className:a,legend:r,errorText:d,helpText:i,children:o,error:n,...t})=>{const h=s.useId();return e.jsxs("fieldset",{className:c("sds-checkbox-fieldset",a),"aria-describedby":`${h}-help-text`,"aria-invalid":Boolean(d),"aria-errormessage":d?`${h}-help-text`:void 0,...t,children:[e.jsxs("legend",{className:c("sds-checkbox-fieldset__legend",n&&"sds-checkbox-fieldset--error"),children:[d&&e.jsx(l,{className:"sds-checkbox-fieldset__legend-icon"}),r]}),e.jsx("div",{className:"sds-checkbox-fieldset__children",children:o}),(d||i)&&e.jsx("div",{className:c("sds-checkbox-fieldset__help-text",d&&"sds-checkbox-fieldset--error"),id:`${h}-help-text`,children:d||i})]})},exports.CheckboxInput=({className:l,name:r,disabled:d,isChecked:i,onChange:o,label:n,value:t,error:h,...x})=>{const m=s.useId();return e.jsxs("label",{htmlFor:m,className:"sds-checkbox",children:[e.jsx("input",{id:m,name:r,type:"checkbox",value:t,checked:null!=i?i:void 0,disabled:d,"aria-invalid":!!h,onChange:o,className:c("sds-checkbox__input",h&&"sds-checkbox__input--error",l),...x}),e.jsx("div",{className:"sds-checkbox__icon-wrapper",children:e.jsx(a,{className:c("sds-checkbox__icon",i&&"sds-checkbox__icon--checked")})}),e.jsx("span",{className:"sds-checkbox__label",children:n})]})};
+"use strict";var e=require("react/jsx-runtime"),s=require("react"),r=require("clsx");const a=({className:s,...a})=>e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 256 256",className:r("sds-icon",s),"aria-hidden":"true",...a,children:e.jsx("path",{d:"m229.66 77.66-128 128a8 8 0 0 1-11.32 0l-56-56a8 8 0 0 1 11.32-11.32L96 188.69 218.34 66.34a8 8 0 0 1 11.32 11.32Z"})}),l=s.createContext(void 0);const d=s.forwardRef((({className:a,legend:d,name:c,errorText:i,helpText:o,children:n,...t},x)=>{const h=s.useId(),m=s.useMemo((()=>({name:c??h,error:Boolean(i)})),[c,i]);return e.jsx(l.Provider,{value:m,children:e.jsxs("fieldset",{ref:x,className:r("sds-form-fieldset",i&&"sds-form-fieldset--error",a),"aria-describedby":`${h}-help-text`,"aria-invalid":Boolean(i),"aria-errormessage":i?`${h}-help-text`:void 0,...t,children:[e.jsx("legend",{className:"sds-form-fieldset__legend",children:d}),n,(i??o)&&e.jsx("div",{className:"sds-form-fieldset__help-text",id:`${h}-help-text`,children:i??o})]})})}));d.displayName="Fieldset";const c=s.forwardRef((({className:d,name:c,disabled:i,isChecked:o,onChange:n,label:t,value:x,error:h,...m},u)=>{const p=s.useId(),b=s.useContext(l)??{};return e.jsxs("label",{className:r("sds-checkbox",(h??b.error)&&"sds-checkbox--error",d),htmlFor:p,children:[e.jsx("input",{ref:u,className:"sds-checkbox__input",id:p,name:c??b.name,type:"checkbox",onChange:n,value:x,checked:o??!1,disabled:i,"aria-invalid":!!(h??b.error),...m}),e.jsx("div",{className:"sds-checkbox__icon-wrapper",children:e.jsx(a,{className:"sds-checkbox__icon"})}),e.jsx("div",{className:"sds-checkbox__input-label",children:t})]})}));c.displayName="CheckboxInput",exports.CheckboxInput=c;
 //# sourceMappingURL=index.js.map

dist/index.d.ts

 /// <reference types="react" />
-import { ChangeEvent, HTMLAttributes, ReactNode } from "react";
+import React from "react";
+import { ChangeEvent, HTMLAttributes } from "react";
 interface CheckboxInputProps extends HTMLAttributes<HTMLInputElement> {
@@ -14,14 +15,4 @@ isChecked?: boolean;
 }
-declare const CheckboxInput: ({ className, name, disabled, isChecked, onChange, label, value, error, ...rest }: CheckboxInputProps) => JSX.Element;
-interface CheckboxFieldsetProps extends HTMLAttributes<HTMLFieldSetElement> {
-    className?: string;
-    legend: string;
-    name?: string;
-    errorText?: string;
-    helpText?: string;
-    children: ReactNode;
-    error?: boolean;
-}
-declare const CheckboxFieldset: ({ className, legend, errorText, helpText, children, error, ...rest }: CheckboxFieldsetProps) => JSX.Element;
-export type { CheckboxInputProps, CheckboxFieldsetProps };
-export { CheckboxInput, CheckboxFieldset };
+declare const CheckboxInput: React.ForwardRefExoticComponent<CheckboxInputProps & React.RefAttributes<HTMLInputElement>>;
+export type { CheckboxInputProps };
+export { CheckboxInput };

dist/index.js

@@ -1,2 +0,2 @@
-import{jsx as e,jsxs as s}from"react/jsx-runtime";import{useId as a}from"react";import c from"clsx";const l=({className:s,...a})=>e("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 256 256",className:c("sds-icon",s),"aria-hidden":"true",...a,children:e("path",{d:"m229.66 77.66-128 128a8 8 0 0 1-11.32 0l-56-56a8 8 0 0 1 11.32-11.32L96 188.69 218.34 66.34a8 8 0 0 1 11.32 11.32Z"})}),r=({className:s,...a})=>e("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 256 256",className:c("sds-icon",s),"aria-hidden":"true",...a,children:e("path",{d:"M236.8 188.09 149.35 36.22a24.76 24.76 0 0 0-42.7 0L19.2 188.09a23.51 23.51 0 0 0 0 23.72A24.35 24.35 0 0 0 40.55 224h174.9a24.35 24.35 0 0 0 21.33-12.19 23.51 23.51 0 0 0 .02-23.72Zm-13.87 15.71a8.5 8.5 0 0 1-7.48 4.2H40.55a8.5 8.5 0 0 1-7.48-4.2 7.59 7.59 0 0 1 0-7.72l87.45-151.87a8.75 8.75 0 0 1 15 0l87.45 151.87a7.59 7.59 0 0 1-.04 7.72ZM120 144v-40a8 8 0 0 1 16 0v40a8 8 0 0 1-16 0Zm20 36a12 12 0 1 1-12-12 12 12 0 0 1 12 12Z"})}),d=({className:r,name:d,disabled:i,isChecked:o,onChange:n,label:t,value:h,error:m,...x})=>{const b=a();return s("label",{htmlFor:b,className:"sds-checkbox",children:[e("input",{id:b,name:d,type:"checkbox",value:h,checked:null!=o?o:void 0,disabled:i,"aria-invalid":!!m,onChange:n,className:c("sds-checkbox__input",m&&"sds-checkbox__input--error",r),...x}),e("div",{className:"sds-checkbox__icon-wrapper",children:e(l,{className:c("sds-checkbox__icon",o&&"sds-checkbox__icon--checked")})}),e("span",{className:"sds-checkbox__label",children:t})]})},i=({className:l,legend:d,errorText:i,helpText:o,children:n,error:t,...h})=>{const m=a();return s("fieldset",{className:c("sds-checkbox-fieldset",l),"aria-describedby":`${m}-help-text`,"aria-invalid":Boolean(i),"aria-errormessage":i?`${m}-help-text`:void 0,...h,children:[s("legend",{className:c("sds-checkbox-fieldset__legend",t&&"sds-checkbox-fieldset--error"),children:[i&&e(r,{className:"sds-checkbox-fieldset__legend-icon"}),d]}),e("div",{className:"sds-checkbox-fieldset__children",children:n}),(i||o)&&e("div",{className:c("sds-checkbox-fieldset__help-text",i&&"sds-checkbox-fieldset--error"),id:`${m}-help-text`,children:i||o})]})};export{i as CheckboxFieldset,d as CheckboxInput};
+import{jsx as e,jsxs as s}from"react/jsx-runtime";import{createContext as r,forwardRef as a,useId as l,useMemo as c,useContext as d}from"react";import i from"clsx";const o=({className:s,...r})=>e("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 256 256",className:i("sds-icon",s),"aria-hidden":"true",...r,children:e("path",{d:"m229.66 77.66-128 128a8 8 0 0 1-11.32 0l-56-56a8 8 0 0 1 11.32-11.32L96 188.69 218.34 66.34a8 8 0 0 1 11.32 11.32Z"})}),n=r(void 0);const t=a((({className:r,legend:a,name:d,errorText:o,helpText:t,children:m,...h},p)=>{const x=l(),b=c((()=>({name:d??x,error:Boolean(o)})),[d,o]);return e(n.Provider,{value:b,children:s("fieldset",{ref:p,className:i("sds-form-fieldset",o&&"sds-form-fieldset--error",r),"aria-describedby":`${x}-help-text`,"aria-invalid":Boolean(o),"aria-errormessage":o?`${x}-help-text`:void 0,...h,children:[e("legend",{className:"sds-form-fieldset__legend",children:a}),m,(o??t)&&e("div",{className:"sds-form-fieldset__help-text",id:`${x}-help-text`,children:o??t})]})})}));t.displayName="Fieldset";const m=a((({className:r,name:a,disabled:c,isChecked:t,onChange:m,label:h,value:p,error:x,...b},f)=>{const v=l(),N=d(n)??{};return s("label",{className:i("sds-checkbox",(x??N.error)&&"sds-checkbox--error",r),htmlFor:v,children:[e("input",{ref:f,className:"sds-checkbox__input",id:v,name:a??N.name,type:"checkbox",onChange:m,value:p,checked:t??!1,disabled:c,"aria-invalid":!!(x??N.error),...b}),e("div",{className:"sds-checkbox__icon-wrapper",children:e(o,{className:"sds-checkbox__icon"})}),e("div",{className:"sds-checkbox__input-label",children:h})]})}));m.displayName="CheckboxInput";export{m as CheckboxInput};
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "@sikt/sds-checkbox",
-  "version": "1.0.0",
+  "version": "2.0.0",
   "license": "UNLICENSED",
@@ -16,4 +16,6 @@ "main": "dist/cjs/index.js",
   "dependencies": {
-    "@sikt/sds-core": "^1.0.1",
-    "@sikt/sds-icons": "^1.0.0"
+    "@sikt/sds-core": "^3.0.0",
+    "@sikt/sds-form": "^2.0.0",
+    "@sikt/sds-icons": "^1.2.0",
+    "@sikt/sds-tokens": "^1.0.0"
   },
@@ -23,3 +25,3 @@ "peerDependencies": {
     "@types/react-dom": "^18.0.0",
-    "clsx": "^1.2.1",
+    "clsx": "^1.0.0 || ^2.0.0",
     "react": "^18.0.0",
@@ -26,0 +28,0 @@ "react-dom": "^18.0.0"

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

110958

increased by16.46%

Lines of code

102

increased by6.25%

Worsened metrics

Dependency count

9

increased by28.57%

Dependency changes

• + Added@sikt/sds-form@^2.0.0

• + Added@sikt/sds-tokens@^1.0.0

• + Added@sikt/sds-core@3.1.0(transitive)

• + Added@sikt/sds-form@2.1.0(transitive)

• + Added@sikt/sds-tokens@1.0.12.1.0(transitive)

• + Addedclsx@2.1.1(transitive)

• - Removed@sikt/sds-core@1.0.1(transitive)

• - Removedclsx@1.2.1(transitive)

• Updated@sikt/sds-core@^3.0.0

• Updated@sikt/sds-icons@^1.2.0