@gallop.software/studio 0.1.83 → 0.1.84

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-XV7HCEAF.mjs → StudioUI-EER6PAXH.mjs} +151 -74
  2. package/dist/StudioUI-EER6PAXH.mjs.map +1 -0
  3. package/dist/{StudioUI-MVIOZTZH.js → StudioUI-VNSW7JUI.js} +103 -26
  4. package/dist/StudioUI-VNSW7JUI.js.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-MVIOZTZH.js.map +0 -1
  9. package/dist/StudioUI-XV7HCEAF.mjs.map +0 -1
package/dist/{StudioUI-MVIOZTZH.js → StudioUI-VNSW7JUI.js} RENAMED
@@ -677,6 +677,12 @@ function StudioFolderPicker({ selectedItems, currentPath, onMove, onCancel }) {
677
677
  // src/components/R2SetupModal.tsx
678
678
 
679
679
 
680
+
681
+ var ENV_TEMPLATE = `CLOUDFLARE_R2_ACCOUNT_ID=your_account_id
682
+ CLOUDFLARE_R2_ACCESS_KEY_ID=your_access_key
683
+ CLOUDFLARE_R2_SECRET_ACCESS_KEY=your_secret_key
684
+ CLOUDFLARE_R2_BUCKET_NAME=your_bucket_name
685
+ CLOUDFLARE_R2_PUBLIC_URL=https://pub-xxx.r2.dev`;
680
686
  var styles3 = {
681
687
  overlay: _react3.css`
682
688
  position: fixed;
@@ -793,12 +799,16 @@ var styles3 = {
793
799
  text-decoration: underline;
794
800
  }
795
801
  `,
802
+ envVarsWrapper: _react3.css`
803
+ position: relative;
804
+ margin-top: 20px;
805
+ `,
796
806
  envVars: _react3.css`
797
807
  background: ${_chunkUFCWGUAGjs.colors.background};
798
808
  border: 1px solid ${_chunkUFCWGUAGjs.colors.border};
799
809
  border-radius: 8px;
800
810
  padding: 16px;
801
- margin-top: 20px;
811
+ padding-right: 48px;
802
812
  font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
803
813
  font-size: 13px;
804
814
  line-height: 1.8;
@@ -814,6 +824,57 @@ var styles3 = {
814
824
  envValue: _react3.css`
815
825
  color: ${_chunkUFCWGUAGjs.colors.textSecondary};
816
826
  `,
827
+ copyBtn: _react3.css`
828
+ position: absolute;
829
+ top: 8px;
830
+ right: 8px;
831
+ width: 32px;
832
+ height: 32px;
833
+ display: flex;
834
+ align-items: center;
835
+ justify-content: center;
836
+ background: ${_chunkUFCWGUAGjs.colors.surface};
837
+ border: 1px solid ${_chunkUFCWGUAGjs.colors.border};
838
+ border-radius: 6px;
839
+ cursor: pointer;
840
+ color: ${_chunkUFCWGUAGjs.colors.textMuted};
841
+ transition: all 0.15s ease;
842
+
843
+ &:hover {
844
+ background: ${_chunkUFCWGUAGjs.colors.surfaceHover};
845
+ color: ${_chunkUFCWGUAGjs.colors.text};
846
+ border-color: #d0d5dd;
847
+ }
848
+ `,
849
+ copyIcon: _react3.css`
850
+ width: 16px;
851
+ height: 16px;
852
+ `,
853
+ copiedTooltip: _react3.css`
854
+ position: absolute;
855
+ top: 50%;
856
+ right: 100%;
857
+ transform: translateY(-50%);
858
+ background: #1a1f36;
859
+ color: white;
860
+ padding: 4px 8px;
861
+ border-radius: 4px;
862
+ font-size: 12px;
863
+ white-space: nowrap;
864
+ margin-right: 6px;
865
+ pointer-events: none;
866
+
867
+ &::before {
868
+ content: '';
869
+ position: absolute;
870
+ right: -4px;
871
+ top: 50%;
872
+ transform: translateY(-50%);
873
+ border-left: 4px solid #1a1f36;
874
+ border-top: 4px solid transparent;
875
+ border-bottom: 4px solid transparent;
876
+ }
877
+ `,
817
878
  footer: _react3.css`
818
879
  padding: 16px 24px;
819
880
  border-top: 1px solid ${_chunkUFCWGUAGjs.colors.border};
@@ -862,6 +923,16 @@ var styles3 = {
862
923
  `
863
924
  };
864
925
  function R2SetupModal({ isOpen, onClose }) {
926
+ const [copied, setCopied] = _react.useState.call(void 0, false);
927
+ const handleCopy = async () => {
928
+ try {
929
+ await navigator.clipboard.writeText(ENV_TEMPLATE);
930
+ setCopied(true);
931
+ setTimeout(() => setCopied(false), 2e3);
932
+ } catch (error) {
933
+ console.error("Failed to copy:", error);
934
+ }
935
+ };
865
936
  if (!isOpen) return null;
866
937
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: styles3.overlay, onClick: onClose, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles3.modal, onClick: (e) => e.stopPropagation(), children: [
867
938
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles3.header, children: [
@@ -926,31 +997,37 @@ function R2SetupModal({ isOpen, onClose }) {
926
997
  ] })
927
998
  ] })
928
999
  ] }),
929
- /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles3.envVars, children: [
930
- /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
931
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_ACCOUNT_ID" }),
932
- "=",
933
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "your_account_id" })
934
- ] }),
935
- /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
936
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_ACCESS_KEY_ID" }),
937
- "=",
938
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "your_access_key" })
939
- ] }),
940
- /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
941
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_SECRET_ACCESS_KEY" }),
942
- "=",
943
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "your_secret_key" })
944
- ] }),
945
- /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
946
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_BUCKET_NAME" }),
947
- "=",
948
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "your_bucket_name" })
1000
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles3.envVarsWrapper, children: [
1001
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { css: styles3.envVars, children: [
1002
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
1003
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_ACCOUNT_ID" }),
1004
+ "=",
1005
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "your_account_id" })
1006
+ ] }),
1007
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
1008
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_ACCESS_KEY_ID" }),
1009
+ "=",
1010
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "your_access_key" })
1011
+ ] }),
1012
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
1013
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_SECRET_ACCESS_KEY" }),
1014
+ "=",
1015
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "your_secret_key" })
1016
+ ] }),
1017
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
1018
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_BUCKET_NAME" }),
1019
+ "=",
1020
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "your_bucket_name" })
1021
+ ] }),
1022
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
1023
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_PUBLIC_URL" }),
1024
+ "=",
1025
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "https://pub-xxx.r2.dev" })
1026
+ ] })
949
1027
  ] }),
950
- /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { css: styles3.envVar, children: [
951
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envKey, children: "CLOUDFLARE_R2_PUBLIC_URL" }),
952
- "=",
953
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.envValue, children: "https://pub-xxx.r2.dev" })
1028
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "button", { css: styles3.copyBtn, onClick: handleCopy, title: "Copy to clipboard", children: [
1029
+ copied && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { css: styles3.copiedTooltip, children: "Copied!" }),
1030
+ /* @__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: "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" }) })
954
1031
  ] })
955
1032
  ] })
956
1033
  ] }),
@@ -4442,4 +4519,4 @@ var StudioUI_default = StudioUI;
4442
4519
 
4443
4520
 
4444
4521
  exports.StudioUI = StudioUI; exports.default = StudioUI_default;
4445
- //# sourceMappingURL=StudioUI-MVIOZTZH.js.map
4522
+ //# sourceMappingURL=StudioUI-VNSW7JUI.js.map