npm - @fanvue/ui - Versions diffs - 3.13.0 → 3.14.1 - Mend

@fanvue/ui 3.13.0 → 3.14.1

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.

Files changed (31) hide show

package/dist/cjs/components/Icons/GridViewIcon.cjs ADDED Viewed

@@ -0,0 +1,50 @@
+"use client";
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const BaseIcon = require("./BaseIcon.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const VARIANTS = {
+  16: {
+    outlined: [
+      {
+        d: "M14.667 5.68V2.653c0-.94-.427-1.32-1.487-1.32h-2.693c-1.06 0-1.487.38-1.487 1.32v3.02c0 .947.427 1.32 1.487 1.32h2.693c1.06.007 1.487-.373 1.487-1.313m0 7.5v-2.693C14.667 9.427 14.24 9 13.18 9h-2.693C9.427 9 9 9.427 9 10.487v2.693c0 1.06.427 1.487 1.487 1.487h2.693c1.06 0 1.487-.427 1.487-1.487M7 5.68V2.653c0-.94-.427-1.32-1.487-1.32H2.82c-1.06 0-1.487.38-1.487 1.32v3.02c0 .947.427 1.32 1.487 1.32h2.693C6.573 7 7 6.62 7 5.68m0 7.5v-2.693C7 9.427 6.573 9 5.513 9H2.82c-1.06 0-1.487.427-1.487 1.487v2.693c0 1.06.427 1.487 1.487 1.487h2.693C6.573 14.667 7 14.24 7 13.18"
+      }
+    ]
+  },
+  24: {
+    outlined: [
+      {
+        d: "M22 8.52V3.98C22 2.57 21.36 2 19.77 2h-4.04c-1.59 0-2.23.57-2.23 1.98v4.53c0 1.42.64 1.98 2.23 1.98h4.04c1.59.01 2.23-.56 2.23-1.97m0 11.25v-4.04c0-1.59-.64-2.23-2.23-2.23h-4.04c-1.59 0-2.23.64-2.23 2.23v4.04c0 1.59.64 2.23 2.23 2.23h4.04c1.59 0 2.23-.64 2.23-2.23M10.5 8.52V3.98C10.5 2.57 9.86 2 8.27 2H4.23C2.64 2 2 2.57 2 3.98v4.53c0 1.42.64 1.98 2.23 1.98h4.04c1.59.01 2.23-.56 2.23-1.97m0 11.25v-4.04c0-1.59-.64-2.23-2.23-2.23H4.23c-1.59 0-2.23.64-2.23 2.23v4.04C2 21.36 2.64 22 4.23 22h4.04c1.59 0 2.23-.64 2.23-2.23"
+      }
+    ]
+  },
+  32: {
+    outlined: [
+      {
+        d: "M29.333 11.36V5.307c0-1.88-.853-2.64-2.973-2.64h-5.387c-2.12 0-2.973.76-2.973 2.64v6.04c0 1.893.853 2.64 2.973 2.64h5.387c2.12.013 2.973-.747 2.973-2.627m0 15v-5.387c0-2.12-.853-2.973-2.973-2.973h-5.387c-2.12 0-2.973.853-2.973 2.973v5.387c0 2.12.853 2.973 2.973 2.973h5.387c2.12 0 2.973-.853 2.973-2.973M14 11.36V5.307c0-1.88-.853-2.64-2.973-2.64H5.64c-2.12 0-2.973.76-2.973 2.64v6.04c0 1.893.853 2.64 2.973 2.64h5.387C13.147 14 14 13.24 14 11.36m0 15v-5.387c0-2.12-.853-2.973-2.973-2.973H5.64c-2.12 0-2.973.853-2.973 2.973v5.387c0 2.12.853 2.973 2.973 2.973h5.387c2.12 0 2.973-.853 2.973-2.973"
+      }
+    ]
+  }
+};
+const GridViewIcon = React__namespace.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(BaseIcon.BaseIcon, { ref, variants: VARIANTS, ...props }));
+GridViewIcon.displayName = "GridViewIcon";
+exports.GridViewIcon = GridViewIcon;
+//# sourceMappingURL=GridViewIcon.cjs.map

