@wistia/ui 0.14.11 → 0.14.12-beta.60f2930b.c8e9b9c

package/dist/index.cjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.14.11
+ * @license @wistia/ui v0.14.12-beta.60f2930b.c8e9b9c
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -76,6 +76,10 @@ __export(index_exports, {
   DataCardHoverArrow: () => DataCardHoverArrow,
   DataCardTrend: () => DataCardTrend,
   DataCards: () => DataCards,
+  DataList: () => DataList,
+  DataListItem: () => DataListItem,
+  DataListItemLabel: () => DataListItemLabel,
+  DataListItemValue: () => DataListItemValue,
   Divider: () => Divider,
   EditableHeading: () => EditableHeading,
   Ellipsis: () => Ellipsis,
@@ -9490,14 +9494,14 @@ var Checkbox = (0, import_react38.forwardRef)(
     const contextValue = checkboxGroupContext?.value;
     const checkboxName = name ?? contextName;
     const handleOnChange = onChange ?? contextOnChange;
-    const defaultChecked = (0, import_type_guards31.isNotUndefined)(value) && contextValue ? contextValue.includes(value) : void 0;
+    const isChecked = (0, import_type_guards31.isNotUndefined)(value) && contextValue ? contextValue.includes(value) : checked;
     return /* @__PURE__ */ (0, import_jsx_runtime221.jsxs)(StyledCheckboxWrapper, { disabled, children: [
       /* @__PURE__ */ (0, import_jsx_runtime221.jsx)(
         StyledHiddenCheckboxInput,
         {
           ...props,
           ref,
-          ...(0, import_type_guards31.isNotUndefined)(defaultChecked) ? { defaultChecked } : { checked },
+          checked: isChecked,
           disabled,
           id: computedId,
           name: checkboxName,
@@ -14945,7 +14949,7 @@ var Radio = (0, import_react72.forwardRef)(
     const contextValue = radioGroupContext?.value;
     const radioName = name ?? contextName;
     const handleOnChange = onChange ?? contextOnChange;
-    const defaultChecked = (0, import_type_guards53.isNotUndefined)(value) && (0, import_type_guards53.isNotUndefined)(contextValue) ? contextValue.includes(value) : void 0;
+    const isChecked = (0, import_type_guards53.isNotUndefined)(value) && (0, import_type_guards53.isNotUndefined)(contextValue) ? contextValue === value : checked;
     return /* @__PURE__ */ (0, import_jsx_runtime286.jsxs)(
       StyledRadioWrapper,
       {
@@ -14957,14 +14961,14 @@ var Radio = (0, import_react72.forwardRef)(
             {
               ...props,
               ref,
+              checked: isChecked,
               disabled,
               id: computedId,
               name: radioName,
               onChange: handleOnChange,
               required,
               type: "radio",
-              value,
-              ...(0, import_type_guards53.isNotUndefined)(defaultChecked) ? { defaultChecked } : { checked }
+              value
             }
           ),
           /* @__PURE__ */ (0, import_jsx_runtime286.jsx)(
@@ -15128,7 +15132,7 @@ var RadioCardRoot = (0, import_react73.forwardRef)(
     const contextValue = radioGroupContext?.value;
     const radioName = name ?? contextName;
     const handleOnChange = onChange ?? contextOnChange;
-    const defaultChecked = (0, import_type_guards54.isNotUndefined)(value) && (0, import_type_guards54.isNotUndefined)(contextValue) ? contextValue.includes(value) : void 0;
+    const isChecked = (0, import_type_guards54.isNotUndefined)(value) && (0, import_type_guards54.isNotUndefined)(contextValue) ? contextValue === value : checked;
     return /* @__PURE__ */ (0, import_jsx_runtime287.jsxs)(
       StyledCard2,
       {
@@ -15141,13 +15145,13 @@ var RadioCardRoot = (0, import_react73.forwardRef)(
             {
               ...props,
               ref,
+              checked: isChecked,
               disabled,
               id: computedId,
               name: radioName,
               onChange: handleOnChange,
               type: "radio",
-              value,
-              ...(0, import_type_guards54.isNotUndefined)(defaultChecked) ? { defaultChecked } : { checked }
+              value
             }
           ),
           children
@@ -17017,6 +17021,86 @@ var ContextMenu = ({
     }
   ) : null;
 };
+
+// src/components/DataList/DataList.tsx
+var import_styled_components121 = __toESM(require("styled-components"));
+var import_jsx_runtime317 = require("react/jsx-runtime");
+var StyledDataList = import_styled_components121.default.dl`
+  display: grid;
+  grid-template-columns: auto 1fr;
+  column-gap: var(--wui-space-02);
+  row-gap: var(--wui-space-04);
+  align-items: baseline;
+  align-content: start;
+
+  dt {
+    margin: 0;
+    padding: 0;
+    font-weight: var(--wui-datalist-label-prominence);
+    width: var(--wui-datalist-label-max-width, auto);
+  }
+
+  dd {
+    margin: 0;
+    padding: 0;
+    text-align: var(--wui-datalist-value-alignment, start);
+  }
+`;
+var DataList = ({
+  children,
+  valueAlignment = "start",
+  labelMaxWith = "auto",
+  labelProminence = "primary",
+  ...props
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime317.jsx)(
+    StyledDataList,
+    {
+      style: {
+        "--wui-datalist-label-max-width": labelMaxWith,
+        "--wui-datalist-value-alignment": valueAlignment === "end" ? "right" : "left",
+        "--wui-datalist-label-prominence": labelProminence === "secondary" ? "var(--wui-typography-weight-label)" : "var(--wui-typography-weight-label-bold)"
+      },
+      ...props,
+      children
+    }
+  );
+};
+DataList.displayName = "DataList_UI";
+
+// src/components/DataList/DataListItem.tsx
+var DataListItem = ({ children }) => {
+  return children;
+};
+DataListItem.displayName = "DataListItem_UI";
+
+// src/components/DataList/DataListItemLabel.tsx
+var import_jsx_runtime318 = require("react/jsx-runtime");
+var DataListItemLabel = (props) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime318.jsx)(
+    Text,
+    {
+      variant: "label4",
+      ...props,
+      renderAs: "dt"
+    }
+  );
+};
+DataListItemLabel.displayName = "DataListItemLabel_UI";
+
+// src/components/DataList/DataListItemValue.tsx
+var import_jsx_runtime319 = require("react/jsx-runtime");
+var DataListItemValue = (props) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime319.jsx)(
+    Text,
+    {
+      variant: "body3",
+      ...props,
+      renderAs: "dd"
+    }
+  );
+};
+DataListItemValue.displayName = "DataListItemValue_UI";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ActionButton,
@@ -17056,6 +17140,10 @@ var ContextMenu = ({
   DataCardHoverArrow,
   DataCardTrend,
   DataCards,
+  DataList,
+  DataListItem,
+  DataListItemLabel,
+  DataListItemValue,
   Divider,
   EditableHeading,
   Ellipsis,