npm - @gravity-ui/date-components - Versions diffs - 2.11.0 → 3.0.0-beta.0 - Mend

@gravity-ui/date-components 2.11.0 → 3.0.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (673) hide show

package/dist/cjs/components/RangeDatePicker/hooks/useRangeDatePickerState.js CHANGED Viewed

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useRangeDatePickerState = void 0;
-const datePickerStateFactory_1 = require("../../DatePicker/hooks/datePickerStateFactory");
-const utils_1 = require("../../DatePicker/utils");
-const RangeDateField_1 = require("../../RangeDateField");
-const dates_1 = require("../../utils/dates");
+const datePickerStateFactory_1 = require("../../DatePicker/hooks/datePickerStateFactory.js");
+const utils_1 = require("../../DatePicker/utils/index.js");
+const RangeDateField_1 = require("../../RangeDateField/index.js");
+const dates_1 = require("../../utils/dates.js");
 exports.useRangeDatePickerState = (0, datePickerStateFactory_1.datePickerStateFactory)({
     getPlaceholderTime,
     mergeDateTime: mergeRangeDateTime,
@@ -26,3 +26,4 @@ function setTimezone(date, timeZone) {
     const end = date.end.timeZone(timeZone);
     return { start, end };
 }
+//# sourceMappingURL=useRangeDatePickerState.js.map

package/dist/cjs/components/RangeDatePicker/hooks/useRangeDatePickerState.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useRangeDatePickerState.js","sourceRoot":"../../../../../src","sources":["components/RangeDatePicker/hooks/useRangeDatePickerState.ts"],"names":[],"mappings":";;;AAGA,6FAAqF;AACrF,2DAAwD;AACxD,kEAA4D;AAG5D,gDAAwE;AAM3D,QAAA,uBAAuB,GAAG,IAAA,+CAAsB,EAAC;IAC1D,kBAAkB;IAClB,aAAa,EAAE,kBAAkB;IACjC,WAAW;IACX,WAAW,EAAE,wBAAgB;IAC7B,iBAAiB,EAAE,uCAAsB;CAC5C,CAAC,CAAC;AAEH,SAAS,kBAAkB,CACvB,gBAAsC,EACtC,QAAiB;IAEjB,MAAM,IAAI,GAAG,IAAA,8BAAsB,EAAC,EAAC,gBAAgB,EAAE,QAAQ,EAAC,CAAC,CAAC;IAClE,OAAO,EAAC,KAAK,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAC,CAAC;AACpC,CAAC;AAED,SAAS,kBAAkB,CACvB,IAA0B,EAC1B,IAA0B;IAE1B,MAAM,KAAK,GAAG,IAAA,qBAAa,EAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACpD,MAAM,GAAG,GAAG,IAAA,qBAAa,EAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;IAC9C,OAAO,EAAC,KAAK,EAAE,GAAG,EAAC,CAAC;AACxB,CAAC;AAED,SAAS,WAAW,CAAC,IAA0B,EAAE,QAAgB;IAC7D,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;IAC5C,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;IACxC,OAAO,EAAC,KAAK,EAAE,GAAG,EAAC,CAAC;AACxB,CAAC","sourcesContent":["import type {DateTime} from '@gravity-ui/date-utils';\n\nimport type {DatePickerState} from '../../DatePicker';\nimport {datePickerStateFactory} from '../../DatePicker/hooks/datePickerStateFactory';\nimport {getDateTimeValue} from '../../DatePicker/utils';\nimport {useRangeDateFieldState} from '../../RangeDateField';\nimport type {RangeDateFieldStateOptions} from '../../RangeDateField';\nimport type {RangeValue} from '../../types';\nimport {createPlaceholderValue, mergeDateTime} from '../../utils/dates';\n\nexport type RangeDatePickerState = DatePickerState<RangeValue<DateTime>>;\n\nexport type RangeDatePickerStateOptions = RangeDateFieldStateOptions;\n\nexport const useRangeDatePickerState = datePickerStateFactory({\n getPlaceholderTime,\n mergeDateTime: mergeRangeDateTime,\n setTimezone,\n getDateTime: getDateTimeValue,\n useDateFieldState: useRangeDateFieldState,\n});\n\nfunction getPlaceholderTime(\n placeholderValue: DateTime | undefined,\n timeZone?: string,\n): RangeValue<DateTime> {\n const date = createPlaceholderValue({placeholderValue, timeZone});\n return {start: date, end: date};\n}\n\nfunction mergeRangeDateTime(\n date: RangeValue<DateTime>,\n time: RangeValue<DateTime>,\n): RangeValue<DateTime> {\n const start = mergeDateTime(date.start, time.start);\n const end = mergeDateTime(date.end, time.end);\n return {start, end};\n}\n\nfunction setTimezone(date: RangeValue<DateTime>, timeZone: string): RangeValue<DateTime> {\n const start = date.start.timeZone(timeZone);\n const end = date.end.timeZone(timeZone);\n return {start, end};\n}\n"]}

package/dist/cjs/components/RangeDatePicker/index.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-export * from './RangeDatePicker';
-export * from './hooks/useRangeDatePickerState';
+export * from "./RangeDatePicker.js";
+export * from "./hooks/useRangeDatePickerState.js";

package/dist/cjs/components/RangeDatePicker/index.js CHANGED Viewed

@@ -1,18 +1,6 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./RangeDatePicker"), exports);
-__exportStar(require("./hooks/useRangeDatePickerState"), exports);
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./RangeDatePicker.js"), exports);
+tslib_1.__exportStar(require("./hooks/useRangeDatePickerState.js"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/RangeDatePicker/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.js","sourceRoot":"../../../../src","sources":["components/RangeDatePicker/index.ts"],"names":[],"mappings":";;;AAAA,+DAAkC;AAElC,6EAAgD","sourcesContent":["export * from './RangeDatePicker';\n\nexport * from './hooks/useRangeDatePickerState';\n"]}

package/dist/cjs/components/RangeDateSelection/RangeDateSelection.css CHANGED Viewed

@@ -25,4 +25,5 @@
   grid-area: buttons-end;
   padding-inline-start: var(--g-spacing-half);
   border-inline-start: 1px solid var(--g-color-line-generic);
-}
+}
+/*# sourceMappingURL=RangeDateSelection.css.map */

package/dist/cjs/components/RangeDateSelection/RangeDateSelection.css.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["components/RangeDateSelection/data:;charset=utf-8,@use%20'../variables';%0A@use%20'../mixins';%0A%0A$block:%20'.%23%7Bvariables.$ns%7Drange-date-selection';%0A%0A%23%7B$block%7D%20%7B%0A%20%20%20%20display:%20grid;%0A%20%20%20%20align-items:%20center;%0A%20%20%20%20grid-template-areas:%20'buttons-start%20ruler%20buttons-end';%0A%20%20%20%20grid-template-columns:%20auto%201fr%20auto;%0A%0A%20%20%20%20border-block:%201px%20solid%20var(--g-color-line-generic);%0A%0A%20%20%20%20&__ruler%20%7B%0A%20%20%20%20%20%20%20%20grid-area:%20ruler;%0A%0A%20%20%20%20%20%20%20%20&_dragging%20%23%7B$block%7D__selection%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20pointer-events:%20none;%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20&__buttons%20%7B%0A%20%20%20%20%20%20%20%20display:%20flex;%0A%20%20%20%20%20%20%20%20align-items:%20center;%0A%0A%20%20%20%20%20%20%20%20height:%2022px;%0A%0A%20%20%20%20%20%20%20%20&_position_start%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20grid-area:%20buttons-start;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20padding-inline-end:%20var(--g-spacing-half);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20border-inline-end:%201px%20solid%20var(--g-color-line-generic);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20&_position_end%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20grid-area:%20buttons-end;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20padding-inline-start:%20var(--g-spacing-half);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20border-inline-start:%201px%20solid%20var(--g-color-line-generic);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%7D%0A"],"names":[],"mappings":"AAKA;EACI;EACA;EACA;EACA;EAEA;;AAEA;EACI;;AAEA;EACI;;AAIR;EACI;EACA;EAEA;;AAEA;EACI;EAEA;EAEA;;AAGJ;EACI;EAEA;EAEA","sourcesContent":["@use '../variables';\n@use '../mixins';\n\n$block: '.#{variables.$ns}range-date-selection';\n\n#{$block} {\n display: grid;\n align-items: center;\n grid-template-areas: 'buttons-start ruler buttons-end';\n grid-template-columns: auto 1fr auto;\n\n border-block: 1px solid var(--g-color-line-generic);\n\n &__ruler {\n grid-area: ruler;\n\n &_dragging #{$block}__selection {\n pointer-events: none;\n }\n }\n\n &__buttons {\n display: flex;\n align-items: center;\n\n height: 22px;\n\n &_position_start {\n grid-area: buttons-start;\n\n padding-inline-end: var(--g-spacing-half);\n\n border-inline-end: 1px solid var(--g-color-line-generic);\n }\n\n &_position_end {\n grid-area: buttons-end;\n\n padding-inline-start: var(--g-spacing-half);\n\n border-inline-start: 1px solid var(--g-color-line-generic);\n }\n }\n}\n"],"file":"RangeDateSelection.css"}

package/dist/cjs/components/RangeDateSelection/RangeDateSelection.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
 import React from 'react';
 import type { DateTime } from '@gravity-ui/date-utils';
-import type { AccessibilityProps, DomProps, StyleProps } from '../types';
-import type { ViewportDimensions, ViewportInterval } from './components/Ruler/Ruler';
-import type { RangeDateSelectionOptions } from './hooks/useRangeDateSelectionState';
-import './RangeDateSelection.css';
+import type { AccessibilityProps, DomProps, StyleProps } from "../types/index.js";
+import type { ViewportDimensions, ViewportInterval } from "./components/Ruler/Ruler.js";
+import type { RangeDateSelectionOptions } from "./hooks/useRangeDateSelectionState.js";
+import "./RangeDateSelection.css";
 export interface RangeDateSelectionProps extends RangeDateSelectionOptions, DomProps, StyleProps, AccessibilityProps {
     /** Formats time ticks */
     formatTime?: (time: DateTime) => string;

package/dist/cjs/components/RangeDateSelection/RangeDateSelection.js CHANGED Viewed

@@ -1,20 +1,18 @@
 'use client';
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RangeDateSelection = RangeDateSelection;
+const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("react"));
+const react_1 = tslib_1.__importDefault(require("react"));
 const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
-const cn_1 = require("../../utils/cn");
-const filterDOMProps_1 = require("../utils/filterDOMProps");
-const Ruler_1 = require("./components/Ruler/Ruler");
-const SelectionControl_1 = require("./components/SelectionControl/SelectionControl");
-const useRangeDateSelectionState_1 = require("./hooks/useRangeDateSelectionState");
-const i18n_1 = require("./i18n");
+const cn_1 = require("../../utils/cn.js");
+const filterDOMProps_1 = require("../utils/filterDOMProps.js");
+const Ruler_1 = require("./components/Ruler/Ruler.js");
+const SelectionControl_1 = require("./components/SelectionControl/SelectionControl.js");
+const useRangeDateSelectionState_1 = require("./hooks/useRangeDateSelectionState.js");
+const i18n_1 = require("./i18n/index.js");
 require("./RangeDateSelection.css");
 const b = (0, cn_1.block)('range-date-selection');
 function RangeDateSelection(props) {
@@ -41,9 +39,10 @@ function RangeDateSelection(props) {
                             state.startDragging();
                             state.scale(0.5);
                             state.endDragging();
-                        }, extraProps: { 'aria-label': (0, i18n_1.i18n)('Decrease range') }, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Minus }) }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat-secondary", size: "xs", onClick: () => {
+                        }, "aria-label": (0, i18n_1.i18n)('Decrease range'), children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Minus }) }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat-secondary", size: "xs", onClick: () => {
                             state.startDragging();
                             state.scale(1.5);
                             state.endDragging();
