rangeflow 1.0.11 → 1.0.13

package/README.md

@@ -110,7 +110,7 @@ Main component. Renders the full picker.
 | `calendar`        | `boolean`                             | No       | `true`                        | Show the popover calendar on the left of the header.                        |
 | `CalendarProps`   | `DayPickerProps` from `react-day-picker` | No    | `undefined`                   | Pass through props to the inner calendar (months, locale, modifiers, etc.). |
 | `Slots`           | `Slots`                               | No       | `{}`                          | Replace any visible part with your own component.                           |
-| `api`             | `RangeFlowApi`                        | No       | `undefined`                   | Hook returned object for external control. See `useRangeflow`.              |
+| `api`             | `RangeFlowApi`                        | No       | `undefined`                   | Hook returned object for external control. See `useRangeFlow`.              |
 
 #### Types
 
@@ -126,12 +126,12 @@ type DateDisabled =
   | { before?: Date; after: Date }
 ```
 
-### `useRangeflow()`
+### `useRangeFlow()`
 
 Returns an imperative API object. Pass it into `<RangeFlow api={...} />` to control the picker from outside.
 
 ```ts
-const rangeflow = useRangeflow()
+const rangeflow = useRangeFlow()
 
 rangeflow.updateRange({ from, to })          // change the window
 rangeflow.updateSelectedDates({ from, to })  // change the picked range
@@ -339,16 +339,16 @@ Keep the slider and tabs, drop the popover calendar.
 />
 ```
 
-### 8. External controls with `useRangeflow`
+### 8. External controls with `useRangeFlow`
 
 Drive the picker from buttons, forms, or URL params.
 
 ```tsx
-import { RangeFlow, useRangeflow } from 'rangeflow'
+import { RangeFlow, useRangeFlow } from 'rangeflow'
 import dayjs from 'dayjs'
 
 export function WithControls() {
-  const rangeflow = useRangeflow()
+  const rangeflow = useRangeFlow()
 
   return (
     <div>
@@ -503,12 +503,12 @@ Use these class names to style parts of the picker without touching the tokens.
 
 If you are an AI tool generating code with RangeFlow, keep these facts in mind:
 
-- The package is `rangeflow`. Only two named exports are public: `RangeFlow` (component) and `useRangeflow` (hook). Also a type export `RangeFlowApi`.
+- The package is `rangeflow`. Only two named exports are public: `RangeFlow` (component) and `useRangeFlow` (hook). Also a type export `RangeFlowApi`.
 - Always import the CSS file once: `import 'rangeflow/style.css'`.
 - `defaultRange` and `defaultSelected` are required. Both must be `{ from: Date; to: Date }`.
 - `defaultSelected` must fit inside `defaultRange` or the slider will clamp it.
 - `onChange` is required and fires with `{ from: Date; to: Date }`.
-- To drive the picker from outside, call `useRangeflow()` and pass the result to `<RangeFlow api={...} />`. Then use `updateRange` or `updateSelectedDates`.
+- To drive the picker from outside, call `useRangeFlow()` and pass the result to `<RangeFlow api={...} />`. Then use `updateRange` or `updateSelectedDates`.
 - Theming is CSS variable based. Set `--rangeflow-accent` on any parent to re-skin the picker.
 - Dark mode turns on via a `dark` class or `data-theme="dark"` on the picker or any parent.
 - The picker is 560px wide and 140px tall by default (`w-140 h-35` in Tailwind units).

package/dist/hooks/use-rangeflow.d.ts

@@ -1,2 +1,2 @@
 import { RangeFlowApi } from '../types';
-export declare function useRangeflow(): RangeFlowApi;
+export declare function useRangeFlow(): RangeFlowApi;

package/dist/index.d.ts

@@ -1,3 +1,3 @@
 export { RangeFlow } from './RangeFlow';
-export { useRangeflow } from './hooks/use-rangeflow';
+export { useRangeFlow } from './hooks/use-rangeflow';
 export type { RangeFlowProps, RangeFlowApi } from './types';

package/dist/index.js

@@ -58,7 +58,7 @@ function N(e, t) {
 //#region src/package/rangeflow/utils/create-slider-values.ts
 var ce = N([1, 100], [5, 100]);
 function P(e, t) {
-	let n = d(e.from).startOf("day"), r = d(e.to).startOf("day").diff(n, "day"), i = d(t.from).startOf("day"), a = d(t.to).startOf("day"), o = Math.max(i.diff(n, "day"), 0), s = Math.max(a.diff(i, "day"), 0) * 100 / r, c = o * 100 / r, l = Math.max(ce(s), 5), u = M(c - (l - s), 0, Math.max(100 - l, 0));
+	let n = d(e.from).startOf("day"), r = d(e.to).startOf("day").diff(n, "day"), i = d(t.from).startOf("day"), a = d(t.to).startOf("day"), o = Math.max(i.diff(n, "day"), 0), s = (a.diff(i, "day") + 1) * 100 / r, c = o * 100 / r, l = Math.max(ce(s), 5), u = M(c - (l - s), 0, Math.max(100 - l, 0));
 	return {
 		size: l,
 		left: u,
@@ -297,7 +297,7 @@ function ge(e, t) {
 		left: r,
 		right: i,
 		from: a.add(u, "day").toDate(),
-		to: a.add(u + l, "day").toDate()
+		to: a.add(u + l - 1, "day").toDate()
 	};
 }
 //#endregion
@@ -352,7 +352,7 @@ function ve() {
 //#region src/package/rangeflow/components/DateSlider/SliderValue.tsx
 var ye = n(() => {
 	let { SliderValueLabel: e } = G(), n = K((e) => e.slider.size), r = K((e) => e.selected_date), i = c(() => {
-		let e = Math.max(d(r.to).diff(r.from, "day"), 1);
+		let e = d(r.to).diff(r.from, "day") + 1;
 		return n < 10 ? `${e}D` : e === 1 ? "1 Day" : `${e} Days`;
 	}, [
 		r.from,
@@ -880,4 +880,4 @@ function He() {
 	};
 }
 //#endregion
-export { Ve as RangeFlow, He as useRangeflow };
+export { Ve as RangeFlow, He as useRangeFlow };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rangeflow",
-  "version": "1.0.11",
+  "version": "1.0.13",
   "type": "module",
   "description": "A fancy date range picker built with React and Tailwind.",
   "license": "MIT",