@g4rcez/components 0.0.56 → 0.0.58

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 (43) hide show
  1. package/dist/index.css +1 -1
  2. package/dist/index.js +27 -26
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.mjs +5349 -5240
  5. package/dist/index.mjs.map +1 -1
  6. package/dist/index.umd.js +21 -20
  7. package/dist/index.umd.js.map +1 -1
  8. package/dist/preset/src/styles/dark.d.ts.map +1 -1
  9. package/dist/preset/src/styles/dark.js +1 -0
  10. package/dist/preset/src/styles/light.d.ts.map +1 -1
  11. package/dist/preset/src/styles/light.js +1 -0
  12. package/dist/preset/src/styles/theme.types.d.ts +2 -1
  13. package/dist/preset/src/styles/theme.types.d.ts.map +1 -1
  14. package/dist/src/components/display/calendar.d.ts +13 -12
  15. package/dist/src/components/display/calendar.d.ts.map +1 -1
  16. package/dist/src/components/display/calendar.js +15 -12
  17. package/dist/src/components/form/autocomplete.d.ts.map +1 -1
  18. package/dist/src/components/form/autocomplete.js +9 -9
  19. package/dist/src/components/form/date-picker.d.ts +24 -24
  20. package/dist/src/components/form/select.d.ts +1 -1
  21. package/dist/src/components/form/select.d.ts.map +1 -1
  22. package/dist/src/components/form/textarea.d.ts.map +1 -1
  23. package/dist/src/components/form/textarea.js +3 -1
  24. package/dist/src/components/table/filter.d.ts +2 -1
  25. package/dist/src/components/table/filter.d.ts.map +1 -1
  26. package/dist/src/components/table/filter.js +54 -31
  27. package/dist/src/components/table/index.d.ts.map +1 -1
  28. package/dist/src/components/table/index.js +9 -7
  29. package/dist/src/components/table/table-lib.d.ts +5 -1
  30. package/dist/src/components/table/table-lib.d.ts.map +1 -1
  31. package/dist/src/components/table/table-lib.js +11 -2
  32. package/dist/src/components/table/thead.d.ts.map +1 -1
  33. package/dist/src/components/table/thead.js +27 -7
  34. package/dist/src/hooks/use-components-provider.d.ts +4 -0
  35. package/dist/src/hooks/use-components-provider.d.ts.map +1 -1
  36. package/dist/src/hooks/use-components-provider.js +2 -0
  37. package/dist/src/styles/dark.d.ts.map +1 -1
  38. package/dist/src/styles/dark.js +1 -0
  39. package/dist/src/styles/light.d.ts.map +1 -1
  40. package/dist/src/styles/light.js +1 -0
  41. package/dist/src/styles/theme.types.d.ts +2 -1
  42. package/dist/src/styles/theme.types.d.ts.map +1 -1
  43. package/package.json +3 -1
