@dt-dds/react-select 1.0.0-beta.95 → 1.0.0-beta.97

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @dt-ui/react-select
 
+## 1.0.0-beta.97
+
+### Patch Changes
+
+- fix: multi select option styling
+- Updated dependencies
+  - @dt-dds/react-dropdown@1.0.0-beta.103
+
+## 1.0.0-beta.96
+
+### Patch Changes
+
+- fix: add displayName to Icon and IconButton for production builds
+- Updated dependencies
+  - @dt-dds/react-icon@1.0.0-beta.63
+  - @dt-dds/react-icon-button@1.0.0-beta.29
+  - @dt-dds/react-checkbox@1.0.0-beta.64
+  - @dt-dds/react-dropdown@1.0.0-beta.102
+  - @dt-dds/react-label-field@1.0.0-beta.61
+
 ## 1.0.0-beta.95
 
 ### Patch Changes

package/dist/index.js

@@ -64,7 +64,7 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/Select.tsx
-var import_react2 = require("react");
+var import_react3 = require("react");
 var Downshift = __toESM(require("downshift"));
 var import_react_box = require("@dt-dds/react-box");
 var import_react_icon = require("@dt-dds/react-icon");
@@ -73,6 +73,7 @@ var import_react_label_field = require("@dt-dds/react-label-field");
 var import_react_tooltip = require("@dt-dds/react-tooltip");
 
 // src/components/SelectOption.tsx
+var import_react2 = require("@emotion/react");
 var import_react_dropdown = require("@dt-dds/react-dropdown");
 
 // src/context/SelectProvider.tsx
@@ -132,6 +133,7 @@ var SelectOption = ({
   value,
   isDisabled = false
 }) => {
+  const { spacing } = (0, import_react2.useTheme)();
   const { getItemProps, isItemHighlighted, isItemSelected, isMulti } = useSelectContext();
   const item = { value, isDisabled };
   const isSelected = isItemSelected(value);
@@ -143,13 +145,14 @@ var SelectOption = ({
       isDisabled,
       isHighlighted,
       isSelected,
-      style: __spreadValues(__spreadValues({}, style), isMulti ? { padding: 0 } : {})
+      style: __spreadValues(__spreadValues({}, style), isMulti ? { paddingY: spacing.spacing_40, paddingX: spacing.spacing_50 } : {})
     }, getItemProps({ item, index })), {
       children: isMulti ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
         SelectCheckboxStyled,
         {
-          checked: isSelected,
-          disabled: isDisabled,
+          isChecked: isSelected,
+          isDisabled,
+          size: "small",
           tabIndex: -1,
           children
         }
@@ -321,7 +324,7 @@ var Select = (_a) => {
     "onFocus"
   ]);
   var _a2;
-  const anchorRef = (0, import_react2.useRef)(null);
+  const anchorRef = (0, import_react3.useRef)(null);
   const handleClearKeyDown = (e) => {
     if (e.code === "Enter" || e.code === "Space") {
       handleClearSelection(e);
@@ -331,11 +334,11 @@ var Select = (_a) => {
     e.stopPropagation();
     isMulti && (onChange == null ? void 0 : onChange([]));
   };
-  const options = (0, import_react2.useMemo)(() => {
+  const options = (0, import_react3.useMemo)(() => {
     var _a3;
-    const tempOptions = import_react2.Children.map(children, (child) => {
+    const tempOptions = import_react3.Children.map(children, (child) => {
       var _a4, _b2, _c;
-      if ((0, import_react2.isValidElement)(child) && child.props.value != void 0) {
+      if ((0, import_react3.isValidElement)(child) && child.props.value != void 0) {
         return {
           value: child.props.value,
           isDisabled: child.props.isDisabled,
@@ -346,11 +349,11 @@ var Select = (_a) => {
     });
     return (_a3 = tempOptions == null ? void 0 : tempOptions.filter(Boolean)) != null ? _a3 : [];
   }, [children]);
-  const selectedOptionsSet = (0, import_react2.useMemo)(
+  const selectedOptionsSet = (0, import_react3.useMemo)(
     () => new Set(value ? [value].flat() : []),
     [value]
   );
-  const selectedItems = (0, import_react2.useMemo)(
+  const selectedItems = (0, import_react3.useMemo)(
     () => options.filter((o) => selectedOptionsSet.has(o.value)),
     [options, selectedOptionsSet]
   );

package/dist/index.mjs

@@ -45,6 +45,7 @@ import { LabelField } from "@dt-dds/react-label-field";
 import { Tooltip } from "@dt-dds/react-tooltip";
 
 // src/components/SelectOption.tsx
+import { useTheme } from "@emotion/react";
 import { Dropdown } from "@dt-dds/react-dropdown";
 
 // src/context/SelectProvider.tsx
@@ -104,6 +105,7 @@ var SelectOption = ({
   value,
   isDisabled = false
 }) => {
+  const { spacing } = useTheme();
   const { getItemProps, isItemHighlighted, isItemSelected, isMulti } = useSelectContext();
   const item = { value, isDisabled };
   const isSelected = isItemSelected(value);
@@ -115,13 +117,14 @@ var SelectOption = ({
       isDisabled,
       isHighlighted,
       isSelected,
-      style: __spreadValues(__spreadValues({}, style), isMulti ? { padding: 0 } : {})
+      style: __spreadValues(__spreadValues({}, style), isMulti ? { paddingY: spacing.spacing_40, paddingX: spacing.spacing_50 } : {})
     }, getItemProps({ item, index })), {
       children: isMulti ? /* @__PURE__ */ jsx2(
         SelectCheckboxStyled,
         {
-          checked: isSelected,
-          disabled: isDisabled,
+          isChecked: isSelected,
+          isDisabled,
+          size: "small",
           tabIndex: -1,
           children
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dt-dds/react-select",
-  "version": "1.0.0-beta.95",
+  "version": "1.0.0-beta.97",
   "license": "MIT",
   "exports": {
     ".": "./dist/index.js"
@@ -21,12 +21,12 @@
   },
   "dependencies": {
     "@dt-dds/react-box": "1.0.0-beta.76",
-    "@dt-dds/react-checkbox": "1.0.0-beta.63",
+    "@dt-dds/react-checkbox": "1.0.0-beta.64",
     "@dt-dds/react-core": "1.0.0-beta.59",
-    "@dt-dds/react-dropdown": "1.0.0-beta.101",
-    "@dt-dds/react-icon": "1.0.0-beta.62",
-    "@dt-dds/react-icon-button": "1.0.0-beta.28",
-    "@dt-dds/react-label-field": "1.0.0-beta.60",
+    "@dt-dds/react-dropdown": "1.0.0-beta.103",
+    "@dt-dds/react-icon": "1.0.0-beta.63",
+    "@dt-dds/react-icon-button": "1.0.0-beta.29",
+    "@dt-dds/react-label-field": "1.0.0-beta.61",
     "@dt-dds/react-tooltip": "1.0.0-beta.69",
     "@dt-dds/react-typography": "1.0.0-beta.50",
     "@dt-dds/themes": "1.0.0-beta.14",