@synerise/ds-date-picker 1.2.1 → 1.2.2

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.2.2](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-picker@1.2.1...@synerise/ds-date-picker@1.2.2) (2025-07-24)
+
+
+### Bug Fixes
+
+* **date-picker:** center picker and quick picks ([06f9301](https://github.com/Synerise/synerise-design/commit/06f930140ea450c6b28f6fbe72792fb7295fcd35))
+
+
+
+
+
 ## [1.2.1](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-picker@1.2.0...@synerise/ds-date-picker@1.2.1) (2025-07-17)
 
 **Note:** Version bump only for package @synerise/ds-date-picker

package/dist/DatePicker.styles.d.ts

@@ -1,4 +1,6 @@
 export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ContentWrapper: import("styled-components").StyledComponent<"div", any, {
+    withQuickPicks?: boolean;
+}, never>;
 export declare const PickerWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const OverlayContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/DatePicker.styles.js

@@ -10,7 +10,9 @@ export var Container = styled.div.withConfig({
 export var ContentWrapper = styled.div.withConfig({
   displayName: "DatePickerstyles__ContentWrapper",
   componentId: "sc-1kprsne-1"
-})(["display:flex;"]);
+})(["", ""], function (props) {
+  return props.withQuickPicks && "\n    display: flex;\n    justify-content: center;\n    ";
+});
 export var PickerWrapper = styled.div.withConfig({
   displayName: "DatePickerstyles__PickerWrapper",
   componentId: "sc-1kprsne-2"

package/dist/Elements/Footer/Footer.types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type WrappedComponentProps } from 'react-intl';
 import { type Texts } from '../../DatePicker.types';
 export type Props = {

package/dist/Elements/Navbar/Navbar.styles.d.ts

@@ -1,11 +1,12 @@
 import Button from '@synerise/ds-button';
+import { type ThemeProps } from '@synerise/ds-core';
 export declare const NavButton: import("styled-components").StyledComponent<typeof Button, any, {
-    hidden?: boolean | undefined;
+    hidden?: boolean;
 }, never>;
 export declare const ArrowPlaceholder: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ArrowContainer: import("styled-components").StyledComponent<"div", any, {
-    hidden?: boolean | undefined;
+    hidden?: boolean;
 }, never>;
 export declare const Text: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Link: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const Link: import("styled-components").StyledComponent<"span", any, ThemeProps, never>;

package/dist/Elements/PickerInput/PickerInput.js

@@ -4,6 +4,7 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
 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, { useCallback, useMemo, useState } from 'react';
 import { legacyParse } from '@date-fns/upgrade/v2';
+import { useTheme } from '@synerise/ds-core';
 import { getDefaultDataTimeOptions, useDataFormat } from '@synerise/ds-data-format';
 import Icon, { CalendarM, Close3S } from '@synerise/ds-icon';
 import Tooltip from '@synerise/ds-tooltip';
@@ -28,6 +29,7 @@ var PickerInput = function PickerInput(_ref) {
     rest = _objectWithoutPropertiesLoose(_ref, _excluded);
   var _useDataFormat = useDataFormat(),
     formatValue = _useDataFormat.formatValue;
+  var theme = useTheme();
   var _useState = useState(false),
     hovered = _useState[0],
     setHovered = _useState[1];
@@ -65,9 +67,10 @@ var PickerInput = function PickerInput(_ref) {
       component: /*#__PURE__*/React.createElement(Close3S, null),
       onClick: handleIconClick
     }))) : /*#__PURE__*/React.createElement(S.DefaultIconWrapper, null, /*#__PURE__*/React.createElement(Icon, {
-      component: /*#__PURE__*/React.createElement(CalendarM, null)
+      component: /*#__PURE__*/React.createElement(CalendarM, null),
+      color: theme.palette['grey-400']
     }));
-  }, [hovered, highlight, allowClear, readOnly, value, clearTooltip, handleIconClick]);
+  }, [hovered, highlight, allowClear, readOnly, value, theme, clearTooltip, handleIconClick]);
   var _ref2 = triggerHTMLAttributes != null ? triggerHTMLAttributes : {},
     className = _ref2.className,
     restAttributes = _objectWithoutPropertiesLoose(_ref2, _excluded2);

package/dist/Elements/PickerInput/PickerInput.styles.d.ts

