@clyrex-digital/clyrex-controls-dev 0.8.1-dev.20260827091356 → 0.8.1-dev.20260827101734

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 (5) hide show
  1. package/dist/index.d.mts +2 -0
  2. package/dist/index.d.ts +2 -0
  3. package/dist/index.js +125 -84
  4. package/dist/index.mjs +125 -84
  5. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -312,6 +312,8 @@ interface DataListConfiguration<T> {
312
312
  addLinkText?: string;
313
313
  recordValidityColumnName?: string;
314
314
  altLinkUrl?: string;
315
+ onQuickView?: (row: any) => void;
316
+ quickViewLabel?: string;
315
317
  }
316
318
  interface DataListColumn {
317
319
  label: string;
package/dist/index.d.ts CHANGED
@@ -312,6 +312,8 @@ interface DataListConfiguration<T> {
312
312
  addLinkText?: string;
313
313
  recordValidityColumnName?: string;
314
314
  altLinkUrl?: string;
315
+ onQuickView?: (row: any) => void;
316
+ quickViewLabel?: string;
315
317
  }
316
318
  interface DataListColumn {
317
319
  label: string;
package/dist/index.js CHANGED
@@ -8845,6 +8845,9 @@ var DataList = (props) => {
8845
8845
  console.log(props.addLinkText);
8846
8846
  const [isDataFound, setIsDataFound] = (0, import_react66.useState)(null);
8847
8847
  const [searchTerm, setSearchTerm] = (0, import_react66.useState)(props.query?.searchTerm ?? "");
8848
+ (0, import_react66.useEffect)(() => {
8849
+ setSearchTerm(props.query?.searchTerm ?? "");
8850
+ }, [props.query?.searchTerm]);
8848
8851
  (0, import_react66.useEffect)(() => {
8849
8852
  if (props?.dataset) {
8850
8853
  if (props?.dataset.result && props.dataset.result.length > 0) {
@@ -8926,16 +8929,19 @@ var DataList = (props) => {
8926
8929
  }
8927
8930
  const timeout = setTimeout(() => {
8928
8931
  const builder2 = new OdataBuilder(props.path);
8929
- builder2.setQuery({
8930
- ...props.query,
8931
- searchTerm,
8932
- searchCols: getSearchableColumns(),
8933
- $skip: "0"
8934
- });
8932
+ const newQuery = { ...props.query, $skip: "0" };
8933
+ if (searchTerm && searchTerm.trim() !== "") {
8934
+ newQuery.searchTerm = searchTerm.trim();
8935
+ newQuery.searchCols = getSearchableColumns();
8936
+ } else {
8937
+ delete newQuery.searchTerm;
8938
+ delete newQuery.searchCols;
8939
+ }
8940
+ builder2.setQuery(newQuery);
8935
8941
  router.push(builder2.getUrl());
8936
- }, 500);
8942
+ }, 400);
8937
8943
  return () => clearTimeout(timeout);
8938
- }, [searchTerm]);
8944
+ }, [searchTerm, props.query?.searchTerm]);
8939
8945
  builder = builder.setQuery(props.query);
8940
8946
  orderBy = builder.getOrderBy();
8941
8947
  activePageNumber = builder.getPageNumber(Constants.pagesize);
@@ -9163,89 +9169,124 @@ var DataList = (props) => {
9163
9169
  }
9164
9170
  ),