@@ -1 +1 @@
1
- {"version":3,"file":"dark.d.ts","sourceRoot":"","sources":["../../../../src/styles/dark.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,UAAU,EAAE,YAqLxB,CAAC"}
1
+ {"version":3,"file":"dark.d.ts","sourceRoot":"","sources":["../../../../src/styles/dark.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,UAAU,EAAE,YAsLxB,CAAC"}
@@ -79,6 +79,7 @@ export var DARK_THEME = {
79
79
  border: "hsla(0, 0%, 19%)",
80
80
  },
81
81
  table: {
82
+ header: "hsla(0, 0%, 12%)",
82
83
  background: "hsla(0, 0%, 15%)",
83
84
  border: "hsla(240, 4%, 33%)",
84
85
  },
@@ -1 +1 @@
1
- {"version":3,"file":"light.d.ts","sourceRoot":"","sources":["../../../../src/styles/light.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,WAAW,EAAE,YAqLzB,CAAC"}
1
+ {"version":3,"file":"light.d.ts","sourceRoot":"","sources":["../../../../src/styles/light.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,WAAW,EAAE,YAsLzB,CAAC"}
@@ -79,6 +79,7 @@ export var LIGHT_THEME = {
79
79
  border: "hsla(200, 1%, 80%)",
80
80
  },
81
81
  table: {
82
+ header: "hsla(221, 10%, 90%)",
82
83
  background: "hsla(0, 0%, 100%)",
83
84
  border: "hsla(210, 25%, 88%)",
84
85
  },
@@ -94,8 +94,9 @@ export type DesignTokens = {
94
94
  border: string;
95
95
  };
96
96
  table: {
97
- background: string;
98
97
  border: string;
98
+ header: string;
99
+ background: string;
99
100
  };
100
101
  };
101
102
  };
@@ -1 +1 @@
1
- {"version":3,"file":"theme.types.d.ts","sourceRoot":"","sources":["../../../../src/styles/theme.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG;KAAG,CAAC,IAAI,MAAM,GAAG,MAAM,GAAG,aAAa;CAAE,CAAC;AAEtE,KAAK,UAAU,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAC;AAE/F,MAAM,MAAM,YAAY,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;IACnC,OAAO,EAAE,MAAM,CAAC,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,MAAM,CAAC,CAAC;IAC7D,OAAO,EAAE,MAAM,CAAC,MAAM,GAAG,IAAI,GAAG,IAAI,EAAE,MAAM,CAAC,CAAC;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,MAAM,EAAE;QACJ,GAAG,EAAE,MAAM,CAAC,UAAU,EAAE;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,EAAE,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC;QACtD,MAAM,EAAE,MAAM,CAAC,UAAU,EAAE;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,EAAE,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC;QACzD,KAAK,EAAE,MAAM,CAAC,UAAU,EAAE;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,EAAE,EAAE,MAAM,CAAC;YAAC,MAAM,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC;QACxE,UAAU,EAAE,MAAM,CAAC;QACnB,UAAU,EAAE,MAAM,CAAC;QACnB,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE;YACN,UAAU,EAAE,MAAM,CAAC;YACnB,OAAO,EAAE,MAAM,CAAC;YAChB,MAAM,EAAE,MAAM,CAAC;YACf,KAAK,EAAE,MAAM,CAAC;SACjB,CAAC;QACF,OAAO,EAAE;YACL,UAAU,EAAE,MAAM,CAAC;YACnB,OAAO,EAAE,MAAM,CAAC;YAChB,MAAM,EAAE,MAAM,CAAC;YACf,KAAK,EAAE,MAAM,CAAC;SACjB,CAAC;QACF,IAAI,EAAE;YACF,OAAO,EAAE,MAAM,CAAC;YAChB,MAAM,EAAE,MAAM,CAAC;YACf,KAAK,EAAE,MAAM,CAAC;YACd,UAAU,EAAE,MAAM,CAAC;YACnB,YAAY,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,SAAS,EAAE;YACP,OAAO,EAAE,MAAM,CAAC;YAChB,UAAU,EAAE,MAAM,CAAC;YACnB,MAAM,EAAE,MAAM,CAAC;YACf,KAAK,EAAE,MAAM,CAAC;YACd,UAAU,EAAE,MAAM,CAAC;SACtB,CAAC;QACF,IAAI,EAAE;YACF,OAAO,EAAE,MAAM,CAAC;YAChB,MAAM,EAAE,MAAM,CAAC;YACf,KAAK,EAAE,MAAM,CAAC;YACd,UAAU,EAAE,MAAM,CAAC;YACnB,YAAY,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,MAAM,EAAE;YACJ,OAAO,EAAE,MAAM,CAAC;YAChB,MAAM,EAAE,MAAM,CAAC;YACf,KAAK,EAAE,MAAM,CAAC;YACd,UAAU,EAAE,MAAM,CAAC;YACnB,YAAY,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,OAAO,EAAE;YACL,OAAO,EAAE,MAAM,CAAC;YAChB,MAAM,EAAE,MAAM,CAAC;YACf,KAAK,EAAE,MAAM,CAAC;YACd,UAAU,EAAE,MAAM,CAAC;YACnB,YAAY,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,KAAK,EAAE;YACH,MAAM,EAAE,MAAM,CAAC;YACf,WAAW,EAAE,MAAM,CAAC;YACpB,YAAY,EAAE,MAAM,CAAC;YACrB,WAAW,EAAE,MAAM,CAAC;YACpB,MAAM,EAAE,MAAM,CAAC;SAClB,CAAC;QACF,IAAI,EAAE;YACF,UAAU,EAAE,MAAM,CAAC;YACnB,MAAM,EAAE,MAAM,CAAC;SAClB,CAAC;QACF,QAAQ,EAAE;YACN,UAAU,EAAE,MAAM,CAAC;YACnB,MAAM,EAAE,MAAM,CAAC;YACf,OAAO,EAAE,MAAM,CAAC;SACnB,CAAC;QACF,OAAO,EAAE;YACL,UAAU,EAAE,MAAM,CAAC;YACnB,UAAU,EAAE,MAAM,CAAC;YACnB,MAAM,EAAE,MAAM,CAAC;SAClB,CAAC;QACF,KAAK,EAAE;YACH,UAAU,EAAE,MAAM,CAAC;YACnB,MAAM,EAAE,MAAM,CAAC;SAClB,CAAC;KACL,CAAC;CACL,CAAC;AAEF,MAAM,MAAM,KAAK,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAEnD,MAAM,MAAM,kBAAkB,GACxB,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,MAAM,CAAC,GACzD,CAAC,CAAC,MAAM,EAAE,MAAM,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC;AAEpF,MAAM,MAAM,mBAAmB,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,KAAK,CAAC;AAEzF,KAAK,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC;AAE/B,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,aAAa,EAAE,CAAC,SAAS,EAAE,IAAI;KAC1D,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,aAAa,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,UAAU,CAAC,EAAE,CAAC;CACnF,CAAC"}
1
+ {"version":3,"file":"theme.types.d.ts","sourceRoot":"","sources":["../../../../src/styles/theme.types.ts"],"names":[],"mappings":"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"}
@@ -6,29 +6,30 @@ type Range = {
6
6
  };
7
7
  type OnChangeDate = (d: Date | undefined) => void;
8
8
  type OnChangeRange = (d: Range | undefined) => void;
9
+ type CalendarStyles = Partial<{
10
+ day: string;
11
+ week: string;
12
+ weekDay: string;
13
+ dayFrame: string;
14
+ calendar: string;
15
+ }>;
9
16
  export type CalendarProps<T extends "date" | "range" | undefined = undefined> = Partial<{
10
- labelRange: {
11
- to: string;
12
- from: string;
13
- };
14
17
  locale: Locales;
15
18
  markRange: boolean;
16
19
  markToday: boolean;
17
20
  rangeMode: boolean;
21
+ styles: CalendarStyles;
18
22
  changeOnlyOnClick: boolean;
19
- onChangeMonth: (d: Date) => void;
20
23
  onChangeYear: (d: Date) => void;
24
+ onChangeMonth: (d: Date) => void;
21
25
  RenderOnDay: React.FC<{
22
26
  date: Date;
23
27
  }>;
24
28
  disabledDate: (date: Date) => boolean;
25
- styles: Partial<{
26
- day: string;
27
- week: string;
28
- weekDay: string;
29
- dayFrame: string;
30
- calendar: string;
31
- }>;
29
+ labelRange: {
30
+ to: string;
31
+ from: string;
32
+ };
32
33
  } & (T extends "date" ? {
33
34
  date: Date;
34
35
  onChange: OnChangeDate;
@@ -1 +1 @@
1
- {"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../src/components/display/calendar.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAqB,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAqBvD,KAAK,KAAK,GAAG;IAAE,IAAI,CAAC,EAAE,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,IAAI,CAAA;CAAE,CAAC;AAExC,KAAK,YAAY,GAAG,CAAC,CAAC,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;AAElD,KAAK,aAAa,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;AAEpD,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,IAAI,OAAO,CACnF;IACI,UAAU,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IACzC,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,YAAY,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,MAAM,EAAE,OAAO,CAAC;QACZ,GAAG,EAAE,MAAM,CAAC;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,CAAC;KACpB,CAAC,CAAC;CACN,GAAG,CAAC,CAAC,SAAS,MAAM,GACf;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GACtC,CAAC,SAAS,OAAO,GACf;IACI,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,aAAa,CAAC;CAC3B,GACD,EAAE,CAAC,GACP,CAAC;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,QAAQ,EAAE,aAAa,CAAA;CAAE,CAAC,CAC3F,CAAC;AAoDF,eAAO,MAAM,QAAQ,mKAclB,aAAa,4CAgRf,CAAC"}
1
+ {"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../src/components/display/calendar.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAqB,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAqBvD,KAAK,KAAK,GAAG;IAAE,IAAI,CAAC,EAAE,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,IAAI,CAAA;CAAE,CAAC;AAExC,KAAK,YAAY,GAAG,CAAC,CAAC,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;AAElD,KAAK,aAAa,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;AAEpD,KAAK,cAAc,GAAG,OAAO,CAAC;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;CACpB,CAAC,CAAC;AAEH,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,IAAI,OAAO,CACnF;IACI,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,cAAc,CAAC;IACvB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,YAAY,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,UAAU,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;CAC5C,GAAG,CAAC,CAAC,SAAS,MAAM,GACf;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GACtC,CAAC,SAAS,OAAO,GACf;IACI,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,aAAa,CAAC;CAC3B,GACD,EAAE,CAAC,GACP,CAAC;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,QAAQ,EAAE,aAAa,CAAA;CAAE,CAAC,CAC3F,CAAC;AA0HF,eAAO,MAAM,QAAQ,mKAclB,aAAa,4CA4Of,CAAC"}
@@ -58,8 +58,21 @@ const inRange = (start, middle, end) => {
58
58
  return false;
59
59
  return isAfter(middle, start) && isBefore(middle, end);
60
60
  };
61
- export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, labelRange, disabledDate, locale, markToday = true, onChangeMonth, onChangeYear, rangeMode = false, onChange, styles, markRange = true, ...props }) => {
61
+ const CalendarBody = (props) => {
62
62
  const translate = useTranslations();
63
+ return (_jsx(motion.tbody, { layout: true, variants: variants, custom: props.direction, onKeyDown: props.onKeyDown, className: css(props.styles?.week), children: props.zip.map((week, index) => (_jsx("tr", { className: props.styles?.week, children: week.map((day) => {
64
+ const key = day.toISOString();
65
+ const isSelected = props.rangeMode
66
+ ? key === props.range?.to?.toISOString() || key === props.range?.from?.toISOString()
67
+ : key === props.date?.toISOString();
68
+ const today = isToday(day) && props.markToday;
69
+ const disabledByFn = props.disabledDate?.(day) || false;
70
+ const disableDate = !isSameMonth(day, props.stateDate) || disabledByFn;
71
+ const isInRange = props.rangeMode ? inRange(props.range?.from, day, props.range?.to) : false;
72
+ return (_jsxs("td", { align: "center", className: css("relative", props.styles?.dayFrame), children: [_jsxs("button", { type: "button", "data-date": key, disabled: disabledByFn, "data-range": props.rangeMode, onClick: props.dispatch.onSelectDate, "data-view": props.stateDate.getMonth().toString(), className: css(`flex size-10 items-center justify-center rounded-full proportional-nums disabled:cursor-not-allowed ${today ? "text-emphasis" : ""} ${disableDate ? "text-disabled" : ""} ${isSelected ? "bg-primary text-primary-foreground" : ""}`, props.styles?.day, isInRange && props.markRange ? "size-10 border border-dashed border-card-border" : ""), children: [day.getDate(), isSelected && props.stateRange.from?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs text-foreground", children: props.labelRange?.from ?? translate.calendarFromDate }) })) : null, isSelected && props.stateRange.to?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs text-foreground", children: props.labelRange?.to ?? translate.calendarToDate }) })) : null] }), props.RenderOnDay ? _jsx(props.RenderOnDay, { date: day }) : null] }, key));
73
+ }) }, `week-${week.length}-${index}`))) }));
74
+ };
75
+ export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, labelRange, disabledDate, locale, markToday = true, onChangeMonth, onChangeYear, rangeMode = false, onChange, styles, markRange = true, ...props }) => {
63
76
  const root = useRef(null);
64
77
  const { date, range } = props;
65
78
  const providedDate = date || new Date();
@@ -195,15 +208,5 @@ export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, labelRange, d
195
208
  };