-                        }, extraProps: { 'aria-label': (0, i18n_1.i18n)('Increase range') }, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Plus }) })] })) : null] })));
+                        }, "aria-label": (0, i18n_1.i18n)('Increase range'), children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Plus }) })] })) : null] })));
 }
+//# sourceMappingURL=RangeDateSelection.js.map

package/dist/cjs/components/RangeDateSelection/RangeDateSelection.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RangeDateSelection.js","sourceRoot":"../../../../src","sources":["components/RangeDateSelection/RangeDateSelection.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AA6Cb,gDA4EC;;;AAvHD,0DAA0B;AAG1B,6CAA8C;AAC9C,6CAA+C;AAE/C,0CAAqC;AAErC,+DAAuD;AAEvD,uDAAuD;AAEvD,wFAAgF;AAChF,sFAA8E;AAE9E,0CAA4B;AAE5B,oCAAmC;AAEnC,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,sBAAsB,CAAC,CAAC;AAwBxC,SAAgB,kBAAkB,CAAC,KAA8B;;IAC7D,MAAM,KAAK,GAAG,IAAA,uDAA0B,EAAC,KAAK,CAAC,CAAC;IAEhD,MAAM,CAAC,eAAe,EAAE,gBAAgB,CAAC,GAAG,eAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElE,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAC9B,KAAK,CAAC,gBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QACpC,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC,CAAC;IACF,MAAM,eAAe,GAAG,CAAC,CAAS,EAAE,EAAE;QAClC,MAAM,aAAa,GAAG,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;QACpF,MAAM,KAAK,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,aAAa,CAAC,GAAG,GAAG,CAAC,CAAC;QACrD,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IACF,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC5B,gBAAgB,CAAC,KAAK,CAAC,CAAC;QACxB,KAAK,CAAC,WAAW,EAAE,CAAC;IACxB,CAAC,CAAC;IAEF,IAAI,EAAE,GAAG,eAAK,CAAC,KAAK,EAAE,CAAC;IACvB,EAAE,GAAG,MAAA,KAAK,CAAC,EAAE,mCAAI,EAAE,CAAC;IAEpB,OAAO,CACH,iDACQ,IAAA,+BAAc,EAAC,KAAK,EAAE,EAAC,SAAS,EAAE,IAAI,EAAC,CAAC,IAC5C,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,EACnC,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,GAAG,EAAC,KAAK,CAAC,oBAAoB;qBAE9B,uBAAC,qBAAa,kBACV,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,EAAC,QAAQ,EAAE,eAAe,EAAC,CAAC,IAC9C,KAAK,CAAC,gBAAgB,IAC1B,WAAW,EAAE,oBAAoB,EACjC,MAAM,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,EAC1D,SAAS,EAAE,kBAAkB,EAC7B,YAAY,EAAE,KAAK,CAAC,UAAU,EAC9B,UAAU,EAAE,KAAK,CAAC,UAAU,EAC5B,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,UAAU,EAAE,KAAK,CAAC,UAAU,EAC5B,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,4BAA4B,EAAE,KAAK,CAAC,4BAA4B,YAEhE,uBAAC,mCAAgB,IAAC,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,KAAK,qBAAmB,EAAE,GAAI,IACtE,EACf,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,CACrB,iCAAK,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,QAAQ,EAAE,MAAA,KAAK,CAAC,oBAAoB,mCAAI,OAAO,EAAC,CAAC,aAC3E,uBAAC,cAAM,IACH,IAAI,EAAC,gBAAgB,EACrB,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,GAAG,EAAE;4BACV,KAAK,CAAC,aAAa,EAAE,CAAC;4BACtB,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;4BACjB,KAAK,CAAC,WAAW,EAAE,CAAC;wBACxB,CAAC,gBACW,IAAA,WAAI,EAAC,gBAAgB,CAAC,YAElC,uBAAC,YAAI,IAAC,IAAI,EAAE,aAAK,GAAI,GAChB,EACT,uBAAC,cAAM,IACH,IAAI,EAAC,gBAAgB,EACrB,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,GAAG,EAAE;4BACV,KAAK,CAAC,aAAa,EAAE,CAAC;4BACtB,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;4BACjB,KAAK,CAAC,WAAW,EAAE,CAAC;wBACxB,CAAC,gBACW,IAAA,WAAI,EAAC,gBAAgB,CAAC,YAElC,uBAAC,YAAI,IAAC,IAAI,EAAE,YAAI,GAAI,GACf,IACP,CACT,CAAC,CAAC,CAAC,IAAI,KACN,CACT,CAAC;AACN,CAAC","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {Minus, Plus} from '@gravity-ui/icons';\nimport {Button, Icon} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\nimport type {AccessibilityProps, DomProps, StyleProps} from '../types';\nimport {filterDOMProps} from '../utils/filterDOMProps';\n\nimport {DateTimeRuler} from './components/Ruler/Ruler';\nimport type {ViewportDimensions, ViewportInterval} from './components/Ruler/Ruler';\nimport {SelectionControl} from './components/SelectionControl/SelectionControl';\nimport {useRangeDateSelectionState} from './hooks/useRangeDateSelectionState';\nimport type {RangeDateSelectionOptions} from './hooks/useRangeDateSelectionState';\nimport {i18n} from './i18n';\n\nimport './RangeDateSelection.scss';\n\nconst b = block('range-date-selection');\n\nexport interface RangeDateSelectionProps\n extends RangeDateSelectionOptions,\n DomProps,\n StyleProps,\n AccessibilityProps {\n /** Formats time ticks */\n formatTime?: (time: DateTime) => string;\n /** Displays now line */\n displayNow?: boolean;\n /** Enables dragging ruler */\n draggableRuler?: boolean;\n /** Displays buttons to scale selection */\n hasScaleButtons?: boolean;\n /** Position of scale buttons */\n scaleButtonsPosition?: 'start' | 'end';\n /** Renders additional svg content in the ruler */\n renderAdditionalRulerContent?: (props: {\n interval: ViewportInterval;\n dimensions: ViewportDimensions;\n }) => React.ReactNode;\n}\n\nexport function RangeDateSelection(props: RangeDateSelectionProps) {\n const state = useRangeDateSelectionState(props);\n\n const [isDraggingRuler, setDraggingRuler] = React.useState(false);\n\n const handleRulerMoveStart = () => {\n state.setDraggingValue(state.value);\n setDraggingRuler(true);\n };\n const handleRulerMove = (d: number) => {\n const intervalWidth = state.viewportInterval.end.diff(state.viewportInterval.start);\n const delta = -Math.floor((d * intervalWidth) / 100);\n state.move(delta);\n };\n const handleRulerMoveEnd = () => {\n setDraggingRuler(false);\n state.endDragging();\n };\n\n let id = React.useId();\n id = props.id ?? id;\n\n return (\n <div\n {...filterDOMProps(props, {labelable: true})}\n id={id}\n className={b(null, props.className)}\n style={props.style}\n dir=\"ltr\" // TODO: RTL support\n >\n <DateTimeRuler\n className={b('ruler', {dragging: isDraggingRuler})}\n {...state.viewportInterval}\n onMoveStart={handleRulerMoveStart}\n onMove={props.draggableRuler ? handleRulerMove : undefined}\n onMoveEnd={handleRulerMoveEnd}\n dragDisabled={state.isDragging}\n displayNow={props.displayNow}\n minValue={props.minValue}\n maxValue={props.maxValue}\n formatTime={props.formatTime}\n timeZone={state.timeZone}\n renderAdditionalRulerContent={props.renderAdditionalRulerContent}\n >\n <SelectionControl className={b('selection')} state={state} aria-labelledby={id} />\n </DateTimeRuler>\n {props.hasScaleButtons ? (\n <div className={b('buttons', {position: props.scaleButtonsPosition ?? 'start'})}>\n <Button\n view=\"flat-secondary\"\n size=\"xs\"\n onClick={() => {\n state.startDragging();\n state.scale(0.5);\n state.endDragging();\n }}\n aria-label={i18n('Decrease range')}\n >\n <Icon data={Minus} />\n </Button>\n <Button\n view=\"flat-secondary\"\n size=\"xs\"\n onClick={() => {\n state.startDragging();\n state.scale(1.5);\n state.endDragging();\n }}\n aria-label={i18n('Increase range')}\n >\n <Icon data={Plus} />\n </Button>\n </div>\n ) : null}\n </div>\n );\n}\n"]}

