@cypress-design/react-checkbox 0.4.3 → 0.4.5

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @cypress-design/react-checkbox
 
+## 0.4.5
+
+### Patch Changes
+
+- [#105](https://github.com/cypress-io/cypress-design/pull/105) [`2f54f5b`](https://github.com/cypress-io/cypress-design/commit/2f54f5b867b60ba5ce2e40fd38870bd65187ba30) Thanks [@elevatebart](https://github.com/elevatebart)! - checkbox should not contain a div to be added inside an inline only tag (<p>)
+
+- Updated dependencies [[`2f54f5b`](https://github.com/cypress-io/cypress-design/commit/2f54f5b867b60ba5ce2e40fd38870bd65187ba30), [`e82d8cb`](https://github.com/cypress-io/cypress-design/commit/e82d8cb60882a379d89f86d1ff7b8f1d5b56ce66)]:
+  - @cypress-design/react-icon@0.11.0
+
+## 0.4.4
+
+### Patch Changes
+
+- [#101](https://github.com/cypress-io/cypress-design/pull/101) [`1630e4c`](https://github.com/cypress-io/cypress-design/commit/1630e4c4200944cf6414cee9e92dcce6b4d8a576) Thanks [@mapsandapps](https://github.com/mapsandapps)! - Fix styles for Checkbox
+
 ## 0.4.3
 
 ### Patch Changes

package/Checkbox.tsx

@@ -60,7 +60,10 @@ export const Checkbox: FunctionComponent<CheckboxProps> = ({
   }
 
   return (
-    <div className={clsx(className, 'relative flex items-center')} {...rest}>
+    <span
+      className={clsx(className, 'block relative flex items-center')}
+      {...rest}
+    >
       <input
         id={id}
         className="absolute inset-0 w-0 h-0 opacity-0"
@@ -73,11 +76,12 @@ export const Checkbox: FunctionComponent<CheckboxProps> = ({
       />
       <label className="flex items-center" htmlFor={id}>
         {localChecked && (
+          // <windi-keep strokeColor="white"/>
           <IconCheckmarkSmall strokeColor="white" className="absolute" />
         )}
         <span
           className={clsx([
-            `block border-1 rounded h-16px w-16px flex items-center text-white`,
+            `block border-1 border-solid rounded h-16px w-16px flex items-center text-white`,
             disabled
               ? 'border-gray-200 bg-gray-100'
               : localChecked
@@ -100,7 +104,7 @@ export const Checkbox: FunctionComponent<CheckboxProps> = ({
           </span>
         )}
       </label>
-    </div>
+    </span>
   )
 }
 

package/dist/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../Checkbox.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGpE,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC;IACtE;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAA;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAA;CAC/D;AAQD,eAAO,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,CA6DrD,CAAA;AAED,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../Checkbox.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGpE,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC;IACtE;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAA;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAA;CAC/D;AAQD,eAAO,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,CAiErD,CAAA;AAED,eAAe,QAAQ,CAAA"}

package/dist/index.es.mjs

@@ -123,12 +123,14 @@ var Checkbox = function (_a) {
         setChecked(!localChecked);
         onChange(event);
     }
-    return (React.createElement("div", __assign$1({ className: clsx(className, 'relative flex items-center') }, rest),
+    return (React.createElement("span", __assign$1({ className: clsx(className, 'block relative flex items-center') }, rest),
         React.createElement("input", { id: id, className: "absolute inset-0 w-0 h-0 opacity-0", "aria-describedby": id + "-description", name: name || id, type: "checkbox", onChange: onChangeInput, disabled: disabled, checked: localChecked }),
         React.createElement("label", { className: "flex items-center", htmlFor: id },
-            localChecked && (React.createElement(IconCheckmarkSmall, { strokeColor: "white", className: "absolute" })),
+            localChecked && (
+            // <windi-keep strokeColor="white"/>
+            React.createElement(IconCheckmarkSmall, { strokeColor: "white", className: "absolute" })),
             React.createElement("span", { className: clsx([
-                    "block border-1 rounded h-16px w-16px flex items-center text-white",
+                    "block border-1 border-solid rounded h-16px w-16px flex items-center text-white",
                     disabled
                         ? 'border-gray-200 bg-gray-100'
                         : localChecked
@@ -147,5 +149,5 @@ var Checkbox = function (_a) {
 
 export { Checkbox as default };
 
-/* <windicss-keep class="relative flex items-center absolute inset-0 w-0 h-0 opacity-0 block border-1 rounded h-16px w-16px text-white border-gray-200 bg-gray-100 border-indigo-500 bg-indigo-400 border-jade-500 bg-jade-400 border-red-500 bg-red-400 bg-white text-gray-500 text-gray-800 ml-2 text-16px leading-normal font-light select-none"> */
+/* <windicss-keep class="block relative flex items-center absolute inset-0 w-0 h-0 opacity-0 border-1 border-solid rounded h-16px w-16px text-white border-gray-200 bg-gray-100 border-indigo-500 bg-indigo-400 border-jade-500 bg-jade-400 border-red-500 bg-red-400 bg-white text-gray-500 text-gray-800 ml-2 text-16px leading-normal font-light select-none icon-dark-white"> */
 //# sourceMappingURL=index.es.mjs.map