package/dist/cjs/components/Icons/GridViewIcon.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"GridViewIcon.cjs","sources":["../../../../src/components/Icons/GridViewIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { BaseIcon } from \"./BaseIcon\";\nimport type { BaseIconProps, IconVariants } from \"./types\";\n\nconst VARIANTS: IconVariants = {\n 16: {\n outlined: [\n {\n d: \"M14.667 5.68V2.653c0-.94-.427-1.32-1.487-1.32h-2.693c-1.06 0-1.487.38-1.487 1.32v3.02c0 .947.427 1.32 1.487 1.32h2.693c1.06.007 1.487-.373 1.487-1.313m0 7.5v-2.693C14.667 9.427 14.24 9 13.18 9h-2.693C9.427 9 9 9.427 9 10.487v2.693c0 1.06.427 1.487 1.487 1.487h2.693c1.06 0 1.487-.427 1.487-1.487M7 5.68V2.653c0-.94-.427-1.32-1.487-1.32H2.82c-1.06 0-1.487.38-1.487 1.32v3.02c0 .947.427 1.32 1.487 1.32h2.693C6.573 7 7 6.62 7 5.68m0 7.5v-2.693C7 9.427 6.573 9 5.513 9H2.82c-1.06 0-1.487.427-1.487 1.487v2.693c0 1.06.427 1.487 1.487 1.487h2.693C6.573 14.667 7 14.24 7 13.18\",\n },\n ],\n },\n 24: {\n outlined: [\n {\n d: \"M22 8.52V3.98C22 2.57 21.36 2 19.77 2h-4.04c-1.59 0-2.23.57-2.23 1.98v4.53c0 1.42.64 1.98 2.23 1.98h4.04c1.59.01 2.23-.56 2.23-1.97m0 11.25v-4.04c0-1.59-.64-2.23-2.23-2.23h-4.04c-1.59 0-2.23.64-2.23 2.23v4.04c0 1.59.64 2.23 2.23 2.23h4.04c1.59 0 2.23-.64 2.23-2.23M10.5 8.52V3.98C10.5 2.57 9.86 2 8.27 2H4.23C2.64 2 2 2.57 2 3.98v4.53c0 1.42.64 1.98 2.23 1.98h4.04c1.59.01 2.23-.56 2.23-1.97m0 11.25v-4.04c0-1.59-.64-2.23-2.23-2.23H4.23c-1.59 0-2.23.64-2.23 2.23v4.04C2 21.36 2.64 22 4.23 22h4.04c1.59 0 2.23-.64 2.23-2.23\",\n },\n ],\n },\n 32: {\n outlined: [\n {\n d: \"M29.333 11.36V5.307c0-1.88-.853-2.64-2.973-2.64h-5.387c-2.12 0-2.973.76-2.973 2.64v6.04c0 1.893.853 2.64 2.973 2.64h5.387c2.12.013 2.973-.747 2.973-2.627m0 15v-5.387c0-2.12-.853-2.973-2.973-2.973h-5.387c-2.12 0-2.973.853-2.973 2.973v5.387c0 2.12.853 2.973 2.973 2.973h5.387c2.12 0 2.973-.853 2.973-2.973M14 11.36V5.307c0-1.88-.853-2.64-2.973-2.64H5.64c-2.12 0-2.973.76-2.973 2.64v6.04c0 1.893.853 2.64 2.973 2.64h5.387C13.147 14 14 13.24 14 11.36m0 15v-5.387c0-2.12-.853-2.973-2.973-2.973H5.64c-2.12 0-2.973.853-2.973 2.973v5.387c0 2.12.853 2.973 2.973 2.973h5.387c2.12 0 2.973-.853 2.973-2.973\",\n },\n ],\n },\n};\n\n/** Props for {@link GridViewIcon}. See {@link BaseIconProps} for the shared shape. */\nexport type GridViewIconProps = BaseIconProps;\n\n/**\n * Grid view icon. Renders at sizes 16, 24, or 32 px.\n *\n * @example\n * ```tsx\n * <GridViewIcon size={24} />\n * ```\n */\nexport const GridViewIcon = React.forwardRef<SVGSVGElement, GridViewIconProps>((props, ref) => (\n <BaseIcon ref={ref} variants={VARIANTS} {...props} />\n));\n\nGridViewIcon.displayName = \"GridViewIcon\";\n"],"names":["React","jsx","BaseIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIA,MAAM,WAAyB;AAAA,EAC7B,IAAI;AAAA,IACF,UAAU;AAAA,MACR;AAAA,QACE,GAAG;AAAA,MAAA;AAAA,IACL;AAAA,EACF;AAAA,EAEF,IAAI;AAAA,IACF,UAAU;AAAA,MACR;AAAA,QACE,GAAG;AAAA,MAAA;AAAA,IACL;AAAA,EACF;AAAA,EAEF,IAAI;AAAA,IACF,UAAU;AAAA,MACR;AAAA,QACE,GAAG;AAAA,MAAA;AAAA,IACL;AAAA,EACF;AAEJ;AAaO,MAAM,eAAeA,iBAAM,WAA6C,CAAC,OAAO,QACrFC,2BAAAA,IAACC,SAAAA,UAAA,EAAS,KAAU,UAAU,UAAW,GAAG,OAAO,CACpD;AAED,aAAa,cAAc;;"}

package/dist/cjs/components/Icons/ListViewIcon.cjs ADDED Viewed

@@ -0,0 +1,50 @@
+"use client";
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const BaseIcon = require("./BaseIcon.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const VARIANTS = {
+  16: {
+    outlined: [
+      {
+        d: "M13.267 9H2.733c-1 0-1.4.427-1.4 1.487v2.693c0 1.06.4 1.487 1.4 1.487h10.534c1 0 1.4-.427 1.4-1.487v-2.693c0-1.06-.4-1.487-1.4-1.487m0-7.667H2.733c-1 0-1.4.427-1.4 1.487v2.693c0 1.06.4 1.487 1.4 1.487h10.534c1 0 1.4-.427 1.4-1.487V2.82c0-1.06-.4-1.487-1.4-1.487"
+      }
+    ]
+  },
+  24: {
+    outlined: [
+      {
+        d: "M19.9 13.5H4.1c-1.5 0-2.1.64-2.1 2.23v4.04C2 21.36 2.6 22 4.1 22h15.8c1.5 0 2.1-.64 2.1-2.23v-4.04c0-1.59-.6-2.23-2.1-2.23m0-11.5H4.1C2.6 2 2 2.64 2 4.23v4.04c0 1.59.6 2.23 2.1 2.23h15.8c1.5 0 2.1-.64 2.1-2.23V4.23C22 2.64 21.4 2 19.9 2"
+      }
+    ]
+  },
+  32: {
+    outlined: [
+      {
+        d: "M26.533 18H5.467c-2 0-2.8.853-2.8 2.973v5.387c0 2.12.8 2.973 2.8 2.973h21.066c2 0 2.8-.853 2.8-2.973v-5.387c0-2.12-.8-2.973-2.8-2.973m0-15.333H5.467c-2 0-2.8.853-2.8 2.973v5.387c0 2.12.8 2.973 2.8 2.973h21.066c2 0 2.8-.854 2.8-2.973V5.64c0-2.12-.8-2.973-2.8-2.973"
+      }
+    ]
+  }
+};
+const ListViewIcon = React__namespace.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(BaseIcon.BaseIcon, { ref, variants: VARIANTS, ...props }));
+ListViewIcon.displayName = "ListViewIcon";
+exports.ListViewIcon = ListViewIcon;
+//# sourceMappingURL=ListViewIcon.cjs.map