package/dist/cjs/components/RangeDateSelection/components/NowLine/NowLine.css CHANGED Viewed

@@ -1,4 +1,5 @@
 .g-date-timeline-now-line {
   stroke: var(--g-date-thin-timeline-now-color);
   stroke-width: 2px;
-}
+}
+/*# sourceMappingURL=NowLine.css.map */

package/dist/cjs/components/RangeDateSelection/components/NowLine/NowLine.css.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["components/RangeDateSelection/components/variables';%0A%0A$block:%20'.%23%7Bvariables.$ns%7Dtimeline-now-line';%0A%0A%23%7B$block%7D%20%7B%0A%20%20%20%20stroke:%20var(--g-date-thin-timeline-now-color);%0A%20%20%20%20stroke-width:%202px;%0A%7D%0A"],"names":[],"mappings":"AAIA;EACI;EACA","sourcesContent":["@use '../../../variables';\n\n$block: '.#{variables.$ns}timeline-now-line';\n\n#{$block} {\n stroke: var(--g-date-thin-timeline-now-color);\n stroke-width: 2px;\n}\n"],"file":"NowLine.css"}

package/dist/cjs/components/RangeDateSelection/components/NowLine/NowLine.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-import './NowLine.css';
+import "./NowLine.css";
 export declare function NowLine(): import("react/jsx-runtime").JSX.Element | null;

package/dist/cjs/components/RangeDateSelection/components/NowLine/NowLine.js CHANGED Viewed

@@ -1,14 +1,12 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NowLine = NowLine;
+const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("react"));
-const cn_1 = require("../../../../utils/cn");
-const constants_1 = require("../../../utils/constants");
-const Ruler_1 = require("../Ruler/Ruler");
+const react_1 = tslib_1.__importDefault(require("react"));
+const cn_1 = require("../../../../utils/cn.js");
+const constants_1 = require("../../../utils/constants.js");
+const Ruler_1 = require("../Ruler/Ruler.js");
 const MIN_UPDATE_DISTANCE = 4; // in px
 require("./NowLine.css");
 const b = (0, cn_1.block)('timeline-now-line');
@@ -40,3 +38,4 @@ function NowLine() {
         viewport.width;
     return (0, jsx_runtime_1.jsx)("path", { d: `M${nowX},0l0,${viewport.height}`, className: b() });
 }
+//# sourceMappingURL=NowLine.js.map

package/dist/cjs/components/RangeDateSelection/components/NowLine/NowLine.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"NowLine.js","sourceRoot":"../../../../../../src","sources":["components/RangeDateSelection/components/NowLine/NowLine.tsx"],"names":[],"mappings":";;AAYA,0BAqCC;;;AAjDD,0DAA0B;AAE1B,gDAA2C;AAC3C,2DAAgD;AAChD,6CAA0E;AAE1E,MAAM,mBAAmB,GAAG,CAAC,CAAC,CAAC,QAAQ;AAEvC,yBAAwB;AAExB,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,mBAAmB,CAAC,CAAC;AAErC,SAAgB,OAAO;IACnB,MAAM,QAAQ,GAAG,IAAA,6BAAqB,GAAE,CAAC;IACzC,MAAM,EAAC,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAC,GAAG,IAAA,2BAAmB,GAAE,CAAC;IAC/D,MAAM,CAAC,EAAE,QAAQ,CAAC,GAAG,eAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAExC,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;IAC3B,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,EAAE,GAAG,OAAO,CAAC;IAClD,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CACrB,kBAAM,EACN,CAAC,mBAAmB,GAAG,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,QAAQ,CAAC,KAAK,EAChE,SAAS,CAAC,OAAO,EAAE,GAAG,OAAO,CAChC,CAAC;IAEF,eAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,KAAK,GAAkB,IAAI,CAAC;QAChC,IAAI,aAAa,EAAE,CAAC;YAChB,KAAK,GAAG,MAAM,CAAC,WAAW,CAAC,GAAG,EAAE;gBAC5B,QAAQ,CAAC,EAAE,CAAC,CAAC;YACjB,CAAC,EAAE,QAAQ,CAAC,CAAC;QACjB,CAAC;QACD,OAAO,GAAG,EAAE;YACR,IAAI,KAAK,EAAE,CAAC;gBACR,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;gBAC5B,KAAK,GAAG,IAAI,CAAC;YACjB,CAAC;QACL,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAC,CAAC;IAE9B,IAAI,OAAO,GAAG,SAAS,CAAC,OAAO,EAAE,IAAI,OAAO,CAAC,OAAO,EAAE,GAAG,OAAO,EAAE,CAAC;QAC/D,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,IAAI,GACN,CAAC,CAAC,OAAO,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC,CAAC;QAC7E,QAAQ,CAAC,KAAK,CAAC;IAEnB,OAAO,iCAAM,CAAC,EAAE,IAAI,IAAI,QAAQ,QAAQ,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,GAAI,CAAC;AAC1E,CAAC","sourcesContent":["import React from 'react';\n\nimport {block} from '../../../../utils/cn';\nimport {SECOND} from '../../../utils/constants';\nimport {useViewportDimensions, useViewportInterval} from '../Ruler/Ruler';\n\nconst MIN_UPDATE_DISTANCE = 4; // in px\n\nimport './NowLine.scss';\n\nconst b = block('timeline-now-line');\n\nexport function NowLine() {\n const viewport = useViewportDimensions();\n const {start: startDate, end: endDate} = useViewportInterval();\n const [, rerender] = React.useState({});\n\n const nowTime = Date.now();\n const needUpdateNow = endDate.valueOf() > nowTime;\n const interval = Math.max(\n SECOND,\n (MIN_UPDATE_DISTANCE * endDate.diff(startDate)) / viewport.width,\n startDate.valueOf() - nowTime,\n );\n\n React.useEffect(() => {\n let timer: number | null = null;\n if (needUpdateNow) {\n timer = window.setInterval(() => {\n rerender({});\n }, interval);\n }\n return () => {\n if (timer) {\n window.clearInterval(timer);\n timer = null;\n }\n };\n }, [needUpdateNow, interval]);\n\n if (nowTime < startDate.valueOf() || endDate.valueOf() < nowTime) {\n return null;\n }\n\n const nowX =\n ((nowTime - startDate.valueOf()) / (endDate.valueOf() - startDate.valueOf())) *\n viewport.width;\n\n return <path d={`M${nowX},0l0,${viewport.height}`} className={b()} />;\n}\n"]}

package/dist/cjs/components/RangeDateSelection/components/Ruler/Ruler.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { DateTime } from '@gravity-ui/date-utils';
-import type { MoveEndEvent, MoveMoveEvent, MoveStartEvent } from '../../../../hooks/useMove';
-import type { RangeValue } from '../../../types';
+import type { MoveEndEvent, MoveMoveEvent, MoveStartEvent } from "../../../../hooks/useMove.js";
+import type { RangeValue } from "../../../types/index.js";
 interface RulerProps {
     className?: string;
     children?: React.ReactNode;

package/dist/cjs/components/RangeDateSelection/components/Ruler/Ruler.js CHANGED Viewed

@@ -1,22 +1,20 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DateTimeRuler = DateTimeRuler;
 exports.useViewportDimensions = useViewportDimensions;
 exports.useViewportInterval = useViewportInterval;
+const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("react"));
-const react_dom_1 = __importDefault(require("react-dom"));
-const useResizeObserver_1 = require("../../../../hooks/useResizeObserver");
-const cn_1 = require("../../../../utils/cn");
-const NowLine_1 = require("../NowLine/NowLine");
-const RulerViewport_1 = require("../RulerViewport/RulerViewport");
-const MiddleTicks_1 = require("../Ticks/MiddleTicks");
-const SlitTicks_1 = require("../Ticks/SlitTicks");
-const UnavialableTicks_1 = require("../Ticks/UnavialableTicks");
-const utils_1 = require("../Ticks/utils");
+const react_1 = tslib_1.__importDefault(require("react"));
+const react_dom_1 = tslib_1.__importDefault(require("react-dom"));
+const useResizeObserver_1 = require("../../../../hooks/useResizeObserver.js");
+const cn_1 = require("../../../../utils/cn.js");
+const NowLine_1 = require("../NowLine/NowLine.js");
+const RulerViewport_1 = require("../RulerViewport/RulerViewport.js");
+const MiddleTicks_1 = require("../Ticks/MiddleTicks.js");
+const SlitTicks_1 = require("../Ticks/SlitTicks.js");
+const UnavialableTicks_1 = require("../Ticks/UnavialableTicks.js");
+const utils_1 = require("../Ticks/utils.js");
 const b = (0, cn_1.block)('ruler');
 const viewportDimensionsContext = react_1.default.createContext(null);
 const viewportIntervalContext = react_1.default.createContext(null);
