@taqwim/solid 0.1.0-beta.3 → 0.1.0-beta.5

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/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
- import { createComponent as e, insert as t, memo as n, mergeProps as r, spread as i, template as a, use as o } from "solid-js/web";
2
- import { createCalendar as s, getCellDisplayValues as c } from "@taqwim/calendar-core";
3
- import { createContext as l, createEffect as u, createRenderEffect as d, createSignal as f, onCleanup as p, onMount as m, splitProps as h, useContext as g } from "solid-js";
1
+ import { createComponent as e, insert as t, mergeProps as n, spread as r, template as i, use as a } from "solid-js/web";
2
+ import { createCalendar as o, getCellDisplayValues as s } from "@taqwim/calendar-core";
3
+ import { children as c, createContext as l, createEffect as u, createRenderEffect as d, createSignal as f, onCleanup as p, onMount as m, splitProps as h, useContext as g } from "solid-js";
4
4
  //#region src/context.ts
5
5
  var _ = l();
6
6
  function v() {
@@ -14,7 +14,7 @@ var y = /* @__PURE__ */ "defaultValue.value.onValueChange.defaultPlaceholder.pla
14
14
  //#endregion
15
15
  //#region src/useCalendar.ts
16
16
  function b(e) {
17
- let t = s(e()), [n, r] = f(t.getSnapshot());
17
+ let t = o(e()), [n, r] = f(t.getSnapshot());
18
18
  return p(t.subscribe(() => {
19
19
  r(t.getSnapshot());
20
20
  })), d(() => {
@@ -26,13 +26,13 @@ function b(e) {
26
26
  }
27
27
  //#endregion
28
28
  //#region src/HijriCalendar.tsx
29
- var x = /*#__PURE__*/ a("<div><div style=position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0><div role=heading aria-level=2>"), S = /*#__PURE__*/ a("<div role=group data-taqwim-calendar-header>"), C = /*#__PURE__*/ a("<div data-taqwim-calendar-heading>"), w = /*#__PURE__*/ a("<button>"), T = /*#__PURE__*/ a("<div tabindex=-1>"), E = /*#__PURE__*/ a("<div aria-hidden=true data-taqwim-calendar-grid-head>"), D = /*#__PURE__*/ a("<div data-taqwim-calendar-grid-body>"), O = /*#__PURE__*/ a("<div role=row data-taqwim-calendar-grid-row>"), k = /*#__PURE__*/ a("<div data-taqwim-calendar-head-cell>"), A = /*#__PURE__*/ a("<div role=gridcell data-taqwim-calendar-cell>");
29
+ var x = /*#__PURE__*/ i("<div><div style=position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0><div role=heading aria-level=2>"), S = /*#__PURE__*/ i("<div role=group data-taqwim-calendar-header>"), C = /*#__PURE__*/ i("<div data-taqwim-calendar-heading>"), w = /*#__PURE__*/ i("<button>"), T = /*#__PURE__*/ i("<div tabindex=-1>"), E = /*#__PURE__*/ i("<div aria-hidden=true data-taqwim-calendar-grid-head>"), D = /*#__PURE__*/ i("<div data-taqwim-calendar-grid-body>"), O = /*#__PURE__*/ i("<div role=row data-taqwim-calendar-grid-row>"), k = /*#__PURE__*/ i("<div data-taqwim-calendar-head-cell>"), A = /*#__PURE__*/ i("<div role=gridcell>");
30
30
  function j(e, t) {
31
- return typeof e == "function" ? e(t()) : e;
31
+ return typeof e == "function" ? c(() => e(t()))() : e;
32
32
  }
33
- function M(n) {
34
- let [a, s, c] = h(n, y, ["children", "initialFocus"]), l, d, { store: f, state: p } = b(() => ({
35
- ...a,
33
+ function M(i) {
34
+ let [o, s, c] = h(i, y, ["children", "initialFocus"]), l, d, { store: f, state: p } = b(() => ({
35
+ ...o,
36
36
  onFocusedDateChange: (e) => {
37
37
  d = e ? f.formatter.isoDate(e) : void 0;
38
38
  }
@@ -53,8 +53,8 @@ function M(n) {
53
53
  state: p
54
54
  },
55
55
  get children() {
56
- var e = x(), n = e.firstChild, a = n.firstChild, u = l;
57
- return typeof u == "function" ? o(u, e) : l = e, i(e, r(v, c, { onKeyDown: g }), !1, !0), t(e, () => j(s.children, () => ({
56
+ var e = x(), i = e.firstChild, o = i.firstChild, u = l;
57
+ return typeof u == "function" ? a(u, e) : l = e, r(e, n(v, c, { onKeyDown: g }), !1, !0), t(e, () => j(s.children, () => ({
58
58
  get months() {
59
59
  return p().months;
60
60
  },
@@ -71,134 +71,137 @@ function M(n) {
71
71
  return p();
72
72
  },
73
73
  store: f
74
- })), n), t(a, () => p().fullCalendarLabel), e;
74
+ })), i), t(o, () => p().fullCalendarLabel), e;
75
75
  }
76
76
  });
77
77
  }
78
78
  function N(e) {
79
- let { state: n } = v(), [a, o] = h(e, ["children"]);
79
+ let { state: i } = v(), [a, o] = h(e, ["children"]);
80
80
  return (() => {
81
81
  var e = S();
82
- return i(e, r({ get "aria-label"() {
83
- return n().fullCalendarLabel;
82
+ return r(e, n({ get "aria-label"() {
83
+ return i().fullCalendarLabel;
84
84
  } }, o), !1, !0), t(e, () => a.children), e;
85
85
  })();
86
86
  }
87
87
  function P(e) {
88
- let { state: a } = v(), [o, s] = h(e, ["children"]);
88
+ let { state: i } = v(), a = "children" in e, [o, s] = h(e, ["children"]);
89
89
  return (() => {
90
90
  var e = C();
91
- return i(e, r({ get "data-disabled"() {
92
- return a().disabled ? "" : void 0;
93
- } }, s), !1, !0), t(e, (() => {
94
- var e = n(() => o.children === void 0);
95
- return () => e() ? a().headingValue : j(o.children, () => a().headingValue);
96
- })()), e;
91
+ return r(e, n({ get "data-disabled"() {
92
+ return i().disabled ? "" : void 0;
93
+ } }, s), !1, !0), t(e, () => a ? j(o.children, () => i().headingValue) : i().headingValue), e;
97
94
  })();
98
95
  }
99
96
  function F(e) {
100
- let { store: n, state: a } = v(), [o, s] = h(e, ["children"]), c = () => (a(), n.getPrevButtonProps());
97
+ let { store: i, state: a } = v(), [o, s] = h(e, ["children"]), c = () => (a(), i.getPrevButtonProps());
101
98
  return (() => {
102
99
  var e = w();
103
- return i(e, r(c, s, {
100
+ return r(e, n(c, s, {
104
101
  get disabled() {
105
102
  return a().isPrevDisabled;
106
103
  },
107
- onClick: () => n.prevPage()
104
+ onClick: () => i.prevPage()
108
105
  }), !1, !0), t(e, () => j(o.children, () => a().isPrevDisabled)), e;
109
106
  })();
110
107
  }
111
108
  function I(e) {
112
- let { store: n, state: a } = v(), [o, s] = h(e, ["children"]), c = () => (a(), n.getNextButtonProps());
109
+ let { store: i, state: a } = v(), [o, s] = h(e, ["children"]), c = () => (a(), i.getNextButtonProps());
113
110
  return (() => {
114
111
  var e = w();
115
- return i(e, r(c, s, {
112
+ return r(e, n(c, s, {
116
113
  get disabled() {
117
114
  return a().isNextDisabled;
118
115
  },
119
- onClick: () => n.nextPage()
116
+ onClick: () => i.nextPage()
120
117
  }), !1, !0), t(e, () => j(o.children, () => a().isNextDisabled)), e;
121
118
  })();
122
119
  }
123
120
  function L(e) {
124
- let { store: n, state: a } = v(), [o, s] = h(e, ["month", "children"]), c = () => o.month ?? a().months[0], l = () => (a(), n.getGridProps(c()));
121
+ let { store: i, state: a } = v(), [o, s] = h(e, ["month", "children"]), c = () => o.month ?? a().months[0], l = () => (a(), i.getGridProps(c()));
125
122
  return (() => {
126
123
  var e = T();
127
- return i(e, r(l, s), !1, !0), t(e, () => j(o.children, c)), e;
124
+ return r(e, n(l, s), !1, !0), t(e, () => j(o.children, c)), e;
128
125
  })();
129
126
  }
130
127
  function R(e) {
131
- let { state: n } = v(), [r, a] = h(e, ["children"]);
128
+ let { state: n } = v(), [i, a] = h(e, ["children"]);
132
129
  return (() => {
133
130
  var e = E();
134
- return i(e, a, !1, !0), t(e, () => j(r.children, () => n().weekDays)), e;
131
+ return r(e, a, !1, !0), t(e, () => j(i.children, () => n().weekDays)), e;
135
132
  })();
136
133
  }
137
134
  function z(e) {
138
- let [n, r] = h(e, ["children"]);
135
+ let [n, i] = h(e, ["children"]);
139
136
  return (() => {
140
137
  var e = D();
141
- return i(e, r, !1, !0), t(e, () => n.children), e;
138
+ return r(e, i, !1, !0), t(e, () => n.children), e;
142
139
  })();
143
140
  }
144
141
  function B(e) {
145
- let [n, r] = h(e, ["children"]);
142
+ let [n, i] = h(e, ["children"]);
146
143
  return (() => {
147
144
  var e = O();
148
- return i(e, r, !1, !0), t(e, () => n.children), e;
145
+ return r(e, i, !1, !0), t(e, () => n.children), e;
149
146
  })();
150
147
  }
151
148
  function V(e) {
152
- let [n, r] = h(e, ["children"]);
149
+ let [n, i] = h(e, ["children"]);
153
150
  return (() => {
154
151
  var e = k();
155
- return i(e, r, !1, !0), t(e, () => n.children), e;
152
+ return r(e, i, !1, !0), t(e, () => n.children), e;
156
153
  })();
157
154
  }
158
155
  function H(e) {
159
- let [n, a] = h(e, ["day", "children"]);
156
+ let { store: i, state: a } = v(), [o, s] = h(e, ["day", "children"]), c = () => (a(), i.getCellProps(o.day));
160
157
  return (() => {
161
158
  var e = A();
162
- return i(e, r({
159
+ return r(e, n({
163
160
  get "aria-selected"() {
164
- return n.day.isSelected || void 0;
161
+ return o.day.isSelected || void 0;
165
162
  },
166
163
  get "aria-disabled"() {
167
- return n.day.isDisabled || n.day.isUnavailable || void 0;
164
+ return o.day.isDisabled || o.day.isUnavailable || void 0;
165
+ },
166
+ get "data-taqwim-calendar-cell"() {
167
+ return c()["data-taqwim-calendar-cell"];
168
+ },
169
+ get "data-tooltip"() {
170
+ return c()["data-tooltip"];
171
+ },
172
+ get title() {
173
+ return c()["data-tooltip"];
168
174
  },
169
175
  get "data-disabled"() {
170
- return n.day.isDisabled ? "" : void 0;
176
+ return o.day.isDisabled ? "" : void 0;
171
177
  },
172
178
  get "data-outside-month"() {
173
- return n.day.isOutsideMonth ? "" : void 0;
179
+ return o.day.isOutsideMonth ? "" : void 0;
174
180
  }
175
- }, a), !1, !0), t(e, () => n.children), e;
181
+ }, s), !1, !0), t(e, () => o.children), e;
176
182
  })();
177
183
  }
178
184
  function U(e) {
179
- let { store: a, state: o } = v(), [s, l] = h(e, ["day", "children"]), u = () => c(s.day, a.formatter, o().showGregorian, o().dateEmphasis), d = () => (o(), a.getCellTriggerProps(s.day));
185
+ let { store: i, state: a } = v(), o = "children" in e, [c, l] = h(e, ["day", "children"]), u = () => s(c.day, i.formatter, a().showGregorian, a().dateEmphasis), d = () => (a(), i.getCellTriggerProps(c.day));
180
186
  function f() {
181
- s.day.isDisabled || s.day.isUnavailable || a.select(s.day.date);
187
+ c.day.isDisabled || c.day.isUnavailable || i.select(c.day.date);
182
188
  }
183
189
  function p() {
184
- s.day.isDisabled || s.day.isFocused || a.focusDate(s.day.date);
190
+ c.day.isDisabled || c.day.isFocused || i.focusDate(c.day.date);
185
191
  }
186
192
  return (() => {
187
193
  var e = w();
188
- return i(e, r(d, l, {
194
+ return r(e, n(d, l, {
189
195
  onClick: f,
190
196
  onFocus: p
191
- }), !1, !0), t(e, (() => {
192
- var e = n(() => s.children === void 0);
193
- return () => e() ? u().dayValue : j(s.children, () => ({
194
- dayValue: u().dayValue,
195
- hijriDayValue: u().hijriDayValue,
196
- gregorianDayValue: u().gregorianDayValue,
197
- primaryDayValue: u().primaryDayValue,
198
- secondaryDayValue: u().secondaryDayValue,
199
- day: s.day
200
- }));
201
- })()), e;
197
+ }), !1, !0), t(e, () => o ? j(c.children, () => ({
198
+ dayValue: u().dayValue,
199
+ hijriDayValue: u().hijriDayValue,
200
+ gregorianDayValue: u().gregorianDayValue,
201
+ primaryDayValue: u().primaryDayValue,
202
+ secondaryDayValue: u().secondaryDayValue,
203
+ day: c.day
204
+ })) : u().dayValue), e;
202
205
  })();
203
206
  }
204
207
  //#endregion
@@ -1,5 +1,5 @@
1
1
  import { getCellDisplayValues } from '@taqwim/calendar-core';
2
- import { createEffect, onMount, splitProps } from 'solid-js';
2
+ import { children, createEffect, onMount, splitProps } from 'solid-js';
3
3
  import { HijriCalendarContext, useHijriCalendarContext } from './context';
4
4
  import { OPTION_KEYS } from './types';
5
5
  import { createCalendarStore } from './useCalendar';
@@ -30,8 +30,11 @@ import { createCalendarStore } from './useCalendar';
30
30
  * function, and the JSX subtree is created once and then updated in place by
31
31
  * the fine-grained bindings inside it.
32
32
  */
33
- function renderChildren(children, props) {
34
- return typeof children === 'function' ? children(props()) : children;
33
+ function renderChildren(raw, props) {
34
+ if (typeof raw !== 'function')
35
+ return raw;
36
+ const resolved = children(() => raw(props()));
37
+ return resolved();
35
38
  }
36
39
  export function HijriCalendarRoot(props) {
37
40
  const [options, local, domProps] = splitProps(props, OPTION_KEYS, ['children', 'initialFocus']);
@@ -120,9 +123,10 @@ export function HijriCalendarHeader(props) {
120
123
  }
121
124
  export function HijriCalendarHeading(props) {
122
125
  const { state } = useHijriCalendarContext();
126
+ const hasChildren = 'children' in props;
123
127
  const [local, rest] = splitProps(props, ['children']);
124
128
  return (<div data-taqwim-calendar-heading="" data-disabled={state().disabled ? '' : undefined} {...rest}>
125
- {local.children === undefined ? state().headingValue : renderChildren(local.children, () => state().headingValue)}
129
+ {hasChildren ? renderChildren(local.children, () => state().headingValue) : state().headingValue}
126
130
  </div>);
127
131
  }
128
132
  export function HijriCalendarPrev(props) {
@@ -193,13 +197,19 @@ export function HijriCalendarHeadCell(props) {
193
197
  </div>);
194
198
  }
195
199
  export function HijriCalendarCell(props) {
200
+ const { store, state } = useHijriCalendarContext();
196
201
  const [local, rest] = splitProps(props, ['day', 'children']);
197
- return (<div role="gridcell" aria-selected={local.day.isSelected || undefined} aria-disabled={local.day.isDisabled || local.day.isUnavailable || undefined} data-taqwim-calendar-cell="" data-disabled={local.day.isDisabled ? '' : undefined} data-outside-month={local.day.isOutsideMonth ? '' : undefined} {...rest}>
202
+ const cellProps = () => {
203
+ void state();
204
+ return store.getCellProps(local.day);
205
+ };
206
+ return (<div role="gridcell" aria-selected={local.day.isSelected || undefined} aria-disabled={local.day.isDisabled || local.day.isUnavailable || undefined} data-taqwim-calendar-cell={cellProps()['data-taqwim-calendar-cell']} data-tooltip={cellProps()['data-tooltip']} title={cellProps()['data-tooltip']} data-disabled={local.day.isDisabled ? '' : undefined} data-outside-month={local.day.isOutsideMonth ? '' : undefined} {...rest}>
198
207
  {local.children}
199
208
  </div>);
200
209
  }
201
210
  export function HijriCalendarCellTrigger(props) {
202
211
  const { store, state } = useHijriCalendarContext();
212
+ const hasChildren = 'children' in props;
203
213
  const [local, rest] = splitProps(props, ['day', 'children']);
204
214
  const display = () => getCellDisplayValues(local.day, store.formatter, state().showGregorian, state().dateEmphasis);
205
215
  /*
@@ -227,15 +237,15 @@ export function HijriCalendarCellTrigger(props) {
227
237
  store.focusDate(local.day.date);
228
238
  }
229
239
  return (<button {...triggerProps()} {...rest} onClick={onClick} onFocus={onFocus}>
230
- {local.children === undefined
231
- ? display().dayValue
232
- : renderChildren(local.children, () => ({
240
+ {hasChildren
241
+ ? renderChildren(local.children, () => ({
233
242
  dayValue: display().dayValue,
234
243
  hijriDayValue: display().hijriDayValue,
235
244
  gregorianDayValue: display().gregorianDayValue,
236
245
  primaryDayValue: display().primaryDayValue,
237
246
  secondaryDayValue: display().secondaryDayValue,
238
247
  day: local.day,
239
- }))}
248
+ }))
249
+ : display().dayValue}
240
250
  </button>);
241
251
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@taqwim/solid",
3
- "version": "0.1.0-beta.3",
3
+ "version": "0.1.0-beta.5",
4
4
  "private": false,
5
5
  "description": "Headless Solid components for Hijri calendars, built on @taqwim/calendar-core",
6
6
  "keywords": [
@@ -46,8 +46,8 @@
46
46
  "access": "public"
47
47
  },
48
48
  "dependencies": {
49
- "@taqwim/calendar-core": "0.1.0-beta.3",
50
- "@taqwim/core": "0.1.0-beta.3"
49
+ "@taqwim/calendar-core": "0.1.0-beta.5",
50
+ "@taqwim/core": "0.1.0-beta.5"
51
51
  },
52
52
  "devDependencies": {
53
53
  "@arethetypeswrong/cli": "^0.18.2",