@shoplflow/templates 0.1.51 → 0.1.53

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.cjs CHANGED
@@ -1599,13 +1599,16 @@ exports.Table = Object.assign(Table, {
1599
1599
  var AttachmentListContext = React6.createContext({});
1600
1600
  var AttachmentList = (_a) => {
1601
1601
  var _b = _a, {
1602
+ onClick,
1602
1603
  onDelete,
1603
1604
  children
1604
1605
  } = _b, rest = __objRest(_b, [
1606
+ "onClick",
1605
1607
  "onDelete",
1606
1608
  "children"
1607
1609
  ]);
1608
1610
  const contextValue = {
1611
+ onClick,
1609
1612
  onDelete
1610
1613
  };
1611
1614
  return /* @__PURE__ */ jsxRuntime.jsx(AttachmentListContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx(base.StackContainer.Horizontal, __spreadProps(__spreadValues({ spacing: "spacing08" }, rest), { children })) });
@@ -1618,7 +1621,7 @@ var StyledSeparator = styled2__default.default.div`
1618
1621
  border-radius: 0.5px;
1619
1622
  flex-shrink: 0;
1620
1623
  `;
1621
- var AttachmentItemSingle = ({ item, onDelete }) => {
1624
+ var AttachmentItemSingle = ({ item, onClick, onDelete }) => {
1622
1625
  const formatFileSize = (bytes) => {
1623
1626
  if (bytes === 0) {
1624
1627
  return "0 Bytes";
@@ -1629,21 +1632,27 @@ var AttachmentItemSingle = ({ item, onDelete }) => {
1629
1632
  return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
1630
1633
  };
1631
1634
  return /* @__PURE__ */ jsxRuntime.jsxs(base.StackContainer.Horizontal, { width: "inherit", align: "center", padding: "0", children: [
1632
- /* @__PURE__ */ jsxRuntime.jsxs(base.StackContainer.Horizontal, { align: "center", spacing: "spacing04", children: [
1633
- /* @__PURE__ */ jsxRuntime.jsx(base.Text, { typography: "body2_400", color: "neutral700", lineClamp: 1, textOverflow: "ellipsis", whiteSpace: "nowrap", children: item.name }),
1634
- item.extension && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1635
- /* @__PURE__ */ jsxRuntime.jsx(StyledSeparator, {}),
1636
- /* @__PURE__ */ jsxRuntime.jsx(base.Text, { typography: "body2_400", color: "neutral400", children: item.extension })
1637
- ] }),
1638
- item.size && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1639
- /* @__PURE__ */ jsxRuntime.jsx(StyledSeparator, {}),
1640
- /* @__PURE__ */ jsxRuntime.jsxs(base.Text, { typography: "body2_400", color: "neutral400", children: [
1641
- formatFileSize(item.size),
1642
- " adsfasdf"
1643
- ] })
1644
- ] })
1645
- ] }),
1646
- /* @__PURE__ */ jsxRuntime.jsx(base.IconButton, { sizeVar: "S", styleVar: "GHOST", children: /* @__PURE__ */ jsxRuntime.jsx(
1635
+ /* @__PURE__ */ jsxRuntime.jsxs(
1636
+ base.StackContainer.Horizontal,
1637
+ {
1638
+ align: "center",
1639
+ spacing: "spacing04",
1640
+ onClick,
1641
+ style: onClick ? { cursor: "pointer" } : void 0,
1642
+ children: [
1643
+ /* @__PURE__ */ jsxRuntime.jsx(base.Text, { typography: "body2_400", color: "neutral700", lineClamp: 1, textOverflow: "ellipsis", whiteSpace: "nowrap", children: item.name }),
1644
+ item.extension && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1645
+ /* @__PURE__ */ jsxRuntime.jsx(StyledSeparator, {}),
1646
+ /* @__PURE__ */ jsxRuntime.jsx(base.Text, { typography: "body2_400", color: "neutral400", children: item.extension })
1647
+ ] }),
1648
+ item.size && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1649
+ /* @__PURE__ */ jsxRuntime.jsx(StyledSeparator, {}),
1650
+ /* @__PURE__ */ jsxRuntime.jsx(base.Text, { typography: "body2_400", color: "neutral400", children: formatFileSize(item.size) })
1651
+ ] })
1652
+ ]
1653
+ }
1654
+ ),
1655
+ onDelete && /* @__PURE__ */ jsxRuntime.jsx(base.IconButton, { sizeVar: "S", styleVar: "GHOST", children: /* @__PURE__ */ jsxRuntime.jsx(
1647
1656
  base.Icon,
1648
1657
  {
1649
1658
  iconSource: shoplAssets.DeleteIcon,
@@ -1655,7 +1664,7 @@ var AttachmentItemSingle = ({ item, onDelete }) => {
1655
1664
  ] });
1656
1665
  };
1657
1666
  exports.AttachmentItemSingle = AttachmentItemSingle;
1658
- var AttachmentItemMulti = ({ item, children, thumbnail, onDelete }) => {
1667
+ var AttachmentItemMulti = ({ item, children, thumbnail, onClick, onDelete }) => {
1659
1668
  var _a;
1660
1669
  const formatFileSize = (bytes) => {
1661
1670
  if (bytes === 0) {
@@ -1675,19 +1684,21 @@ var AttachmentItemMulti = ({ item, children, thumbnail, onDelete }) => {
1675
1684
  padding: "8px",
1676
1685
  spacing: "spacing08",
1677
1686
  radius: "borderRadius08",
1687
+ onClick,
1678
1688
  onMouseEnter: (e) => {
1679
1689
  e.currentTarget.style.backgroundColor = "rgba(153, 153, 153, 0.05)";
1680
1690
  },
1681
1691
  onMouseLeave: (e) => {
1682
1692
  e.currentTarget.style.backgroundColor = "transparent";
1683
1693
  },
1694
+ style: onClick ? { cursor: "pointer" } : void 0,
1684
1695
  children: [
1685
1696
  thumbnail,
1686
1697
  /* @__PURE__ */ jsxRuntime.jsx(base.StackContainer.Vertical, { flex: "1", align: "flex-start", height: "100%", children: item ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1687
1698
  /* @__PURE__ */ jsxRuntime.jsx(base.Text, { typography: "body1_400", color: "neutral700", lineClamp: 1, textOverflow: "ellipsis", whiteSpace: "nowrap", children: item.name }),
1688
1699
  item.size && /* @__PURE__ */ jsxRuntime.jsx(base.Text, { typography: "caption_400", color: "neutral400", children: formatFileSize((_a = item.size) != null ? _a : 0) })
1689
1700
  ] }) : children }),
1690
- /* @__PURE__ */ jsxRuntime.jsx(base.IconButton, { sizeVar: "S", styleVar: "GHOST", children: /* @__PURE__ */ jsxRuntime.jsx(
1701
+ onDelete && /* @__PURE__ */ jsxRuntime.jsx(base.IconButton, { sizeVar: "S", styleVar: "GHOST", children: /* @__PURE__ */ jsxRuntime.jsx(
1691
1702
  base.Icon,
1692
1703
  {
1693
1704
  iconSource: shoplAssets.DeleteIcon,
package/dist/index.d.cts CHANGED
@@ -299,12 +299,14 @@ interface AttachmentItemData {
299
299
  size?: number;
300
300
  }
301
301
  interface AttachmentListProps {
302
+ onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
302
303
  onDelete?: (e: React.MouseEvent<HTMLButtonElement>) => void;
303
304
  disabled?: boolean;
304
305
  children: React.ReactNode;
305
306
  }
306
307
  interface AttachmentItemSingleProps {
307
308
  item: AttachmentItemData;
309
+ onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
308
310
  onDelete?: (e: React.MouseEvent<HTMLButtonElement>) => void;
309
311
  }
310
312
  interface AttachmentItemMultiProps {
@@ -312,6 +314,7 @@ interface AttachmentItemMultiProps {
312
314
  thumbnail?: React.ReactNode;
313
315
  children?: React.ReactNode;
314
316
  onDelete?: (e: React.MouseEvent<HTMLButtonElement>) => void;
317
+ onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
315
318
  }
316
319
  interface AttachmentThumbnailProps {
317
320
  iconSource?: IconSource;
package/dist/index.d.ts CHANGED
@@ -299,12 +299,14 @@ interface AttachmentItemData {
299
299
  size?: number;
300
300
  }
301
301
  interface AttachmentListProps {
302
+ onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
302
303
  onDelete?: (e: React.MouseEvent<HTMLButtonElement>) => void;
303
304
  disabled?: boolean;
304
305
  children: React.ReactNode;
305
306
  }
306
307
  interface AttachmentItemSingleProps {
307
308
  item: AttachmentItemData;
309
+ onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
308
310
  onDelete?: (e: React.MouseEvent<HTMLButtonElement>) => void;
309
311
  }
310
312
  interface AttachmentItemMultiProps {
@@ -312,6 +314,7 @@ interface AttachmentItemMultiProps {
312
314
  thumbnail?: React.ReactNode;
313
315
  children?: React.ReactNode;
314
316
  onDelete?: (e: React.MouseEvent<HTMLButtonElement>) => void;
317
+ onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
315
318
  }
316
319
  interface AttachmentThumbnailProps {
317
320
  iconSource?: IconSource;
package/dist/index.js CHANGED
@@ -1593,13 +1593,16 @@ var TableComponent = Object.assign(Table, {
1593
1593
  var AttachmentListContext = createContext({});
1594
1594
  var AttachmentList = (_a) => {
1595
1595
  var _b = _a, {
1596
+ onClick,
1596
1597
  onDelete,
1597
1598
  children
1598
1599
  } = _b, rest = __objRest(_b, [
1600
+ "onClick",
1599
1601
  "onDelete",
1600
1602
  "children"
1601
1603
  ]);
1602
1604
  const contextValue = {
1605
+ onClick,
1603
1606
  onDelete
1604
1607
  };
1605
1608
  return /* @__PURE__ */ jsx(AttachmentListContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(StackContainer.Horizontal, __spreadProps(__spreadValues({ spacing: "spacing08" }, rest), { children })) });
@@ -1612,7 +1615,7 @@ var StyledSeparator = styled2.div`
1612
1615
  border-radius: 0.5px;
1613
1616
  flex-shrink: 0;
1614
1617
  `;
1615
- var AttachmentItemSingle = ({ item, onDelete }) => {
1618
+ var AttachmentItemSingle = ({ item, onClick, onDelete }) => {
1616
1619
  const formatFileSize = (bytes) => {
1617
1620
  if (bytes === 0) {
1618
1621
  return "0 Bytes";
@@ -1623,21 +1626,27 @@ var AttachmentItemSingle = ({ item, onDelete }) => {
1623
1626
  return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
1624
1627
  };
1625
1628
  return /* @__PURE__ */ jsxs(StackContainer.Horizontal, { width: "inherit", align: "center", padding: "0", children: [
1626
- /* @__PURE__ */ jsxs(StackContainer.Horizontal, { align: "center", spacing: "spacing04", children: [
1627
- /* @__PURE__ */ jsx(Text, { typography: "body2_400", color: "neutral700", lineClamp: 1, textOverflow: "ellipsis", whiteSpace: "nowrap", children: item.name }),
1628
- item.extension && /* @__PURE__ */ jsxs(Fragment, { children: [
1629
- /* @__PURE__ */ jsx(StyledSeparator, {}),
1630
- /* @__PURE__ */ jsx(Text, { typography: "body2_400", color: "neutral400", children: item.extension })
1631
- ] }),
1632
- item.size && /* @__PURE__ */ jsxs(Fragment, { children: [
1633
- /* @__PURE__ */ jsx(StyledSeparator, {}),
1634
- /* @__PURE__ */ jsxs(Text, { typography: "body2_400", color: "neutral400", children: [
1635
- formatFileSize(item.size),
1636
- " adsfasdf"
1637
- ] })
1638
- ] })
1639
- ] }),
1640
- /* @__PURE__ */ jsx(IconButton, { sizeVar: "S", styleVar: "GHOST", children: /* @__PURE__ */ jsx(
1629
+ /* @__PURE__ */ jsxs(
1630
+ StackContainer.Horizontal,
1631
+ {
1632
+ align: "center",
1633
+ spacing: "spacing04",
1634
+ onClick,
1635
+ style: onClick ? { cursor: "pointer" } : void 0,
1636
+ children: [
1637
+ /* @__PURE__ */ jsx(Text, { typography: "body2_400", color: "neutral700", lineClamp: 1, textOverflow: "ellipsis", whiteSpace: "nowrap", children: item.name }),
1638
+ item.extension && /* @__PURE__ */ jsxs(Fragment, { children: [
1639
+ /* @__PURE__ */ jsx(StyledSeparator, {}),
1640
+ /* @__PURE__ */ jsx(Text, { typography: "body2_400", color: "neutral400", children: item.extension })
1641
+ ] }),
1642
+ item.size && /* @__PURE__ */ jsxs(Fragment, { children: [
1643
+ /* @__PURE__ */ jsx(StyledSeparator, {}),
1644
+ /* @__PURE__ */ jsx(Text, { typography: "body2_400", color: "neutral400", children: formatFileSize(item.size) })
1645
+ ] })
1646
+ ]
1647
+ }
1648
+ ),
1649
+ onDelete && /* @__PURE__ */ jsx(IconButton, { sizeVar: "S", styleVar: "GHOST", children: /* @__PURE__ */ jsx(
1641
1650
  Icon,
1642
1651
  {
1643
1652
  iconSource: DeleteIcon,
@@ -1649,7 +1658,7 @@ var AttachmentItemSingle = ({ item, onDelete }) => {
1649
1658
  ] });
1650
1659
  };
1651
1660
  var AttachmentItemSingle_default = AttachmentItemSingle;
1652
- var AttachmentItemMulti = ({ item, children, thumbnail, onDelete }) => {
1661
+ var AttachmentItemMulti = ({ item, children, thumbnail, onClick, onDelete }) => {
1653
1662
  var _a;
1654
1663
  const formatFileSize = (bytes) => {
1655
1664
  if (bytes === 0) {
@@ -1669,19 +1678,21 @@ var AttachmentItemMulti = ({ item, children, thumbnail, onDelete }) => {
1669
1678
  padding: "8px",
1670
1679
  spacing: "spacing08",
1671
1680
  radius: "borderRadius08",
1681
+ onClick,
1672
1682
  onMouseEnter: (e) => {
1673
1683
  e.currentTarget.style.backgroundColor = "rgba(153, 153, 153, 0.05)";
1674
1684
  },
1675
1685
  onMouseLeave: (e) => {
1676
1686
  e.currentTarget.style.backgroundColor = "transparent";
1677
1687
  },
1688
+ style: onClick ? { cursor: "pointer" } : void 0,
1678
1689
  children: [
1679
1690
  thumbnail,
1680
1691
  /* @__PURE__ */ jsx(StackContainer.Vertical, { flex: "1", align: "flex-start", height: "100%", children: item ? /* @__PURE__ */ jsxs(Fragment, { children: [
1681
1692
  /* @__PURE__ */ jsx(Text, { typography: "body1_400", color: "neutral700", lineClamp: 1, textOverflow: "ellipsis", whiteSpace: "nowrap", children: item.name }),
1682
1693
  item.size && /* @__PURE__ */ jsx(Text, { typography: "caption_400", color: "neutral400", children: formatFileSize((_a = item.size) != null ? _a : 0) })
1683
1694
  ] }) : children }),
1684
- /* @__PURE__ */ jsx(IconButton, { sizeVar: "S", styleVar: "GHOST", children: /* @__PURE__ */ jsx(
1695
+ onDelete && /* @__PURE__ */ jsx(IconButton, { sizeVar: "S", styleVar: "GHOST", children: /* @__PURE__ */ jsx(
1685
1696
  Icon,
1686
1697
  {
1687
1698
  iconSource: DeleteIcon,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@shoplflow/templates",
3
- "version": "0.1.51",
3
+ "version": "0.1.53",
4
4
  "type": "module",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/index.js",
@@ -93,8 +93,8 @@
93
93
  "simplebar-react": "^3.2.6",
94
94
  "@shoplflow/base": "^0.45.2",
95
95
  "@shoplflow/shopl-assets": "^0.12.27",
96
- "@shoplflow/hada-assets": "^0.1.8",
97
- "@shoplflow/utils": "^0.7.0"
96
+ "@shoplflow/utils": "^0.7.0",
97
+ "@shoplflow/hada-assets": "^0.1.8"
98
98
  },
99
99
  "scripts": {
100
100
  "type-check": "tsc --noEmit",