@gallop.software/studio 0.1.44 → 0.1.46

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 (9) hide show
  1. package/dist/{StudioUI-CTTMF6ET.js → StudioUI-5RTNU7LM.js} +122 -33
  2. package/dist/StudioUI-5RTNU7LM.js.map +1 -0
  3. package/dist/{StudioUI-FRELPTRA.mjs → StudioUI-GFSNJ4X2.mjs} +122 -33
  4. package/dist/StudioUI-GFSNJ4X2.mjs.map +1 -0
  5. package/dist/index.js +1 -1
  6. package/dist/index.mjs +1 -1
  7. package/package.json +1 -1
  8. package/dist/StudioUI-CTTMF6ET.js.map +0 -1
  9. package/dist/StudioUI-FRELPTRA.mjs.map +0 -1
package/dist/{StudioUI-CTTMF6ET.js → StudioUI-5RTNU7LM.js} RENAMED
@@ -1125,7 +1125,7 @@ var styles3 = {
1125
1125
  folderIcon: _react3.css`
1126
1126
  width: 56px;
1127
1127
  height: 56px;
1128
- color: #5469d4;
1128
+ color: #0a2540;
1129
1129
  `,
1130
1130
  imagesFolderIcon: _react3.css`
1131
1131
  width: 56px;
@@ -1232,8 +1232,28 @@ var styles3 = {
1232
1232
  width: 18px;
1233
1233
  height: 18px;
1234
1234
  `,
1235
- copyBtnFlash: _react3.css`
1236
- color: ${_chunkUFCWGUAGjs.colors.success};
1235
+ tooltip: _react3.css`
1236
+ position: absolute;
1237
+ top: 100%;
1238
+ right: 0;
1239
+ background: #1a1f36;
1240
+ color: white;
1241
+ padding: 4px 8px;
1242
+ border-radius: 4px;
1243
+ font-size: 12px;
1244
+ white-space: nowrap;
1245
+ margin-top: 6px;
1246
+ pointer-events: none;
1247
+ z-index: 100;
1248
+
1249
+ &::before {
1250
+ content: '';
1251
+ position: absolute;
1252
+ bottom: 100%;
1253
+ right: 8px;
1254
+ border: 4px solid transparent;
1255
+ border-bottom-color: #1a1f36;
1256
+ }
1237
1257
  `,
1238
1258
  openBtn: _react3.css`
1239
1259
  position: absolute;
@@ -1469,13 +1489,16 @@ function GridItem({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
1469
1489
  ),
1470
1490
  item.cdnSynced && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.cdnBadge, children: "CDN" }),
1471
1491
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles3.content, children: [
1472
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
1492
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
1473
1493
  "button",
1474
1494
  {
1475
- css: [styles3.copyBtn, showCopied && styles3.copyBtnFlash],
1495
+ css: styles3.copyBtn,
1476
1496
  onClick: handleCopyPath,
1477
1497
  title: "Copy file path",
1478
- children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles3.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) })
1498
+ children: [
1499
+ showCopied && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.tooltip, children: "Copied!" }),
1500
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles3.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) })
1501
+ ]
1479
1502
  }
1480
1503
  ),
