@synerise/ds-tray 1.1.26 → 1.1.28

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.1.28](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tray@1.1.27...@synerise/ds-tray@1.1.28) (2026-04-01)
+
+**Note:** Version bump only for package @synerise/ds-tray
+
+## [1.1.27](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tray@1.1.26...@synerise/ds-tray@1.1.27) (2026-03-24)
+
+**Note:** Version bump only for package @synerise/ds-tray
+
 ## [1.1.26](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tray@1.1.25...@synerise/ds-tray@1.1.26) (2026-03-20)
 
 **Note:** Version bump only for package @synerise/ds-tray

package/dist/Tray.const.js

@@ -1,3 +1,8 @@
-export var WRAPPER_HEIGHT = 562;
-export var FOOTER_HEIGHT = 48;
-export var HEADER_HEIGHT = 56;
+const WRAPPER_HEIGHT = 562;
+const FOOTER_HEIGHT = 48;
+const HEADER_HEIGHT = 56;
+export {
+  FOOTER_HEIGHT,
+  HEADER_HEIGHT,
+  WRAPPER_HEIGHT
+};

package/dist/Tray.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import type { TrayProps } from './Tray.types';
+import { default as React } from 'react';
+import { TrayProps } from './Tray.types';
 declare const Tray: ({ id, ...htmlAttributes }: TrayProps) => React.JSX.Element | null;
 export default Tray;

package/dist/Tray.js