196
209
  return (_jsx(MotionConfig, { transition: transition, children: _jsxs("div", { ref: root, className: css("relative overflow-hidden", styles?.calendar), children: [_jsx("div", { className: "flex flex-col justify-center rounded text-center", children: _jsx(AnimatePresence, { initial: false, mode: "popLayout", custom: state.direction, onExitComplete: dispatch.onExitComplete, children: _jsxs(motion.div, { initial: "enter", animate: "middle", exit: "exit", children: [_jsxs("header", { className: "relative flex justify-between", children: [_jsx(motion.button, { layout: true, "data-focustrap": "prev", variants: removeImmediately, onClick: dispatch.previousMonth, className: "z-calendar rounded-full p-1.5 hover:bg-primary", children: _jsx(ChevronLeftIcon, { className: "h-4 w-4" }) }), _jsx(motion.span, { layout: true, variants: variants, custom: state.direction, className: "absolute inset-0 isolate z-normal flex items-center justify-center font-semibold", children: _jsxs("span", { className: "flex w-fit items-center justify-center gap-0.5 py-1", children: [_jsx("select", { style: { width: `${monthString.length}ch` }, value: monthString, onChange: dispatch.onChangeMonth, className: "w-fit cursor-pointer appearance-none bg-transparent capitalize proportional-nums hover:text-primary", children: state.months }), _jsx(TheMaskInput, { mask: "int", value: state.year, maxLength: 4, placeholder: "YYYY", onChange: internalOnChangeYear, style: { width: `${state.year.length}ch` }, className: "w-16 cursor-pointer appearance-none bg-transparent hover:text-primary" })] }) }), _jsx(motion.button, { layout: true, "data-focustrap": "next", variants: removeImmediately, className: "z-calendar rounded-full p-1.5 hover:bg-primary", onClick: dispatch.nextMonth, children: _jsx(ChevronRightIcon, { className: "h-4 w-4" }) }), _jsx("div", { className: "absolute inset-0", style: {
197
210
  backgroundImage: "linear-gradient(to right, hsla(var(--card-background)) 15%, transparent 30%, transparent 70%, hsla(var(--card-background)) 85%)",
198
- } })] }), _jsxs(motion.table, { className: "mt-2 table min-w-full table-auto border-0", children: [_jsx("thead", { children: _jsx("tr", { children: state.week.map((dayOfWeek) => (_jsx("th", { className: css("py-2 text-sm font-medium capitalize", styles?.weekDay), children: dayOfWeek.toLocaleDateString(locale, { weekday: "short" }) }, dayOfWeek.toString()))) }) }), _jsx(motion.tbody, { layout: true, variants: variants, custom: state.direction, onKeyDown: dispatch.onKeyDown, className: css(styles?.week), children: zip.map((week, index) => (_jsx("tr", { className: styles?.week, children: week.map((day) => {
199
- const key = day.toISOString();
200
- const isSelected = rangeMode
201
- ? key === range?.to?.toISOString() || key === range?.from?.toISOString()
202
- : key === date?.toISOString();
203
- const today = isToday(day) && markToday;
204
- const disabledByFn = disabledDate?.(day) || false;
205
- const disableDate = !isSameMonth(day, state.date) || disabledByFn;
206
- const isInRange = rangeMode ? inRange(range?.from, day, range?.to) : false;
207
- return (_jsxs("td", { align: "center", className: css("relative", styles?.dayFrame), children: [_jsxs("button", { type: "button", "data-date": key, disabled: disabledByFn, "data-range": rangeMode, onClick: dispatch.onSelectDate, "data-view": state.date.getMonth().toString(), className: css(`flex size-10 items-center justify-center rounded-full proportional-nums disabled:cursor-not-allowed ${today ? "text-emphasis" : ""} ${disableDate ? "text-disabled" : ""} ${isSelected ? "bg-primary text-primary-foreground" : ""}`, styles?.day, isInRange && markRange ? "size-10 border border-dashed border-card-border" : ""), children: [day.getDate(), isSelected && state.range.from?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs text-foreground", children: labelRange?.from ?? translate.calendarFromDate }) })) : null, isSelected && state.range.to?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs text-foreground", children: labelRange?.to ?? translate.calendarToDate }) })) : null] }), RenderOnDay ? _jsx(RenderOnDay, { date: day }) : null] }, key));
208
- }) }, `week-${week.length}-${index}`))) })] })] }, monthString) }) }), _jsx("footer", { className: "mt-2 text-center text-primary", children: _jsx("button", { className: "transition-transform duration-300 hover:scale-105", type: "button", onClick: dispatch.setToday, children: "Today" }) })] }) }));
211
+ } })] }), _jsxs(motion.table, { className: "mt-2 table min-w-full table-auto border-0", children: [_jsx("thead", { children: _jsx("tr", { children: state.week.map((dayOfWeek) => (_jsx("th", { className: css("py-2 text-sm font-medium capitalize", styles?.weekDay), children: dayOfWeek.toLocaleDateString(locale, { weekday: "short" }) }, dayOfWeek.toString()))) }) }), _jsx(CalendarBody, { stateRange: state.range, stateDate: state.date, disabledDate: disabledDate, markRange: markRange, zip: zip, range: range, styles: styles, dispatch: dispatch, date: date || null, markToday: markToday, rangeMode: rangeMode, labelRange: labelRange, RenderOnDay: RenderOnDay, direction: state.direction, onKeyDown: dispatch.onKeyDown })] })] }, monthString) }) }), _jsx("footer", { className: "mt-2 text-center text-primary", children: _jsx("button", { className: "transition-transform duration-300 hover:scale-105", type: "button", onClick: dispatch.setToday, children: "Today" }) })] }) }));
209
212
  };
@@ -1 +1 @@
1
- {"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/form/autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAoF,MAAM,OAAO,CAAC;AAIzG,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAErF,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,UAAU,CAAC,GAAG;IACrF,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,qBAAqB,CAAC;CACjC,CAAC;AAIF,eAAO,MAAM,MAAM,4GA2BjB,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,GAAG;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,qBAAqB,EAAE,CAAC;CACpC,CAAC;AAaF,eAAO,MAAM,YAAY,yGAiRxB,CAAC"}
1
+ {"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/form/autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAoF,MAAM,OAAO,CAAC;AAIzG,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAErF,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,UAAU,CAAC,GAAG;IACrF,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,qBAAqB,CAAC;CACjC,CAAC;AAIF,eAAO,MAAM,MAAM,4GA2BjB,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,GAAG;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,qBAAqB,EAAE,CAAC;CACpC,CAAC;AAaF,eAAO,MAAM,YAAY,yGAwRxB,CAAC"}
@@ -165,7 +165,7 @@ export const Autocomplete = forwardRef(({ options, dynamicOption = false, feedba
165
165
  }
166
166
  }
167
167
  },