1481
1504
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
@@ -1659,6 +1682,8 @@ var styles4 = {
1659
1682
  align-items: center;
1660
1683
  justify-content: flex-end;
1661
1684
  gap: 8px;
1685
+ margin-left: auto;
1686
+ flex-shrink: 0;
1662
1687
  `,
1663
1688
  copyBtn: _react3.css`
1664
1689
  flex-shrink: 0;
@@ -1682,19 +1707,40 @@ var styles4 = {
1682
1707
  color: ${_chunkUFCWGUAGjs.colors.text};
1683
1708
  }
1684
1709
  `,
1685
- copyBtnFlash: _react3.css`
1686
- background: ${_chunkUFCWGUAGjs.colors.successLight};
1687
- border-color: ${_chunkUFCWGUAGjs.colors.success};
1688
- color: ${_chunkUFCWGUAGjs.colors.success};
1689
- `,
1690
1710
  copyIcon: _react3.css`
1691
1711
  width: 16px;
1692
1712
  height: 16px;
1693
1713
  `,
1714
+ tooltip: _react3.css`
1715
+ position: absolute;
1716
+ bottom: 100%;
1717
+ left: 50%;
1718
+ transform: translateX(-50%);
1719
+ background: #1a1f36;
1720
+ color: white;
1721
+ padding: 4px 8px;
1722
+ border-radius: 4px;
1723
+ font-size: 12px;
1724
+ white-space: nowrap;
1725
+ margin-bottom: 6px;
1726
+ pointer-events: none;
1727
+ z-index: 100;
1728
+
1729
+ &::after {
1730
+ content: '';
1731
+ position: absolute;
1732
+ top: 100%;
1733
+ left: 50%;
1734
+ transform: translateX(-50%);
1735
+ border: 4px solid transparent;
1736
+ border-top-color: #1a1f36;
1737
+ }
1738
+ `,
1694
1739
  nameCell: _react3.css`
1695
1740
  display: flex;
1696
1741
  align-items: center;
1697
1742
  gap: 12px;
1743
+ flex: 1;
1698
1744
  `,
1699
1745
  thumbnailWrapper: _react3.css`
1700
1746
  width: 48px;
@@ -1715,7 +1761,7 @@ var styles4 = {
1715
1761
  folderIcon: _react3.css`
1716
1762
  width: 24px;
1717
1763
  height: 24px;
1718
- color: #5469d4;
1764
+ color: #0a2540;
1719
1765
  `,
1720
1766
  imagesFolderWrapper: _react3.css`
1721
1767
  width: 48px;
@@ -2005,13 +2051,16 @@ function ListRow({ item, isSelected, onClick, onOpen, onGenerateThumbnail }) {
2005
2051
  ) }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles4.thumbnailWrapper, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles4.fileIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z" }) }) }),
2006
2052
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles4.name, title: item.name, children: truncateMiddle2(item.name) }),
2007
2053
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles4.actionsCell, children: [
2008
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
2054
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
2009
2055
  "button",
2010
2056
  {
2011
- css: [styles4.copyBtn, showCopied && styles4.copyBtnFlash],
2057
+ css: styles4.copyBtn,
2012
2058
  onClick: handleCopyPath,
2013
2059
  title: "Copy file path",
2014
- children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles4.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) })
2060
+ children: [
2061
+ showCopied && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles4.tooltip, children: "Copied!" }),
2062
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles4.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) })
2063
+ ]
2015
2064
  }
2016
2065
  ),
2017
2066
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
@@ -2133,18 +2182,35 @@ var styles5 = {
2133
2182
  height: 20px;
2134
2183
  color: ${_chunkUFCWGUAGjs.colors.textSecondary};
2135
2184
  `,
2136
- copyBtnFlash: _react3.css`
2137
- background: ${_chunkUFCWGUAGjs.colors.successLight};
2138
- border-color: ${_chunkUFCWGUAGjs.colors.success};
2185
+ tooltip: _react3.css`
2186
+ position: absolute;
2187
+ right: 100%;
2188
+ top: 50%;
2189
+ transform: translateY(-50%);
2190
+ background: #1a1f36;
2191
+ color: white;
2192
+ padding: 4px 8px;
2193
+ border-radius: 4px;
2194
+ font-size: 12px;
2195
+ white-space: nowrap;
2196
+ margin-right: 8px;
2197
+ pointer-events: none;
2198
+ z-index: 100;
2139
2199
 
2140
- svg {
2141
- color: ${_chunkUFCWGUAGjs.colors.success};
2200
+ &::after {
2201
+ content: '';
2202
+ position: absolute;
2203
+ left: 100%;
2204
+ top: 50%;
2205
+ transform: translateY(-50%);
2206
+ border: 4px solid transparent;
2207
+ border-left-color: #1a1f36;
2142
2208
  }
2143
2209
  `,
2144
2210
  mainCloseBtn: _react3.css`
2145
2211
  padding: 8px;
2146
- background: ${_chunkUFCWGUAGjs.colors.danger};
2147
- border: 1px solid ${_chunkUFCWGUAGjs.colors.danger};
2212
+ background: ${_chunkUFCWGUAGjs.colors.surface};
2213
+ border: 1px solid ${_chunkUFCWGUAGjs.colors.border};
2148
2214
  border-radius: 8px;
2149
2215
  cursor: pointer;
2150
2216
  transition: all 0.15s ease;
@@ -2154,14 +2220,14 @@ var styles5 = {
2154
2220
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
2155
2221
 
2156
2222
  &:hover {
2157
- background-color: ${_chunkUFCWGUAGjs.colors.dangerHover};
2158
- border-color: ${_chunkUFCWGUAGjs.colors.dangerHover};
2223
+ background-color: ${_chunkUFCWGUAGjs.colors.surfaceHover};
2224
+ border-color: ${_chunkUFCWGUAGjs.colors.borderHover};
2159
2225
  }
2160
2226
  `,
2161
2227
  mainCloseIcon: _react3.css`
2162
2228
  width: 20px;
2163
2229
  height: 20px;
2164
- color: white;
2230
+ color: ${_chunkUFCWGUAGjs.colors.textSecondary};
2165
2231
  `,
2166
2232
  mediaWrapper: _react3.css`
2167
2233
  max-width: 100%;
@@ -2391,7 +2457,10 @@ function StudioDetailView() {
2391
2457
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles5.overlay, onClick: handleClose, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles5.container, onClick: (e) => e.stopPropagation(), children: [
2392
2458
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles5.main, children: [
2393
2459
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles5.headerButtons, children: [
2394
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { css: [styles5.copyBtn, showCopied && styles5.copyBtnFlash], onClick: handleCopyPath, title: "Copy file path", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles5.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) }) }),
2460
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "button", { css: styles5.copyBtn, onClick: handleCopyPath, title: "Copy file path", children: [
2461
+ showCopied && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles5.tooltip, children: "Copied!" }),
2462
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles5.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) })
2463
+ ] }),
2395
2464
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { css: styles5.mainCloseBtn, onClick: handleClose, "aria-label": "Close", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles5.mainCloseIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })
2396
2465
  ] }),