@@ -59,3 +57,4 @@ function useViewportInterval() {
     }
     return viewport;
 }
+//# sourceMappingURL=Ruler.js.map

package/dist/cjs/components/RangeDateSelection/components/Ruler/Ruler.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Ruler.js","sourceRoot":"../../../../../../src","sources":["components/RangeDateSelection/components/Ruler/Ruler.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport ReactDOM from 'react-dom';\n\nimport type {MoveEndEvent, MoveMoveEvent, MoveStartEvent} from '../../../../hooks/useMove';\nimport {useResizeObserver} from '../../../../hooks/useResizeObserver';\nimport {block} from '../../../../utils/cn';\nimport type {RangeValue} from '../../../types';\nimport {NowLine} from '../NowLine/NowLine';\nimport {RulerViewport} from '../RulerViewport/RulerViewport';\nimport {MiddleTicks} from '../Ticks/MiddleTicks';\nimport {SlitTicks} from '../Ticks/SlitTicks';\nimport {UnavailableTicks} from '../Ticks/UnavialableTicks';\nimport {makeUnavailableTicksGeometry} from '../Ticks/utils';\n\nconst b = block('ruler');\n\ninterface RulerProps {\n className?: string;\n children?: React.ReactNode;\n start: DateTime;\n end: DateTime;\n minValue?: DateTime;\n maxValue?: DateTime;\n onMoveStart?: (event: MoveStartEvent) => void;\n onMove?: (delta: number, event: MoveMoveEvent) => void;\n onMoveEnd?: (event: MoveEndEvent) => void;\n displayNow?: boolean;\n formatTime?: (time: DateTime) => string;\n timeZone?: string;\n dragDisabled?: boolean;\n renderAdditionalRulerContent?: (props: {\n interval: ViewportInterval;\n dimensions: ViewportDimensions;\n }) => React.ReactNode;\n}\n\nexport interface ViewportDimensions {\n width: number;\n height: number;\n}\n\nexport type ViewportInterval = RangeValue<DateTime>;\n\nconst viewportDimensionsContext = React.createContext<ViewportDimensions | null>(null);\nconst viewportIntervalContext = React.createContext<ViewportInterval | null>(null);\n\nexport function DateTimeRuler({\n className,\n children,\n start,\n end,\n minValue,\n maxValue,\n onMove,\n onMoveStart,\n onMoveEnd,\n displayNow,\n formatTime,\n timeZone,\n dragDisabled,\n renderAdditionalRulerContent,\n}: RulerProps) {\n const [container, setContainer] = React.useState<HTMLDivElement | null>(null);\n const viewportInterval = React.useMemo(() => ({start, end}), [start, end]);\n const [viewportDimensions, setViewportDimensions] = React.useState<ViewportDimensions>({\n width: 0,\n height: 0,\n });\n const onResize = React.useCallback(() => {\n if (!container) {\n return;\n }\n const {width, height} = container.getBoundingClientRect();\n setViewportDimensions({width, height});\n }, [container]);\n\n const containerRef = React.useMemo(() => ({current: container}), [container]);\n\n useResizeObserver({ref: containerRef, onResize});\n\n const hasConstrains = Boolean(minValue || maxValue);\n\n return (\n <div className={b(null, className)}>\n <viewportIntervalContext.Provider value={viewportInterval}>\n <viewportDimensionsContext.Provider value={viewportDimensions}>\n <RulerViewport\n ref={setContainer}\n onMove={onMove}\n onMoveStart={onMoveStart}\n onMoveEnd={onMoveEnd}\n dragDisabled={dragDisabled}\n >\n <MiddleTicks timeZone={timeZone} />\n <SlitTicks formatTime={formatTime} timeZone={timeZone} />\n {hasConstrains ? (\n <UnavailableTicks\n theme=\"dim\"\n minValue={minValue}\n maxValue={maxValue}\n geometry={makeUnavailableTicksGeometry({\n tickHeight: 10,\n viewportHeight: viewportDimensions.height,\n })}\n tickWidth={viewportDimensions.height + 10}\n />\n ) : null}\n {displayNow ? <NowLine /> : null}\n {renderAdditionalRulerContent?.({\n interval: viewportInterval,\n dimensions: viewportDimensions,\n })}\n </RulerViewport>\n {container ? ReactDOM.createPortal(children, container) : null}\n </viewportDimensionsContext.Provider>\n </viewportIntervalContext.Provider>\n </div>\n );\n}\n\nexport function useViewportDimensions() {\n const viewport = React.useContext(viewportDimensionsContext);\n if (!viewport) {\n throw new Error('useViewportDimensions must be used within a RulerViewport');\n }\n return viewport;\n}\n\nexport function useViewportInterval() {\n const viewport = React.useContext(viewportIntervalContext);\n if (!viewport) {\n throw new Error('useViewportInterval must be used within a RulerViewport');\n }\n return viewport;\n}\n"]}

package/dist/cjs/components/RangeDateSelection/components/RulerViewport/RulerViewport.css CHANGED Viewed

@@ -22,4 +22,5 @@
 }
 .g-date-ruler-viewport__svg {
   pointer-events: none;
-}
+}
+/*# sourceMappingURL=RulerViewport.css.map */

package/dist/cjs/components/RangeDateSelection/components/RulerViewport/RulerViewport.css.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["components/RangeDateSelection/components/variables';%0A%0A$block:%20'.%23%7Bvariables.$ns%7Druler-viewport';%0A%0A%23%7B$block%7D%20%7B%0A%20%20%20%20--_--g-date-ruler-viewport-background:%20var(%0A%20%20%20%20%20%20%20%20--g-date-ruler-viewport-background,%0A%20%20%20%20%20%20%20%20var(--g-color-base-background)%0A%20%20%20%20);%0A%0A%20%20%20%20--g-date-thin-timeline-height:%2022px;%0A%20%20%20%20--g-date-thin-timeline-now-color:%20var(--g-color-line-danger);%0A%0A%20%20%20%20position:%20relative;%0A%0A%20%20%20%20box-sizing:%20border-box;%0A%20%20%20%20height:%20var(--g-date-thin-timeline-height);%0A%0A%20%20%20%20&__dragger%20%7B%0A%20%20%20%20%20%20%20%20position:%20absolute;%0A%20%20%20%20%20%20%20%20inset:%200;%0A%0A%20%20%20%20%20%20%20%20cursor:%20grab;%0A%0A%20%20%20%20%20%20%20%20&:focus-visible%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20outline:%202px%20solid%20var(--g-color-line-focus);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20&_disabled%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20pointer-events:%20none;%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20&__svg%20%7B%0A%20%20%20%20%20%20%20%20pointer-events:%20none;%0A%20%20%20%20%7D%0A%7D%0A"],"names":[],"mappings":"AAIA;EACI;AAAA;AAAA;AAAA;EAKA;EACA;EAEA;EAEA;EACA;;AAEA;EACI;EACA;EAEA;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI","sourcesContent":["@use '../../../variables';\n\n$block: '.#{variables.$ns}ruler-viewport';\n\n#{$block} {\n --_--g-date-ruler-viewport-background: var(\n --g-date-ruler-viewport-background,\n var(--g-color-base-background)\n );\n\n --g-date-thin-timeline-height: 22px;\n --g-date-thin-timeline-now-color: var(--g-color-line-danger);\n\n position: relative;\n\n box-sizing: border-box;\n height: var(--g-date-thin-timeline-height);\n\n &__dragger {\n position: absolute;\n inset: 0;\n\n cursor: grab;\n\n &:focus-visible {\n outline: 2px solid var(--g-color-line-focus);\n }\n\n &_disabled {\n pointer-events: none;\n }\n }\n\n &__svg {\n pointer-events: none;\n }\n}\n"],"file":"RulerViewport.css"}