168
- }), "data-value": value, "data-error": !!error, "data-name": id, "data-target": id, required: required, value: open ? shadow : label || value, "aria-autocomplete": "list", autoComplete: "off", className: css("input placeholder-input-mask group h-input-height w-full flex-1", "rounded-md bg-transparent px-input-x py-input-y text-foreground", "outline-none transition-colors focus:ring-2 focus:ring-inset focus:ring-primary", "group-error:text-danger group-error:placeholder-input-mask-error", "group-focus-within:border-primary group-hover:border-primary", props.className) }), _jsx("input", { id: id, name: id, type: "hidden", "data-origin": id, ref: externalRef, required: required, defaultValue: props.value || value || undefined }), _jsx(FloatingPortal, { preserveTabOrder: true, children: open ? (_jsx(FloatingFocusManager, { guards: true, returnFocus: false, context: context, initialFocus: -1, visuallyHiddenDismiss: true, children: _jsx("ul", { ...getFloatingProps({
168
+ }), "data-value": value, "data-error": !!error, "data-name": id, "data-target": id, required: required, value: open ? shadow : label || value, "aria-autocomplete": "list", autoComplete: "off", className: css("input placeholder-input-mask group h-input-height w-full flex-1", "rounded-md bg-transparent px-input-x py-input-y text-foreground", "outline-none transition-colors focus:ring-2 focus:ring-inset focus:ring-primary", "group-error:text-danger group-error:placeholder-input-mask-error", "group-focus-within:border-primary group-hover:border-primary", props.className) }), _jsx("input", { id: id, name: id, type: "hidden", "data-origin": id, ref: externalRef, required: required, defaultValue: props.value || value || undefined }), _jsx(FloatingPortal, { preserveTabOrder: true, children: open ? (_jsx(FloatingFocusManager, { guards: true, returnFocus: false, context: context, initialFocus: -1, visuallyHiddenDismiss: true, children: _jsxs("ul", { ...getFloatingProps({
169
169
  ref: refs.setFloating,
170
170
  style: {
171
171
  position: strategy,
@@ -173,12 +173,12 @@ export const Autocomplete = forwardRef(({ options, dynamicOption = false, feedba
173
173
  top: y ?? 0,
174
174
  ...transitions.styles,
175
175
  },
176
- }), "data-floating": "true", className: "z-floating m-0 origin-[top_center] list-none overflow-auto overflow-y-auto rounded-b-lg rounded-t-lg border border-floating-border bg-floating-background p-0 text-foreground shadow-floating", children: list.map((option, i) => {
177
- const active = value === option.value || value === option.label;
178
- return (_jsx(Option, { ...getItemProps({
179
- onClick: () => onSelect(option, i),
180
- ref: (node) => void (listRef.current[i] = node),
181
- selected: index === i,
182
- }), option: option, active: active, selected: index === i }, `${option.value}-option`));
183
- }) }) })) : null })] }));
176
+ }), "data-floating": "true", className: "z-floating m-0 origin-[top_center] list-none overflow-auto overflow-y-auto overscroll-contain rounded-b-lg rounded-t-lg border border-floating-border bg-floating-background p-0 text-foreground shadow-floating", children: [list.map((option, i) => {
177
+ const active = value === option.value || value === option.label;
178
+ return (_jsx(Option, { ...getItemProps({
179
+ onClick: () => onSelect(option, i),
180
+ ref: (node) => void (listRef.current[i] = node),
181
+ selected: index === i,
182
+ }), option: option, active: active, selected: index === i }, `${option.value}-option`));
183
+ }), list.length === 0 ? (_jsx("li", { role: "option", className: "w-full border-b border-tooltip-border last:border-transparent", children: _jsx("span", { className: "flex w-full justify-between p-2 text-left text-disabled", children: translation.autocompleteEmpty }) })) : null] }) })) : null })] }));
184
184
  });
@@ -3,22 +3,11 @@ import { Override } from "../../types";
3
3
  import { CalendarProps } from "../display/calendar";
4
4
  import { InputProps } from "./input";
5
5
  export type DatePickerProps = Override<InputProps, CalendarProps<"date">>;