package/dist/cjs/components/Icons/ListViewIcon.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ListViewIcon.cjs","sources":["../../../../src/components/Icons/ListViewIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { BaseIcon } from \"./BaseIcon\";\nimport type { BaseIconProps, IconVariants } from \"./types\";\n\nconst VARIANTS: IconVariants = {\n 16: {\n outlined: [\n {\n d: \"M13.267 9H2.733c-1 0-1.4.427-1.4 1.487v2.693c0 1.06.4 1.487 1.4 1.487h10.534c1 0 1.4-.427 1.4-1.487v-2.693c0-1.06-.4-1.487-1.4-1.487m0-7.667H2.733c-1 0-1.4.427-1.4 1.487v2.693c0 1.06.4 1.487 1.4 1.487h10.534c1 0 1.4-.427 1.4-1.487V2.82c0-1.06-.4-1.487-1.4-1.487\",\n },\n ],\n },\n 24: {\n outlined: [\n {\n d: \"M19.9 13.5H4.1c-1.5 0-2.1.64-2.1 2.23v4.04C2 21.36 2.6 22 4.1 22h15.8c1.5 0 2.1-.64 2.1-2.23v-4.04c0-1.59-.6-2.23-2.1-2.23m0-11.5H4.1C2.6 2 2 2.64 2 4.23v4.04c0 1.59.6 2.23 2.1 2.23h15.8c1.5 0 2.1-.64 2.1-2.23V4.23C22 2.64 21.4 2 19.9 2\",\n },\n ],\n },\n 32: {\n outlined: [\n {\n d: \"M26.533 18H5.467c-2 0-2.8.853-2.8 2.973v5.387c0 2.12.8 2.973 2.8 2.973h21.066c2 0 2.8-.853 2.8-2.973v-5.387c0-2.12-.8-2.973-2.8-2.973m0-15.333H5.467c-2 0-2.8.853-2.8 2.973v5.387c0 2.12.8 2.973 2.8 2.973h21.066c2 0 2.8-.854 2.8-2.973V5.64c0-2.12-.8-2.973-2.8-2.973\",\n },\n ],\n },\n};\n\n/** Props for {@link ListViewIcon}. See {@link BaseIconProps} for the shared shape. */\nexport type ListViewIconProps = BaseIconProps;\n\n/**\n * List view icon. Renders at sizes 16, 24, or 32 px.\n *\n * @example\n * ```tsx\n * <ListViewIcon size={24} />\n * ```\n */\nexport const ListViewIcon = React.forwardRef<SVGSVGElement, ListViewIconProps>((props, ref) => (\n <BaseIcon ref={ref} variants={VARIANTS} {...props} />\n));\n\nListViewIcon.displayName = \"ListViewIcon\";\n"],"names":["React","jsx","BaseIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIA,MAAM,WAAyB;AAAA,EAC7B,IAAI;AAAA,IACF,UAAU;AAAA,MACR;AAAA,QACE,GAAG;AAAA,MAAA;AAAA,IACL;AAAA,EACF;AAAA,EAEF,IAAI;AAAA,IACF,UAAU;AAAA,MACR;AAAA,QACE,GAAG;AAAA,MAAA;AAAA,IACL;AAAA,EACF;AAAA,EAEF,IAAI;AAAA,IACF,UAAU;AAAA,MACR;AAAA,QACE,GAAG;AAAA,MAAA;AAAA,IACL;AAAA,EACF;AAEJ;AAaO,MAAM,eAAeA,iBAAM,WAA6C,CAAC,OAAO,QACrFC,2BAAAA,IAACC,SAAAA,UAAA,EAAS,KAAU,UAAU,UAAW,GAAG,OAAO,CACpD;AAED,aAAa,cAAc;;"}

package/dist/cjs/components/SegmentedControl/SegmentedControl.cjs CHANGED Viewed

@@ -35,11 +35,47 @@ function warnMissingAccessibleName(ariaLabel, ariaLabelledBy) {
     }
   }
 }