@@ -1,40 +1,45 @@
-var _excluded = ["id"];
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-import React from 'react';
-import Button from '@synerise/ds-button';
-import Icon, { CloseM } from '@synerise/ds-icon';
-import * as S from './Tray.styles';
-import { useTrayContext } from './hooks/useTrayContext';
-var Tray = function Tray(_ref) {
-  var id = _ref.id,
-    htmlAttributes = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var _useTrayContext = useTrayContext(),
-    getTrayState = _useTrayContext.getTrayState,
-    closeTray = _useTrayContext.closeTray;
-  var _getTrayState = getTrayState(id),
-    isOpen = _getTrayState.isOpen,
-    data = _getTrayState.data;
+import { jsxs, jsx } from "react/jsx-runtime";
+import Button from "@synerise/ds-button";
+import Icon, { CloseM } from "@synerise/ds-icon";
+import { TrayWrapper, TrayHeader, TrayHeaderLeft, TrayTitle, TrayHeaderRight, TrayContent, TrayScrollbar, TrayFooter } from "./Tray.styles.js";
+import { useTrayContext } from "./hooks/useTrayContext.js";
+const Tray = ({
+  id,
+  ...htmlAttributes
+}) => {
+  const {
+    getTrayState,
+    closeTray
+  } = useTrayContext();
+  const {
+    isOpen,
+    data
+  } = getTrayState(id);
   if (!isOpen) {
     return null;
   }
-  var content = data.content,
-    title = data.title,
-    footer = data.footer,
-    headerRightSide = data.headerRightSide,
-    onClose = data.onClose;
-  return /*#__PURE__*/React.createElement(S.TrayWrapper, htmlAttributes, /*#__PURE__*/React.createElement(S.TrayHeader, null, /*#__PURE__*/React.createElement(S.TrayHeaderLeft, null, /*#__PURE__*/React.createElement(S.TrayTitle, {
-    level: 4
-  }, title)), /*#__PURE__*/React.createElement(S.TrayHeaderRight, null, headerRightSide, /*#__PURE__*/React.createElement(Button, {
-    type: "ghost",
-    mode: "single-icon",
-    onClick: function onClick() {
-      closeTray(id);
-      onClose == null || onClose(id);
-    }
-  }, /*#__PURE__*/React.createElement(Icon, {
-    component: /*#__PURE__*/React.createElement(CloseM, null)
-  })))), /*#__PURE__*/React.createElement(S.TrayContent, null, /*#__PURE__*/React.createElement(S.TrayScrollbar, {
-    absolute: true
-  }, content)), footer && /*#__PURE__*/React.createElement(S.TrayFooter, null, footer));
+  const {
+    content,
+    title,
+    footer,
+    headerRightSide,
+    onClose
+  } = data;
+  return /* @__PURE__ */ jsxs(TrayWrapper, { ...htmlAttributes, children: [
+    /* @__PURE__ */ jsxs(TrayHeader, { children: [
+      /* @__PURE__ */ jsx(TrayHeaderLeft, { children: /* @__PURE__ */ jsx(TrayTitle, { level: 4, children: title }) }),
+      /* @__PURE__ */ jsxs(TrayHeaderRight, { children: [
+        headerRightSide,
+        /* @__PURE__ */ jsx(Button, { type: "ghost", mode: "single-icon", onClick: () => {
+          closeTray(id);
+          onClose?.(id);
+        }, children: /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(CloseM, {}) }) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(TrayContent, { children: /* @__PURE__ */ jsx(TrayScrollbar, { absolute: true, children: content }) }),
+    footer && /* @__PURE__ */ jsx(TrayFooter, { children: footer })
+  ] });
+};
+export {
+  Tray as default
 };
-export default Tray;

package/dist/Tray.styles.d.ts

@@ -1,8 +1,8 @@
-export declare const TrayContent: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TrayScrollbar: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<(import("@synerise/ds-scrollbar").ScrollbarProps | import("@synerise/ds-scrollbar").VirtualScrollbarProps) & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
-export declare const TrayWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TrayHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TrayHeaderLeft: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TrayHeaderRight: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TrayFooter: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TrayTitle: import("styled-components").StyledComponent<({ level, withoutMargin, children, className, ellipsis, ...antdProps }: import("@synerise/ds-typography/dist/Title.types").Props) => React.JSX.Element, any, {}, never>;
+export declare const TrayContent: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const TrayScrollbar: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<(import('@synerise/ds-scrollbar').ScrollbarProps | import('@synerise/ds-scrollbar').VirtualScrollbarProps) & import('react').RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const TrayWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const TrayHeader: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const TrayHeaderLeft: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const TrayHeaderRight: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const TrayFooter: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const TrayTitle: import('styled-components').StyledComponent<({ level, withoutMargin, children, className, ellipsis, ...antdProps }: import('@synerise/ds-typography/dist/Title.types').Props) => React.JSX.Element, any, {}, never>;

package/dist/Tray.styles.js

@@ -1,48 +1,46 @@
-import styled from 'styled-components';
-import Scrollbar from '@synerise/ds-scrollbar';
-import { Title } from '@synerise/ds-typography';
-import { FOOTER_HEIGHT, HEADER_HEIGHT, WRAPPER_HEIGHT } from './Tray.const';
-export var TrayContent = styled.div.withConfig({
+import styled from "styled-components";
+import Scrollbar from "@synerise/ds-scrollbar";
+import { Title } from "@synerise/ds-typography";
+import { FOOTER_HEIGHT, HEADER_HEIGHT, WRAPPER_HEIGHT } from "./Tray.const.js";
+const TrayContent = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Traystyles__TrayContent",
   componentId: "sc-1v5sbw5-0"
 })(["flex:1 1 auto;min-height:0;position:relative;display:flex;flex-direction:column;"]);
-export var TrayScrollbar = styled(Scrollbar).withConfig({
+const TrayScrollbar = /* @__PURE__ */ styled(Scrollbar).withConfig({
   displayName: "Traystyles__TrayScrollbar",
   componentId: "sc-1v5sbw5-1"
 })(["min-height:0;display:flex;flex-direction:column;.scrollbar-container{min-height:0;}"]);
-export var TrayWrapper = styled.div.withConfig({
+const TrayWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Traystyles__TrayWrapper",
   componentId: "sc-1v5sbw5-2"
-})(["position:fixed;top:0;right:0;z-index:", ";box-shadow:", ";width:400px;border-radius:3px;max-height:", "px;display:flex;flex-direction:column;background:", ";"], function (props) {
-  return props.theme.variables['zindex-tooltip'];
-}, function (props) {
-  return props.theme.variables['box-shadow-2'];
-}, WRAPPER_HEIGHT, function (props) {
-  return props.theme.palette.white;
-});
-export var TrayHeader = styled.div.withConfig({
+})(["position:fixed;top:0;right:0;z-index:", ";box-shadow:", ";width:400px;border-radius:3px;max-height:", "px;display:flex;flex-direction:column;background:", ";"], (props) => props.theme.variables["zindex-tooltip"], (props) => props.theme.variables["box-shadow-2"], WRAPPER_HEIGHT, (props) => props.theme.palette.white);
+const TrayHeader = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Traystyles__TrayHeader",
   componentId: "sc-1v5sbw5-3"
-})(["height:", "px;flex:0 0 ", "px;padding-left:18px;padding-right:12px;border-bottom:solid 1px ", ";display:flex;align-items:center;justify-content:space-between;"], HEADER_HEIGHT, HEADER_HEIGHT, function (props) {
-  return props.theme.palette['grey-200'];
-});
-export var TrayHeaderLeft = styled.div.withConfig({
+})(["height:", "px;flex:0 0 ", "px;padding-left:18px;padding-right:12px;border-bottom:solid 1px ", ";display:flex;align-items:center;justify-content:space-between;"], HEADER_HEIGHT, HEADER_HEIGHT, (props) => props.theme.palette["grey-200"]);
+const TrayHeaderLeft = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Traystyles__TrayHeaderLeft",
   componentId: "sc-1v5sbw5-4"
 })([""]);
-export var TrayHeaderRight = styled.div.withConfig({
+const TrayHeaderRight = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Traystyles__TrayHeaderRight",
   componentId: "sc-1v5sbw5-5"
 })(["display:flex;gap:8px;align-items:center;"]);
-export var TrayFooter = styled.div.withConfig({
+const TrayFooter = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Traystyles__TrayFooter",
   componentId: "sc-1v5sbw5-6"
-})(["border-top:solid 1px ", ";background:", ";height:", "px;display:flex;align-items:center;padding:0 8px;flex:0 0 ", "px;"], function (props) {
-  return props.theme.palette['grey-100'];
-}, function (props) {
-  return props.theme.palette['grey-050'];
-}, FOOTER_HEIGHT, FOOTER_HEIGHT);
-export var TrayTitle = styled(Title).withConfig({
+})(["border-top:solid 1px ", ";background:", ";height:", "px;display:flex;align-items:center;padding:0 8px;flex:0 0 ", "px;"], (props) => props.theme.palette["grey-100"], (props) => props.theme.palette["grey-050"], FOOTER_HEIGHT, FOOTER_HEIGHT);
+const TrayTitle = /* @__PURE__ */ styled(Title).withConfig({
   displayName: "Traystyles__TrayTitle",
   componentId: "sc-1v5sbw5-7"
-})(["margin:0;"]);
+})(["margin:0;"]);
+export {
+  TrayContent,
+  TrayFooter,
+  TrayHeader,
+  TrayHeaderLeft,
+  TrayHeaderRight,
+  TrayScrollbar,
+  TrayTitle,
+  TrayWrapper
+};

package/dist/Tray.types.d.ts

@@ -1,4 +1,4 @@
-import { type WithHTMLAttributes } from '@synerise/ds-utils';
+import { WithHTMLAttributes } from '@synerise/ds-utils';
 export type TrayProps = WithHTMLAttributes<HTMLDivElement, {
     id: string;
 }>;

package/dist/Tray.types.js

@@ -1 +1 @@
-export {};
+

package/dist/components/TrayProvider.d.ts

@@ -1,4 +1,4 @@
-import React, { type ReactNode } from 'react';
+import { default as React, ReactNode } from 'react';
 export type TrayData = {
     content: ReactNode;
     title: ReactNode;

package/dist/components/TrayProvider.js

@@ -1,39 +1,40 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React, { useState } from 'react';
-import { TrayContext } from '../contexts/TrayContext';
-export var TrayProvider = function TrayProvider(_ref) {
-  var children = _ref.children;
-  var _useState = useState({}),
-    trayState = _useState[0],
-    setTrayState = _useState[1];
-  var openTray = function openTray(id, data) {
-    setTrayState(function (prev) {
-      var _extends2;
-      return _extends({}, prev, (_extends2 = {}, _extends2[id] = {
+import { jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { TrayContext } from "../contexts/TrayContext.js";
+const TrayProvider = ({
+  children
+}) => {
+  const [trayState, setTrayState] = useState({});
+  const openTray = (id, data) => {
+    setTrayState((prev) => ({
+      ...prev,
+      [id]: {
         isOpen: true,
-        data: data
-      }, _extends2));
-    });
+        data
+      }
+    }));
   };
-  var closeTray = function closeTray(id) {
-    setTrayState(function (prev) {
-      var _extends3;
-      return _extends({}, prev, (_extends3 = {}, _extends3[id] = _extends({}, prev[id], {
+  const closeTray = (id) => {
+    setTrayState((prev) => ({
+      ...prev,
+      [id]: {
+        ...prev[id],
         isOpen: false
-      }), _extends3));
-    });
+      }
+    }));
   };
-  var getTrayState = function getTrayState(id) {
+  const getTrayState = (id) => {
     return trayState[id] || {
       isOpen: false,
       data: null
     };
   };
-  return /*#__PURE__*/React.createElement(TrayContext.Provider, {
-    value: {
-      openTray: openTray,
-      closeTray: closeTray,
-      getTrayState: getTrayState
-    }
-  }, children);
-};
+  return /* @__PURE__ */ jsx(TrayContext.Provider, { value: {
+    openTray,
+    closeTray,
+    getTrayState
+  }, children });
+};
+export {
+  TrayProvider
+};

package/dist/contexts/TrayContext.d.ts

@@ -1,4 +1,4 @@
-import { type TrayData } from '../components/TrayProvider';
+import { TrayData } from '../components/TrayProvider';
 export type TrayContextType = {
     openTray: (id: string, data: TrayData) => void;
     closeTray: (id: string) => void;
@@ -7,4 +7,4 @@ export type TrayContextType = {
         data: TrayData;
     };
 };
-export declare const TrayContext: import("react").Context<TrayContextType | undefined>;
+export declare const TrayContext: import('react').Context<TrayContextType | undefined>;

package/dist/contexts/TrayContext.js

@@ -1,2 +1,5 @@
-import { createContext } from 'react';
-export var TrayContext = /*#__PURE__*/createContext(undefined);
+import { createContext } from "react";
+const TrayContext = createContext(void 0);
+export {
+  TrayContext
+};

package/dist/hooks/useTray.d.ts

@@ -1,4 +1,4 @@
 export declare const useTray: () => {
-    open: (id: string, data: import("../components/TrayProvider").TrayData) => void;
+    open: (id: string, data: import('../components/TrayProvider').TrayData) => void;
     close: (id: string) => void;
 };

package/dist/hooks/useTray.js

@@ -1,10 +1,14 @@
-import { useTrayContext } from './useTrayContext';
-export var useTray = function useTray() {
-  var _useTrayContext = useTrayContext(),
-    openTray = _useTrayContext.openTray,
-    closeTray = _useTrayContext.closeTray;
+import { useTrayContext } from "./useTrayContext.js";
+const useTray = () => {
+  const {
+    openTray,
+    closeTray
+  } = useTrayContext();
   return {
     open: openTray,
     close: closeTray
   };
-};
+};
+export {
+  useTray
+};

package/dist/hooks/useTrayContext.d.ts

@@ -1,2 +1,2 @@
-import { type TrayContextType } from '../contexts/TrayContext';
+import { TrayContextType } from '../contexts/TrayContext';
 export declare const useTrayContext: () => TrayContextType;

package/dist/hooks/useTrayContext.js

@@ -1,9 +1,12 @@
-import { useContext } from 'react';
-import { TrayContext } from '../contexts/TrayContext';
-export var useTrayContext = function useTrayContext() {
-  var context = useContext(TrayContext);
+import { useContext } from "react";
+import { TrayContext } from "../contexts/TrayContext.js";
+const useTrayContext = () => {
+  const context = useContext(TrayContext);
   if (!context) {
-    throw new Error('useTrayContext must be used within a TrayProvider');
+    throw new Error("useTrayContext must be used within a TrayProvider");
   }
   return context;
-};
+};
+export {
+  useTrayContext
+};

package/dist/index.js

@@ -1,3 +1,8 @@
-export { default } from './Tray';
-export { TrayProvider } from './components/TrayProvider';
-export { useTray } from './hooks/useTray';
+import { default as default2 } from "./Tray.js";
+import { TrayProvider } from "./components/TrayProvider.js";
+import { useTray } from "./hooks/useTray.js";
+export {
+  TrayProvider,
+  default2 as default,
+  useTray
+};

package/dist/modules.d.js

@@ -1 +1 @@
-import '@testing-library/jest-dom';
+import "@testing-library/jest-dom";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-tray",
-  "version": "1.1.26",
+  "version": "1.1.28",
   "description": "Tray UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -16,10 +16,10 @@
     "access": "public"
   },
   "scripts": {
-    "build": "pnpm run build:js && pnpm run build:css && pnpm run defs",
+    "build": "vite build",
     "build:css": "node ../../../scripts/style/less.js",
     "build:js": "babel --delete-dir-on-start --root-mode upward src --out-dir dist --extensions '.js,.ts,.tsx'",
-    "build:watch": "pnpm run build:js -- --watch",
+    "build:watch": "vite build --watch",
     "defs": "tsc --declaration --outDir dist/ --emitDeclarationOnly",
     "prepublish": "pnpm run build",
     "types": "tsc --noEmit",
@@ -34,16 +34,16 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-button": "^1.5.17",
-    "@synerise/ds-icon": "^1.15.0",
-    "@synerise/ds-scrollbar": "^1.2.16",
-    "@synerise/ds-typography": "^1.1.12",
-    "@synerise/ds-utils": "^1.7.0"
+    "@synerise/ds-button": "^1.5.19",
+    "@synerise/ds-icon": "^1.15.2",
+    "@synerise/ds-scrollbar": "^1.2.18",
+    "@synerise/ds-typography": "^1.1.14",
+    "@synerise/ds-utils": "^1.7.1"
   },
   "peerDependencies": {
     "@synerise/ds-core": "*",
     "react": ">=16.9.0 <= 18.3.1",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "8efc031fa688c0b87c7b3915bae93546bb63bcac"
+  "gitHead": "c2384982c3533a31eb5e5e0408f8dcecb2b0f399"
 }