package/dist/cjs/components/RangeDateSelection/components/RulerViewport/RulerViewport.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { MoveEndEvent, MoveMoveEvent, MoveStartEvent } from '../../../../hooks/useMove';
-import './RulerViewport.css';
+import type { MoveEndEvent, MoveMoveEvent, MoveStartEvent } from "../../../../hooks/useMove.js";
+import "./RulerViewport.css";
 interface RulerViewportProps {
     className?: string;
     children?: React.ReactNode;

package/dist/cjs/components/RangeDateSelection/components/RulerViewport/RulerViewport.js CHANGED Viewed

@@ -1,14 +1,12 @@
 'use client';
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RulerViewport = void 0;
+const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("react"));
-const useMove_1 = require("../../../../hooks/useMove");
-const cn_1 = require("../../../../utils/cn");
+const react_1 = tslib_1.__importDefault(require("react"));
+const useMove_1 = require("../../../../hooks/useMove.js");
+const cn_1 = require("../../../../utils/cn.js");
 require("./RulerViewport.css");
 const b = (0, cn_1.block)('ruler-viewport');
 function RulerViewport({ className, children, onMove, onMoveStart, onMoveEnd, dragDisabled }, ref) {
@@ -33,3 +31,4 @@ function RulerViewport({ className, children, onMove, onMoveStart, onMoveEnd, dr
 }
 const _RulerViewport = react_1.default.forwardRef(RulerViewport);
 exports.RulerViewport = _RulerViewport;
+//# sourceMappingURL=RulerViewport.js.map

package/dist/cjs/components/RangeDateSelection/components/RulerViewport/RulerViewport.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RulerViewport.js","sourceRoot":"../../../../../../src","sources":["components/RangeDateSelection/components/RulerViewport/RulerViewport.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;AAEb,0DAA0B;AAE1B,0DAAkD;AAElD,gDAA2C;AAE3C,+BAA8B;AAE9B,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,gBAAgB,CAAC,CAAC;AAWlC,SAAS,aAAa,CAClB,EAAC,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,YAAY,EAAqB,EACvF,GAA8B;IAE9B,MAAM,YAAY,GAAG,eAAK,CAAC,MAAM,CAAgB,IAAI,CAAC,CAAC;IACvD,MAAM,SAAS,GAAG,OAAO,MAAM,KAAK,UAAU,CAAC;IAC/C,MAAM,EAAC,SAAS,EAAC,GAAG,IAAA,iBAAO,EAAC;QACxB,WAAW,EAAE,WAAW;QACxB,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;YACV,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,CAAC;YACvC,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,IAAI,SAAS,EAAE,CAAC;gBAC9B,MAAM,EAAC,KAAK,EAAC,GAAG,SAAS,CAAC,qBAAqB,EAAE,CAAC;gBAClD,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,MAAM,GAAG,GAAG,CAAC,GAAG,KAAK,CAAC;gBACrC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;gBACtC,IAAI,KAAK,KAAK,CAAC,EAAE,CAAC;oBACd,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,KAAK,EAAE,CAAC,CAAC,CAAC;gBACvB,CAAC;YACL,CAAC;QACL,CAAC;QACD,SAAS,EAAE,SAAS;KACvB,CAAC,CAAC;IAEH,OAAO,CACH,iCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,aACxC,iCACI,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,CAAC,CAAC,KAAK,CAAC,EACnB,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,KAAK,EAAC,4BAA4B,EAClC,UAAU,EAAC,8BAA8B,aAEzC,2CAEI,oCAAQ,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,GAAG,EAAC,MAAM,EAAC,GAAG,EAAC,EAAE,EAAC,uBAAuB,aAC/D,oCAAS,UAAU,EAAC,4CAA4C,GAAG,EACnE,wCAAa,EAAE,EAAC,eAAe,GAAG,IAC7B,GACN,EACN,QAAQ,IACP,EACL,SAAS,CAAC,CAAC,CAAC,CACT,8CAAK,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,QAAQ,EAAE,YAAY,EAAC,CAAC,IAAM,SAAS,EAAI,CAC5E,CAAC,CAAC,CAAC,IAAI,IACN,CACT,CAAC;AACN,CAAC;AAED,MAAM,cAAc,GAAG,eAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;AAC7B,uCAAa","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport {useMove} from '../../../../hooks/useMove';\nimport type {MoveEndEvent, MoveMoveEvent, MoveStartEvent} from '../../../../hooks/useMove';\nimport {block} from '../../../../utils/cn';\n\nimport './RulerViewport.scss';\n\nconst b = block('ruler-viewport');\n\ninterface RulerViewportProps {\n className?: string;\n children?: React.ReactNode;\n onMoveStart?: (event: MoveStartEvent) => void;\n onMove?: (delta: number, event: MoveMoveEvent) => void;\n onMoveEnd?: (event: MoveEndEvent) => void;\n dragDisabled?: boolean;\n}\n\nfunction RulerViewport(\n {className, children, onMove, onMoveStart, onMoveEnd, dragDisabled}: RulerViewportProps,\n ref: React.Ref<HTMLDivElement>,\n) {\n const containerRef = React.useRef<SVGSVGElement>(null);\n const draggable = typeof onMove === 'function';\n const {moveProps} = useMove({\n onMoveStart: onMoveStart,\n onMove: (e) => {\n const container = containerRef.current;\n if (e.deltaX !== 0 && container) {\n const {width} = container.getBoundingClientRect();\n let delta = (e.deltaX * 100) / width;\n delta = Math.round(delta * 100) / 100;\n if (delta !== 0) {\n onMove?.(delta, e);\n }\n }\n },\n onMoveEnd: onMoveEnd,\n });\n\n return (\n <div ref={ref} className={b(null, className)}>\n <svg\n ref={containerRef}\n className={b('svg')}\n width=\"100%\"\n height=\"100%\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlnsXlink=\"http://www.w3.org/1999/xlink\"\n >\n <defs>\n {/* this one allows rendering background under tick labels */}\n <filter x=\"0\" y=\"0\" width=\"1\" height=\"1\" id=\"g-date-tt-ticklabelbg\">\n <feFlood floodColor=\"var(--_--g-date-ruler-viewport-background)\" />\n <feComposite in=\"SourceGraphic\" />\n </filter>\n </defs>\n {children}\n </svg>\n {draggable ? (\n <div className={b('dragger', {disabled: dragDisabled})} {...moveProps} />\n ) : null}\n </div>\n );\n}\n\nconst _RulerViewport = React.forwardRef(RulerViewport);\nexport {_RulerViewport as RulerViewport};\n"]}

package/dist/cjs/components/RangeDateSelection/components/SelectionControl/SelectionControl.css CHANGED Viewed

@@ -75,4 +75,5 @@
   white-space: nowrap;
   border: 0;
   clip-path: inset(50%);
-}
+}
+/*# sourceMappingURL=SelectionControl.css.map */

