@preply/ds-web-lib 10.0.0 → 11.1.0

package/dist/Checkbox-CtolNbxI.js

@@ -0,0 +1,108 @@
+"use client";
+import { filterAttributesPassedByRadixUIAtRuntime } from "./utils/filterAttributesPassedByRadixUIAtRuntime.js";
+import { t as renderIcon } from "./render-icon-Ch3b2dE0.js";
+import { t as require_jsx_runtime } from "./jsx-runtime-i4KUlhDu.js";
+import { useIndeterminate } from "./components/Checkbox/hooks/useIndeterminate.js";
+import * as React$1 from "react";
+import { forwardRef } from "react";
+import { getDatasetProps, moduleClassNames, stringClassNames } from "@preply/ds-web-core";
+import { webComponentNames } from "@preply/ds-visual-coverage-preply-component-names";
+import './assets/Checkbox.css';//#region src/components/Checkbox/svg/remove.svg
+var SvgRemove = ({ title, titleId, ...props }, ref) => /* @__PURE__ */ React$1.createElement("svg", {
+	"data-preply-ds-component": "SvgTokyoUIIcon",
+	viewBox: "0 0 14 2",
+	xmlns: "http://www.w3.org/2000/svg",
+	ref,
+	"aria-labelledby": titleId,
+	...props
+}, title ? /* @__PURE__ */ React$1.createElement("title", { id: titleId }, title) : null, /* @__PURE__ */ React$1.createElement("path", { d: "M0 0h14v2H0z" }));
+var ForwardRef$1 = forwardRef(SvgRemove);
+//#endregion
+//#region src/components/Checkbox/svg/checkmark.svg
+var SvgCheckmark = ({ title, titleId, ...props }, ref) => /* @__PURE__ */ React$1.createElement("svg", {
+	"data-preply-ds-component": "SvgTokyoUIIcon",
+	viewBox: "0 0 13 11",
+	xmlns: "http://www.w3.org/2000/svg",
+	ref,
+	"aria-labelledby": titleId,
+	...props
+}, title ? /* @__PURE__ */ React$1.createElement("title", { id: titleId }, title) : null, /* @__PURE__ */ React$1.createElement("path", {
+	fillRule: "evenodd",
+	clipRule: "evenodd",
+	d: "M3.923 10.101 0 6.18 1.179 5l2.744 2.744L11.667 0l1.178 1.179z"
+}));
+var ForwardRef = forwardRef(SvgCheckmark);
+var index_module_default = {
+	checkbox: "checkbox__KtCna",
+	remove: "remove__GrRcv",
+	checkmark: "checkmark__ha-Nu",
+	"checkbox--dsInternalSimulation-focus": "checkbox--dsInternalSimulation-focus__NqNUT"
+};
+//#endregion
+//#region src/components/Checkbox/Checkbox.tsx
+var import_jsx_runtime = require_jsx_runtime();
+/**
+* To make this accessible, you must label it using a `<label>` or `aria-label`:
+*
+* @example Using `<label>` parent
+* <label>
+*   Setting:
+*   <Checkbox />
+* </label>
+*
+* @example Using `<label>` sibling
+* <label id="setting-label">Setting:</label>
+* <Checkbox aria-labelledby="setting-label" />
+*
+* @example Using `aria-label`
+* <Checkbox aria-label="Setting" />
+*
+* It is uncontrolled by default, and can be manually controlled via the `checked` prop.
+*/
+var Checkbox = forwardRef(function Checkbox({ id, name, checked, defaultChecked, indeterminate, onChange, onCheckedChange, hasError, disabled, required, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, "aria-describedby": ariaDescribedby, dataset, dsInternalSimulation, onBlur, onFocus, ...restPropsPassedByRadixUI }, ref) {
+	const { mergedRef, onChangeHandler, ariaChecked } = useIndeterminate({
+		ref,
+		onChange,
+		indeterminate,
+		onCheckedChange
+	});
+	const classNames = moduleClassNames(index_module_default, "checkbox", [stringClassNames(`dsInternalSimulation`, dsInternalSimulation)]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		...filterAttributesPassedByRadixUIAtRuntime(restPropsPassedByRadixUI),
+		className: classNames.join(" "),
+		"data-preply-ds-component": webComponentNames.Checkbox,
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
+				id,
+				name,
+				type: "checkbox",
+				required,
+				disabled,
+				checked,
+				defaultChecked,
+				"aria-checked": ariaChecked,
+				"aria-invalid": hasError === true ? true : void 0,
+				"aria-label": ariaLabel,
+				"aria-labelledby": ariaLabelledby,
+				"aria-describedby": ariaDescribedby,
+				onChange: onChangeHandler,
+				ref: mergedRef,
+				onBlur,
+				onFocus,
+				...getDatasetProps(dataset)
+			}),
+			renderIcon(ForwardRef, {
+				focusable: "false",
+				"aria-hidden": "true",
+				className: index_module_default.checkmark
+			}),
+			renderIcon(ForwardRef$1, {
+				focusable: "false",
+				"aria-hidden": "true",
+				className: index_module_default.remove
+			})
+		]
+	});
+});
+//#endregion
+export { Checkbox as t };