+function warnMissingOptionAccessibleName(options) {
+  if (process.env.NODE_ENV !== "production") {
+    for (const option of options) {
+      if (option.icon && !option.label?.trim()) {
+        console.warn(
+          `SegmentedControl: icon-only segment "${option.value}" is missing a non-empty \`label\` to use as its accessible name.`
+        );
+      }
+    }
+  }
+}
+function getSegmentClassName({
+  appearance,
+  size,
+  variant,
+  isSelected,
+  disabled
+}) {
+  return cn.cn(
+    "relative inline-flex min-w-0 cursor-pointer items-center justify-center rounded-full",
+    "motion-safe:transition-colors motion-safe:duration-150 motion-safe:ease-in-out",
+    "focus-visible:shadow-focus-ring focus-visible:outline-none",
+    variant === "fill" ? "flex-1" : "shrink-0",
+    appearance === "plain" ? cn.cn(
+      // Padding + negative margin enlarge the hit target without changing the
+      // visual footprint, which must stay glyph-only to match the design.
+      "-m-1 p-1",
+      isSelected ? "text-icons-primary" : "text-icons-tertiary hover:text-icons-primary"
+    ) : cn.cn(
+      sizeClasses[size],
+      isSelected ? "bg-buttons-primary-default text-content-primary-inverted shadow-sm" : "text-content-primary hover:bg-buttons-switch-hover"
+    ),
+    disabled && "pointer-events-none"
+  );
+}
 const SegmentedControl = React__namespace.forwardRef(
   ({
     className,
     size = "32",
     variant = "hug",
+    appearance = "pill",
     options,
     value: controlledValue,
     defaultValue,
@@ -48,6 +84,7 @@ const SegmentedControl = React__namespace.forwardRef(
     ...props
   }, ref) => {
     warnMissingAccessibleName(props["aria-label"], props["aria-labelledby"]);
+    warnMissingOptionAccessibleName(options);
     const [internalValue, setInternalValue] = React__namespace.useState(defaultValue ?? options[0]?.value);
     const isControlled = controlledValue !== void 0;
     const currentValue = isControlled ? controlledValue : internalValue;
@@ -74,8 +111,9 @@ const SegmentedControl = React__namespace.forwardRef(
         ref,
         role: "radiogroup",
         className: cn.cn(
-          "relative items-center rounded-full bg-surface-tertiary p-1",
+          "relative items-center rounded-full",
           variant === "fill" ? "flex w-full" : "inline-flex",
+          appearance === "plain" ? "gap-2" : "bg-surface-tertiary p-1",
           disabled && "cursor-not-allowed opacity-50",
           className
         ),
@@ -95,18 +133,11 @@ const SegmentedControl = React__namespace.forwardRef(
                 "aria-checked": isSelected,
                 tabIndex: isSelected || !anySelected && index === 0 ? 0 : -1,
                 disabled,
+                "aria-label": option.icon ? option.label : void 0,
                 onClick: () => handleSelect(option.value),
                 onKeyDown: (e) => handleKeyDown(e, index),
-                className: cn.cn(
-                  "relative inline-flex min-w-0 cursor-pointer items-center justify-center rounded-full",
-                  "motion-safe:transition-colors motion-safe:duration-150 motion-safe:ease-in-out",
-                  "focus-visible:shadow-focus-ring focus-visible:outline-none",
-                  variant === "fill" ? "flex-1" : "shrink-0",
-                  sizeClasses[size],
-                  isSelected ? "bg-buttons-primary-default text-content-primary-inverted shadow-sm" : "text-content-primary hover:bg-buttons-switch-hover",
-                  disabled && "pointer-events-none"
-                ),
-                children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: option.label })
+                className: getSegmentClassName({ appearance, size, variant, isSelected, disabled }),
+                children: option.icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex shrink-0 items-center justify-center", "aria-hidden": "true", children: option.icon }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: option.label })
               },
               option.value
             )

package/dist/cjs/components/SegmentedControl/SegmentedControl.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SegmentedControl.cjs","sources":["../../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Height of the segmented control in pixels. /\nexport type SegmentedControlSize = \"32\" \| \"40\" \| \"48\";\n\n/\n Segment layout.\n * - `\"hug\"`: each segment is sized to its content.\n * - `\"fill\"`: the control spans the full width of its container and each segment grows equally.\n /\nexport type SegmentedControlVariant = \"hug\" \| \"fill\";\n\n/* Describes one selectable segment. /\nexport interface SegmentedControlOption {\n /* Display label for the segment. /\n label: string;\n /* Value identifier returned via `onChange`. /\n value: string;\n}\n\nexport interface SegmentedControlProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n /* Height of the control in pixels. @default \"32\" /\n size?: SegmentedControlSize;\n /* Segment layout. @default \"hug\" /\n variant?: SegmentedControlVariant;\n /* The selectable segments. Designed for two or three mutually exclusive options. /\n options: SegmentedControlOption[];\n /* Currently selected value (controlled). /\n value?: string;\n /* Initially selected value (uncontrolled). Defaults to the first option. /\n defaultValue?: string;\n /* Callback fired when the selected value changes. /\n onChange?: (value: string) => void;\n /* Whether the control is disabled. @default false /\n disabled?: boolean;\n}\n\n/* Padding and typography per size. Combined with the container's `p-1` these hit the 32/40/48px heights. /\nconst sizeClasses: Record<SegmentedControlSize, string> = {\n \"32\": \"px-2 py-1 typography-description-12px-semibold\",\n \"40\": \"px-3 py-1.75 typography-body-small-14px-semibold\",\n \"48\": \"px-4 py-2 typography-body-default-16px-semibold\",\n};\n\nfunction warnMissingAccessibleName(ariaLabel?: string, ariaLabelledBy?: string) {\n if (process.env.NODE_ENV !== \"production\") {\n if (!ariaLabel && !ariaLabelledBy) {\n console.warn(\n \"SegmentedControl: no accessible name provided. Pass an `aria-label` or `aria-labelledby` prop.\",\n );\n }\n }\n}\n\n/\n A compact selector for choosing between two or three mutually exclusive\n * options where the choice affects the content immediately below it. Use\n * instead of tabs when the options are more like settings or filters than\n * navigation, such as toggling a list/grid view or a monthly/annual price.\n \n Rendered as a `radiogroup` with roving-tabindex keyboard navigation. Supports\n * both controlled and uncontrolled usage.\n \n @example\n * ```tsx\n * <SegmentedControl\n * options={[\n * { label: \"Net\", value: \"net\" },\n * { label: \"Gross\", value: \"gross\" },\n * ]}\n * value={amount}\n * onChange={setAmount}\n * aria-label=\"Amount type\"\n * />\n * ```\n */\nexport const SegmentedControl = React.forwardRef<HTMLDivElement, SegmentedControlProps>(\n (\n {\n className,\n size = \"32\",\n variant = \"hug\",\n options,\n value: controlledValue,\n defaultValue,\n onChange,\n disabled = false,\n ...props\n },\n ref,\n ) => {\n warnMissingAccessibleName(props[\"aria-label\"], props[\"aria-labelledby\"]);\n\n // Tracks selection for uncontrolled usage; ignored when `value` prop is provided\n const [internalValue, setInternalValue] = React.useState(defaultValue ?? options[0]?.value);\n const isControlled = controlledValue !== undefined;\n const currentValue = isControlled ? controlledValue : internalValue;\n const anySelected = options.some((o) => o.value === currentValue);\n const buttonRefs = React.useRef<(HTMLButtonElement \| null)[]>([]);\n\n const handleSelect = (optionValue: string) => {\n if (disabled \|\| optionValue === currentValue) return;\n if (!isControlled) {\n setInternalValue(optionValue);\n }\n onChange?.(optionValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent, index: number) => {\n const nextIndex =\n e.key === \"ArrowRight\" \|\| e.key === \"ArrowDown\"\n ? (index + 1) % options.length\n : e.key === \"ArrowLeft\" \|\| e.key === \"ArrowUp\"\n ? (index - 1 + options.length) % options.length\n : null;\n if (nextIndex === null) return;\n e.preventDefault();\n const nextOption = options[nextIndex] as SegmentedControlOption;\n handleSelect(nextOption.value);\n buttonRefs.current[nextIndex]?.focus();\n };\n\n return (\n <div\n ref={ref}\n role=\"radiogroup\"\n className={cn(\n \"relative items-center rounded-full bg-surface-tertiary p-1\",\n variant === \"fill\" ? \"flex w-full\" : \"inline-flex\",\n disabled && \"cursor-not-allowed opacity-50\",\n className,\n )}\n {...props}\n >\n {options.map((option, index) => {\n const isSelected = currentValue === option.value;\n return (\n // biome-ignore lint/a11y/useSemanticElements: native radio inputs only allow Tab-focus on the checked item; buttons with roving tabindex give full keyboard navigation\n <button\n key={option.value}\n ref={(el) => {\n buttonRefs.current[index] = el;\n }}\n type=\"button\"\n role=\"radio\"\n aria-checked={isSelected}\n tabIndex={isSelected \|\| (!anySelected && index === 0) ? 0 : -1}\n disabled={disabled}\n onClick={() => handleSelect(option.value)}\n onKeyDown={(e) => handleKeyDown(e, index)}\n className={cn(\n \"relative inline-flex min-w-0 cursor-pointer items-center justify-center rounded-full\",\n \"motion-safe:transition-colors motion-safe:duration-150 motion-safe:ease-in-out\",\n \"focus-visible:shadow-focus-ring focus-visible:outline-none\",\n variant === \"fill\" ? \"flex-1\" : \"shrink-0\",\n sizeClasses[size],\n isSelected\n ? \"bg-buttons-primary-default text-content-primary-inverted shadow-sm\"\n : \"text-content-primary hover:bg-buttons-switch-hover\",\n disabled && \"pointer-events-none\",\n )}\n >\n <span className=\"min-w-0 truncate\">{option.label}</span>\n </button>\n );\n })}\n </div>\n );\n },\n);\n\nSegmentedControl.displayName = \"SegmentedControl\";\n"],"names":["React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAwCA,MAAM,cAAoD;AAAA,EACxD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AACR;AAEA,SAAS,0BAA0B,WAAoB,gBAAyB;AAC9E,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,QAAI,CAAC,aAAa,CAAC,gBAAgB;AACjC,cAAQ;AAAA,QACN;AAAA,MAAA;AAAA,IAEJ;AAAA,EACF;AACF;AAwBO,MAAM,mBAAmBA,iBAAM;AAAA,EACpC,CACE;AAAA,IACE;AAAA,IACA,OAAO;AAAA,IACP,UAAU;AAAA,IACV;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,GAAG;AAAA,EAAA,GAEL,QACG;AACH,8BAA0B,MAAM,YAAY,GAAG,MAAM,iBAAiB,CAAC;AAGvE,UAAM,CAAC,eAAe,gBAAgB,IAAIA,iBAAM,SAAS,gBAAgB,QAAQ,CAAC,GAAG,KAAK;AAC1F,UAAM,eAAe,oBAAoB;AACzC,UAAM,eAAe,eAAe,kBAAkB;AACtD,UAAM,cAAc,QAAQ,KAAK,CAAC,MAAM,EAAE,UAAU,YAAY;AAChE,UAAM,aAAaA,iBAAM,OAAqC,EAAE;AAEhE,UAAM,eAAe,CAAC,gBAAwB;AAC5C,UAAI,YAAY,gBAAgB,aAAc;AAC9C,UAAI,CAAC,cAAc;AACjB,yBAAiB,WAAW;AAAA,MAC9B;AACA,iBAAW,WAAW;AAAA,IACxB;AAEA,UAAM,gBAAgB,CAAC,GAAwB,UAAkB;AAC/D,YAAM,YACJ,EAAE,QAAQ,gBAAgB,EAAE,QAAQ,eAC/B,QAAQ,KAAK,QAAQ,SACtB,EAAE,QAAQ,eAAe,EAAE,QAAQ,aAChC,QAAQ,IAAI,QAAQ,UAAU,QAAQ,SACvC;AACR,UAAI,cAAc,KAAM;AACxB,QAAE,eAAA;AACF,YAAM,aAAa,QAAQ,SAAS;AACpC,mBAAa,WAAW,KAAK;AAC7B,iBAAW,QAAQ,SAAS,GAAG,MAAA;AAAA,IACjC;AAEA,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,WAAWC,GAAAA;AAAAA,UACT;AAAA,UACA,YAAY,SAAS,gBAAgB;AAAA,UACrC,YAAY;AAAA,UACZ;AAAA,QAAA;AAAA,QAED,GAAG;AAAA,QAEH,UAAA,QAAQ,IAAI,CAAC,QAAQ,UAAU;AAC9B,gBAAM,aAAa,iBAAiB,OAAO;AAC3C;AAAA;AAAA,YAEED,2BAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,KAAK,CAAC,OAAO;AACX,6BAAW,QAAQ,KAAK,IAAI;AAAA,gBAC9B;AAAA,gBACA,MAAK;AAAA,gBACL,MAAK;AAAA,gBACL,gBAAc;AAAA,gBACd,UAAU,cAAe,CAAC,eAAe,UAAU,IAAK,IAAI;AAAA,gBAC5D;AAAA,gBACA,SAAS,MAAM,aAAa,OAAO,KAAK;AAAA,gBACxC,WAAW,CAAC,MAAM,cAAc,GAAG,KAAK;AAAA,gBACxC,WAAWC,GAAAA;AAAAA,kBACT;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA,YAAY,SAAS,WAAW;AAAA,kBAChC,YAAY,IAAI;AAAA,kBAChB,aACI,uEACA;AAAA,kBACJ,YAAY;AAAA,gBAAA;AAAA,gBAGd,UAAAD,2BAAAA,IAAC,QAAA,EAAK,WAAU,oBAAoB,iBAAO,MAAA,CAAM;AAAA,cAAA;AAAA,cAvB5C,OAAO;AAAA,YAAA;AAAA;AAAA,QA0BlB,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEA,iBAAiB,cAAc;;"}
1	+ {"version":3,"file":"SegmentedControl.cjs","sources":["../../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Height of the segmented control in pixels. /\nexport type SegmentedControlSize = \"32\" \| \"40\" \| \"48\";\n\n/\n Segment layout.\n * - `\"hug\"`: each segment is sized to its content.\n * - `\"fill\"`: the control spans the full width of its container and each segment grows equally.\n /\nexport type SegmentedControlVariant = \"hug\" \| \"fill\";\n\n/\n Visual style of the control.\n * - `\"pill\"`: the container has a muted background and the selected segment shows a filled pill (default).\n * - `\"plain\"`: no container or selected-pill background; segments are bare content and selection is\n * communicated by color alone. Designed for icon-only toggles (e.g. a list/grid view switch).\n /\nexport type SegmentedControlAppearance = \"pill\" \| \"plain\";\n\n/* Describes one selectable segment. /\nexport interface SegmentedControlOption {\n /\n Display label for the segment. When `icon` is provided, the segment renders icon-only and\n * this value is used as its accessible name (applied as `aria-label`) instead of visible text.\n /\n label: string;\n /* Value identifier returned via `onChange`. /\n value: string;\n /\n Icon to render instead of the visible label. When set, the segment renders icon-only and\n * `label` becomes required as its accessible name — it is applied as `aria-label` and no\n * visible text is rendered.\n /\n icon?: React.ReactNode;\n}\n\nexport interface SegmentedControlProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n /* Height of the control in pixels. @default \"32\" /\n size?: SegmentedControlSize;\n /* Segment layout. @default \"hug\" /\n variant?: SegmentedControlVariant;\n /* Visual style of the control. @default \"pill\" /\n appearance?: SegmentedControlAppearance;\n /* The selectable segments. Designed for two or three mutually exclusive options. /\n options: SegmentedControlOption[];\n /* Currently selected value (controlled). /\n value?: string;\n /* Initially selected value (uncontrolled). Defaults to the first option. /\n defaultValue?: string;\n /* Callback fired when the selected value changes. /\n onChange?: (value: string) => void;\n /* Whether the control is disabled. @default false /\n disabled?: boolean;\n}\n\n/* Padding and typography per size. Combined with the container's `p-1` these hit the 32/40/48px heights. /\nconst sizeClasses: Record<SegmentedControlSize, string> = {\n \"32\": \"px-2 py-1 typography-description-12px-semibold\",\n \"40\": \"px-3 py-1.75 typography-body-small-14px-semibold\",\n \"48\": \"px-4 py-2 typography-body-default-16px-semibold\",\n};\n\nfunction warnMissingAccessibleName(ariaLabel?: string, ariaLabelledBy?: string) {\n if (process.env.NODE_ENV !== \"production\") {\n if (!ariaLabel && !ariaLabelledBy) {\n console.warn(\n \"SegmentedControl: no accessible name provided. Pass an `aria-label` or `aria-labelledby` prop.\",\n );\n }\n }\n}\n\nfunction warnMissingOptionAccessibleName(options: SegmentedControlOption[]) {\n if (process.env.NODE_ENV !== \"production\") {\n for (const option of options) {\n if (option.icon && !option.label?.trim()) {\n console.warn(\n `SegmentedControl: icon-only segment \"${option.value}\" is missing a non-empty \\`label\\` to use as its accessible name.`,\n );\n }\n }\n }\n}\n\nfunction getSegmentClassName({\n appearance,\n size,\n variant,\n isSelected,\n disabled,\n}: {\n appearance: SegmentedControlAppearance;\n size: SegmentedControlSize;\n variant: SegmentedControlVariant;\n isSelected: boolean;\n disabled: boolean;\n}) {\n return cn(\n \"relative inline-flex min-w-0 cursor-pointer items-center justify-center rounded-full\",\n \"motion-safe:transition-colors motion-safe:duration-150 motion-safe:ease-in-out\",\n \"focus-visible:shadow-focus-ring focus-visible:outline-none\",\n variant === \"fill\" ? \"flex-1\" : \"shrink-0\",\n appearance === \"plain\"\n ? cn(\n // Padding + negative margin enlarge the hit target without changing the\n // visual footprint, which must stay glyph-only to match the design.\n \"-m-1 p-1\",\n isSelected ? \"text-icons-primary\" : \"text-icons-tertiary hover:text-icons-primary\",\n )\n : cn(\n sizeClasses[size],\n isSelected\n ? \"bg-buttons-primary-default text-content-primary-inverted shadow-sm\"\n : \"text-content-primary hover:bg-buttons-switch-hover\",\n ),\n disabled && \"pointer-events-none\",\n );\n}\n\n/\n A compact selector for choosing between two or three mutually exclusive\n * options where the choice affects the content immediately below it. Use\n * instead of tabs when the options are more like settings or filters than\n * navigation, such as toggling a list/grid view or a monthly/annual price.\n \n Rendered as a `radiogroup` with roving-tabindex keyboard navigation. Supports\n * both controlled and uncontrolled usage.\n \n @example\n * ```tsx\n * <SegmentedControl\n * options={[\n * { label: \"Net\", value: \"net\" },\n * { label: \"Gross\", value: \"gross\" },\n * ]}\n * value={amount}\n * onChange={setAmount}\n * aria-label=\"Amount type\"\n * />\n * ```\n \n @example Icon-only segments (e.g. a list/grid view toggle)\n * ```tsx\n * <SegmentedControl\n * appearance=\"plain\"\n * options={[\n * { label: \"List view\", value: \"list\", icon: <ListViewIcon size={16} /> },\n * { label: \"Grid view\", value: \"grid\", icon: <GridViewIcon size={16} /> },\n * ]}\n * value={view}\n * onChange={setView}\n * aria-label=\"View\"\n * />\n * ```\n */\nexport const SegmentedControl = React.forwardRef<HTMLDivElement, SegmentedControlProps>(\n (\n {\n className,\n size = \"32\",\n variant = \"hug\",\n appearance = \"pill\",\n options,\n value: controlledValue,\n defaultValue,\n onChange,\n disabled = false,\n ...props\n },\n ref,\n ) => {\n warnMissingAccessibleName(props[\"aria-label\"], props[\"aria-labelledby\"]);\n warnMissingOptionAccessibleName(options);\n\n // Tracks selection for uncontrolled usage; ignored when `value` prop is provided\n const [internalValue, setInternalValue] = React.useState(defaultValue ?? options[0]?.value);\n const isControlled = controlledValue !== undefined;\n const currentValue = isControlled ? controlledValue : internalValue;\n const anySelected = options.some((o) => o.value === currentValue);\n const buttonRefs = React.useRef<(HTMLButtonElement \| null)[]>([]);\n\n const handleSelect = (optionValue: string) => {\n if (disabled \|\| optionValue === currentValue) return;\n if (!isControlled) {\n setInternalValue(optionValue);\n }\n onChange?.(optionValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent, index: number) => {\n const nextIndex =\n e.key === \"ArrowRight\" \|\| e.key === \"ArrowDown\"\n ? (index + 1) % options.length\n : e.key === \"ArrowLeft\" \|\| e.key === \"ArrowUp\"\n ? (index - 1 + options.length) % options.length\n : null;\n if (nextIndex === null) return;\n e.preventDefault();\n const nextOption = options[nextIndex] as SegmentedControlOption;\n handleSelect(nextOption.value);\n buttonRefs.current[nextIndex]?.focus();\n };\n\n return (\n <div\n ref={ref}\n role=\"radiogroup\"\n className={cn(\n \"relative items-center rounded-full\",\n variant === \"fill\" ? \"flex w-full\" : \"inline-flex\",\n appearance === \"plain\" ? \"gap-2\" : \"bg-surface-tertiary p-1\",\n disabled && \"cursor-not-allowed opacity-50\",\n className,\n )}\n {...props}\n >\n {options.map((option, index) => {\n const isSelected = currentValue === option.value;\n return (\n // biome-ignore lint/a11y/useSemanticElements: native radio inputs only allow Tab-focus on the checked item; buttons with roving tabindex give full keyboard navigation\n <button\n key={option.value}\n ref={(el) => {\n buttonRefs.current[index] = el;\n }}\n type=\"button\"\n role=\"radio\"\n aria-checked={isSelected}\n tabIndex={isSelected \|\| (!anySelected && index === 0) ? 0 : -1}\n disabled={disabled}\n aria-label={option.icon ? option.label : undefined}\n onClick={() => handleSelect(option.value)}\n onKeyDown={(e) => handleKeyDown(e, index)}\n className={getSegmentClassName({ appearance, size, variant, isSelected, disabled })}\n >\n {option.icon ? (\n <span className=\"flex shrink-0 items-center justify-center\" aria-hidden=\"true\">\n {option.icon}\n </span>\n ) : (\n <span className=\"min-w-0 truncate\">{option.label}</span>\n )}\n </button>\n );\n })}\n </div>\n );\n },\n);\n\nSegmentedControl.displayName = \"SegmentedControl\";\n"],"names":["cn","React","jsx"],"mappings":"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"}