package/dist/cjs/components/RangeDateSelection/components/SelectionControl/SelectionControl.css.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["components/RangeDateSelection/mixins';%0A%0A$block:%20'.%23%7Bvariables.$ns%7Drange-date-selection-control';%0A%0A%23%7B$block%7D%20%7B%0A%20%20%20%20--_--g-date-timeline-color-selection:%20var(%0A%20%20%20%20%20%20%20%20--g-date-timeline-color-selection,%0A%20%20%20%20%20%20%20%20var(--g-color-base-info-light)%0A%20%20%20%20);%0A%0A%20%20%20%20--_--g-date-timeline-color-selection-hover:%20var(%0A%20%20%20%20%20%20%20%20--g-date-timeline-color-selection-hover,%0A%20%20%20%20%20%20%20%20var(--g-color-base-info-light-hover)%0A%20%20%20%20);%0A%0A%20%20%20%20--_--g-date-timeline-color-selection-handle:%20var(%0A%20%20%20%20%20%20%20%20--g-date-timeline-color-selection-handle,%0A%20%20%20%20%20%20%20%20var(--g-color-base-brand)%0A%20%20%20%20);%0A%0A%20%20%20%20--_--g-date-timeline-color-selection-handle-hover:%20var(%0A%20%20%20%20%20%20%20%20--g-date-timeline-color-selection-handle-hover,%0A%20%20%20%20%20%20%20%20var(--g-color-base-brand-hover)%0A%20%20%20%20);%0A%0A%20%20%20%20position:%20absolute;%0A%20%20%20%20z-index:%201;%0A%20%20%20%20inset-block:%200;%0A%0A%20%20%20%20@supports%20(selector(:has(*)))%20and%20(selector(:focus-visible))%20%7B%0A%20%20%20%20%20%20%20%20&__start:has(&__slider-input:focus-visible),%0A%20%20%20%20%20%20%20%20&__end:has(&__slider-input:focus-visible),%0A%20%20%20%20%20%20%20%20&__dragger:has(&__slider-input:focus-visible)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20border-radius:%20var(--g-border-radius-xs);%0A%20%20%20%20%20%20%20%20%20%20%20%20outline:%20var(--g-color-line-focus)%20solid%202px;%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20@supports%20not%20(selector(:has(*)))%20%7B%0A%20%20%20%20%20%20%20%20&__start:focus-within,%0A%20%20%20%20%20%20%20%20&__end:focus-within,%0A%20%20%20%20%20%20%20%20&__dragger:focus-within%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20border-radius:%20var(--g-border-radius-xs);%0A%20%20%20%20%20%20%20%20%20%20%20%20outline:%20var(--g-color-line-focus)%20solid%202px;%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20&__dragger%20%7B%0A%20%20%20%20%20%20%20%20position:%20absolute;%0A%20%20%20%20%20%20%20%20inset-block:%200;%0A%20%20%20%20%20%20%20%20inset-inline:%202px;%0A%0A%20%20%20%20%20%20%20%20cursor:%20move;%0A%0A%20%20%20%20%20%20%20%20background:%20var(--_--g-date-timeline-color-selection);%0A%0A%20%20%20%20%20%20%20%20&:hover,%0A%20%20%20%20%20%20%20%20&_dragging%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20background:%20var(--_--g-date-timeline-color-selection-hover);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20&_disabled%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20pointer-events:%20none;%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20&__start%20%7B%0A%20%20%20%20%20%20%20%20position:%20absolute;%0A%20%20%20%20%20%20%20%20inset-block:%200;%0A%20%20%20%20%20%20%20%20inset-inline-start:%200;%0A%0A%20%20%20%20%20%20%20%20width:%204px;%0A%0A%20%20%20%20%20%20%20%20background:%20var(--_--g-date-timeline-color-selection-handle);%0A%20%20%20%20%7D%0A%0A%20%20%20%20&__end%20%7B%0A%20%20%20%20%20%20%20%20position:%20absolute;%0A%20%20%20%20%20%20%20%20inset-inline-end:%200;%0A%0A%20%20%20%20%20%20%20%20width:%204px;%0A%20%20%20%20%20%20%20%20height:%20100%25;%0A%0A%20%20%20%20%20%20%20%20background:%20var(--_--g-date-timeline-color-selection-handle);%0A%20%20%20%20%7D%0A%0A%20%20%20%20&__start,%0A%20%20%20%20&__end%20%7B%0A%20%20%20%20%20%20%20%20cursor:%20ew-resize;%0A%0A%20%20%20%20%20%20%20%20&:hover,%0A%20%20%20%20%20%20%20%20&_dragging%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20background:%20var(--_--g-date-timeline-color-selection-handle-hover);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20&__slider-input-wrapper%20%7B%0A%20%20%20%20%20%20%20%20@include%20mixins.visually-hidden();%0A%20%20%20%20%7D%0A%7D%0A","components/RangeDateSelection/components/SelectionControl/file:/home/runner/work/date-components/date-components/src/components/mixins.scss"],"names":[],"mappings":"AAKA;EACI;AAAA;AAAA;AAAA;EAKA;AAAA;AAAA;AAAA;EAKA;AAAA;AAAA;AAAA;EAKA;AAAA;AAAA;AAAA;EAKA;EACA;EACA;;AAEA;EACI;IAGI;IACA;;;AAIR;EACI;IAGI;IACA;;;AAIR;EACI;EACA;EACA;EAEA;EAEA;;AAEA;EAEI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;EAEA;EAEA;;AAGJ;EACI;EACA;EAEA;EACA;EAEA;;AAGJ;EAEI;;AAEA;EAEI;;AAIR;EChGA;EAEA;EACA;EAEA;EACA;EACA;EACA;EAEA;EAEA;EACA","sourcesContent":["@use '../../../variables';\n@use '../../../mixins';\n\n$block: '.#{variables.$ns}range-date-selection-control';\n\n#{$block} {\n --_--g-date-timeline-color-selection: var(\n --g-date-timeline-color-selection,\n var(--g-color-base-info-light)\n );\n\n --_--g-date-timeline-color-selection-hover: var(\n --g-date-timeline-color-selection-hover,\n var(--g-color-base-info-light-hover)\n );\n\n --_--g-date-timeline-color-selection-handle: var(\n --g-date-timeline-color-selection-handle,\n var(--g-color-base-brand)\n );\n\n --_--g-date-timeline-color-selection-handle-hover: var(\n --g-date-timeline-color-selection-handle-hover,\n var(--g-color-base-brand-hover)\n );\n\n position: absolute;\n z-index: 1;\n inset-block: 0;\n\n @supports (selector(:has(*))) and (selector(:focus-visible)) {\n &__start:has(&__slider-input:focus-visible),\n &__end:has(&__slider-input:focus-visible),\n &__dragger:has(&__slider-input:focus-visible) {\n border-radius: var(--g-border-radius-xs);\n outline: var(--g-color-line-focus) solid 2px;\n }\n }\n\n @supports not (selector(:has(*))) {\n &__start:focus-within,\n &__end:focus-within,\n &__dragger:focus-within {\n border-radius: var(--g-border-radius-xs);\n outline: var(--g-color-line-focus) solid 2px;\n }\n }\n\n &__dragger {\n position: absolute;\n inset-block: 0;\n inset-inline: 2px;\n\n cursor: move;\n\n background: var(--_--g-date-timeline-color-selection);\n\n &:hover,\n &_dragging {\n background: var(--_--g-date-timeline-color-selection-hover);\n }\n\n &_disabled {\n pointer-events: none;\n }\n }\n\n &__start {\n position: absolute;\n inset-block: 0;\n inset-inline-start: 0;\n\n width: 4px;\n\n background: var(--_--g-date-timeline-color-selection-handle);\n }\n\n &__end {\n position: absolute;\n inset-inline-end: 0;\n\n width: 4px;\n height: 100%;\n\n background: var(--_--g-date-timeline-color-selection-handle);\n }\n\n &__start,\n &__end {\n cursor: ew-resize;\n\n &:hover,\n &_dragging {\n background: var(--_--g-date-timeline-color-selection-handle-hover);\n }\n }\n\n &__slider-input-wrapper {\n @include mixins.visually-hidden();\n }\n}\n","@mixin visually-hidden() {\n position: absolute;\n\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n\n white-space: nowrap;\n\n border: 0;\n clip-path: inset(50%);\n}\n"],"file":"SelectionControl.css"}

package/dist/cjs/components/RangeDateSelection/components/SelectionControl/SelectionControl.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import type { AccessibilityProps, DomProps, StyleProps } from '../../../types';
-import type { RangeDateSelectionState } from '../../hooks/useRangeDateSelectionState';
-import './SelectionControl.css';
+import type { AccessibilityProps, DomProps, StyleProps } from "../../../types/index.js";
+import type { RangeDateSelectionState } from "../../hooks/useRangeDateSelectionState.js";
+import "./SelectionControl.css";
 interface SelectionControlProps extends DomProps, StyleProps, AccessibilityProps {
     state: RangeDateSelectionState;
 }

package/dist/cjs/components/RangeDateSelection/components/SelectionControl/SelectionControl.js CHANGED Viewed

@@ -4,11 +4,11 @@ exports.SelectionControl = SelectionControl;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importDefault(require("react"));
-const useMove_1 = require("../../../../hooks/useMove");
-const cn_1 = require("../../../../utils/cn");
-const i18n_1 = require("../../i18n");
-const span_1 = require("../../utils/span");
-const Ruler_1 = require("../Ruler/Ruler");
+const useMove_1 = require("../../../../hooks/useMove.js");
+const cn_1 = require("../../../../utils/cn.js");
+const i18n_1 = require("../../i18n/index.js");
+const span_1 = require("../../utils/span.js");
+const Ruler_1 = require("../Ruler/Ruler.js");
 require("./SelectionControl.css");
 const b = (0, cn_1.block)('range-date-selection-control');
 const MIN_SELECTION_WIDTH = 12; // px;
@@ -133,3 +133,4 @@ function SelectionControl(_a) {
                             .filter(Boolean)
                             .join(' '), "aria-orientation": "horizontal", "aria-valuetext": `${endValue.format()}`, value: 0, onChange: () => { } }) }) }))) : null] }));
 }
+//# sourceMappingURL=SelectionControl.js.map