2397
2466
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles5.mediaWrapper, children: renderMedia() })
@@ -2584,12 +2653,29 @@ var styles6 = {
2584
2653
  border-color: ${_chunkUFCWGUAGjs.colors.borderHover};
2585
2654
  }
2586
2655
  `,
2587
- copyBtnFlash: _react3.css`
2588
- background: ${_chunkUFCWGUAGjs.colors.successLight};
2589
- border-color: ${_chunkUFCWGUAGjs.colors.success};
2656
+ tooltip: _react3.css`
2657
+ position: absolute;
2658
+ bottom: 100%;
2659
+ left: 50%;
2660
+ transform: translateX(-50%);
2661
+ background: #1a1f36;
2662
+ color: white;
2663
+ padding: 4px 8px;
2664
+ border-radius: 4px;
2665
+ font-size: 12px;
2666
+ white-space: nowrap;
2667
+ margin-bottom: 6px;
2668
+ pointer-events: none;
2669
+ z-index: 100;
2590
2670
 
2591
- svg {
2592
- color: ${_chunkUFCWGUAGjs.colors.success};
2671
+ &::after {
2672
+ content: '';
2673
+ position: absolute;
2674
+ top: 100%;
2675
+ left: 50%;
2676
+ transform: translateX(-50%);
2677
+ border: 4px solid transparent;
2678
+ border-top-color: #1a1f36;
2593
2679
  }
2594
2680
  `,
2595
2681
  copyIcon: _react3.css`
@@ -2722,7 +2808,10 @@ function SettingsPanel({ onClose }) {
2722
2808
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { css: styles6.sectionTitle, children: "Cloudflare R2" }),
2723
2809
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles6.description, children: "Configure in .env.local file:" }),
2724
2810
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles6.codeWrapper, children: [
2725
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "button", { css: [styles6.copyBtn, copied && styles6.copyBtnFlash], onClick: handleCopy, title: "Copy to clipboard", children: copied ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles6.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles6.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" }) }) }),
2811
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "button", { css: styles6.copyBtn, onClick: handleCopy, title: "Copy to clipboard", children: [
2812
+ copied && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles6.tooltip, children: "Copied!" }),
2813
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { css: styles6.copyIcon, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) })
2814
+ ] }),
2726
2815
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles6.code, children: [
2727
2816
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles6.codeLine, children: "CLOUDFLARE_R2_ACCOUNT_ID=abc123def456ghi789" }),
2728
2817
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { css: styles6.codeLine, children: "CLOUDFLARE_R2_ACCESS_KEY_ID=your_access_key_id_here" }),
@@ -3053,4 +3142,4 @@ var StudioUI_default = StudioUI;
3053
3142
 
3054
3143
 
3055
3144
  exports.StudioUI = StudioUI; exports.default = StudioUI_default;
3056
- //# sourceMappingURL=StudioUI-CTTMF6ET.js.map
3145
+ //# sourceMappingURL=StudioUI-5RTNU7LM.js.map