@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 +29 -18
- package/dist/index.d.cts +3 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +29 -18
- package/package.json +3 -3
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(
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
|
|
1643
|
-
|
|
1644
|
-
|
|
1645
|
-
|
|
1646
|
-
|
|
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(
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
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.
|
|
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/
|
|
97
|
-
"@shoplflow/
|
|
96
|
+
"@shoplflow/utils": "^0.7.0",
|
|
97
|
+
"@shoplflow/hada-assets": "^0.1.8"
|
|
98
98
|
},
|
|
99
99
|
"scripts": {
|
|
100
100
|
"type-check": "tsc --noEmit",
|