bs-ad-calendar-react 1.1.1 → 1.2.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.
- package/README.md +53 -10
- package/dist/bs-ad-calendar.css +1 -1
- package/dist/bs-ad-calendar.js +1261 -1120
- package/dist/bs-ad-calendar.umd.cjs +8 -8
- package/dist/vite.svg +1 -1
- package/package.json +4 -1
package/README.md
CHANGED
|
@@ -83,23 +83,45 @@ export default function App() {
|
|
|
83
83
|
}
|
|
84
84
|
```
|
|
85
85
|
|
|
86
|
-
###
|
|
86
|
+
### Range Presets with Filtering
|
|
87
87
|
|
|
88
88
|
```tsx
|
|
89
|
+
import { Calendar, PRESET_KEYS } from 'bs-ad-calendar-react'
|
|
90
|
+
|
|
89
91
|
<Calendar
|
|
90
92
|
calendarType="BS"
|
|
91
93
|
mode="range"
|
|
92
94
|
showRangePresets
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
95
|
+
rangePresetsPosition="left"
|
|
96
|
+
presetKeys={[
|
|
97
|
+
PRESET_KEYS.LAST_7_DAYS,
|
|
98
|
+
PRESET_KEYS.LAST_30_DAYS,
|
|
99
|
+
PRESET_KEYS.THIS_MONTH,
|
|
100
|
+
PRESET_KEYS.LAST_MONTH
|
|
101
|
+
]}
|
|
102
|
+
onRangeSelect={(range) => console.log(range)}
|
|
103
|
+
/>
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
### Custom Preset Labels
|
|
107
|
+
|
|
108
|
+
```tsx
|
|
109
|
+
import { Calendar, PRESET_KEYS } from 'bs-ad-calendar-react'
|
|
110
|
+
|
|
111
|
+
<Calendar
|
|
112
|
+
calendarType="AD"
|
|
113
|
+
mode="range"
|
|
114
|
+
showRangePresets
|
|
115
|
+
presetKeys={[
|
|
116
|
+
PRESET_KEYS.LAST_7_DAYS,
|
|
117
|
+
PRESET_KEYS.LAST_30_DAYS,
|
|
118
|
+
PRESET_KEYS.THIS_MONTH
|
|
102
119
|
]}
|
|
120
|
+
presetLabels={{
|
|
121
|
+
[PRESET_KEYS.LAST_7_DAYS]: 'Past Week',
|
|
122
|
+
[PRESET_KEYS.LAST_30_DAYS]: 'Past Month',
|
|
123
|
+
[PRESET_KEYS.THIS_MONTH]: 'Current Month'
|
|
124
|
+
}}
|
|
103
125
|
onRangeSelect={(range) => console.log(range)}
|
|
104
126
|
/>
|
|
105
127
|
```
|
|
@@ -197,6 +219,9 @@ export default function App() {
|
|
|
197
219
|
| `showNepaliDays` | `boolean` | `false` | Nepali days |
|
|
198
220
|
| `showNepaliNumbers` | `boolean` | `false` | Nepali numbers |
|
|
199
221
|
| `showRangePresets` | `boolean` | `false` | Show presets |
|
|
222
|
+
| `rangePresetsPosition` | `'top' \| 'right' \| 'bottom' \| 'left'` | `'top'` | Preset position |
|
|
223
|
+
| `presetKeys` | `string[]` | - | Filter presets |
|
|
224
|
+
| `presetLabels` | `Record<string, string>` | - | Rename presets |
|
|
200
225
|
| `predefinedRanges` | `PredefinedRange[]` | - | Custom presets |
|
|
201
226
|
|
|
202
227
|
### DatePicker Props
|
|
@@ -237,6 +262,24 @@ Chrome, Firefox, Safari, Edge (latest versions)
|
|
|
237
262
|
|
|
238
263
|
```tsx
|
|
239
264
|
import type { DateOutput, DateRange, CalendarProps } from 'bs-ad-calendar-react'
|
|
265
|
+
import { PRESET_KEYS } from 'bs-ad-calendar-react'
|
|
266
|
+
```
|
|
267
|
+
|
|
268
|
+
## Available Preset Keys
|
|
269
|
+
|
|
270
|
+
```tsx
|
|
271
|
+
PRESET_KEYS.TODAY // Today
|
|
272
|
+
PRESET_KEYS.YESTERDAY // Yesterday
|
|
273
|
+
PRESET_KEYS.THIS_WEEK // This Week
|
|
274
|
+
PRESET_KEYS.LAST_7_DAYS // Last 7 Days
|
|
275
|
+
PRESET_KEYS.LAST_30_DAYS // Last 30 Days
|
|
276
|
+
PRESET_KEYS.THIS_MONTH // This Month
|
|
277
|
+
PRESET_KEYS.LAST_MONTH // Last Month
|
|
278
|
+
PRESET_KEYS.LAST_3_MONTHS // Last 3 Months
|
|
279
|
+
PRESET_KEYS.LAST_6_MONTHS // Last 6 Months
|
|
280
|
+
PRESET_KEYS.LAST_9_MONTHS // Last 9 Months
|
|
281
|
+
PRESET_KEYS.LAST_180_DAYS // Last 180 Days
|
|
282
|
+
PRESET_KEYS.LAST_YEAR // Last Year (12 months)
|
|
240
283
|
```
|
|
241
284
|
|
|
242
285
|
## License
|
package/dist/bs-ad-calendar.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._calendar_lve6c_1{background:var(--calendar-background, white);border:1px solid var(--calendar-border, #e5e7eb);border-radius:8px;box-shadow:0 4px 6px -1px #0000001a;padding:16px;font-family:system-ui,-apple-system,sans-serif;color:var(--calendar-text, #1f2937)}._calendar_lve6c_1>div:has(._grid_lve6c_14){display:flex;gap:16px}@media(max-width:600px){._calendar_lve6c_1>div:has(._grid_lve6c_14){flex-direction:column}}._header_lve6c_25{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}._navButton_lve6c_32{background:none;border:none;cursor:pointer;padding:8px;border-radius:4px;transition:background-color .2s;color:var(--calendar-text, #1f2937);font-size:18px;font-weight:700;min-width:32px;height:32px;display:flex;align-items:center;justify-content:center}._navButton_lve6c_32:hover:not(:disabled){background-color:var(--calendar-hover, #f3f4f6)}._navButton_lve6c_32:disabled{opacity:.5;cursor:not-allowed}._monthYear_lve6c_58{font-weight:600;font-size:16px;color:var(--calendar-text, #1f2937);background:none;border:none;cursor:pointer;padding:8px 12px;border-radius:4px;transition:background-color .2s}._monthYear_lve6c_58:hover:not(:disabled){background-color:var(--calendar-hover, #f3f4f6)}._monthYear_lve6c_58:disabled{cursor:not-allowed}._pickerOverlay_lve6c_78{position:fixed;inset:0;background:#0000004d;display:flex;align-items:center;justify-content:center;z-index:1000}._pickerContent_lve6c_88{background:#fff;border-radius:12px;box-shadow:0 20px 25px -5px #0000001a;width:90%;max-width:400px;max-height:90vh;overflow:auto}._pickerHeader_lve6c_98{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid #e5e7eb}._pickerHeader_lve6c_98 h3{margin:0;font-size:16px;font-weight:600}._closeButton_lve6c_112{background:none;border:none;font-size:24px;cursor:pointer;color:#6b7280;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px}._closeButton_lve6c_112:hover{background:#f3f4f6}._pickerBody_lve6c_131{padding:16px}._pickerSection_lve6c_135{margin-bottom:20px}._pickerSection_lve6c_135:last-child{margin-bottom:0}._pickerSection_lve6c_135 label{display:block;font-size:14px;font-weight:500;margin-bottom:8px;color:#374151}._pickerSectionHeader_lve6c_151{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}._pickerSectionHeader_lve6c_151 label{margin-bottom:0}._yearNav_lve6c_162{display:flex;align-items:center;gap:8px}._yearNav_lve6c_162 button{background:none;border:none;cursor:pointer;padding:4px 8px;border-radius:4px;font-size:16px;color:var(--calendar-primary, #3b82f6)}._yearNav_lve6c_162 button:hover:not(:disabled){background:var(--calendar-hover, #eff6ff)}._yearNav_lve6c_162 button:disabled{opacity:.3;cursor:not-allowed}._yearNav_lve6c_162 span{font-size:13px;font-weight:500;min-width:80px;text-align:center}._yearGrid_lve6c_194{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}._yearGrid_lve6c_194 button{padding:10px;border:1px solid #e5e7eb;background:#fff;border-radius:6px;cursor:pointer;font-size:13px;transition:all .2s}._yearGrid_lve6c_194 button:hover{background:#f3f4f6}._yearGrid_lve6c_194 button._selected_lve6c_214{background:var(--calendar-selected, #3b82f6);color:#fff;border-color:var(--calendar-selected, #3b82f6)}._monthGrid_lve6c_220{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}._monthGrid_lve6c_220 button{padding:12px;border:1px solid #e5e7eb;background:#fff;border-radius:6px;cursor:pointer;font-size:13px;transition:all .2s}._monthGrid_lve6c_220 button:hover{background:#f3f4f6}._monthGrid_lve6c_220 button._selected_lve6c_214{background:var(--calendar-selected, #3b82f6);color:#fff;border-color:var(--calendar-selected, #3b82f6)}._grid_lve6c_14{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}._dayHeader_lve6c_252{text-align:center;font-weight:500;font-size:12px;color:var(--calendar-disabled, #6b7280);padding:8px 4px}._day_lve6c_252{aspect-ratio:1;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:4px;transition:all .2s;font-size:14px;color:var(--calendar-text, #1f2937);min-height:32px}._day_lve6c_252:hover:not(._dayDisabled_lve6c_273):not(._dayOtherMonth_lve6c_273){background-color:var(--calendar-hover, #f3f4f6)}._daySelected_lve6c_277{background-color:var(--calendar-selected, #3b82f6)!important;color:#fff!important}._dayToday_lve6c_282{background-color:var(--calendar-today, #dbeafe);color:var(--calendar-primary, #1d4ed8);font-weight:600}._dayInRange_lve6c_288{background-color:var(--calendar-hover, #eff6ff);color:var(--calendar-primary, #1d4ed8)}._dayDisabled_lve6c_273{color:var(--calendar-disabled, #d1d5db);cursor:not-allowed}._dayOtherMonth_lve6c_273{color:var(--calendar-disabled, #9ca3af);cursor:default}._calendar_lve6c_1[data-theme=dark]{--calendar-primary: #60a5fa;--calendar-background: #1f2937;--calendar-text: #f9fafb;--calendar-border: #374151;--calendar-hover: #374151;--calendar-selected: #3b82f6;--calendar-today: #1e40af;--calendar-disabled: #6b7280}._datePicker_z7mc2_1{position:relative;display:inline-block;width:100%}._input_z7mc2_7{width:100%;padding:10px 40px 10px 12px;border:1px solid var(--datepicker-border, #d1d5db);border-radius:var(--datepicker-radius, 6px);font-size:var(--datepicker-font-size, 14px);cursor:pointer;background:var(--datepicker-background, white);color:var(--datepicker-text, #1f2937);transition:border-color .2s,box-shadow .2s;box-sizing:border-box}._input_z7mc2_7:hover{border-color:var(--datepicker-border-hover, #9ca3af)}._input_z7mc2_7:focus{outline:none;border-color:var(--datepicker-border-focus, #3b82f6);box-shadow:0 0 0 3px var(--datepicker-focus-ring, rgba(59, 130, 246, .1))}._input_z7mc2_7:disabled{background:#f3f4f6;cursor:not-allowed;opacity:.6}._iconButton_z7mc2_38{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:4px;font-size:18px;display:flex;align-items:center;justify-content:center;color:var(--datepicker-icon, #6b7280);transition:color .2s}._iconButton_z7mc2_38:hover{color:var(--datepicker-icon-hover, #3b82f6)}._iconButton_z7mc2_38:disabled{cursor:not-allowed;opacity:.5}._popup_z7mc2_64{position:absolute;top:calc(100% + 8px);left:0;z-index:1000;box-shadow:0 10px 25px #00000026;border-radius:8px;background:#fff}@media(max-width:640px){._popup_z7mc2_64{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);max-width:90vw}}
|