package/dist/cjs/index.cjs CHANGED Viewed

@@ -7,6 +7,7 @@ const AccordionContent = require("./components/Accordion/AccordionContent.cjs");
 const AccordionItem = require("./components/Accordion/AccordionItem.cjs");
 const AccordionTrigger = require("./components/Accordion/AccordionTrigger.cjs");
 const Alert = require("./components/Alert/Alert.cjs");
+const AudioPlayer = require("./components/AudioPlayer/AudioPlayer.cjs");
 const AudioUpload = require("./components/AudioUpload/AudioUpload.cjs");
 const useAudioRecorder = require("./components/AudioUpload/useAudioRecorder.cjs");
 const Autocomplete = require("./components/Autocomplete/Autocomplete.cjs");
@@ -32,6 +33,7 @@ const Drawer = require("./components/Drawer/Drawer.cjs");
 const DropdownMenu = require("./components/DropdownMenu/DropdownMenu.cjs");
 const EmptyState = require("./components/EmptyState/EmptyState.cjs");
 const FanFollowerCount = require("./components/FanFollowerCount/FanFollowerCount.cjs");
+const FloatingActionButton = require("./components/FloatingActionButton/FloatingActionButton.cjs");
 const IconButton = require("./components/IconButton/IconButton.cjs");
 const AddIcon = require("./components/Icons/AddIcon.cjs");
 const AffiliatesIcon = require("./components/Icons/AffiliatesIcon.cjs");