6
- export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<InputProps, "onChange" | "date" | "locale" | "labelRange" | "markRange" | "markToday" | "rangeMode" | "changeOnlyOnClick" | "onChangeMonth" | "onChangeYear" | "RenderOnDay" | "disabledDate" | "styles"> & Partial<{
7
- labelRange: {
8
- to: string;
9
- from: string;
10
- };
6
+ export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<InputProps, "onChange" | "date" | "locale" | "markRange" | "markToday" | "rangeMode" | "styles" | "changeOnlyOnClick" | "onChangeYear" | "onChangeMonth" | "RenderOnDay" | "disabledDate" | "labelRange"> & Partial<{
11
7
  locale: import("the-mask-input").Locales;
12
8
  markRange: boolean;
13
9
  markToday: boolean;
14
10
  rangeMode: boolean;
15
- changeOnlyOnClick: boolean;
16
- onChangeMonth: (d: Date) => void;
17
- onChangeYear: (d: Date) => void;
18
- RenderOnDay: React.FC<{
19
- date: Date;
20
- }>;
21
- disabledDate: (date: Date) => boolean;
22
11
  styles: Partial<{
23
12
  day: string;
24
13
  week: string;
@@ -26,28 +15,28 @@ export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<Inpu
26
15
  dayFrame: string;
27
16
  calendar: string;
28
17
  }>;
18
+ changeOnlyOnClick: boolean;
19
+ onChangeYear: (d: Date) => void;
20
+ onChangeMonth: (d: Date) => void;
21
+ RenderOnDay: React.FC<{
22
+ date: Date;
23
+ }>;
24
+ disabledDate: (date: Date) => boolean;
25
+ labelRange: {
26
+ to: string;
27
+ from: string;
28
+ };
29
29
  } & {
30
30
  date: Date;
31
31
  onChange: (d: Date | undefined) => void;
32
32
  } & {
33
33
  date: Date;
34
34
  onChange: (d: Date | undefined) => void;
35
- }>, "ref"> | Omit<Omit<InputProps, "onChange" | "date" | "locale" | "labelRange" | "markRange" | "markToday" | "rangeMode" | "changeOnlyOnClick" | "onChangeMonth" | "onChangeYear" | "RenderOnDay" | "disabledDate" | "styles"> & Partial<{
36
- labelRange: {
37
- to: string;
38
- from: string;
39
- };
35
+ }>, "ref"> | Omit<Omit<InputProps, "onChange" | "date" | "locale" | "markRange" | "markToday" | "rangeMode" | "styles" | "changeOnlyOnClick" | "onChangeYear" | "onChangeMonth" | "RenderOnDay" | "disabledDate" | "labelRange"> & Partial<{
40
36
  locale: import("the-mask-input").Locales;
41
37
  markRange: boolean;
42
38
  markToday: boolean;
43
39
  rangeMode: boolean;
44
- changeOnlyOnClick: boolean;
45
- onChangeMonth: (d: Date) => void;
46
- onChangeYear: (d: Date) => void;
47
- RenderOnDay: React.FC<{
48
- date: Date;
49
- }>;
50
- disabledDate: (date: Date) => boolean;
51
40
  styles: Partial<{
52
41
  day: string;
53
42
  week: string;
@@ -55,6 +44,17 @@ export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<Inpu
55
44
  dayFrame: string;
56
45
  calendar: string;
57
46
  }>;
47
+ changeOnlyOnClick: boolean;
48
+ onChangeYear: (d: Date) => void;
49
+ onChangeMonth: (d: Date) => void;
50
+ RenderOnDay: React.FC<{
51
+ date: Date;
52
+ }>;
53
+ disabledDate: (date: Date) => boolean;
54
+ labelRange: {
55
+ to: string;
56
+ from: string;
57
+ };
58
58
  } & {
59
59
  date: Date;
60
60
  onChange: (d: Date | undefined) => void;
@@ -4,7 +4,7 @@ import { InputFieldProps } from "./input-field";
4
4
  export type OptionProps = Override<React.ComponentProps<"option">, {
5
5
  value: string;
6
6
  "data-dynamic"?: string;
7
- }>;
7
+ } & Partial<Record<`data-${string}`, string>>>;
8
8
  export type SelectProps = Override<InputFieldProps<"select">, {
9
9
  options: OptionProps[];
10
10
  selectContainer?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/form/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAGlF,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE5D,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,cAAc,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAE/G,MAAM,MAAM,WAAW,GAAG,QAAQ,CAC9B,eAAe,CAAC,QAAQ,CAAC,EACzB;IACI,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B,CACJ,CAAC;AAEF,eAAO,MAAM,MAAM,oGA8FlB,CAAC"}
1
+ {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/form/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAGlF,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE5D,MAAM,MAAM,WAAW,GAAG,QAAQ,CAC9B,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAC9B;IACI,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;CAC3B,GAAG,OAAO,CAAC,MAAM,CAAC,QAAQ,MAAM,EAAE,EAAE,MAAM,CAAC,CAAC,CAChD,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,QAAQ,CAC9B,eAAe,CAAC,QAAQ,CAAC,EACzB;IACI,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B,CACJ,CAAC;AAEF,eAAO,MAAM,MAAM,oGA8FlB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../../src/components/form/textarea.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAkB,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5D,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;AAE1D,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAW5C,CAAC"}
1
+ {"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../../src/components/form/textarea.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAkB,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5D,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;AAE1D,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAY5C,CAAC"}
@@ -2,8 +2,10 @@
2
2
  import { createFreeText } from "./free-text";
3
3
  export const Textarea = createFreeText("textarea", { container: "w-full" }, (textarea) => {
4
4
  const adjustHeight = () => {
5
+ const lineBreakers = textarea.value.split("\n");
5
6
  textarea.style.height = "auto";
6
- textarea.style.height = `${textarea.scrollHeight}px`;
7
+ if (lineBreakers.length > 1)
8
+ return void (textarea.style.height = `${textarea.scrollHeight}px`);
7
9
  };
8
10
  textarea.addEventListener("input", adjustHeight);
9
11
  return () => textarea.removeEventListener("input", adjustHeight);
@@ -7,6 +7,7 @@ type Operators = {
7
7
  value: string;
8
8
  label: string;
9
9
  symbol: string;
10
+ "data-default"?: string;
10
11
  };
11
12
  type OperatorTypes = "contains" | "is" | "isNot" | "notContains" | "lessThan" | "greaterThan" | "startsWith" | "endsWith";
12
13
  type Operations = Record<OperatorTypes, Operators>;
@@ -27,7 +28,7 @@ type Props<T extends {}> = TableConfiguration<T, {
27
28
  }>;
28
29
  export declare const createFilterFromCol: <T extends {}>(f: Col<T>, options: OperationOptions, operations: Operations, rest?: Partial<FilterConfig<T>>) => FilterConfig<T>;
29
30
  export declare const useOperators: () => {
30
- operationOptions: Partial<Record<ColType, OptionProps[]>>;
31
+ options: Partial<Record<ColType, OptionProps[]>>;
31
32
  operations: Operations;
32
33
  };
33
34
  export declare const Filter: <T extends {}>(props: Props<T>) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- {"version":3,"file":"filter.d.ts","sourceRoot":"","sources":["../../../../src/components/table/filter.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGpC,OAAO,EAAE,WAAW,EAAU,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,GAAG,EAAE,OAAO,EAAY,kBAAkB,EAAiB,MAAM,aAAa,CAAC;AAGxF,KAAK,SAAS,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAA;AAEjE,KAAK,aAAa,GAAG,UAAU,GAAG,IAAI,GAAG,OAAO,GAAG,aAAa,GAAG,UAAU,GAAG,aAAa,GAAG,YAAY,GAAG,UAAU,CAAA;AAEzH,KAAK,UAAU,GAAG,MAAM,CAAC,aAAa,EAAE,SAAS,CAAC,CAAA;AAElD,KAAK,gBAAgB,GAAG,OAAO,CAAC,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,CAAC,CAAC,CAAA;AAE/D,KAAK,WAAW,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG,OAAO,CAAC;AAExD,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,EAAE,GAAG,EAAE,IAAI;IAC1C,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;IAClB,IAAI,EAAE,OAAO,CAAC;IACd,SAAS,EAAE,SAAS,CAAC;IACrB,KAAK,EAAE,WAAW,CAAC;CACtB,CAAC;AAEF,KAAK,KAAK,CAAC,CAAC,SAAS,EAAE,IAAI,kBAAkB,CACzC,CAAC,EACD;IACI,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;IACf,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3B,GAAG,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;CAChE,CACJ,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,CAAC,SAAS,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC,WAAW,gBAAgB,cAAc,UAAU,SAAQ,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,KAAQ,YAAY,CAAC,CAAC,CAMnK,CAAC;AAEF,eAAO,MAAM,YAAY;;;CAwBxB,CAAA;AAED,eAAO,MAAM,MAAM,GAAI,CAAC,SAAS,EAAE,SAAS,KAAK,CAAC,CAAC,CAAC,4CAiGnD,CAAC;AAEF,KAAK,uBAAuB,CAAC,CAAC,SAAS,EAAE,IAAI;IACzC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC3D,GAAG,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;CAChE,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,CAAC,SAAS,EAAE,6BAA6B,uBAAuB,CAAC,CAAC,CAAC,4CAsCrG,CAAC"}
1
+ {"version":3,"file":"filter.d.ts","sourceRoot":"","sources":["../../../../src/components/table/filter.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGpC,OAAO,EAAE,WAAW,EAAU,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,GAAG,EAAE,OAAO,EAAY,kBAAkB,EAAiB,MAAM,aAAa,CAAC;AAGxF,KAAK,SAAS,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,cAAc,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAE3F,KAAK,aAAa,GAAG,UAAU,GAAG,IAAI,GAAG,OAAO,GAAG,aAAa,GAAG,UAAU,GAAG,aAAa,GAAG,YAAY,GAAG,UAAU,CAAC;AAE1H,KAAK,UAAU,GAAG,MAAM,CAAC,aAAa,EAAE,SAAS,CAAC,CAAC;AAEnD,KAAK,gBAAgB,GAAG,OAAO,CAAC,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC;AAEhE,KAAK,WAAW,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG,OAAO,CAAC;AAExD,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,EAAE,GAAG,EAAE,IAAI;IAC1C,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;IAClB,IAAI,EAAE,OAAO,CAAC;IACd,SAAS,EAAE,SAAS,CAAC;IACrB,KAAK,EAAE,WAAW,CAAC;CACtB,CAAC;AAEF,KAAK,KAAK,CAAC,CAAC,SAAS,EAAE,IAAI,kBAAkB,CACzC,CAAC,EACD;IACI,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;IACf,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3B,GAAG,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;CAChE,CACJ,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,CAAC,SAAS,EAAE,KACzC,GAAG,CAAC,CAAC,CAAC,WACA,gBAAgB,cACb,UAAU,SAChB,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,KAC/B,YAAY,CAAC,CAAC,CAOhB,CAAC;AAEF,eAAO,MAAM,YAAY;;;CA0CxB,CAAC;AAEF,eAAO,MAAM,MAAM,GAAI,CAAC,SAAS,EAAE,SAAS,KAAK,CAAC,CAAC,CAAC,4CA0GnD,CAAC;AAEF,KAAK,uBAAuB,CAAC,CAAC,SAAS,EAAE,IAAI;IACzC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC3D,GAAG,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;CAChE,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,CAAC,SAAS,EAAE,6BAA6B,uBAAuB,CAAC,CAAC,CAAC,4CAgDrG,CAAC"}
@@ -10,39 +10,52 @@ import { useTranslations } from "../../hooks/use-components-provider";
10
10
  export const createFilterFromCol = (f, options, operations, rest = {}) => {
11
11
  const name = f.id;
12
12
  const type = f.type ?? ColType.Text;
13
- const operatorId = options[type]?.[0].value;
13
+ const typeOptions = options[type] ?? [];
14
+ const operatorId = typeOptions.find((x) => x["data-default"])?.value ?? typeOptions[0]?.value;
14
15
  const operation = operations[operatorId];
15
16
  return { id: uuid(), operation, label: getLabel(f), name, type, value: "", ...rest };
16
17
  };
17
18
  export const useOperators = () => {
18
19
  const translation = useTranslations();
19
- const operations = useMemo(() => {
20
- return {
21
- contains: { value: "contains", label: translation.tableFilterTypeContains, symbol: "includes" },
22
- is: { value: "is", label: translation.tableFilterTypeIs, symbol: "is" },
23
- isNot: { value: "isNot", label: translation.tableFilterTypeIsNot, symbol: "!==" },
24
- notContains: { value: "notContains", label: translation.tableFilterTypeNotContains, symbol: "notIncludes" },
25
- lessThan: { value: "lessThan", label: translation.tableFilterTypeLessThan, symbol: "<=" },
26
- greaterThan: { value: "greaterThan", label: translation.tableFilterTypeGreaterThan, symbol: ">=" },
27
- startsWith: { value: "startsWith", label: translation.tableFilterTypeStartsWith, symbol: "startsWith" },
28
- endsWith: { value: "endsWith", label: translation.tableFilterTypeEndsWith, symbol: "endsWith" },
29
- };
30
- }, [translation]);
31
- const operationOptions = useMemo(() => {
32
- return {
33
- [ColType.Text]: [operations.is, operations.isNot, operations.contains, operations.notContains, operations.startsWith, operations.endsWith],
34
- [ColType.Boolean]: [operations.is, operations.isNot],
35
- [ColType.Number]: [operations.is, operations.isNot, operations.greaterThan, operations.lessThan],
36
- };
37
- }, [translation]);
38
- return { operationOptions, operations };
20
+ const operations = useMemo(() => ({
21
+ contains: {
22
+ value: "contains",
23
+ label: translation.tableFilterTypeContains,
24
+ symbol: "includes",
25
+ "data-default": "true",
26
+ },
27
+ is: { value: "is", label: translation.tableFilterTypeIs, symbol: "is" },
28
+ isNot: { value: "isNot", label: translation.tableFilterTypeIsNot, symbol: "!==" },
29
+ notContains: {
30
+ value: "notContains",
31
+ label: translation.tableFilterTypeNotContains,
32
+ symbol: "notIncludes",
33
+ },
34
+ lessThan: { value: "lessThan", label: translation.tableFilterTypeLessThan, symbol: "<=" },
35
+ greaterThan: { value: "greaterThan", label: translation.tableFilterTypeGreaterThan, symbol: ">=" },
36
+ startsWith: { value: "startsWith", label: translation.tableFilterTypeStartsWith, symbol: "startsWith" },
37
+ endsWith: { value: "endsWith", label: translation.tableFilterTypeEndsWith, symbol: "endsWith" },
38
+ }), [translation]);
39
+ const options = useMemo(() => ({
40
+ [ColType.Text]: [
41
+ operations.is,
42
+ operations.isNot,
43
+ operations.contains,
44
+ operations.notContains,
45
+ operations.startsWith,
46
+ operations.endsWith,
47
+ ],
48
+ [ColType.Boolean]: [operations.is, operations.isNot],
49
+ [ColType.Number]: [operations.is, operations.isNot, operations.greaterThan, operations.lessThan],
50
+ }), [translation]);
51
+ return { options, operations };
39
52
  };
40
53
  export const Filter = (props) => {
41
54
  const translation = useTranslations();
42
- const { operationOptions, operations } = useOperators();
55
+ const operators = useOperators();
43
56
  const onAddFilter = () => {
44
57
  const col = props.cols.at(0);
45
- props.set((prev) => [...prev, createFilterFromCol(col, operationOptions, operations)]);
58
+ props.set((prev) => [...prev, createFilterFromCol(col, operators.options, operators.operations)]);
46
59
  };
47
60
  const onSelectProperty = (e) => {
48
61
  const changedId = e.target.dataset.id || "";
@@ -51,13 +64,18 @@ export const Filter = (props) => {
51
64
  if (changedId !== x.id)
52
65
  return x;
53
66
  const col = props.cols.find((x) => newId === x.id);
54
- return createFilterFromCol(col, operationOptions, operations, { value: "" });
67
+ return createFilterFromCol(col, operators.options, operators.operations, { value: "" });
55
68
  }));
56
69
  };
57
70
  const onSelectOperation = (e) => {
58
71
  const id = e.target.dataset.id || "";
59
72
  const operator = e.target.value;
60
- props.set((prev) => prev.map((x) => (x.id === id ? { ...x, operation: operations[operator] } : x)));
73
+ props.set((prev) => prev.map((x) => x.id === id
74
+ ? {
75
+ ...x,
76
+ operation: operators.operations[operator],
77
+ }
78
+ : x));
61
79
  };
62
80
  const onDelete = (e) => {
63
81
  const id = e.currentTarget.dataset.id || "";
@@ -69,22 +87,27 @@ export const Filter = (props) => {
69
87
  props.set((prev) => prev.map((x) => (x.id === id ? { ...x, value } : x)));
70
88
  };
71
89
  return (_jsx(Fragment, { children: _jsx(Dropdown, { arrow: true, title: translation.tableFilterDropdownTitle, trigger: _jsxs("span", { className: "flex items-center gap-1 proportional-nums", children: [_jsx(ListFilterIcon, { size: 14 }), translation.tableFilterLabel, " ", props.filters.length === 0 ? "" : ` (${props.filters.length})`] }), children: _jsxs("ul", { className: "mt-4 space-y-2", children: [props.filters.map((filter) => {
72
- const operators = operationOptions[filter.type];
73
- return (_jsxs("li", { className: "flex flex-nowrap gap-3", children: [_jsx(Select, { options: props.options, title: translation.tableFilterColumnTitle, placeholder: translation.tableFilterColumnPlaceholder, value: filter.name, "data-id": filter.id, onChange: onSelectProperty }), _jsx(Select, { "data-id": filter.id, onChange: onSelectOperation, value: filter.operation.value, options: operators, title: translation.tableFilterOperatorTitle, placeholder: translation.tableFilterOperatorPlaceholder }), _jsx(Input, { "data-id": filter.id, onChange: onChangeValue, title: translation.tableFilterValueTitle, placeholder: translation.tableFilterValuePlaceholder, type: filter.type, value: filter.value, optionalText: "" }), _jsx("div", { className: "flex items-center justify-center mt-5", children: _jsx("button", { "data-id": filter.id, type: "button", onClick: onDelete, children: _jsx(Trash2Icon, { className: "text-danger", size: 16 }) }) })] }, `filter-select-${filter.id}`));
74
- }), _jsx("li", { children: _jsxs("button", { type: "button", onClick: onAddFilter, className: "text-primary flex items-center gap-1", children: [_jsx(PlusIcon, { size: 14 }), " ", translation.tableFilterNewFilter] }) })] }) }) }));
90
+ const options = operators.options[filter.type];
91
+ return (_jsxs("li", { className: "flex flex-nowrap gap-3", children: [_jsx(Select, { options: props.options, title: translation.tableFilterColumnTitle, placeholder: translation.tableFilterColumnPlaceholder, value: filter.name, "data-id": filter.id, onChange: onSelectProperty }), _jsx(Select, { "data-id": filter.id, onChange: onSelectOperation, value: filter.operation.value, options: options, title: translation.tableFilterOperatorTitle, placeholder: translation.tableFilterOperatorPlaceholder }), _jsx(Input, { "data-id": filter.id, onChange: onChangeValue, title: translation.tableFilterValueTitle, placeholder: translation.tableFilterValuePlaceholder, type: filter.type, value: filter.value, optionalText: "" }), _jsx("div", { className: "mt-5 flex items-center justify-center", children: _jsx("button", { "data-id": filter.id, type: "button", onClick: onDelete, children: _jsx(Trash2Icon, { className: "text-danger", size: 16 }) }) })] }, `filter-select-${filter.id}`));
92
+ }), _jsx("li", { children: _jsxs("button", { type: "button", onClick: onAddFilter, className: "flex items-center gap-1 text-primary", children: [_jsx(PlusIcon, { size: 14 }), " ", translation.tableFilterNewFilter] }) })] }) }) }));
75
93
  };