package/dist/Chips-BRGw7Uup.js

@@ -0,0 +1,99 @@
+"use client";
+import { filterAttributesPassedByRadixUIAtRuntime } from "./utils/filterAttributesPassedByRadixUIAtRuntime.js";
+import { t as Icon } from "./Icon-CixAeOSd.js";
+import { t as require_jsx_runtime } from "./jsx-runtime-i4KUlhDu.js";
+import { genericAriaLabels } from "./utils/shared-strings.js";
+import * as React$1 from "react";
+import { forwardRef } from "react";
+import { getDatasetProps } from "@preply/ds-web-core";
+import { webComponentNames } from "@preply/ds-visual-coverage-preply-component-names";
+import { useIntl } from "react-intl";
+import './assets/Chips.css';var index_module_default = {
+	chips: "chips__0cCVU",
+	chip: "chip__t4Yxh",
+	"chip-toggle": "chip-toggle__Q6Xqq",
+	"chip-remove": "chip-remove__uHsIL"
+};
+//#endregion
+//#region src/components/deprecated/Chips/svg/close.svg
+var SvgClose = ({ title, titleId, ...props }, ref) => /* @__PURE__ */ React$1.createElement("svg", {
+	xmlns: "http://www.w3.org/2000/svg",
+	viewBox: "0 0 24 24",
+	ref,
+	"aria-labelledby": titleId,
+	...props
+}, title ? /* @__PURE__ */ React$1.createElement("title", { id: titleId }, title) : null, /* @__PURE__ */ React$1.createElement("path", {
+	fillRule: "evenodd",
+	d: "M7.207 5.793a1 1 0 0 0-1.414 1.414L10.586 12l-4.793 4.793a1 1 0 1 0 1.414 1.414L12 13.414l4.793 4.793a1 1 0 0 0 1.414-1.414L13.414 12l4.793-4.793a1 1 0 0 0-1.414-1.414L12 10.586 7.207 5.793Z",
+	clipRule: "evenodd"
+}));
+var ForwardRef = forwardRef(SvgClose);
+//#endregion
+//#region src/components/deprecated/Chips/Chips.tsx
+var import_jsx_runtime = require_jsx_runtime();
+/**
+* A Chips container.
+*
+* Add `Chips.Item` children to render a list of Chips.
+*
+* @deprecated Use `SingleSelectChips`, `MultiSelectChips`, or `DismissibleChips` instead.
+* @see {@link https://ds.preply.org/latest/?path=/docs/components-chips-singleselectchips--docs SingleSelectChips}
+* @see {@link https://ds.preply.org/latest/?path=/docs/components-chips-multiselectchips--docs MultiSelectChips}
+* @see {@link https://ds.preply.org/latest/?path=/docs/components-chips-dismissiblechips--docs DismissibleChips}
+*/
+var Chips = ({ variant = "choice", children, "aria-label": ariaLabel, dataset }) => {
+	const dataAttributes = {
+		...dataset,
+		variant
+	};
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", {
+		"aria-label": ariaLabel,
+		className: index_module_default.chips,
+		...getDatasetProps(dataAttributes, { preplyDsComponent: webComponentNames.Chips }),
+		children
+	});
+};
+Chips.Item = forwardRef(function ChipsItem({ label, leadingSvgIcon, pressed, onToggle, onRemove, "aria-controls": ariaControls, dataset, ...restPropsPassedByRadixUI }, ref) {
+	const { formatMessage } = useIntl();
+	const toggle = () => onToggle === null || onToggle === void 0 ? void 0 : onToggle(!pressed);
+	const remove = onRemove !== null && onRemove !== void 0 ? onRemove : toggle;
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", {
+		...filterAttributesPassedByRadixUIAtRuntime(restPropsPassedByRadixUI),
+		ref,
+		className: index_module_default.chip,
+		...getDatasetProps(dataset, { preplyDsComponent: webComponentNames.Chip }),
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
+			type: "button",
+			className: index_module_default["chip-toggle"],
+			"aria-pressed": pressed,
+			"aria-controls": ariaControls,
+			onClick: toggle,
+			onKeyUp: (e) => {
+				switch (e.key) {
+					case "Backspace":
+					case "Delete":
+						if (!pressed) return;
+						toggle();
+						break;
+					default:
+				}
+			},
+			children: [leadingSvgIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {
+				size: "24",
+				svg: leadingSvgIcon
+			}), label]
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: index_module_default["chip-remove"],
+			onClick: remove,
+			"aria-label": formatMessage(genericAriaLabels.remove),
+			"aria-controls": ariaControls,
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {
+				size: "24",
+				svg: ForwardRef
+			})
+		})]
+	});
+});
+//#endregion
+export { Chips as t };