@@ -105,6 +107,7 @@ const GenderIcon = require("./components/Icons/GenderIcon.cjs");
 const GifIcon = require("./components/Icons/GifIcon.cjs");
 const GiftIcon = require("./components/Icons/GiftIcon.cjs");
 const GoogleIcon = require("./components/Icons/GoogleIcon.cjs");
+const GridViewIcon = require("./components/Icons/GridViewIcon.cjs");
 const HealthIcon = require("./components/Icons/HealthIcon.cjs");
 const HeartIcon = require("./components/Icons/HeartIcon.cjs");
 const HelpIcon = require("./components/Icons/HelpIcon.cjs");
@@ -117,6 +120,7 @@ const InfoCircleIcon = require("./components/Icons/InfoCircleIcon.cjs");
 const InfoIcon = require("./components/Icons/InfoIcon.cjs");
 const LanguageIcon = require("./components/Icons/LanguageIcon.cjs");
 const LinkIcon = require("./components/Icons/LinkIcon.cjs");
+const ListViewIcon = require("./components/Icons/ListViewIcon.cjs");
 const LocationIcon = require("./components/Icons/LocationIcon.cjs");
 const LockerIcon = require("./components/Icons/LockerIcon.cjs");
 const LockerOffIcon = require("./components/Icons/LockerOffIcon.cjs");