76
94
  export const ColumnHeaderFilter = ({ filter, onDelete, set }) => {
77
95
  const translation = useTranslations();
78
- const { operationOptions, operations } = useOperators();
96
+ const operators = useOperators();
79
97
  const onSelectOperation = (e) => {
80
98
  const operator = e.target.value;
81
99
  const id = e.target.dataset.id || "";
82
- set((prev) => prev.map((x) => (x.id === id ? { ...x, operation: operations[operator] } : x)));
100
+ set((prev) => prev.map((x) => x.id === id
101
+ ? {
102
+ ...x,
103
+ operation: operators.operations[operator],
104
+ }
105
+ : x));
83
106
  };
84
107
  const onChangeValue = (e) => {
85
108
  const id = e.target.dataset.id || "";
86
109
  const value = valueFromType(e.target);
87
110
  set((prev) => prev.map((x) => (x.id === id ? { ...x, value } : x)));
88
111
  };
89
- return (_jsxs("div", { className: "flex flex-nowrap items-center gap-4 py-2", children: [_jsx(Select, { "data-id": filter.id, onChange: onSelectOperation, options: operationOptions[filter.type], title: translation.tableFilterColumnTitle, placeholder: translation.tableFilterColumnPlaceholder, value: filter.operation.value }), _jsx(Input, { "data-id": filter.id, onChange: onChangeValue, type: filter.type, value: filter.value, title: translation.tableFilterValueTitle, placeholder: translation.tableFilterValueTitle }), _jsx("button", { onClick: onDelete, "data-id": filter.id, type: "button", className: "mt-4", children: _jsx(Trash2Icon, { className: "text-danger", size: 14 }) })] }));
112
+ return (_jsxs("div", { className: "flex flex-nowrap items-center gap-4 py-2", children: [_jsx(Select, { "data-id": filter.id, onChange: onSelectOperation, value: filter.operation.value, options: operators.options[filter.type], title: translation.tableFilterColumnTitle, placeholder: translation.tableFilterColumnPlaceholder }), _jsx(Input, { "data-id": filter.id, onChange: onChangeValue, type: filter.type, value: filter.value, title: translation.tableFilterValueTitle, placeholder: translation.tableFilterValueTitle }), _jsx("button", { onClick: onDelete, "data-id": filter.id, type: "button", className: "mt-4", children: _jsx(Trash2Icon, { className: "text-danger", size: 14 }) })] }));
90
113
  };
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/table/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAA2B,cAAc,EAAoD,MAAM,OAAO,CAAC;AAMzH,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGpC,OAAO,EAAa,MAAM,EAAE,MAAM,QAAQ,CAAC;AAC3C,OAAO,EAAoB,GAAG,EAA+B,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAStG,KAAK,eAAe,CAAC,CAAC,SAAS,EAAE,IAAI,cAAc,CAAC,gBAAgB,CAAC,GACjE,mBAAmB,CAAC,CAAC,CAAC,GAAG;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC;IACxB,UAAU,EAAE,WAAW,EAAE,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5B,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAChE,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAgLN,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,aAAa,GAAG,QAAQ,CAAC,GAAG;IAC1G,IAAI,EAAE,MAAM,CAAC;CAChB,GAAG,OAAO,CACH,mBAAmB,CAAC,CAAC,CAAC,GAAG;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,OAAO,CAAC;CACvB,CACJ,CAAC;AASN,eAAO,MAAM,KAAK,GAAI,CAAC,SAAS,EAAE,SAAS,UAAU,CAAC,CAAC,CAAC,4CA6GvD,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/table/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAA2B,cAAc,EAAoD,MAAM,OAAO,CAAC;AAMzH,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGpC,OAAO,EAAa,MAAM,EAAE,MAAM,QAAQ,CAAC;AAC3C,OAAO,EAAoB,GAAG,EAA+B,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAStG,KAAK,eAAe,CAAC,CAAC,SAAS,EAAE,IAAI,cAAc,CAAC,gBAAgB,CAAC,GACjE,mBAAmB,CAAC,CAAC,CAAC,GAAG;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC;IACxB,UAAU,EAAE,WAAW,EAAE,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5B,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAChE,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AA8LN,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,aAAa,GAAG,QAAQ,CAAC,GAAG;IAC1G,IAAI,EAAE,MAAM,CAAC;CAChB,GAAG,OAAO,CACH,mBAAmB,CAAC,CAAC,CAAC,GAAG;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,OAAO,CAAC;CACvB,CACJ,CAAC;AASN,eAAO,MAAM,KAAK,GAAI,CAAC,SAAS,EAAE,SAAS,UAAU,CAAC,CAAC,CAAC,4CA6GvD,CAAC"}
@@ -1,6 +1,6 @@
1
1
  import { createElement as _createElement } from "react";
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { AnimatePresence, motion } from "framer-motion";
3
+ import { AnimatePresence } from "framer-motion";
4
4
  import Linq from "linq-arrays";