9165
9171
  /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { className: "flex-1 overflow-y-auto justify-end bg-white rounded shadow h-[calc(100vh-14rem)]", children: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("table", { className: "w-full divide-y divide-gray-200", children: [
9166
- /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("thead", { className: "bg-gray-50 sticky top-0", children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("tr", { children: props?.columns?.map((column) => {
9167
- let url = builder.getNewOrderByUrl(column.name);
9168
- let icon = "chevronUpDown";
9169
- if (orderBy.includes(`${column.name} desc`)) {
9170
- icon = "chevronDown";
9171
- url = builder.getNewOrderByUrl(column.name);
9172
- } else if (orderBy.includes(`${column.name}`)) {
9173
- icon = "chevronUp";
9174
- url = builder.getNewOrderByUrl(column.name + " desc");
9175
- }
9176
- return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9177
- "th",
9178
- {
9179
- className: "px-6 py-3 text-left font-medium bg-neutral-soft " + (column.enableSorting ? "cursor-pointer " : "") + column.width + (column.controlType == ViewControlTypes_default.money ? " text-right" : ""),
9180
- children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9181
- Hyperlink,
9182
- {
9183
- href: column.enableSorting ? url : void 0,
9184
- className: "!text-neutral-contrast ",
9185
- children: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("span", { className: "flex items-center space-x-1", children: [
9186
- /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("span", { className: "text-black", children: column.label }),
9187
- column.enableSorting && /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Icon_default, { className: "w-4 h-4", name: icon })
9188
- ] })
9189
- }
9190
- )
9191
- },
9192
- column.name
9193
- );
9194
- }) }) }),
9172
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("thead", { className: "bg-gray-50 sticky top-0", children: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("tr", { children: [
9173
+ props?.columns?.map((column) => {
9174
+ let url = builder.getNewOrderByUrl(column.name);
9175
+ let icon = "chevronUpDown";
9176
+ if (orderBy.includes(`${column.name} desc`)) {
9177
+ icon = "chevronDown";
9178
+ url = builder.getNewOrderByUrl(column.name);
9179
+ } else if (orderBy.includes(`${column.name}`)) {
9180
+ icon = "chevronUp";
9181
+ url = builder.getNewOrderByUrl(column.name + " desc");
9182
+ }
9183
+ return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9184
+ "th",
9185
+ {
9186
+ className: "px-6 py-3 text-left font-medium bg-neutral-soft " + (column.enableSorting ? "cursor-pointer " : "") + column.width + (column.controlType == ViewControlTypes_default.money ? " text-right" : ""),
9187
+ children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9188
+ Hyperlink,
9189
+ {
9190
+ href: column.enableSorting ? url : void 0,
9191
+ className: "!text-neutral-contrast ",
9192
+ children: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("span", { className: "flex items-center space-x-1", children: [
9193
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("span", { className: "text-black", children: column.label }),
9194
+ column.enableSorting && /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Icon_default, { className: "w-4 h-4", name: icon })
9195
+ ] })
9196
+ }
9197
+ )
9198
+ },
9199
+ column.name
9200
+ );
9201
+ }),
9202
+ props.onQuickView && /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("th", { className: "px-6 py-3 text-right font-medium bg-neutral-soft w-32 text-black", children: "Action" })
9203
+ ] }) }),
9195
9204
  /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("tbody", { className: "divide-y divide-gray-200 ", children: props.dataset?.result?.map((dataitem, index) => {
9196
9205
  let validityClass = "";
9197
9206
  if (props.recordValidityColumnName && getNestedProperty2(dataitem, props.recordValidityColumnName) == false) {
9198
9207
  validityClass = "bg-alert-200";
9199
9208
  }
9200
- return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("tr", { className: validityClass, children: props?.columns?.map((column, colindex) => {
9201
- return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(import_react66.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9202
- "td",
9209
+ return /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("tr", { className: validityClass, children: [
9210
+ props?.columns?.map((column, colindex) => {
9211
+ return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(import_react66.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9212
+ "td",
9213
+ {
9214
+ className: "px-6 py-2 whitespace-normal " + (column.controlType == ViewControlTypes_default.money ? "" : ""),
9215
+ children: column.addhref === true ? /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9216
+ Hyperlink,
9217
+ {
9218
+ className: "",
9219
+ href: `https://${dataitem[column.name]}`,
9220
+ children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9221
+ ViewControl_default,
9222
+ {
9223
+ controlType: column.controlType,
9224
+ value: getNestedProperty2(
9225
+ dataitem,
9226
+ column.name
9227
+ ),
9228
+ format: column.format,
9229
+ customProps: column.customProps
9230
+ }
9231
+ )
9232
+ }
9233
+ ) : column.showAsLink ? /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9234
+ Hyperlink,
9235
+ {
9236
+ href: props.path + dataitem[props.columns[0].name] + "/" + (dataitem.linkUrlSegment ?? column.linkUrlSegment),
9237
+ children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9238
+ ViewControl_default,
9239
+ {
9240
+ controlType: column.controlType,
9241
+ value: getNestedProperty2(dataitem, column.name) || column.emptyValueLabel,
9242
+ format: column.format,
9243
+ customProps: column.customProps
9244
+ }
9245
+ )
9246
+ }
9247
+ ) : /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9248
+ ViewControl_default,
9249
+ {
9250
+ controlType: column.controlType,
9251
+ value: getNestedProperty2(dataitem, column.name),
9252
+ format: column.format,
9253
+ customProps: column.customProps
9254
+ }
9255
+ )
9256
+ }
9257
+ ) }, colindex);
9258
+ }),
9259
+ props.onQuickView && /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("td", { className: "px-6 py-2 text-right whitespace-nowrap", children: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(
9260
+ "button",
9203
9261
  {
9204
- className: "px-6 py-2 whitespace-normal " + (column.controlType == ViewControlTypes_default.money ? "" : ""),
9205
- children: column.addhref === true ? /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9206
- Hyperlink,
9207
- {
9208
- className: "",
9209
- href: `https://${dataitem[column.name]}`,
9210
- children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9211
- ViewControl_default,
9212
- {
9213
- controlType: column.controlType,
9214
- value: getNestedProperty2(
9215
- dataitem,
9216
- column.name
9217
- ),
9218
- format: column.format,
9219
- customProps: column.customProps
9220
- }
9221
- )
9222
- }
9223
- ) : column.showAsLink ? /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9224
- Hyperlink,
9225
- {
9226
- href: props.path + dataitem[props.columns[0].name] + "/" + (dataitem.linkUrlSegment ?? column.linkUrlSegment),
9227
- children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9228
- ViewControl_default,
9229
- {
9230
- controlType: column.controlType,
9231
- value: getNestedProperty2(dataitem, column.name) || column.emptyValueLabel,
9232
- format: column.format,
9233
- customProps: column.customProps
9234
- }
9235
- )
9236
- }
9237
- ) : /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
9238
- ViewControl_default,
9239
- {
9240
- controlType: column.controlType,
9241
- value: getNestedProperty2(dataitem, column.name),
9242
- format: column.format,
9243
- customProps: column.customProps
9244
- }
9245
- )
9262
+ type: "button",
9263
+ onClick: (e) => {
9264
+ e.stopPropagation();
9265
+ props.onQuickView(dataitem);
9266
+ },
9267
+ className: "inline-flex items-center gap-1.5 px-3 py-1 text-xs font-semibold rounded-md border border-neutral-300 bg-white hover:bg-neutral-100 text-neutral-800 transition-colors shadow-xs",
9268
+ children: [
9269
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(
9270
+ "svg",
9271
+ {
9272
+ className: "w-3.5 h-3.5",
9273
+ fill: "none",
9274
+ viewBox: "0 0 24 24",
9275
+ stroke: "currentColor",
9276
+ strokeWidth: 2,
9277
+ strokeLinecap: "round",
9278
+ strokeLinejoin: "round",
9279
+ children: [
9280
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("path", { d: "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z" }),
9281
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("circle", { cx: "12", cy: "12", r: "3" })
9282
+ ]
9283
+ }
9284
+ ),
9285
+ /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("span", { children: props.quickViewLabel || "Quick View" })
9286
+ ]
9246
9287
  }
9247
- ) }, colindex);
9248
- }) }, index);
9288
+ ) })
9289
+ ] }, index);
9249
9290
  }) })