@@ -1,23 +1,23 @@
-/// <reference types="react" />
+import { type ThemeProps } from '@synerise/ds-core';
 import { type InputProps } from '@synerise/ds-input';
-export declare const Prefixel: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Suffixel: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Input: import("styled-components").StyledComponent<({ className, errorText, label, description, counterLimit, tooltip, tooltipConfig, icon1, icon1Tooltip, autoResize, icon2, icon2Tooltip, resetMargin, handleInputRef, prefixel, suffixel, error, expandable, expandableTooltip, renderCustomCounter, autoResizeProps, ...antdInputProps }: InputProps) => import("react").JSX.Element, any, {
-    error?: boolean | undefined;
-    className?: string | undefined;
-    counterLimit?: number | undefined;
-    renderCustomCounter?: ((count?: number | undefined) => import("react").ReactNode) | undefined;
-    icon1?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
-    icon1Tooltip?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
-    icon2?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
-    icon2Tooltip?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
-    resetMargin?: boolean | undefined;
+export declare const Prefixel: import("styled-components").StyledComponent<"div", any, ThemeProps, never>;
+export declare const Suffixel: import("styled-components").StyledComponent<"div", any, ThemeProps, never>;
+export declare const Input: import("styled-components").StyledComponent<({ className, errorText, label, description, counterLimit, tooltip, tooltipConfig, icon1, icon1Tooltip, autoResize, icon2, icon2Tooltip, resetMargin, handleInputRef, prefixel, suffixel, error, expandable, expandableTooltip, renderCustomCounter, autoResizeProps, ...antdInputProps }: InputProps) => React.JSX.Element, any, {
+    error?: boolean;
+    className?: string;
+    counterLimit?: number;
+    renderCustomCounter?: (count?: number) => import("react").ReactNode;
+    icon1?: import("react").ReactElement;
+    icon1Tooltip?: import("react").ReactElement;
+    icon2?: import("react").ReactElement;
+    icon2Tooltip?: import("react").ReactElement;
+    resetMargin?: boolean;
     handleInputRef?: ((ref: import("react").MutableRefObject<HTMLInputElement | null>) => void) | undefined;
     prefixel?: import("react").ReactNode;
     suffixel?: import("react").ReactNode;
-    autoResize?: import("@synerise/ds-input").AutoResizeProp | undefined;
-    autoResizeProps?: Partial<Pick<import("@synerise/ds-input").AutosizeInputProps, "wrapperClassName" | "placeholderIsMinWidth" | "wrapperStyle" | "extraWidth">> | undefined;
-    expandable?: boolean | undefined;
+    autoResize?: import("@synerise/ds-input").AutoResizeProp;
+    autoResizeProps?: Partial<Pick<import("@synerise/ds-input").AutosizeInputProps, "placeholderIsMinWidth" | "wrapperClassName" | "wrapperStyle" | "extraWidth">>;
+    expandable?: boolean;
     expandableTooltip?: import("react").ReactNode;
 } & Omit<import("@synerise/ds-form-field").ContentAboveProps, "id" | "rightSide"> & import("@synerise/ds-form-field").ContentBelowProps & import("antd/lib/input").InputProps & {
     active: boolean;

package/dist/Elements/PickerInput/PickerInput.styles.js

@@ -48,6 +48,8 @@ export var ClearIconWrapper = styled.div.withConfig({
 export var DefaultIconWrapper = styled.div.withConfig({
   displayName: "PickerInputstyles__DefaultIconWrapper",
   componentId: "sc-168pcz5-6"
-})(["&&:hover{.ds-icon svg{fill:", ";}}"], function (props) {
+})([".ds-icon svg{fill:", ";}&&:hover{.ds-icon svg{fill:", ";}}"], function (props) {
+  return props.theme.palette['grey-400'];
+}, function (props) {
   return props.theme.palette['grey-600'];
 });

package/dist/RawDatePicker/RawDatePicker.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type WrappedComponentProps } from 'react-intl';
 import { type RawDatePickerProps } from './RawDatePicker.types';
-declare const _default: React.FC<import("react-intl").WithIntlProps<RawDatePickerProps & WrappedComponentProps<"intl">>> & {
-    WrappedComponent: React.ComponentType<RawDatePickerProps & WrappedComponentProps<"intl">>;
+declare const _default: React.FC<import("react-intl").WithIntlProps<RawDatePickerProps & WrappedComponentProps>> & {
+    WrappedComponent: React.ComponentType<RawDatePickerProps & WrappedComponentProps>;
 };
 export default _default;

package/dist/RawDatePicker/RawDatePicker.js

@@ -260,7 +260,9 @@ var RawDatePicker = /*#__PURE__*/function (_React$Component) {
         picker = null;
         break;
     }
-    return /*#__PURE__*/React.createElement(S.Container, null, /*#__PURE__*/React.createElement(S.ContentWrapper, null, (quickPicks == null ? void 0 : quickPicks.length) && /*#__PURE__*/React.createElement(QuickPicks, {
+    return /*#__PURE__*/React.createElement(S.Container, null, /*#__PURE__*/React.createElement(S.ContentWrapper, {
+      withQuickPicks: !!(quickPicks != null && quickPicks.length)
+    }, (quickPicks == null ? void 0 : quickPicks.length) && /*#__PURE__*/React.createElement(QuickPicks, {
       value: value,
       onChange: function onChange(item) {
         _this2.handleMonthChange(item.value, 'date');

package/dist/format.js

@@ -6,6 +6,9 @@ var locales = {
   pl: pl,
   es: es
 };
+var isLocaleKey = function isLocaleKey(key) {
+  return Object.prototype.hasOwnProperty.call(locales, key);
+};
 var defaultLocale = 'en';
 export default function (date, formatStr, locale) {
   if (locale === void 0) {
@@ -14,7 +17,8 @@ export default function (date, formatStr, locale) {
   if (!fnsIsValid(date)) {
     return '';
   }
+  var localeKey = locale.substring(0, 2);
   return fnsFormat(date, formatStr, {
-    locale: locales[locale.substring(0, 2)]
+    locale: isLocaleKey(localeKey) ? locales[localeKey] : locales[defaultLocale]
   });
 }

package/dist/localeUtils.js

@@ -1,5 +1,6 @@
 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 MomentLocaleUtils from 'react-day-picker/moment';
+var LOCALES = ['en', 'pl'];
 var WEEKDAYS_LONG = {
   en: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
   pl: ['Niedziela', 'Poniedziałek', 'Wtorek', 'Środa', 'Czwartek', 'Piątek', 'obota']
@@ -18,8 +19,11 @@ var FIRST_DAY = {
 };
 var DEFAULT_LOCALE = 'en';
 var DEFAULT_FORMAT = 'MMM DD, YYYY';
+var isValidLocale = function isValidLocale(locale) {
+  return LOCALES.includes(locale);
+};
 var getValidLocale = function getValidLocale(locale) {
-  return Object.keys(MONTHS).includes(locale) ? locale : DEFAULT_LOCALE;
+  return isValidLocale(locale) ? locale : DEFAULT_LOCALE;
 };
 function formatDay(d, _format, locale) {
   if (_format === void 0) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-date-picker",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "DatePicker UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -35,14 +35,14 @@
   "types": "dist/index.d.ts",
   "dependencies": {
     "@date-fns/upgrade": "^1.0.3",
-    "@synerise/ds-button": "^1.4.5",
-    "@synerise/ds-data-format": "^1.0.1",
-    "@synerise/ds-dropdown": "^1.0.18",
-    "@synerise/ds-icon": "^1.6.1",
-    "@synerise/ds-input": "^1.3.5",
-    "@synerise/ds-time-picker": "^1.1.13",
-    "@synerise/ds-tooltip": "^1.1.14",
-    "@synerise/ds-utils": "^1.3.1",
+    "@synerise/ds-button": "^1.4.6",
+    "@synerise/ds-data-format": "^1.1.0",
+    "@synerise/ds-dropdown": "^1.0.19",
+    "@synerise/ds-icon": "^1.6.2",
+    "@synerise/ds-input": "^1.3.6",
+    "@synerise/ds-time-picker": "^1.1.14",
+    "@synerise/ds-tooltip": "^1.1.15",
+    "@synerise/ds-utils": "^1.4.0",
     "classnames": "^2.5.1",
     "date-fns": "2.16.1",
     "lodash": "^4.17.21",
@@ -56,5 +56,5 @@
     "react-intl": ">=3.12.0 <= 6.8",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "4e851d649cb25346f2f8e0575dde91cc50f43bc4"
+  "gitHead": "b35b1875727156fe9f5b3bad55aed5ca447c8c8d"
 }