5
5
  import React, { createContext, Fragment, useContext, useEffect, useMemo, useRef, useState } from "react";
6
6
  import { TableVirtuoso } from "react-virtuoso";
@@ -15,13 +15,15 @@ import { createOptionCols } from "./table-lib";
15
15
  import { TableHeader } from "./thead";
16
16
  const TableContext = createContext({});
17
17
  const useTable = () => useContext(TableContext);
18
- const TableBody = React.forwardRef((props, ref) => (_jsx("tbody", { ...props, role: "rowgroup", className: `divide-y divide-table-border ${props.className ?? ""}`, ref: ref, children: _jsx(AnimatePresence, { children: props.children }) })));
19
- const VirtualTable = React.forwardRef((props, ref) => (_jsx("table", { ...props, ref: ref, role: "table", className: `table min-w-full table-auto divide-y divide-table-border text-left ${props.className ?? ""}` })));
18
+ const TableBody = React.forwardRef(({ context, className = "", ...props }, ref) => {
19
+ return (_jsx("tbody", { ...props, role: "rowgroup", className: `divide-y divide-table-border ${className}`, ref: ref, children: _jsx(AnimatePresence, { children: props.children }) }));
20
+ });
21
+ const VirtualTable = React.forwardRef(({ context, className = "", ...props }, ref) => (_jsx("table", { ...props, ref: ref, role: "table", className: `table min-w-full table-auto divide-y divide-table-border text-left ${className ?? ""}` })));
20
22
  const Thead = React.forwardRef(({ context, ...props }, ref) => {
21
23
  const ctx = useTable();
22
24
  const style = {
23
25
  ...props?.style,
24
- sticky: Is.number(ctx.sticky) ? `${ctx.sticky}px` : props?.style?.sticky,
26
+ top: Is.number(ctx.sticky) ? `${ctx.sticky}px` : undefined,
25
27
  };
26
28
  return _jsx("thead", { ...props, style: style, role: "rowgroup", className: "shadow-xs group:sticky top-0 bg-card-background", ref: ref });
27
29
  });
