@uniformdev/design-system 20.24.0 → 20.25.0

package/dist/esm/index.js

@@ -7067,6 +7067,8 @@ var trigger = css50`
   margin: 2px 0;
 `;
 var popover = css50`
+  border-radius: var(--rounded-sm);
+  box-shadow: var(--elevation-100);
   padding: var(--spacing-md);
   max-width: unset;
   container-type: inline-size;
@@ -7266,6 +7268,7 @@ var DateTimePicker = ({
   offset = 8,
   testId = "datetime-picker",
   placement = "bottom-start",
+  portal = false,
   ...props
 }) => {
   const popover2 = usePopoverStore({ placement });
@@ -7374,6 +7377,7 @@ var DateTimePicker = ({
           unmountOnHide: true,
           "aria-label": "Pick a date",
           css: [Popover, popover],
+          portal,
           children: [
             /* @__PURE__ */ jsxs40("div", { css: popoverInnerContent, children: [
               /* @__PURE__ */ jsx63("div", { css: calendarSection, children: /* @__PURE__ */ jsx63(

package/dist/index.d.mts

@@ -1634,6 +1634,8 @@ type DateTimePickerProps = {
      * @default 8
      */
     offset?: number;
+    /** (optional) sets whether to render the popover in a portal */
+    portal?: boolean;
 };
 /**
  * Use this context for slots within the date time picker
@@ -1653,7 +1655,7 @@ declare function useDateTimePickerContext(): {
  * Subcomponents can manipulate the value directly by using
  * the `useDateTimePickerContext()` hook.
  */
-declare const DateTimePicker: ({ id, label, triggerIcon, value, minVisible, maxVisible, variant, caption, placeholder, belowTimeInputSlot, showLabel, errorMessage, warningMessage, disabled, onChange, offset, testId, placement, ...props }: DateTimePickerProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const DateTimePicker: ({ id, label, triggerIcon, value, minVisible, maxVisible, variant, caption, placeholder, belowTimeInputSlot, showLabel, errorMessage, warningMessage, disabled, onChange, offset, testId, placement, portal, ...props }: DateTimePickerProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 declare function DateTimePickerSummary({ value, placeholder, }: {
     value: DateTimePickerValue | null | undefined;

package/dist/index.d.ts

@@ -1634,6 +1634,8 @@ type DateTimePickerProps = {
      * @default 8
      */
     offset?: number;
+    /** (optional) sets whether to render the popover in a portal */
+    portal?: boolean;
 };
 /**
  * Use this context for slots within the date time picker
@@ -1653,7 +1655,7 @@ declare function useDateTimePickerContext(): {
  * Subcomponents can manipulate the value directly by using
  * the `useDateTimePickerContext()` hook.
  */
-declare const DateTimePicker: ({ id, label, triggerIcon, value, minVisible, maxVisible, variant, caption, placeholder, belowTimeInputSlot, showLabel, errorMessage, warningMessage, disabled, onChange, offset, testId, placement, ...props }: DateTimePickerProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const DateTimePicker: ({ id, label, triggerIcon, value, minVisible, maxVisible, variant, caption, placeholder, belowTimeInputSlot, showLabel, errorMessage, warningMessage, disabled, onChange, offset, testId, placement, portal, ...props }: DateTimePickerProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 declare function DateTimePickerSummary({ value, placeholder, }: {
     value: DateTimePickerValue | null | undefined;

package/dist/index.js

@@ -8856,6 +8856,8 @@ var trigger = import_react72.css`
   margin: 2px 0;
 `;
 var popover = import_react72.css`
+  border-radius: var(--rounded-sm);
+  box-shadow: var(--elevation-100);
   padding: var(--spacing-md);
   max-width: unset;
   container-type: inline-size;
@@ -9050,6 +9052,7 @@ var DateTimePicker = ({
   offset = 8,
   testId = "datetime-picker",
   placement = "bottom-start",
+  portal = false,
   ...props
 }) => {
   const popover2 = (0, import_react73.usePopoverStore)({ placement });
@@ -9158,6 +9161,7 @@ var DateTimePicker = ({
           unmountOnHide: true,
           "aria-label": "Pick a date",
           css: [Popover, popover],
+          portal,
           children: [
             /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { css: popoverInnerContent, children: [
               /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { css: calendarSection, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "20.24.0",
+  "version": "20.25.0",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "exports": {
@@ -38,8 +38,8 @@
     "@storybook/theming": "^8.3.3",
     "@types/react": "18.3.11",
     "@types/react-dom": "18.3.1",
-    "@uniformdev/canvas": "^20.24.0",
-    "@uniformdev/richtext": "^20.24.0",
+    "@uniformdev/canvas": "^20.25.0",
+    "@uniformdev/richtext": "^20.25.0",
     "@vitest/coverage-v8": "^3.1.2",
     "autoprefixer": "10.4.21",
     "hygen": "6.2.11",
@@ -91,5 +91,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "7d45b562619c10c1cd1824d6e03eedf7fff3bbdf"
+  "gitHead": "3fe795ce670ac4b96982a833d234059ad5a47995"
 }