@@ -257,6 +261,7 @@ exports.AccordionContent = AccordionContent.AccordionContent;
 exports.AccordionItem = AccordionItem.AccordionItem;
 exports.AccordionTrigger = AccordionTrigger.AccordionTrigger;
 exports.Alert = Alert.Alert;
+exports.AudioPlayer = AudioPlayer.AudioPlayer;
 exports.AudioUpload = AudioUpload.AudioUpload;
 exports.useAudioRecorder = useAudioRecorder.useAudioRecorder;
 exports.Autocomplete = Autocomplete.Autocomplete;
@@ -321,6 +326,7 @@ exports.DropdownMenuSeparator = DropdownMenu.DropdownMenuSeparator;
 exports.DropdownMenuTrigger = DropdownMenu.DropdownMenuTrigger;
 exports.EmptyState = EmptyState.EmptyState;
 exports.FanFollowerCount = FanFollowerCount.FanFollowerCount;
+exports.FloatingActionButton = FloatingActionButton.FloatingActionButton;
 exports.IconButton = IconButton.IconButton;
 exports.AddIcon = AddIcon.AddIcon;
 exports.AffiliatesIcon = AffiliatesIcon.AffiliatesIcon;
@@ -394,6 +400,7 @@ exports.GenderIcon = GenderIcon.GenderIcon;
 exports.GifIcon = GifIcon.GifIcon;
 exports.GiftIcon = GiftIcon.GiftIcon;
 exports.GoogleIcon = GoogleIcon.GoogleIcon;
+exports.GridViewIcon = GridViewIcon.GridViewIcon;
 exports.HealthIcon = HealthIcon.HealthIcon;
 exports.HeartIcon = HeartIcon.HeartIcon;
 exports.HelpIcon = HelpIcon.HelpIcon;
@@ -406,6 +413,7 @@ exports.InfoCircleIcon = InfoCircleIcon.InfoCircleIcon;
 exports.InfoIcon = InfoIcon.InfoIcon;
 exports.LanguageIcon = LanguageIcon.LanguageIcon;
 exports.LinkIcon = LinkIcon.LinkIcon;
+exports.ListViewIcon = ListViewIcon.ListViewIcon;
 exports.LocationIcon = LocationIcon.LocationIcon;
 exports.LockerIcon = LockerIcon.LockerIcon;
 exports.LockerOffIcon = LockerOffIcon.LockerOffIcon;

package/dist/cjs/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}