@cambly/syntax-core 3.1.0 → 3.3.0

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode, ReactElement } from 'react';
+import React$1, { ReactNode, ReactElement } from 'react';
 
 /**
  * Avatar is a circular image that represents a user.
@@ -390,19 +390,19 @@ declare const Button: ({ text, loadingText, color, size: sizeProp, accessibility
     /**
      * The icon to be displayed at the start of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)
      */
-    startIcon?: React.ComponentType<{
+    startIcon?: React$1.ComponentType<{
         className: string;
     }> | undefined;
     /**
      * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)
      */
-    endIcon?: React.ComponentType<{
+    endIcon?: React$1.ComponentType<{
         className: string;
     }> | undefined;
     /**
      * The callback to be called when the button is clicked
      */
-    onClick: React.MouseEventHandler<HTMLButtonElement>;
+    onClick: React$1.MouseEventHandler<HTMLButtonElement>;
     /**
      * The tooltip to be displayed when the user hovers over the button
      */
@@ -460,7 +460,7 @@ declare const Card: ({ children, }: {
 /**
  * Divider is a thin horizontal line to group content in lists and layouts.
  */
-declare function Divider({}: Record<string, never>): JSX.Element;
+declare function Divider(): React.ReactElement;
 declare namespace Divider {
     var displayName: string;
 }
@@ -533,7 +533,7 @@ declare const IconButton: ({ accessibilityLabel, color, disabled: disabledProp,
     /**
      * The icon to be displayed. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)
      */
-    icon: React.ComponentType<{
+    icon: React$1.ComponentType<{
         className: string;
     }>;
     /**
@@ -545,7 +545,7 @@ declare const IconButton: ({ accessibilityLabel, color, disabled: disabledProp,
     /**
      * The callback to be called when the button is clicked
      */
-    onClick: React.MouseEventHandler<HTMLButtonElement>;
+    onClick: React$1.MouseEventHandler<HTMLButtonElement>;
     /**
      * The tooltip to be displayed when the user hovers over the button
      */
@@ -565,7 +565,7 @@ declare const Checkbox: ({ checked, disabled, size, label, error, onChange, }: {
     /**
      * The callback to be called when the checkbox value changes
      */
-    onChange: React.ChangeEventHandler<HTMLInputElement>;
+    onChange: React$1.ChangeEventHandler<HTMLInputElement>;
     /**
      * Whether or not the box is disabled
      *
@@ -636,7 +636,7 @@ declare const RadioButton: ({ checked, disabled, error, label, name, onChange, s
     /**
      * The callback to be called when the radio button is clicked
      */
-    onChange: React.ChangeEventHandler<HTMLInputElement>;
+    onChange: React$1.ChangeEventHandler<HTMLInputElement>;
     /**
      * Size of the components
      *
@@ -679,7 +679,7 @@ declare const SelectList: {
         /**
          * The callback to be called when an option is selected
          */
-        onChange: React.ChangeEventHandler<HTMLSelectElement>;
+        onChange: React$1.ChangeEventHandler<HTMLSelectElement>;
         /**
          * Text showing in select box if no option has been chosen.
          * We should always have a placeholder unless there is a default option selected
@@ -703,7 +703,7 @@ declare const SelectList: {
         value: string;
         label: string;
         disabled?: boolean | undefined;
-    }) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    }) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>>;
 };
 
 /**

package/dist/index.js

@@ -545,7 +545,7 @@ var Divider_module_default = { "divider": "_divider_1ddgq_1" };
 
 // src/Divider/Divider.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
-function Divider({}) {
+function Divider() {
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("hr", { className: Divider_module_default.divider });
 }
 Divider.displayName = "Divider";
@@ -968,14 +968,7 @@ var SelectList = ({
         [SelectList_module_default.opacityOverlay]: disabled
       }),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("label", { htmlFor: id, className: SelectList_module_default.outerTextContainer, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-          Typography_default,
-          {
-            size: 100,
-            color: errorText ? "destructive-primary" : "gray700",
-            children: label
-          }
-        ) }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("label", { htmlFor: id, className: SelectList_module_default.outerTextContainer, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Typography_default, { size: 100, color: "gray700", children: label }) }),
         /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: SelectList_module_default.selectWrapper, children: [
           /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
             "select",
@@ -989,8 +982,9 @@ var SelectList = ({
                 [SelectList_module_default.selectError]: errorText
               }),
               onChange,
+              value: placeholderText && !selectedValue ? placeholderText : selectedValue,
               children: [
-                placeholderText && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("option", { disabled: true, value: "", children: placeholderText }),
+                placeholderText && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("option", { disabled: true, value: placeholderText, children: placeholderText }),
                 children
               ]
             }