package/dist/cjs/components/RangeDateSelection/components/SelectionControl/SelectionControl.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"SelectionControl.js","sourceRoot":"../../../../../../src","sources":["components/RangeDateSelection/components/SelectionControl/SelectionControl.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {useMove} from '../../../../hooks/useMove';\nimport {block} from '../../../../utils/cn';\nimport type {AccessibilityProps, DomProps, StyleProps} from '../../../types';\nimport type {RangeDateSelectionState} from '../../hooks/useRangeDateSelectionState';\nimport {i18n} from '../../i18n';\nimport {lerp} from '../../utils/span';\nimport {useViewportDimensions, useViewportInterval} from '../Ruler/Ruler';\n\nimport './SelectionControl.scss';\n\nconst b = block('range-date-selection-control');\n\nconst MIN_SELECTION_WIDTH = 12; // px;\nconst MIN_DRAG_SCALE = 0.01;\nconst MAX_DRAG_SCALE = 100;\nconst DRAG_SCALE_STRENGTH = 20;\n\ninterface SelectionControlProps extends DomProps, StyleProps, AccessibilityProps {\n state: RangeDateSelectionState;\n}\n\nexport function SelectionControl({state, style, className, ...props}: SelectionControlProps) {\n const {start: startDate, end: endDate} = useViewportInterval();\n const viewport = useViewportDimensions();\n\n const [isDragging, setIsDragging] = React.useState<'dragger' | 'start' | 'end' | null>(null);\n\n const moveDataRef = React.useRef<{isZooming: boolean}>({\n isZooming: false,\n });\n\n const visualMinDuration =\n (MIN_SELECTION_WIDTH * (endDate.valueOf() - startDate.valueOf())) / viewport.width;\n\n const handleMoveEnd = () => {\n state.endDragging();\n setIsDragging(null);\n };\n\n const {moveProps} = useMove({\n onMoveStart: (e) => {\n setIsDragging('dragger');\n state.startDragging();\n moveDataRef.current = {\n isZooming: state.canResize && (e.ctrlKey || e.metaKey),\n };\n },\n onMoveEnd: handleMoveEnd,\n onMove: (e) => {\n if (e.deltaX === 0) {\n return;\n }\n if (moveDataRef.current.isZooming) {\n let scale = Math.exp((e.deltaX * DRAG_SCALE_STRENGTH) / viewport.width);\n scale = Math.min(Math.max(scale, MIN_DRAG_SCALE), MAX_DRAG_SCALE);\n state.scale(scale, {visualMinDuration});\n } else {\n let delta = (e.deltaX * (endDate.valueOf() - startDate.valueOf())) / viewport.width;\n if (e.pointerType === 'keyboard') {\n delta =\n delta > 0\n ? Math.max(delta, state.align)\n : Math.min(delta, -1 * state.align);\n }\n state.move(delta, {visualMinDuration});\n }\n },\n });\n const {moveProps: moveStartProps} = useMove({\n onMoveStart: () => {\n setIsDragging('start');\n state.startDragging();\n },\n onMoveEnd: handleMoveEnd,\n onMove: (e) => {\n if (e.deltaX === 0) {\n return;\n }\n let delta = (e.deltaX * (endDate.valueOf() - startDate.valueOf())) / viewport.width;\n if (e.pointerType === 'keyboard') {\n delta =\n delta > 0 ? Math.max(delta, state.align) : Math.min(delta, -1 * state.align);\n }\n state.moveStart(delta, {visualMinDuration});\n },\n });\n const {moveProps: moveEndProps} = useMove({\n onMoveStart: () => {\n setIsDragging('end');\n state.startDragging();\n },\n onMoveEnd: handleMoveEnd,\n onMove: (e) => {\n if (e.deltaX === 0) {\n return;\n }\n let delta = (e.deltaX * (endDate.valueOf() - startDate.valueOf())) / viewport.width;\n if (e.pointerType === 'keyboard') {\n delta =\n delta > 0 ? Math.max(delta, state.align) : Math.min(delta, -1 * state.align);\n }\n state.moveEnd(delta, {visualMinDuration});\n },\n });\n\n const {start: startValue, end: endValue} = state.value;\n const startX = lerp(\n {start: startDate.valueOf(), end: endDate.valueOf()},\n {start: 0, end: viewport.width},\n startValue.valueOf(),\n );\n const endX = lerp(\n {start: startDate.valueOf(), end: endDate.valueOf()},\n {start: 0, end: viewport.width},\n endValue.valueOf(),\n );\n\n const draggerInputRef = React.useRef<HTMLInputElement>(null);\n const startInputRef = React.useRef<HTMLInputElement>(null);\n const endInputRef = React.useRef<HTMLInputElement>(null);\n\n let id = React.useId();\n id = props.id ?? id;\n\n return (\n <div className={b(null, className)} style={{...style, left: startX, width: endX - startX}}>\n {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}\n <div\n className={b('dragger', {\n dragging: isDragging === 'dragger',\n disabled: Boolean(isDragging && isDragging !== 'dragger'),\n })}\n {...moveProps}\n onClick={() => {\n draggerInputRef.current?.focus();\n }}\n >\n <div className={b('slider-input-wrapper')}>\n <input\n id={`${id}-range`}\n ref={draggerInputRef}\n className={b('slider-input')}\n type=\"range\"\n step={1}\n aria-label={i18n('Range')}\n aria-labelledby={[`${id}-range`, props['aria-labelledby']]\n .filter(Boolean)\n .join(' ')}\n aria-orientation=\"horizontal\"\n aria-valuetext={`${startValue.format()} - ${endValue.format()}`}\n value={0}\n onChange={() => {}}\n />\n </div>\n </div>\n {state.canResize ? (\n /* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */\n <div\n className={b('start', {\n dragging: isDragging === 'start',\n disabled: Boolean(isDragging && isDragging !== 'start'),\n })}\n {...moveStartProps}\n onClick={() => {\n startInputRef.current?.focus();\n }}\n >\n <div className={b('slider-input-wrapper')}>\n <input\n id={`${id}-start`}\n ref={startInputRef}\n className={b('slider-input')}\n type=\"range\"\n step={1}\n aria-label={i18n('Start of range')}\n aria-labelledby={[`${id}-start`, props['aria-labelledby']]\n .filter(Boolean)\n .join(' ')}\n aria-orientation=\"horizontal\"\n aria-valuetext={`${startValue.format()}`}\n value={0}\n onChange={() => {}}\n />\n </div>\n </div>\n ) : null}\n {state.canResize ? (\n /* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */\n <div\n className={b('end', {\n dragging: isDragging === 'end',\n disabled: Boolean(isDragging && isDragging !== 'end'),\n })}\n {...moveEndProps}\n onClick={() => {\n endInputRef.current?.focus();\n }}\n >\n <div className={b('slider-input-wrapper')}>\n <input\n id={`${id}-end`}\n ref={endInputRef}\n className={b('slider-input')}\n type=\"range\"\n step={1}\n aria-label={i18n('End of range')}\n aria-labelledby={[`${id}-end`, props['aria-labelledby']]\n .filter(Boolean)\n .join(' ')}\n aria-orientation=\"horizontal\"\n aria-valuetext={`${endValue.format()}`}\n value={0}\n onChange={() => {}}\n />\n </div>\n </div>\n ) : null}\n </div>\n );\n}\n"]}

package/dist/cjs/components/RangeDateSelection/components/Ticks/MiddleTicks.js CHANGED Viewed

@@ -2,9 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MiddleTicks = MiddleTicks;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const Ruler_1 = require("../Ruler/Ruler");
-const Ticks_1 = require("./Ticks");
+const Ruler_1 = require("../Ruler/Ruler.js");
+const Ticks_1 = require("./Ticks.js");
 function MiddleTicks({ timeZone }) {
     const { height } = (0, Ruler_1.useViewportDimensions)();
     return ((0, jsx_runtime_1.jsx)(Ticks_1.Ticks, { minTickWidth: 8, maxTickWidth: 20, theme: "dim", geometry: (0, Ticks_1.makeMiddleTicksGeometry)({ tickHeight: 4, viewportHeight: height }), timeZone: timeZone }));
 }
+//# sourceMappingURL=MiddleTicks.js.map

package/dist/cjs/components/RangeDateSelection/components/Ticks/MiddleTicks.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"MiddleTicks.js","sourceRoot":"../../../../../../src","sources":["components/RangeDateSelection/components/Ticks/MiddleTicks.tsx"],"names":[],"mappings":";;AAIA,kCAWC;;AAfD,6CAAqD;AAErD,sCAAuD;AAEvD,SAAgB,WAAW,CAAC,EAAC,QAAQ,EAAsB;IACvD,MAAM,EAAC,MAAM,EAAC,GAAG,IAAA,6BAAqB,GAAE,CAAC;IACzC,OAAO,CACH,uBAAC,aAAK,IACF,YAAY,EAAE,CAAC,EACf,YAAY,EAAE,EAAE,EAChB,KAAK,EAAC,KAAK,EACX,QAAQ,EAAE,IAAA,+BAAuB,EAAC,EAAC,UAAU,EAAE,CAAC,EAAE,cAAc,EAAE,MAAM,EAAC,CAAC,EAC1E,QAAQ,EAAE,QAAQ,GACpB,CACL,CAAC;AACN,CAAC","sourcesContent":["import {useViewportDimensions} from '../Ruler/Ruler';\n\nimport {Ticks, makeMiddleTicksGeometry} from './Ticks';\n\nexport function MiddleTicks({timeZone}: {timeZone?: string}) {\n const {height} = useViewportDimensions();\n return (\n <Ticks\n minTickWidth={8}\n maxTickWidth={20}\n theme=\"dim\"\n geometry={makeMiddleTicksGeometry({tickHeight: 4, viewportHeight: height})}\n timeZone={timeZone}\n />\n );\n}\n"]}

package/dist/cjs/components/RangeDateSelection/components/Ticks/SlitTicks.js CHANGED Viewed

@@ -2,9 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SlitTicks = SlitTicks;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const Ruler_1 = require("../Ruler/Ruler");
-const Ticks_1 = require("./Ticks");
+const Ruler_1 = require("../Ruler/Ruler.js");
+const Ticks_1 = require("./Ticks.js");
 function SlitTicks({ formatTime, timeZone, }) {
     const { height } = (0, Ruler_1.useViewportDimensions)();
     return ((0, jsx_runtime_1.jsx)(Ticks_1.Ticks, { minTickWidth: 80, maxTickWidth: 200, theme: "normal", geometry: (0, Ticks_1.makeSlitTicksGeometry)({ tickHeight: 4, viewportHeight: height }), hasLabels: true, formatTime: formatTime, timeZone: timeZone }));
 }
+//# sourceMappingURL=SlitTicks.js.map

