@spark-ui/checkbox 1.13.3 → 1.13.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,12 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [1.13.4](https://github.com/adevinta/spark/compare/@spark-ui/checkbox@1.13.3...@spark-ui/checkbox@1.13.4) (2023-05-09)
7
+
8
+ ### Bug Fixes
9
+
10
+ - **checkbox:** fix deps ([2525365](https://github.com/adevinta/spark/commit/2525365b1bde8459c48248ab1a419a698d63a6f1))
11
+
6
12
  ## [1.13.3](https://github.com/adevinta/spark/compare/@spark-ui/checkbox@1.13.2...@spark-ui/checkbox@1.13.3) (2023-05-05)
7
13
 
8
14
  **Note:** Version bump only for package @spark-ui/checkbox
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-ui/checkbox",
3
- "version": "1.13.3",
3
+ "version": "1.13.4",
4
4
  "description": "A control that allows the user to toggle between checked and not checked.",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -13,10 +13,10 @@
13
13
  },
14
14
  "dependencies": {
15
15
  "@radix-ui/react-checkbox": "1",
16
- "@radix-ui/react-label": "^2.0.1",
17
- "@spark-ui/icons": "^1.10.2",
18
- "@spark-ui/internal-utils": "^1.5.3",
19
- "@spark-ui/use-merge-refs": "^0.3.2",
16
+ "@radix-ui/react-label": "2",
17
+ "@spark-ui/icons": "^1.10.3",
18
+ "@spark-ui/internal-utils": "1",
19
+ "@spark-ui/use-merge-refs": "0",
20
20
  "class-variance-authority": "0.5.2"
21
21
  },
22
22
  "peerDependencies": {
@@ -25,8 +25,8 @@
25
25
  "tailwindcss": "^3.0.0"
26
26
  },
27
27
  "devDependencies": {
28
- "@spark-ui/button": "^1.11.1",
29
- "@spark-ui/radio": "^1.10.1"
28
+ "@spark-ui/button": "^1.11.2",
29
+ "@spark-ui/radio": "^1.10.2"
30
30
  },
31
31
  "repository": {
32
32
  "type": "git",
@@ -37,6 +37,5 @@
37
37
  "url": "https://github.com/adevinta/spark/issues"
38
38
  },
39
39
  "homepage": "https://sparkui.vercel.app",
40
- "license": "MIT",
41
- "gitHead": "f337f456853f839bf9665041e39c9b0fedcb6c76"
40
+ "license": "MIT"
42
41
  }
package/LICENSE DELETED
@@ -1,21 +0,0 @@
1
- MIT License
2
-
3
- Copyright (c) Adevinta ASA.
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.
@@ -1,4 +0,0 @@
1
- import React from 'react';
2
- import { type InputProps } from './CheckboxInput';
3
- export type CheckboxProps = InputProps;
4
- export declare const Checkbox: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLButtonElement>>;
@@ -1,39 +0,0 @@
1
- import { ButtonHTMLAttributes, ReactNode } from 'react';
2
- import { type InputStylesProps } from './CheckboxInput.styles';
3
- type CheckedStatus = boolean | 'indeterminate';
4
- interface RadixProps {
5
- /**
6
- * The checked icon to use
7
- */
8
- icon?: ReactNode;
9
- /**
10
- * The checked state of the checkbox when it is initially rendered. Use when you do not need to control its checked state.
11
- */
12
- defaultChecked?: CheckedStatus;
13
- /**
14
- * The controlled checked state of the checkbox. Must be used in conjunction with onCheckedChange.
15
- */
16
- checked?: CheckedStatus;
17
- /**
18
- * Event handler called when the checked state of the checkbox changes.
19
- */
20
- onCheckedChange?: (checked: boolean, indeterminate?: boolean) => void;
21
- /**
22
- * When true, prevents the user from interacting with the checkbox.
23
- */
24
- disabled?: boolean;
25
- /**
26
- * When true, indicates that the user must check the checkbox before the owning form can be submitted.
27
- */
28
- required?: boolean;
29
- /**
30
- * The name of the checkbox. Submitted with its owning form as part of a name/value pair.
31
- */
32
- name?: string;
33
- }
34
- export interface InputProps extends RadixProps, // Radix props
35
- InputStylesProps, // CVA props (variants)
36
- Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'checked' | 'defaultChecked'> {
37
- }
38
- export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLButtonElement>>;
39
- export {};
@@ -1,5 +0,0 @@
1
- import { VariantProps } from 'class-variance-authority';
2
- export declare const inputStyles: (props?: ({
3
- intent?: "primary" | "success" | "alert" | "error" | "info" | "neutral" | null | undefined;
4
- } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
5
- export type InputStylesProps = VariantProps<typeof inputStyles>;
@@ -1,17 +0,0 @@
1
- import { PropsWithChildren } from 'react';
2
- import { type LabelStylesProps } from './CheckboxLabel.styles';
3
- export interface LabelProps extends LabelStylesProps, PropsWithChildren<React.HTMLAttributes<HTMLLabelElement>> {
4
- /**
5
- * Change the component to the HTML tag or custom component of the only child.
6
- */
7
- asChild?: boolean;
8
- /**
9
- * The id of the element the label is associated with.
10
- */
11
- htmlFor?: string;
12
- /**
13
- * When true, prevents the user from interacting with the checkbox item.
14
- */
15
- disabled?: boolean;
16
- }
17
- export declare const Label: ({ className, disabled, ...others }: LabelProps) => JSX.Element;
@@ -1,5 +0,0 @@
1
- import { VariantProps } from 'class-variance-authority';
2
- export declare const labelStyles: (props?: ({
3
- disabled?: boolean | null | undefined;
4
- } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
5
- export type LabelStylesProps = VariantProps<typeof labelStyles>;
package/dist/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export { Checkbox } from './Checkbox';
package/dist/index.js DELETED
@@ -1 +0,0 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react"),v=require("@radix-ui/react-checkbox"),C=require("@spark-ui/use-merge-refs"),y=require("@spark-ui/internal-utils"),d=require("class-variance-authority"),w=require("@radix-ui/react-label");function x(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,s.get?s:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const o=x(v),l=r.forwardRef(({title:e,fill:a="currentColor",stroke:t="none",...s},i)=>r.createElement("svg",{ref:i,viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",...e&&{"data-title":e},fill:a,stroke:t,...s,dangerouslySetInnerHTML:{__html:(e===void 0?"":`<title>${e}</title>`)+'<path d="M8.91958 20.1667C8.73748 20.1667 8.56045 20.1323 8.38847 20.0635C8.21649 19.9947 8.05969 19.8915 7.91806 19.7539L2.42489 14.4176C2.14163 14.1425 2 13.8083 2 13.4152C2 13.0222 2.14163 12.688 2.42489 12.4129C2.70814 12.1377 3.04704 12.0001 3.44158 12.0001C3.83612 12.0001 4.18513 12.1377 4.48862 12.4129L8.91958 16.7173L19.5417 6.42797C19.825 6.1528 20.1639 6.0103 20.5584 6.00048C20.953 5.99065 21.2919 6.13315 21.5751 6.42797C21.8584 6.70313 22 7.03727 22 7.43036C22 7.82346 21.8584 8.15759 21.5751 8.43276L9.92109 19.7539C9.77946 19.8915 9.62266 19.9947 9.45068 20.0635C9.27871 20.1323 9.10167 20.1667 8.91958 20.1667Z"/>'}}));l.displayName="Check";const u=r.forwardRef(({title:e,fill:a="currentColor",stroke:t="none",...s},i)=>r.createElement("svg",{ref:i,viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",...e&&{"data-title":e},fill:a,stroke:t,...s,dangerouslySetInnerHTML:{__html:(e===void 0?"":`<title>${e}</title>`)+'<path fill-rule="evenodd" clip-rule="evenodd" d="M2 11.9999C2 11.379 2.44772 10.8756 3 10.8756H21C21.5523 10.8756 22 11.379 22 11.9999C22 12.6208 21.5523 13.1242 21 13.1242H3C2.44772 13.1242 2 12.6208 2 11.9999Z"/>'}}));u.displayName="Minus";const N=d.cva(["h-sz-20 w-sz-20 border-md peer my-[var(--sz-1)] shrink-0 items-center justify-center self-baseline rounded-sm bg-transparent","spark-disabled:opacity-dim-3 spark-disabled:cursor-not-allowed spark-disabled:hover:ring-0","focus-visible:ring-outline-high focus-visible:outline-none focus-visible:ring-2","hover:border-primary-container hover:outline-none hover:ring-2","u-shadow-border-transition"],{variants:{intent:y.makeVariants({primary:["spark-state-unchecked:border-outline","spark-state-indeterminate:border-primary spark-state-indeterminate:bg-primary","spark-state-checked:border-primary spark-state-checked:bg-primary"],success:["spark-state-unchecked:border-success","spark-state-indeterminate:border-success spark-state-indeterminate:bg-success","spark-state-checked:border-success spark-state-checked:bg-success"],alert:["spark-state-unchecked:border-alert","spark-state-indeterminate:border-alert spark-state-indeterminate:bg-alert","spark-state-checked:border-alert spark-state-checked:bg-alert"],error:["spark-state-unchecked:border-error","spark-state-indeterminate:border-error spark-state-indeterminate:bg-error","spark-state-checked:border-error spark-state-checked:bg-error"],info:["spark-state-unchecked:border-info","spark-state-indeterminate:border-info spark-state-indeterminate:bg-info","spark-state-checked:border-info spark-state-checked:bg-info"],neutral:["spark-state-unchecked:border-neutral","spark-state-indeterminate:border-neutral spark-state-indeterminate:bg-neutral","spark-state-checked:border-neutral spark-state-checked:bg-neutral"]})},defaultVariants:{intent:"primary"}}),E=r.forwardRef(({intent:e,icon:a,className:t,onCheckedChange:s,...i},k)=>{const[b,m]=r.useState(),p=C.useMergeRefs(k,n=>{m(n?.getAttribute("aria-checked"))}),f=(({icon:n,checked:c})=>{if(n)return n;switch(c){case"true":return r.createElement(l,null);case"mixed":return r.createElement(u,null);default:return null}})({icon:a,checked:b}),h=r.useCallback(n=>{if(typeof s=="function"){const[c,g]=[n!=="indeterminate"&&n,n==="indeterminate"||void 0];s(c,g)}},[]);return r.createElement(o.Root,{ref:p,className:N({intent:e,className:t}),...i,onCheckedChange:h},r.createElement(o.Indicator,{className:"text-surface flex items-center justify-center"},f))}),M=d.cva(["flex","items-center","gap-md","text-body-1"],{variants:{disabled:{true:["text-neutral/dim-2","cursor-not-allowed"],false:["cursor-pointer"]}},defaultVariants:{disabled:!1}}),j=({className:e,disabled:a,...t})=>r.createElement(w.Label,{className:M({className:e,disabled:a}),...t}),L=r.forwardRef(({children:e,className:a,...t},s)=>r.createElement(j,{"data-spark-component":"checkbox",className:a,disabled:t.disabled},r.createElement(E,{ref:s,...t}),e));exports.Checkbox=L;
package/dist/index.mjs DELETED
@@ -1,35 +0,0 @@
1
- import r, { forwardRef as C, useState as v, useCallback as w } from "react";
2
- import * as d from "@radix-ui/react-checkbox";
3
- import { useMergeRefs as y } from "@spark-ui/use-merge-refs";
4
- import { makeVariants as x } from "@spark-ui/internal-utils";
5
- import { cva as c } from "class-variance-authority";
6
- import { Label as N } from "@radix-ui/react-label";
7
- const l = r.forwardRef(({ title: e, fill: a = "currentColor", stroke: t = "none", ...s }, i) => r.createElement("svg", { ref: i, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...e && { "data-title": e }, fill: a, stroke: t, ...s, dangerouslySetInnerHTML: { __html: (e === void 0 ? "" : `<title>${e}</title>`) + '<path d="M8.91958 20.1667C8.73748 20.1667 8.56045 20.1323 8.38847 20.0635C8.21649 19.9947 8.05969 19.8915 7.91806 19.7539L2.42489 14.4176C2.14163 14.1425 2 13.8083 2 13.4152C2 13.0222 2.14163 12.688 2.42489 12.4129C2.70814 12.1377 3.04704 12.0001 3.44158 12.0001C3.83612 12.0001 4.18513 12.1377 4.48862 12.4129L8.91958 16.7173L19.5417 6.42797C19.825 6.1528 20.1639 6.0103 20.5584 6.00048C20.953 5.99065 21.2919 6.13315 21.5751 6.42797C21.8584 6.70313 22 7.03727 22 7.43036C22 7.82346 21.8584 8.15759 21.5751 8.43276L9.92109 19.7539C9.77946 19.8915 9.62266 19.9947 9.45068 20.0635C9.27871 20.1323 9.10167 20.1667 8.91958 20.1667Z"/>' } }));
8
- l.displayName = "Check";
9
- const m = r.forwardRef(({ title: e, fill: a = "currentColor", stroke: t = "none", ...s }, i) => r.createElement("svg", { ref: i, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...e && { "data-title": e }, fill: a, stroke: t, ...s, dangerouslySetInnerHTML: { __html: (e === void 0 ? "" : `<title>${e}</title>`) + '<path fill-rule="evenodd" clip-rule="evenodd" d="M2 11.9999C2 11.379 2.44772 10.8756 3 10.8756H21C21.5523 10.8756 22 11.379 22 11.9999C22 12.6208 21.5523 13.1242 21 13.1242H3C2.44772 13.1242 2 12.6208 2 11.9999Z"/>' } }));
10
- m.displayName = "Minus";
11
- const E = c(["h-sz-20 w-sz-20 border-md peer my-[var(--sz-1)] shrink-0 items-center justify-center self-baseline rounded-sm bg-transparent", "spark-disabled:opacity-dim-3 spark-disabled:cursor-not-allowed spark-disabled:hover:ring-0", "focus-visible:ring-outline-high focus-visible:outline-none focus-visible:ring-2", "hover:border-primary-container hover:outline-none hover:ring-2", "u-shadow-border-transition"], { variants: { intent: x({ primary: ["spark-state-unchecked:border-outline", "spark-state-indeterminate:border-primary spark-state-indeterminate:bg-primary", "spark-state-checked:border-primary spark-state-checked:bg-primary"], success: ["spark-state-unchecked:border-success", "spark-state-indeterminate:border-success spark-state-indeterminate:bg-success", "spark-state-checked:border-success spark-state-checked:bg-success"], alert: ["spark-state-unchecked:border-alert", "spark-state-indeterminate:border-alert spark-state-indeterminate:bg-alert", "spark-state-checked:border-alert spark-state-checked:bg-alert"], error: ["spark-state-unchecked:border-error", "spark-state-indeterminate:border-error spark-state-indeterminate:bg-error", "spark-state-checked:border-error spark-state-checked:bg-error"], info: ["spark-state-unchecked:border-info", "spark-state-indeterminate:border-info spark-state-indeterminate:bg-info", "spark-state-checked:border-info spark-state-checked:bg-info"], neutral: ["spark-state-unchecked:border-neutral", "spark-state-indeterminate:border-neutral spark-state-indeterminate:bg-neutral", "spark-state-checked:border-neutral spark-state-checked:bg-neutral"] }) }, defaultVariants: { intent: "primary" } }), L = C(({ intent: e, icon: a, className: t, onCheckedChange: s, ...i }, k) => {
12
- const [p, u] = v(), b = y(k, (n) => {
13
- u(n?.getAttribute("aria-checked"));
14
- }), f = (({ icon: n, checked: o }) => {
15
- if (n)
16
- return n;
17
- switch (o) {
18
- case "true":
19
- return r.createElement(l, null);
20
- case "mixed":
21
- return r.createElement(m, null);
22
- default:
23
- return null;
24
- }
25
- })({ icon: a, checked: p }), h = w((n) => {
26
- if (typeof s == "function") {
27
- const [o, g] = [n !== "indeterminate" && n, n === "indeterminate" || void 0];
28
- s(o, g);
29
- }
30
- }, []);
31
- return r.createElement(d.Root, { ref: b, className: E({ intent: e, className: t }), ...i, onCheckedChange: h }, r.createElement(d.Indicator, { className: "text-surface flex items-center justify-center" }, f));
32
- }), M = c(["flex", "items-center", "gap-md", "text-body-1"], { variants: { disabled: { true: ["text-neutral/dim-2", "cursor-not-allowed"], false: ["cursor-pointer"] } }, defaultVariants: { disabled: !1 } }), R = ({ className: e, disabled: a, ...t }) => r.createElement(N, { className: M({ className: e, disabled: a }), ...t }), V = r.forwardRef(({ children: e, className: a, ...t }, s) => r.createElement(R, { "data-spark-component": "checkbox", className: a, disabled: t.disabled }, r.createElement(L, { ref: s, ...t }), e));
33
- export {
34
- V as Checkbox
35
- };