9250
9291
  ] }) }),
9251
9292
  /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { className: "pt-4 border-t border-t-gray-50 sticky bottom-0 h-11 mt-2 ", children: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("div", { className: "flex items-center justify-between", children: [
package/dist/index.mjs CHANGED
@@ -3732,6 +3732,9 @@ var DataList = (props) => {
3732
3732
  console.log(props.addLinkText);
3733
3733
  const [isDataFound, setIsDataFound] = useState2(null);
3734
3734
  const [searchTerm, setSearchTerm] = useState2(props.query?.searchTerm ?? "");
3735
+ useEffect3(() => {
3736
+ setSearchTerm(props.query?.searchTerm ?? "");
3737
+ }, [props.query?.searchTerm]);
3735
3738
  useEffect3(() => {
3736
3739
  if (props?.dataset) {
3737
3740
  if (props?.dataset.result && props.dataset.result.length > 0) {
@@ -3813,16 +3816,19 @@ var DataList = (props) => {
3813
3816
  }
3814
3817
  const timeout = setTimeout(() => {
3815
3818
  const builder2 = new OdataBuilder(props.path);
3816
- builder2.setQuery({
3817
- ...props.query,
3818
- searchTerm,
3819
- searchCols: getSearchableColumns(),
3820
- $skip: "0"
3821
- });
3819
+ const newQuery = { ...props.query, $skip: "0" };
3820
+ if (searchTerm && searchTerm.trim() !== "") {
3821
+ newQuery.searchTerm = searchTerm.trim();
3822
+ newQuery.searchCols = getSearchableColumns();
3823
+ } else {
3824
+ delete newQuery.searchTerm;
3825
+ delete newQuery.searchCols;
3826
+ }
3827
+ builder2.setQuery(newQuery);
3822
3828
  router.push(builder2.getUrl());
3823
- }, 500);
3829
+ }, 400);
3824
3830
  return () => clearTimeout(timeout);
3825
- }, [searchTerm]);
3831
+ }, [searchTerm, props.query?.searchTerm]);
3826
3832
  builder = builder.setQuery(props.query);
3827
3833
  orderBy = builder.getOrderBy();
3828
3834
  activePageNumber = builder.getPageNumber(Constants.pagesize);
@@ -4050,89 +4056,124 @@ var DataList = (props) => {
4050
4056
  }
4051
4057
  ),
4052
4058
  /* @__PURE__ */ jsx47("div", { className: "flex-1 overflow-y-auto justify-end bg-white rounded shadow h-[calc(100vh-14rem)]", children: /* @__PURE__ */ jsxs20("table", { className: "w-full divide-y divide-gray-200", children: [
4053
- /* @__PURE__ */ jsx47("thead", { className: "bg-gray-50 sticky top-0", children: /* @__PURE__ */ jsx47("tr", { children: props?.columns?.map((column) => {
4054
- let url = builder.getNewOrderByUrl(column.name);
4055
- let icon = "chevronUpDown";
4056
- if (orderBy.includes(`${column.name} desc`)) {
4057
- icon = "chevronDown";
4058
- url = builder.getNewOrderByUrl(column.name);
4059
- } else if (orderBy.includes(`${column.name}`)) {
4060
- icon = "chevronUp";
4061
- url = builder.getNewOrderByUrl(column.name + " desc");
4062
- }
4063
- return /* @__PURE__ */ jsx47(
4064
- "th",
4065
- {
4066
- className: "px-6 py-3 text-left font-medium bg-neutral-soft " + (column.enableSorting ? "cursor-pointer " : "") + column.width + (column.controlType == ViewControlTypes_default.money ? " text-right" : ""),
4067
- children: /* @__PURE__ */ jsx47(
4068
- Hyperlink,
4069
- {
4070
- href: column.enableSorting ? url : void 0,
4071
- className: "!text-neutral-contrast ",
4072
- children: /* @__PURE__ */ jsxs20("span", { className: "flex items-center space-x-1", children: [
4073
- /* @__PURE__ */ jsx47("span", { className: "text-black", children: column.label }),
4074
- column.enableSorting && /* @__PURE__ */ jsx47(Icon_default, { className: "w-4 h-4", name: icon })
4075
- ] })
4076
- }
4077
- )
4078
- },
4079
- column.name
4080
- );
4081
- }) }) }),
4059
+ /* @__PURE__ */ jsx47("thead", { className: "bg-gray-50 sticky top-0", children: /* @__PURE__ */ jsxs20("tr", { children: [
4060
+ props?.columns?.map((column) => {
4061
+ let url = builder.getNewOrderByUrl(column.name);
4062
+ let icon = "chevronUpDown";
4063
+ if (orderBy.includes(`${column.name} desc`)) {
4064
+ icon = "chevronDown";
4065
+ url = builder.getNewOrderByUrl(column.name);
4066
+ } else if (orderBy.includes(`${column.name}`)) {
4067
+ icon = "chevronUp";
4068
+ url = builder.getNewOrderByUrl(column.name + " desc");
4069
+ }
4070
+ return /* @__PURE__ */ jsx47(
4071
+ "th",
4072
+ {
4073
+ className: "px-6 py-3 text-left font-medium bg-neutral-soft " + (column.enableSorting ? "cursor-pointer " : "") + column.width + (column.controlType == ViewControlTypes_default.money ? " text-right" : ""),
4074
+ children: /* @__PURE__ */ jsx47(
4075
+ Hyperlink,
4076
+ {
4077
+ href: column.enableSorting ? url : void 0,
4078
+ className: "!text-neutral-contrast ",
4079
+ children: /* @__PURE__ */ jsxs20("span", { className: "flex items-center space-x-1", children: [
4080
+ /* @__PURE__ */ jsx47("span", { className: "text-black", children: column.label }),
4081
+ column.enableSorting && /* @__PURE__ */ jsx47(Icon_default, { className: "w-4 h-4", name: icon })
4082
+ ] })
4083
+ }
4084
+ )
4085
+ },
4086
+ column.name
4087
+ );
4088
+ }),
4089
+ props.onQuickView && /* @__PURE__ */ jsx47("th", { className: "px-6 py-3 text-right font-medium bg-neutral-soft w-32 text-black", children: "Action" })
4090
+ ] }) }),
4082
4091
  /* @__PURE__ */ jsx47("tbody", { className: "divide-y divide-gray-200 ", children: props.dataset?.result?.map((dataitem, index) => {
4083
4092
  let validityClass = "";
4084
4093
  if (props.recordValidityColumnName && getNestedProperty2(dataitem, props.recordValidityColumnName) == false) {
4085
4094
  validityClass = "bg-alert-200";
4086
4095
  }
4087
- return /* @__PURE__ */ jsx47("tr", { className: validityClass, children: props?.columns?.map((column, colindex) => {
4088
- return /* @__PURE__ */ jsx47(React30.Fragment, { children: /* @__PURE__ */ jsx47(
4089
- "td",
4096
+ return /* @__PURE__ */ jsxs20("tr", { className: validityClass, children: [
4097
+ props?.columns?.map((column, colindex) => {
4098
+ return /* @__PURE__ */ jsx47(React30.Fragment, { children: /* @__PURE__ */ jsx47(
4099
+ "td",
4100
+ {
4101
+ className: "px-6 py-2 whitespace-normal " + (column.controlType == ViewControlTypes_default.money ? "" : ""),
4102
+ children: column.addhref === true ? /* @__PURE__ */ jsx47(
4103
+ Hyperlink,
4104
+ {
4105
+ className: "",
4106
+ href: `https://${dataitem[column.name]}`,
4107
+ children: /* @__PURE__ */ jsx47(
4108
+ ViewControl_default,
4109
+ {
4110
+ controlType: column.controlType,
4111
+ value: getNestedProperty2(
4112
+ dataitem,
4113
+ column.name
4114
+ ),
4115
+ format: column.format,
4116
+ customProps: column.customProps
4117
+ }
4118
+ )
4119
+ }
4120
+ ) : column.showAsLink ? /* @__PURE__ */ jsx47(
4121
+ Hyperlink,
4122
+ {
4123
+ href: props.path + dataitem[props.columns[0].name] + "/" + (dataitem.linkUrlSegment ?? column.linkUrlSegment),
4124
+ children: /* @__PURE__ */ jsx47(
4125
+ ViewControl_default,
4126
+ {
4127
+ controlType: column.controlType,
4128
+ value: getNestedProperty2(dataitem, column.name) || column.emptyValueLabel,
4129
+ format: column.format,
4130
+ customProps: column.customProps
4131
+ }
4132
+ )
4133
+ }
4134
+ ) : /* @__PURE__ */ jsx47(
4135
+ ViewControl_default,
4136
+ {
4137
+ controlType: column.controlType,
4138
+ value: getNestedProperty2(dataitem, column.name),
4139
+ format: column.format,
4140
+ customProps: column.customProps
4141
+ }
4142
+ )
4143
+ }
4144
+ ) }, colindex);
4145
+ }),
4146
+ props.onQuickView && /* @__PURE__ */ jsx47("td", { className: "px-6 py-2 text-right whitespace-nowrap", children: /* @__PURE__ */ jsxs20(
4147
+ "button",
4090
4148
  {
4091
- className: "px-6 py-2 whitespace-normal " + (column.controlType == ViewControlTypes_default.money ? "" : ""),
4092
- children: column.addhref === true ? /* @__PURE__ */ jsx47(
4093
- Hyperlink,
4094
- {
4095
- className: "",
4096
- href: `https://${dataitem[column.name]}`,
4097
- children: /* @__PURE__ */ jsx47(
4098
- ViewControl_default,
4099
- {
4100
- controlType: column.controlType,
4101
- value: getNestedProperty2(
4102
- dataitem,
4103
- column.name
4104
- ),
4105
- format: column.format,
4106
- customProps: column.customProps
4107
- }
4108
- )
4109
- }
4110
- ) : column.showAsLink ? /* @__PURE__ */ jsx47(
4111
- Hyperlink,
4112
- {
4113
- href: props.path + dataitem[props.columns[0].name] + "/" + (dataitem.linkUrlSegment ?? column.linkUrlSegment),
4114
- children: /* @__PURE__ */ jsx47(
4115
- ViewControl_default,
4116
- {
4117
- controlType: column.controlType,
4118
- value: getNestedProperty2(dataitem, column.name) || column.emptyValueLabel,
4119
- format: column.format,
4120
- customProps: column.customProps
4121
- }
4122
- )
4123
- }
4124
- ) : /* @__PURE__ */ jsx47(
4125
- ViewControl_default,
4126
- {
4127
- controlType: column.controlType,
4128
- value: getNestedProperty2(dataitem, column.name),
4129
- format: column.format,
4130
- customProps: column.customProps
4131
- }
4132
- )
4149
+ type: "button",
4150
+ onClick: (e) => {
4151
+ e.stopPropagation();
4152
+ props.onQuickView(dataitem);
4153
+ },
4154
+ className: "inline-flex items-center gap-1.5 px-3 py-1 text-xs font-semibold rounded-md border border-neutral-300 bg-white hover:bg-neutral-100 text-neutral-800 transition-colors shadow-xs",
4155
+ children: [
4156
+ /* @__PURE__ */ jsxs20(
4157
+ "svg",
4158
+ {
4159
+ className: "w-3.5 h-3.5",
4160
+ fill: "none",
4161
+ viewBox: "0 0 24 24",
4162
+ stroke: "currentColor",
4163
+ strokeWidth: 2,
4164
+ strokeLinecap: "round",
4165
+ strokeLinejoin: "round",
4166
+ children: [
4167
+ /* @__PURE__ */ jsx47("path", { d: "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z" }),
4168
+ /* @__PURE__ */ jsx47("circle", { cx: "12", cy: "12", r: "3" })
4169
+ ]
4170
+ }
4171
+ ),
4172
+ /* @__PURE__ */ jsx47("span", { children: props.quickViewLabel || "Quick View" })
4173
+ ]
4133
4174
  }
4134
- ) }, colindex);
4135
- }) }, index);
4175
+ ) })
4176
+ ] }, index);
4136
4177
  }) })
4137
4178
  ] }) }),
4138
4179
  /* @__PURE__ */ jsx47("div", { className: "pt-4 border-t border-t-gray-50 sticky bottom-0 h-11 mt-2 ", children: /* @__PURE__ */ jsxs20("div", { className: "flex items-center justify-between", children: [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@clyrex-digital/clyrex-controls-dev",
3
- "version": "0.8.1-dev.20260827091356",
3
+ "version": "0.8.1-dev.20260827101734",
4
4
  "description": "Reusable React components",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",