@@ -48,7 +50,7 @@ const ItemContent = (index, row, context) => {
48
50
  const value = path(row, col.id);
49
51
  const Component = col.Element;
50
52
  const className = col.cellProps?.className || "";
51
- return (_createElement("td", { ...col.cellProps, role: "cell", "data-matrix": matrix, key: `accessor-${index}-${colIndex}`, className: `hidden h-14 border-none px-2 first:table-cell md:table-cell ${className}` }, loading ? (_jsx("div", { className: "h-2 w-10/12 animate-pulse rounded bg-table-border" })) : Component ? (_jsx(Component, { row: row, matrix: matrix, col: col, rowIndex: index, value: value })) : (_jsx(Fragment, { children: Is.nil(value) ? "" : value }))));
53
+ return (_createElement("td", { ...col.cellProps, role: "cell", "data-matrix": matrix, key: `accessor-${index}-${colIndex}`, className: `hidden h-14 border-l border-table-border px-2 first:table-cell first:border-transparent md:table-cell ${className}` }, loading ? (_jsx("div", { className: "h-2 w-10/12 animate-pulse rounded bg-table-border" })) : Component ? (_jsx(Component, { row: row, matrix: matrix, col: col, rowIndex: index, value: value })) : (_jsx(Fragment, { children: Is.nil(value) ? "" : value }))));
52
54
  }) }));
53
55
  };
54
56
  const Frag = () => _jsx(Fragment, {});
@@ -87,7 +89,7 @@ const InnerTable = ({ filters, pagination = null, onScrollEnd, useControl = fals
87
89
  observer.observe(div);
88
90
  return () => observer.disconnect();
89
91
  }, []);
90
- return (_jsxs("div", { className: "min-w-full", children: [_jsxs("div", { className: `group rounded-lg px-1 ${border ? "border border-table-border" : ""}`, children: [_jsx(TableVirtuoso, { data: rows, useWindowScroll: true, components: components, totalCount: rows.length, itemContent: ItemContent, context: { loading: props.loading, loadingMore: props.loadingMore, cols: cols }, fixedFooterContent: showLoadingFooter ? Frag : null, fixedHeaderContent: () => (_jsx(TableHeader, { filters: filters, headers: cols, inlineFilter: props.inlineFilter, inlineSorter: props.inlineSorter, loading: !!props.loading, setCols: setCols, setFilters: setFilters, setSorters: setSorters, sorters: sorters })) }), _jsx("div", { "aria-hidden": "true", ref: ref, className: "h-0.5 w-full" })] }), pagination !== null ? _jsx(Pagination, { ...pagination }) : null] }));
92
+ return (_jsxs("div", { className: "min-w-full", children: [_jsxs("div", { className: `group rounded-lg px-1 ${border ? "border border-table-border" : ""}`, children: [_jsx(TableVirtuoso, { data: rows, useWindowScroll: true, followOutput: "smooth", components: components, totalCount: rows.length, itemContent: ItemContent, context: { loading: props.loading, loadingMore: props.loadingMore, cols: cols }, fixedFooterContent: showLoadingFooter ? Frag : null, fixedHeaderContent: () => (_jsx(TableHeader, { filters: filters, headers: cols, inlineFilter: props.inlineFilter, inlineSorter: props.inlineSorter, loading: !!props.loading, setCols: setCols, setFilters: setFilters, setSorters: setSorters, sorters: sorters })) }), _jsx("div", { "aria-hidden": "true", ref: ref, className: "h-0.5 w-full" })] }), pagination !== null ? _jsx(Pagination, { ...pagination }) : null] }));
91
93
  };
92
94
  const dispatcherFun = (prev, setter) => typeof setter === "function" ? setter(prev) : setter;
93
95
  const compareAndExec = (prev, state, exec) => (prev === state ? undefined : exec?.(state));
@@ -123,5 +125,5 @@ export const Table = (props) => {
123
125
  },
124
126
  ],
125
127
  });
126
- return (_jsx(TableContext.Provider, { value: contextState, children: _jsxs("div", { className: "relative min-w-full", children: [operations ? (_jsx(Metadata, { cols: state.cols, filters: state.filters, groups: state.groups, inlineFilter: props.inlineFilter ?? true, inlineSorter: props.inlineSorter ?? true, options: optionCols, pagination: props.pagination ?? null, rows: props.rows, setCols: dispatch.cols, setFilters: dispatch.filters, setGroups: dispatch.groups, setSorters: dispatch.sorters, sorters: state.sorters })) : null, state.groups.length === 0 ? (_jsx(InnerTable, { ...props, inlineFilter: props.inlineFilter ?? true, inlineSorter: props.inlineSorter ?? true, onScrollEnd: props.onScrollEnd, cols: state.cols, filters: state.filters, groups: state.groups, index: 0, optionCols: optionCols, options: optionCols, setCols: dispatch.cols, setFilters: dispatch.filters, setGroups: dispatch.groups, setSorters: dispatch.sorters, sorters: state.sorters, pagination: props.pagination ?? null })) : (_jsx("div", { className: "flex flex-wrap gap-4", children: state.groups.map((group, index) => (_jsx(motion.div, { className: "min-w-full", children: _jsx(InnerTable, { ...props, inlineFilter: props.inlineFilter ?? true, inlineSorter: props.inlineSorter ?? true, pagination: null, onScrollEnd: props.onScrollEnd, cols: state.cols, filters: state.filters, group: group, groups: state.groups, index: index, optionCols: optionCols, options: optionCols, rows: group.rows, setCols: dispatch.cols, setFilters: dispatch.filters, setGroups: dispatch.groups, setSorters: dispatch.sorters, sorters: state.sorters }) }, `group-${group.groupId}`))) }))] }) }));
128
+ return (_jsx(TableContext.Provider, { value: contextState, children: _jsxs("div", { className: "relative min-w-full", children: [operations ? (_jsx(Metadata, { cols: state.cols, rows: props.rows, options: optionCols, groups: state.groups, filters: state.filters, setCols: dispatch.cols, sorters: state.sorters, setGroups: dispatch.groups, setFilters: dispatch.filters, setSorters: dispatch.sorters, pagination: props.pagination ?? null, inlineFilter: props.inlineFilter ?? true, inlineSorter: props.inlineSorter ?? true })) : null, state.groups.length === 0 ? (_jsx(InnerTable, { ...props, index: 0, cols: state.cols, options: optionCols, groups: state.groups, filters: state.filters, optionCols: optionCols, setCols: dispatch.cols, sorters: state.sorters, setGroups: dispatch.groups, setFilters: dispatch.filters, setSorters: dispatch.sorters, onScrollEnd: props.onScrollEnd, pagination: props.pagination ?? null, inlineFilter: props.inlineFilter ?? true, inlineSorter: props.inlineSorter ?? true })) : (_jsx("div", { className: "flex flex-wrap gap-4", children: state.groups.map((group, index) => (_jsx("div", { className: "min-w-full", children: _jsx(InnerTable, { ...props, group: group, index: index, cols: state.cols, pagination: null, rows: group.rows, options: optionCols, groups: state.groups, filters: state.filters, optionCols: optionCols, setCols: dispatch.cols, sorters: state.sorters, setGroups: dispatch.groups, setFilters: dispatch.filters, setSorters: dispatch.sorters, onScrollEnd: props.onScrollEnd, inlineFilter: props.inlineFilter ?? true, inlineSorter: props.inlineSorter ?? true }) }, `group-${group.groupId}`))) }))] }) }));
127
129
  };