package/dist/cjs/components/RangeDateSelection/components/Ticks/SlitTicks.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"SlitTicks.js","sourceRoot":"../../../../../../src","sources":["components/RangeDateSelection/components/Ticks/SlitTicks.tsx"],"names":[],"mappings":";;AAMA,8BAmBC;;AAvBD,6CAAqD;AAErD,sCAAqD;AAErD,SAAgB,SAAS,CAAC,EACtB,UAAU,EACV,QAAQ,GAIX;IACG,MAAM,EAAC,MAAM,EAAC,GAAG,IAAA,6BAAqB,GAAE,CAAC;IACzC,OAAO,CACH,uBAAC,aAAK,IACF,YAAY,EAAE,EAAE,EAChB,YAAY,EAAE,GAAG,EACjB,KAAK,EAAC,QAAQ,EACd,QAAQ,EAAE,IAAA,6BAAqB,EAAC,EAAC,UAAU,EAAE,CAAC,EAAE,cAAc,EAAE,MAAM,EAAC,CAAC,EACxE,SAAS,QACT,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,QAAQ,GACpB,CACL,CAAC;AACN,CAAC","sourcesContent":["import type {DateTime} from '@gravity-ui/date-utils';\n\nimport {useViewportDimensions} from '../Ruler/Ruler';\n\nimport {Ticks, makeSlitTicksGeometry} from './Ticks';\n\nexport function SlitTicks({\n formatTime,\n timeZone,\n}: {\n formatTime?: (time: DateTime) => string;\n timeZone?: string;\n}) {\n const {height} = useViewportDimensions();\n return (\n <Ticks\n minTickWidth={80}\n maxTickWidth={200}\n theme=\"normal\"\n geometry={makeSlitTicksGeometry({tickHeight: 4, viewportHeight: height})}\n hasLabels\n formatTime={formatTime}\n timeZone={timeZone}\n />\n );\n}\n"]}

package/dist/cjs/components/RangeDateSelection/components/Ticks/Ticks.css CHANGED Viewed

@@ -13,4 +13,5 @@
   user-select: none;
   fill: var(--g-color-text-secondary);
   text-anchor: middle;
-}
+}
+/*# sourceMappingURL=Ticks.css.map */

package/dist/cjs/components/RangeDateSelection/components/Ticks/Ticks.css.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["components/RangeDateSelection/components/variables';%0A%0A$block:%20'.%23%7Bvariables.$ns%7Dtimeline-ticks';%0A%0A%23%7B$block%7D%20%7B%0A%20%20%20%20stroke:%20var(--g-color-text-secondary);%0A%0A%20%20%20%20fill:%20var(--g-color-text-secondary);%0A%20%20%20%20stroke-width:%201px;%0A%0A%20%20%20%20&_theme_dim%20%7B%0A%20%20%20%20%20%20%20%20stroke:%20var(--g-color-line-generic-accent);%0A%0A%20%20%20%20%20%20%20%20fill:%20var(--g-color-line-generic-accent);%0A%20%20%20%20%7D%0A%0A%20%20%20%20&__label%20%7B%0A%20%20%20%20%20%20%20%20font-size:%2011px;%0A%20%20%20%20%20%20%20%20line-height:%2014px;%0A%20%20%20%20%20%20%20%20user-select:%20none;%0A%0A%20%20%20%20%20%20%20%20fill:%20var(--g-color-text-secondary);%0A%20%20%20%20%20%20%20%20text-anchor:%20middle;%0A%20%20%20%20%7D%0A%7D%0A"],"names":[],"mappings":"AAIA;EACI;EAEA;EACA;;AAEA;EACI;EAEA;;AAGJ;EACI;EACA;EACA;EAEA;EACA","sourcesContent":["@use '../../../variables';\n\n$block: '.#{variables.$ns}timeline-ticks';\n\n#{$block} {\n stroke: var(--g-color-text-secondary);\n\n fill: var(--g-color-text-secondary);\n stroke-width: 1px;\n\n &_theme_dim {\n stroke: var(--g-color-line-generic-accent);\n\n fill: var(--g-color-line-generic-accent);\n }\n\n &__label {\n font-size: 11px;\n line-height: 14px;\n user-select: none;\n\n fill: var(--g-color-text-secondary);\n text-anchor: middle;\n }\n}\n"],"file":"Ticks.css"}

package/dist/cjs/components/RangeDateSelection/components/Ticks/Ticks.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import type { DateTime } from '@gravity-ui/date-utils';
-import type { Geometry } from './utils';
-import { makeMiddleTicksGeometry, makeSlitTicksGeometry } from './utils';
-import './Ticks.css';
+import type { Geometry } from "./utils.js";
+import { makeMiddleTicksGeometry, makeSlitTicksGeometry } from "./utils.js";
+import "./Ticks.css";
 interface TicksProps {
     theme: 'normal' | 'dim';
     minTickWidth: number;

package/dist/cjs/components/RangeDateSelection/components/Ticks/Ticks.js CHANGED Viewed

@@ -1,17 +1,15 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makeSlitTicksGeometry = exports.makeMiddleTicksGeometry = void 0;
 exports.Ticks = Ticks;
+const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("react"));
+const react_1 = tslib_1.__importDefault(require("react"));
 const date_utils_1 = require("@gravity-ui/date-utils");
-const cn_1 = require("../../../../utils/cn");
-const span_1 = require("../../utils/span");
-const Ruler_1 = require("../Ruler/Ruler");
-const utils_1 = require("./utils");
+const cn_1 = require("../../../../utils/cn.js");
+const span_1 = require("../../utils/span.js");
+const Ruler_1 = require("../Ruler/Ruler.js");
+const utils_1 = require("./utils.js");
 Object.defineProperty(exports, "makeMiddleTicksGeometry", { enumerable: true, get: function () { return utils_1.makeMiddleTicksGeometry; } });
 Object.defineProperty(exports, "makeSlitTicksGeometry", { enumerable: true, get: function () { return utils_1.makeSlitTicksGeometry; } });
 require("./Ticks.css");
@@ -50,3 +48,4 @@ function Ticks({ theme, minTickWidth, maxTickWidth, hasLabels, geometry, classNa
     }, [hasLabels, tickCoords, tickTimes, timeZone, labelsClassName, formatTime]);
     return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [ticksPath, tickLabels] }));
 }
+//# sourceMappingURL=Ticks.js.map

package/dist/cjs/components/RangeDateSelection/components/Ticks/Ticks.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Ticks.js","sourceRoot":"../../../../../../src","sources":["components/RangeDateSelection/components/Ticks/Ticks.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {dateTime} from '@gravity-ui/date-utils';\n\nimport {block} from '../../../../utils/cn';\nimport {getLerpCoeff} from '../../utils/span';\nimport {useViewportDimensions, useViewportInterval} from '../Ruler/Ruler';\n\nimport type {Geometry} from './utils';\nimport {\n calculateTickTimes,\n formatTick as defaultFormatTime,\n makeMiddleTicksGeometry,\n makeSlitTicksGeometry,\n} from './utils';\n\nimport './Ticks.scss';\n\ninterface TicksProps {\n theme: 'normal' | 'dim';\n minTickWidth: number;\n maxTickWidth: number;\n hasLabels?: boolean;\n\n geometry: Geometry;\n className?: string;\n labelsClassName?: string;\n\n formatTime?: (time: DateTime) => string;\n timeZone?: string;\n}\n\nconst b = block('timeline-ticks');\n\nexport {makeMiddleTicksGeometry, makeSlitTicksGeometry};\nexport type {Geometry};\n\nexport function Ticks({\n theme,\n minTickWidth,\n maxTickWidth,\n hasLabels,\n geometry,\n className,\n labelsClassName,\n formatTime,\n timeZone,\n}: TicksProps) {\n const viewport = useViewportDimensions();\n const interval = useViewportInterval();\n const tickTimes = React.useMemo(\n () =>\n calculateTickTimes({\n minTickWidth,\n maxTickWidth,\n viewportStart: interval.start,\n viewportEnd: interval.end,\n viewportWidth: viewport.width,\n timeZone,\n }),\n [maxTickWidth, minTickWidth, interval, viewport.width, timeZone],\n );\n const tickCoords = React.useMemo(() => {\n const timeToXCoeff = getLerpCoeff(\n {start: interval.start.valueOf(), end: interval.end.valueOf()},\n {start: 0, end: viewport.width},\n );\n return tickTimes.map(\n (t) => 0 + Math.round((t.valueOf() - interval.start.valueOf()) * timeToXCoeff),\n );\n }, [tickTimes, interval, viewport.width]);\n\n const ticksGeometry = React.useMemo(() => {\n return tickCoords.map(geometry).join('');\n }, [geometry, tickCoords]);\n\n const ticksPath = <path className={b({theme}, className)} d={ticksGeometry} />;\n\n const tickLabels = React.useMemo(() => {\n if (!hasLabels || tickCoords.length < 2) {\n return null;\n }\n\n const result: React.ReactElement[] = [];\n\n for (let i = 0; i < tickCoords.length; i++) {\n const x = tickCoords[i];\n const t = tickTimes[i];\n const dt = dateTime({input: t, timeZone});\n\n result.push(\n <text\n key={i}\n className={b('label', labelsClassName)}\n dominantBaseline=\"middle\"\n x={x}\n y=\"50%\"\n filter=\"url(#g-date-tt-ticklabelbg)\"\n >\n {formatTime ? formatTime(dt) : defaultFormatTime(dt)}\n </text>,\n );\n }\n return result;\n }, [hasLabels, tickCoords, tickTimes, timeZone, labelsClassName, formatTime]);\n\n return (\n <React.Fragment>\n {ticksPath}\n {tickLabels}\n </React.Fragment>\n );\n}\n"]}

package/dist/cjs/components/RangeDateSelection/components/Ticks/UnavialableTicks.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import type { DateTime } from '@gravity-ui/date-utils';
-import type { Geometry } from './utils';
-import { makeMiddleTicksGeometry, makeSlitTicksGeometry } from './utils';
-import './Ticks.css';
+import type { Geometry } from "./utils.js";
+import { makeMiddleTicksGeometry, makeSlitTicksGeometry } from "./utils.js";
+import "./Ticks.css";
 interface TicksProps {
     theme: 'normal' | 'dim';
     tickWidth: number;