@vishu1301/script-writing 1.3.4 → 1.3.5

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 (7) hide show
  1. package/dist/index.cjs +458 -270
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +6 -3
  4. package/dist/index.d.ts +6 -3
  5. package/dist/index.js +459 -271
  6. package/dist/index.js.map +1 -1
  7. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -1838,8 +1838,13 @@ function ScriptBreakdownSceneView({
1838
1838
  aiSummarized = false,
1839
1839
  onUpdateBrief
1840
1840
  }) {
1841
- const [expanded, setExpanded] = react.useState(false);
1842
1841
  const [expandedCategories, setExpandedCategories] = react.useState({});
1842
+ const [editingTagData, setEditingTagData] = react.useState(null);
1843
+ const [tagForm, setTagForm] = react.useState({ quantity: 1, look: "", age: "" });
1844
+ const [popupPlacement, setPopupPlacement] = react.useState({
1845
+ alignRight: false,
1846
+ alignBottom: false
1847
+ });
1843
1848
  const [isSidebarOpen, setIsSidebarOpen] = react.useState(false);
1844
1849
  const COURIER_STACK = "'Courier Prime', 'Courier', monospace";
1845
1850
  react.useEffect(() => {
@@ -1930,284 +1935,438 @@ function ScriptBreakdownSceneView({
1930
1935
  }
1931
1936
  return nodes;
1932
1937
  };
1933
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative p-8 md:p-12 mx-auto w-full min-h-screen flex flex-col gap-8 xl:pr-[20rem]", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center max-w-6xl xl:max-w-full", children: [
1934
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 min-h-screen", children: [
1938
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative p-8 md:p-12 mx-auto w-full min-h-screen flex flex-col gap-8 xl:pr-[20rem]", children: [
1939
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center max-w-6xl xl:max-w-full", children: [
1940
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 min-h-screen", children: [
1941
+ /* @__PURE__ */ jsxRuntime.jsx(
1942
+ "div",
1943
+ {
1944
+ className: "relative bg-[#fdfdfc] shadow-md shadow-zinc-300/60 border border-zinc-100 rounded-sm md:rounded-md pl-[1.5in] py-[1in] pr-[1in] flex flex-col w-[210mm] min-h-auto shrink-0",
1945
+ style: {
1946
+ fontFamily: COURIER_STACK,
1947
+ paddingLeft: "1.5in",
1948
+ paddingRight: "1in",
1949
+ paddingTop: "1in",
1950
+ paddingBottom: "1in",
1951
+ lineHeight: "1.2"
1952
+ },
1953
+ "data-screenplay-editor": "true",
1954
+ onMouseUp: handleMouseUp,
1955
+ children: blocks.map((block) => /* @__PURE__ */ jsxRuntime.jsxs(
1956
+ "div",
1957
+ {
1958
+ "data-block-id": block.id,
1959
+ className: `relative break-words w-full px-4 py-2 ${blockStyles[block.type].className}`,
1960
+ style: __spreadProps(__spreadValues({}, blockStyles[block.type].inputStyle), {
1961
+ minHeight: "2.5rem"
1962
+ }),
1963
+ children: [
1964
+ renderBlockText(block),
1965
+ (selectionMenu == null ? void 0 : selectionMenu.blockId) === block.id && /* @__PURE__ */ jsxRuntime.jsxs(
1966
+ "div",
1967
+ {
1968
+ ref: menuRef,
1969
+ "data-screenplay-editor": "false",
1970
+ className: `tag-menu absolute z-50 bg-white/70 backdrop-blur-2xl shadow-[0_10px_40px_rgb(0,0,0,0.06)] border border-white rounded-[1.5rem] p-2 flex flex-col w-56 animate-in fade-in zoom-in-95 duration-300 ease-out ${menuPlacement === "top" ? "origin-bottom" : "origin-top"}`,
1971
+ style: {
1972
+ top: selectionMenu.top,
1973
+ left: selectionMenu.left,
1974
+ transform: menuPlacement === "top" ? "translate(-50%, calc(-100% - 12px))" : "translate(-50%, 32px)"
1975
+ },
1976
+ children: [
1977
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 px-3 py-2.5 border-b border-white/60 mb-1.5", children: [
1978
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[9px] font-extrabold tracking-[0.2em] text-slate-400 uppercase mb-1", children: "Tag Element" }),
1979
+ /* @__PURE__ */ jsxRuntime.jsxs(
1980
+ "p",
1981
+ {
1982
+ className: "text-xs font-bold text-slate-700 truncate drop-shadow-sm",
1983
+ title: selectionMenu.text,
1984
+ children: [
1985
+ '"',
1986
+ selectionMenu.text,
1987
+ '"'
1988
+ ]
1989
+ }
1990
+ )
1991
+ ] }),
1992
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex flex-col gap-1", children: [
1993
+ CATEGORIES.filter(
1994
+ (cat) => !(cat.id === "LOCATION" && hasLocationTag) && !(cat.id === "SUBLOCATION" && !hasLocationTag)
1995
+ ).map((cat) => /* @__PURE__ */ jsxRuntime.jsxs(
1996
+ "button",
1997
+ {
1998
+ onClick: () => {
1999
+ const existingTag = tags.find(
2000
+ (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2001
+ );
2002
+ if (existingTag && existingTag.id) {
2003
+ updateTag == null ? void 0 : updateTag(existingTag.id, cat.id);
2004
+ } else {
2005
+ addTag(cat.id);
2006
+ }
2007
+ },
2008
+ className: "group w-full text-[12px] font-bold px-3 py-2 rounded-xl transition-all duration-300 text-left flex items-center justify-between hover:bg-white/80 hover:shadow-[0_2px_10px_rgb(0,0,0,0.02)] active:scale-[0.98]",
2009
+ style: { color: cat.color },
2010
+ children: [
2011
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2012
+ /* @__PURE__ */ jsxRuntime.jsx(
2013
+ cat.icon,
2014
+ {
2015
+ className: "w-4 h-4 group-hover:scale-110 transition-transform duration-300",
2016
+ style: { color: cat.color }
2017
+ }
2018
+ ),
2019
+ cat.label
2020
+ ] }),
2021
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-slate-400 opacity-0 group-hover:opacity-100 transition-all duration-300 translate-x-1 group-hover:translate-x-0", children: "Select" })
2022
+ ]
2023
+ },
2024
+ cat.id
2025
+ )),
2026
+ tags.some(
2027
+ (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2028
+ ) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 pt-1 border-t border-white/60", children: /* @__PURE__ */ jsxRuntime.jsxs(
2029
+ "button",
2030
+ {
2031
+ onClick: (e) => {
2032
+ const tagToRemove = tags.find(
2033
+ (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2034
+ );
2035
+ if (tagToRemove) {
2036
+ removeTag(e, tagToRemove.id);
2037
+ clearSelection();
2038
+ }
2039
+ },
2040
+ className: "group w-full text-[12px] font-bold px-3 py-2 rounded-xl transition-all duration-300 text-left flex items-center justify-between hover:bg-rose-50 hover:text-rose-600 hover:shadow-[0_2px_10px_rgb(225,29,72,0.04)] active:scale-[0.98] text-slate-500 border border-transparent hover:border-rose-100",
2041
+ children: [
2042
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2043
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full shadow-sm bg-rose-400 group-hover:scale-125 transition-transform duration-300" }),
2044
+ "Remove Tag"
2045
+ ] }),
2046
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-rose-400 opacity-0 group-hover:opacity-100 transition-all duration-300 translate-x-1 group-hover:translate-x-0", children: "Remove" })
2047
+ ]
2048
+ }
2049
+ ) })
2050
+ ] })
2051
+ ]
2052
+ }
2053
+ )
2054
+ ]
2055
+ },
2056
+ block.id
2057
+ ))
2058
+ }
2059
+ ),
2060
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative bg-[#fdfdfc] shadow-md shadow-zinc-300/60 border border-zinc-100 rounded-sm md:rounded-md flex flex-col w-[210mm] shrink-0 p-8 md:p-12 lg:p-16", children: [
2061
+ /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-xs font-extrabold text-slate-800 uppercase tracking-[0.25em] mb-6 flex items-center gap-3 font-sans", children: [
2062
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex items-center justify-center w-8 h-8 rounded-full bg-slate-100/80 shadow-inner border border-slate-200/50", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlignLeft, { className: "w-3.5 h-3.5 text-slate-500" }) }),
2063
+ "Scene Brief"
2064
+ ] }),
2065
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative bg-zinc-50/50 border border-zinc-200/60 rounded-xl p-4 md:p-6 shadow-inner focus-within:bg-white focus-within:border-zinc-300 focus-within:shadow-[0_8px_30px_rgb(0,0,0,0.04)] transition-all duration-300", children: [
2066
+ /* @__PURE__ */ jsxRuntime.jsx(
2067
+ "textarea",
2068
+ {
2069
+ value: sceneBrief,
2070
+ onChange: (e) => setSceneBrief(e.target.value),
2071
+ placeholder: "Write a brief description or notes for this scene...",
2072
+ className: "w-full min-h-[120px] bg-transparent outline-none resize-y text-zinc-700 placeholder:text-zinc-400 text-sm md:text-base custom-scrollbar font-sans select-none",
2073
+ style: {
2074
+ lineHeight: "1.6"
2075
+ }
2076
+ }
2077
+ ),
2078
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsx(
2079
+ "button",
2080
+ {
2081
+ onClick: onUpdateBrief,
2082
+ disabled: !sceneBrief || sceneBrief.trim() === "",
2083
+ className: "rounded-full bg-[#15607b] px-6 py-3 text-[13px] font-semibold tracking-wide text-white shadow-md transition-all hover:bg-[#134a61] hover:shadow-lg active:scale-95 disabled:bg-gray-200 disabled:cursor-not-allowed disabled:opacity-95 disabled:text-black disabled:shadow-none",
2084
+ children: "Update"
2085
+ }
2086
+ ) })
2087
+ ] })
2088
+ ] })
2089
+ ] }),
2090
+ /* @__PURE__ */ jsxRuntime.jsxs(
2091
+ "button",
2092
+ {
2093
+ onClick: () => setIsSidebarOpen(true),
2094
+ className: "fixed bottom-6 right-6 z-40 flex h-14 w-14 items-center justify-center rounded-full bg-[#15607b] text-white shadow-[0_8px_30px_rgba(21,96,123,0.3)] transition-transform hover:scale-105 active:scale-95 xl:hidden",
2095
+ children: [
2096
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-6 w-6" }),
2097
+ tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -top-1 -right-1 flex h-5 w-5 items-center justify-center rounded-full bg-rose-500 text-[10px] font-bold text-white shadow-sm border-2 border-white", children: tags.length })
2098
+ ]
2099
+ }
2100
+ ),
2101
+ isSidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
2102
+ "div",
2103
+ {
2104
+ className: "fixed inset-0 z-40 bg-slate-900/20 backdrop-blur-sm transition-opacity xl:hidden",
2105
+ onClick: () => setIsSidebarOpen(false)
2106
+ }
2107
+ ),
1935
2108
  /* @__PURE__ */ jsxRuntime.jsx(
1936
2109
  "div",
1937
2110
  {
1938
- className: "relative bg-[#fdfdfc] shadow-md shadow-zinc-300/60 border border-zinc-100 rounded-sm md:rounded-md pl-[1.5in] py-[1in] pr-[1in] flex flex-col w-[210mm] min-h-auto shrink-0",
1939
- style: {
1940
- fontFamily: COURIER_STACK,
1941
- paddingLeft: "1.5in",
1942
- paddingRight: "1in",
1943
- paddingTop: "1in",
1944
- paddingBottom: "1in",
1945
- lineHeight: "1.2"
1946
- },
1947
- "data-screenplay-editor": "true",
1948
- onMouseUp: handleMouseUp,
1949
- children: blocks.map((block) => /* @__PURE__ */ jsxRuntime.jsxs(
1950
- "div",
1951
- {
1952
- "data-block-id": block.id,
1953
- className: `relative break-words w-full px-4 py-2 ${blockStyles[block.type].className}`,
1954
- style: __spreadProps(__spreadValues({}, blockStyles[block.type].inputStyle), {
1955
- minHeight: "2.5rem"
1956
- }),
1957
- children: [
1958
- renderBlockText(block),
1959
- (selectionMenu == null ? void 0 : selectionMenu.blockId) === block.id && /* @__PURE__ */ jsxRuntime.jsxs(
1960
- "div",
1961
- {
1962
- ref: menuRef,
1963
- "data-screenplay-editor": "false",
1964
- className: `tag-menu absolute z-50 bg-white/70 backdrop-blur-2xl shadow-[0_10px_40px_rgb(0,0,0,0.06)] border border-white rounded-[1.5rem] p-2 flex flex-col w-56 animate-in fade-in zoom-in-95 duration-300 ease-out ${menuPlacement === "top" ? "origin-bottom" : "origin-top"}`,
1965
- style: {
1966
- top: selectionMenu.top,
1967
- left: selectionMenu.left,
1968
- transform: menuPlacement === "top" ? "translate(-50%, calc(-100% - 12px))" : "translate(-50%, 32px)"
1969
- },
1970
- children: [
1971
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 px-3 py-2.5 border-b border-white/60 mb-1.5", children: [
1972
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[9px] font-extrabold tracking-[0.2em] text-slate-400 uppercase mb-1", children: "Tag Element" }),
1973
- /* @__PURE__ */ jsxRuntime.jsxs(
1974
- "p",
2111
+ className: `fixed xl:absolute top-0 right-0 z-50 h-full w-72 transform transition-transform duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] xl:translate-x-0 ${isSidebarOpen ? "translate-x-0 shadow-[0_0_40px_rgba(0,0,0,0.1)]" : "translate-x-full"}`,
2112
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sticky top-0 flex h-[100dvh] max-h-screen w-full flex-col border-l border-l-[#eefafd] bg-white p-3 py-5", children: [
2113
+ !aiSummarized && /* @__PURE__ */ jsxRuntime.jsx(
2114
+ summarize_button_default,
2115
+ {
2116
+ isSummarizing,
2117
+ onSummarize
2118
+ }
2119
+ ),
2120
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-3 py-5 my-5 border-t border-t-[#eefafd] flex-1 overflow-hidden", children: [
2121
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center justify-between mb-6 shrink-0", children: [
2122
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2123
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex h-8 w-8 items-center justify-center rounded-[10px] border border-[#15607b]/20 bg-white shadow-sm", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-4 w-4 text-[#15607b]" }) }),
2124
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[12px] font-semibold uppercase tracking-[0.28em] text-[#134a61]", children: "Breakdown" })
2125
+ ] }),
2126
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rounded-full border border-slate-200/60 bg-slate-50 px-2.5 py-1 text-[11px] font-semibold text-[#134a61] shadow-sm backdrop-blur-md", children: tags.length }) })
2127
+ ] }),
2128
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 overflow-y-auto overflow-x-hidden pb-4 pr-1 custom-scrollbar", children: CATEGORIES.map((cat) => {
2129
+ const catTags = tags.filter((t) => t.category_id === cat.id);
2130
+ if (!catTags.length) return null;
2131
+ const isExpanded = expandedCategories[cat.id];
2132
+ const uniqueTags = Array.from(
2133
+ new Map(
2134
+ catTags.map((tag) => [tag.name.toLowerCase(), tag])
2135
+ ).values()
2136
+ );
2137
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
2138
+ /* @__PURE__ */ jsxRuntime.jsxs(
2139
+ "div",
2140
+ {
2141
+ onClick: () => setExpandedCategories((prev) => ({
2142
+ [cat.id]: !prev[cat.id]
2143
+ })),
2144
+ className: "group relative flex cursor-pointer items-center gap-3 overflow-hidden rounded-[24px] border border-white/70 px-4 py-3.5 transition-all duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] hover:-translate-y-[1px]",
2145
+ style: {
2146
+ background: `linear-gradient(135deg, rgba(255,255,255,0.92), ${cat.hex}18)`,
2147
+ boxShadow: `0 16px 36px ${cat.hex}14, inset 0 1px 0 rgba(255,255,255,0.9)`,
2148
+ border: `1px solid ${cat.hex}50`
2149
+ },
2150
+ children: [
2151
+ /* @__PURE__ */ jsxRuntime.jsx(
2152
+ "div",
1975
2153
  {
1976
- className: "text-xs font-bold text-slate-700 truncate drop-shadow-sm",
1977
- title: selectionMenu.text,
1978
- children: [
1979
- '"',
1980
- selectionMenu.text,
1981
- '"'
1982
- ]
2154
+ className: "absolute inset-0 opacity-0 transition-opacity duration-300 group-hover:opacity-100",
2155
+ style: {
2156
+ background: `radial-gradient(circle at 15% 20%, ${cat.hex}24, transparent 38%)`
2157
+ }
1983
2158
  }
1984
- )
1985
- ] }),
1986
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex flex-col gap-1", children: [
1987
- CATEGORIES.filter(
1988
- (cat) => !(cat.id === "LOCATION" && hasLocationTag) && !(cat.id === "SUBLOCATION" && !hasLocationTag)
1989
- ).map((cat) => /* @__PURE__ */ jsxRuntime.jsxs(
1990
- "button",
2159
+ ),
2160
+ /* @__PURE__ */ jsxRuntime.jsx(
2161
+ "div",
1991
2162
  {
1992
- onClick: () => {
1993
- const existingTag = tags.find(
1994
- (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
1995
- );
1996
- if (existingTag && existingTag.id) {
1997
- updateTag == null ? void 0 : updateTag(existingTag.id, cat.id);
1998
- } else {
1999
- addTag(cat.id);
2000
- }
2163
+ className: "relative flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-white/70 backdrop-blur-md",
2164
+ style: {
2165
+ background: `linear-gradient(135deg, ${cat.color}22, rgba(255,255,255,0.75))`,
2166
+ boxShadow: `0 10px 22px ${cat.color}14`
2001
2167
  },
2002
- className: "group w-full text-[12px] font-bold px-3 py-2 rounded-xl transition-all duration-300 text-left flex items-center justify-between hover:bg-white/80 hover:shadow-[0_2px_10px_rgb(0,0,0,0.02)] active:scale-[0.98]",
2168
+ children: /* @__PURE__ */ jsxRuntime.jsx(cat.icon, { className: "h-4 w-4", color: cat.color })
2169
+ }
2170
+ ),
2171
+ /* @__PURE__ */ jsxRuntime.jsx(
2172
+ "span",
2173
+ {
2174
+ className: "relative text-[13px] font-semibold tracking-[0.01em]",
2003
2175
  style: { color: cat.color },
2004
- children: [
2005
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2006
- /* @__PURE__ */ jsxRuntime.jsx(
2007
- cat.icon,
2008
- {
2009
- className: "w-4 h-4 group-hover:scale-110 transition-transform duration-300",
2010
- style: { color: cat.color }
2011
- }
2012
- ),
2013
- cat.label
2014
- ] }),
2015
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-slate-400 opacity-0 group-hover:opacity-100 transition-all duration-300 translate-x-1 group-hover:translate-x-0", children: "Select" })
2016
- ]
2017
- },
2018
- cat.id
2019
- )),
2020
- tags.some(
2021
- (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2022
- ) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 pt-1 border-t border-white/60", children: /* @__PURE__ */ jsxRuntime.jsxs(
2023
- "button",
2176
+ children: cat.label
2177
+ }
2178
+ ),
2179
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative ml-auto rounded-full border border-white/70 bg-white/75 px-2.5 py-1 text-[11px] font-semibold text-[#456575] backdrop-blur-md", children: catTags.length }),
2180
+ /* @__PURE__ */ jsxRuntime.jsx(
2181
+ lucideReact.ChevronDown,
2024
2182
  {
2025
- onClick: (e) => {
2026
- const tagToRemove = tags.find(
2027
- (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2028
- );
2029
- if (tagToRemove) {
2030
- removeTag(e, tagToRemove.id);
2031
- clearSelection();
2032
- }
2033
- },
2034
- className: "group w-full text-[12px] font-bold px-3 py-2 rounded-xl transition-all duration-300 text-left flex items-center justify-between hover:bg-rose-50 hover:text-rose-600 hover:shadow-[0_2px_10px_rgb(225,29,72,0.04)] active:scale-[0.98] text-slate-500 border border-transparent hover:border-rose-100",
2035
- children: [
2036
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2037
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full shadow-sm bg-rose-400 group-hover:scale-125 transition-transform duration-300" }),
2038
- "Remove Tag"
2039
- ] }),
2040
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-rose-400 opacity-0 group-hover:opacity-100 transition-all duration-300 translate-x-1 group-hover:translate-x-0", children: "Remove" })
2041
- ]
2183
+ className: `relative h-4 w-4 transition-transform duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "rotate-180" : ""}`,
2184
+ style: { color: cat.color }
2042
2185
  }
2043
- ) })
2044
- ] })
2045
- ]
2046
- }
2047
- )
2048
- ]
2049
- },
2050
- block.id
2051
- ))
2186
+ )
2187
+ ]
2188
+ }
2189
+ ),
2190
+ /* @__PURE__ */ jsxRuntime.jsx(
2191
+ "div",
2192
+ {
2193
+ className: `grid transition-all duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "grid-rows-[1fr] opacity-100 mt-3" : "grid-rows-[0fr] opacity-0"}`,
2194
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap justify-start gap-2 py-2", children: uniqueTags.map((tag, index) => /* @__PURE__ */ jsxRuntime.jsx(
2195
+ "div",
2196
+ {
2197
+ className: "relative flex flex-col items-start",
2198
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
2199
+ "span",
2200
+ {
2201
+ title: tag.name,
2202
+ onClick: (e) => {
2203
+ e.stopPropagation();
2204
+ if (cat.id !== "PROP" && cat.id !== "SET_PROP" && cat.id !== "CAST")
2205
+ return;
2206
+ if ((editingTagData == null ? void 0 : editingTagData.tag.id) === tag.id) {
2207
+ setEditingTagData(null);
2208
+ } else {
2209
+ const rect = e.currentTarget.getBoundingClientRect();
2210
+ setPopupPlacement({
2211
+ alignRight: rect.left > window.innerWidth - 240,
2212
+ alignBottom: rect.bottom > window.innerHeight - 250
2213
+ });
2214
+ setTagForm({
2215
+ quantity: tag.quantity || 1,
2216
+ look: tag.look || "",
2217
+ age: tag.age || ""
2218
+ });
2219
+ setEditingTagData({
2220
+ tag,
2221
+ catId: cat.id,
2222
+ catColor: cat.color,
2223
+ rect
2224
+ });
2225
+ }
2226
+ },
2227
+ className: `inline-block max-w-full truncate text-[11px] font-semibold px-3 py-1.5 rounded-full border backdrop-blur-md transition-all duration-300 ${cat.id === "PROP" || cat.id === "SET_PROP" || cat.id === "CAST" ? "cursor-pointer hover:scale-105 shadow-sm" : ""}`,
2228
+ style: {
2229
+ color: cat.color,
2230
+ background: `linear-gradient(145deg, ${cat.color}18, rgba(255,255,255,0.88))`,
2231
+ borderColor: `${cat.color}28`
2232
+ },
2233
+ children: [
2234
+ tag.name,
2235
+ (cat.id === "PROP" || cat.id === "SET_PROP") && tag.quantity && tag.quantity > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-1.5 opacity-80 font-bold", children: [
2236
+ "x",
2237
+ tag.quantity
2238
+ ] }) : null
2239
+ ]
2240
+ }
2241
+ )
2242
+ },
2243
+ index
2244
+ )) }) })
2245
+ }
2246
+ )
2247
+ ] }, cat.id);
2248
+ }) })
2249
+ ] })
2250
+ ] })
2052
2251
  }
2053
- ),
2054
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative bg-[#fdfdfc] shadow-md shadow-zinc-300/60 border border-zinc-100 rounded-sm md:rounded-md flex flex-col w-[210mm] shrink-0 p-8 md:p-12 lg:p-16", children: [
2055
- /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-xs font-extrabold text-slate-800 uppercase tracking-[0.25em] mb-6 flex items-center gap-3 font-sans", children: [
2056
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex items-center justify-center w-8 h-8 rounded-full bg-slate-100/80 shadow-inner border border-slate-200/50", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlignLeft, { className: "w-3.5 h-3.5 text-slate-500" }) }),
2057
- "Scene Brief"
2058
- ] }),
2059
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative bg-zinc-50/50 border border-zinc-200/60 rounded-xl p-4 md:p-6 shadow-inner focus-within:bg-white focus-within:border-zinc-300 focus-within:shadow-[0_8px_30px_rgb(0,0,0,0.04)] transition-all duration-300", children: [
2060
- /* @__PURE__ */ jsxRuntime.jsx(
2061
- "textarea",
2062
- {
2063
- value: sceneBrief,
2064
- onChange: (e) => setSceneBrief(e.target.value),
2065
- placeholder: "Write a brief description or notes for this scene...",
2066
- className: "w-full min-h-[120px] bg-transparent outline-none resize-y text-zinc-700 placeholder:text-zinc-400 text-sm md:text-base custom-scrollbar font-sans select-none",
2067
- style: {
2068
- lineHeight: "1.6"
2069
- }
2070
- }
2071
- ),
2072
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsx(
2073
- "button",
2074
- {
2075
- onClick: onUpdateBrief,
2076
- disabled: !sceneBrief || sceneBrief.trim() === "",
2077
- className: "rounded-full bg-[#15607b] px-6 py-3 text-[13px] font-semibold tracking-wide text-white shadow-md transition-all hover:bg-[#134a61] hover:shadow-lg active:scale-95 disabled:bg-gray-200 disabled:cursor-not-allowed disabled:opacity-95 disabled:text-black disabled:shadow-none",
2078
- children: "Update"
2079
- }
2080
- ) })
2081
- ] })
2082
- ] })
2252
+ )
2083
2253
  ] }),
2084
- /* @__PURE__ */ jsxRuntime.jsxs(
2085
- "button",
2086
- {
2087
- onClick: () => setIsSidebarOpen(true),
2088
- className: "fixed bottom-6 right-6 z-40 flex h-14 w-14 items-center justify-center rounded-full bg-[#15607b] text-white shadow-[0_8px_30px_rgba(21,96,123,0.3)] transition-transform hover:scale-105 active:scale-95 xl:hidden",
2089
- children: [
2090
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-6 w-6" }),
2091
- tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -top-1 -right-1 flex h-5 w-5 items-center justify-center rounded-full bg-rose-500 text-[10px] font-bold text-white shadow-sm border-2 border-white", children: tags.length })
2092
- ]
2093
- }
2094
- ),
2095
- isSidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
2096
- "div",
2097
- {
2098
- className: "fixed inset-0 z-40 bg-slate-900/20 backdrop-blur-sm transition-opacity xl:hidden",
2099
- onClick: () => setIsSidebarOpen(false)
2100
- }
2101
- ),
2102
- /* @__PURE__ */ jsxRuntime.jsx(
2103
- "div",
2104
- {
2105
- className: `fixed xl:absolute top-0 right-0 z-50 h-full w-72 transform transition-transform duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] xl:translate-x-0 ${isSidebarOpen ? "translate-x-0 shadow-[0_0_40px_rgba(0,0,0,0.1)]" : "translate-x-full"}`,
2106
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sticky top-0 flex h-[100dvh] max-h-screen w-full flex-col border-l border-l-[#eefafd] bg-white p-3 py-5", children: [
2107
- !aiSummarized && /* @__PURE__ */ jsxRuntime.jsx(
2108
- summarize_button_default,
2109
- {
2110
- isSummarizing,
2111
- onSummarize
2112
- }
2113
- ),
2114
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-3 py-5 my-5 border-t border-t-[#eefafd] flex-1 overflow-hidden", children: [
2115
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center justify-between mb-6 shrink-0", children: [
2116
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2117
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex h-8 w-8 items-center justify-center rounded-[10px] border border-[#15607b]/20 bg-white shadow-sm", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-4 w-4 text-[#15607b]" }) }),
2118
- /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[12px] font-semibold uppercase tracking-[0.28em] text-[#134a61]", children: "Breakdown" })
2119
- ] }),
2120
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rounded-full border border-slate-200/60 bg-slate-50 px-2.5 py-1 text-[11px] font-semibold text-[#134a61] shadow-sm backdrop-blur-md", children: tags.length }) })
2254
+ editingTagData && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2255
+ /* @__PURE__ */ jsxRuntime.jsx(
2256
+ "div",
2257
+ {
2258
+ className: "fixed inset-0 z-[100]",
2259
+ onClick: (e) => {
2260
+ e.stopPropagation();
2261
+ setEditingTagData(null);
2262
+ }
2263
+ }
2264
+ ),
2265
+ /* @__PURE__ */ jsxRuntime.jsxs(
2266
+ "div",
2267
+ {
2268
+ className: `p-3.5 bg-white/90 backdrop-blur-2xl rounded-[1.25rem] shadow-[0_10px_40px_rgb(0,0,0,0.12)] border border-white/60 z-[101] w-56 animate-in fade-in zoom-in-95 duration-200 ease-out fixed`,
2269
+ style: {
2270
+ top: popupPlacement.alignBottom ? "auto" : editingTagData.rect.bottom + 8,
2271
+ bottom: popupPlacement.alignBottom ? window.innerHeight - editingTagData.rect.top + 8 : "auto",
2272
+ left: popupPlacement.alignRight ? "auto" : editingTagData.rect.left,
2273
+ right: popupPlacement.alignRight ? window.innerWidth - editingTagData.rect.right : "auto"
2274
+ },
2275
+ onClick: (e) => e.stopPropagation(),
2276
+ children: [
2277
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center mb-3 border-b border-slate-100 pb-2.5", children: [
2278
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-extrabold text-slate-400 uppercase tracking-widest drop-shadow-sm", children: "Details" }),
2279
+ /* @__PURE__ */ jsxRuntime.jsx(
2280
+ "button",
2281
+ {
2282
+ onClick: () => setEditingTagData(null),
2283
+ className: "hover:bg-slate-100/80 p-1.5 rounded-full transition-colors active:scale-95",
2284
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-3.5 h-3.5 text-slate-500" })
2285
+ }
2286
+ )
2121
2287
  ] }),
2122
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 overflow-y-auto overflow-x-hidden pb-4 pr-1 custom-scrollbar", children: CATEGORIES.map((cat) => {
2123
- const catTags = tags.filter((t) => t.category_id === cat.id);
2124
- if (!catTags.length) return null;
2125
- const isExpanded = expandedCategories[cat.id];
2126
- const uniqueTags = Array.from(
2127
- new Map(
2128
- catTags.map((tag) => [tag.name.toLowerCase(), tag])
2129
- ).values()
2130
- );
2131
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
2132
- /* @__PURE__ */ jsxRuntime.jsxs(
2133
- "div",
2288
+ (editingTagData.catId === "PROP" || editingTagData.catId === "SET_PROP") && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
2289
+ /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Quantity" }),
2290
+ /* @__PURE__ */ jsxRuntime.jsx(
2291
+ "input",
2292
+ {
2293
+ type: "number",
2294
+ min: "1",
2295
+ value: tagForm.quantity,
2296
+ onChange: (e) => {
2297
+ const val = Math.max(1, parseInt(e.target.value) || 1);
2298
+ setTagForm((prev) => __spreadProps(__spreadValues({}, prev), {
2299
+ quantity: val
2300
+ }));
2301
+ },
2302
+ className: "w-full text-[13px] px-3 py-2 rounded-xl border border-slate-200/80 outline-none focus:border-[#15607b] focus:ring-2 focus:ring-[#15607b]/20 transition-all bg-slate-50/50 focus:bg-white font-semibold text-slate-700"
2303
+ }
2304
+ )
2305
+ ] }),
2306
+ editingTagData.catId === "CAST" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
2307
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
2308
+ /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Look" }),
2309
+ /* @__PURE__ */ jsxRuntime.jsx(
2310
+ "input",
2134
2311
  {
2135
- onClick: () => setExpandedCategories((prev) => ({
2136
- [cat.id]: !prev[cat.id]
2137
- })),
2138
- className: "group relative flex cursor-pointer items-center gap-3 overflow-hidden rounded-[24px] border border-white/70 px-4 py-3.5 transition-all duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] hover:-translate-y-[1px]",
2139
- style: {
2140
- background: `linear-gradient(135deg, rgba(255,255,255,0.92), ${cat.hex}18)`,
2141
- boxShadow: `0 16px 36px ${cat.hex}14, inset 0 1px 0 rgba(255,255,255,0.9)`,
2142
- border: `1px solid ${cat.hex}50`
2312
+ type: "text",
2313
+ placeholder: "e.g. Dirty, Formal",
2314
+ value: tagForm.look,
2315
+ onChange: (e) => {
2316
+ setTagForm((prev) => __spreadProps(__spreadValues({}, prev), {
2317
+ look: e.target.value
2318
+ }));
2143
2319
  },
2144
- children: [
2145
- /* @__PURE__ */ jsxRuntime.jsx(
2146
- "div",
2147
- {
2148
- className: "absolute inset-0 opacity-0 transition-opacity duration-300 group-hover:opacity-100",
2149
- style: {
2150
- background: `radial-gradient(circle at 15% 20%, ${cat.hex}24, transparent 38%)`
2151
- }
2152
- }
2153
- ),
2154
- /* @__PURE__ */ jsxRuntime.jsx(
2155
- "div",
2156
- {
2157
- className: "relative flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-white/70 backdrop-blur-md",
2158
- style: {
2159
- background: `linear-gradient(135deg, ${cat.color}22, rgba(255,255,255,0.75))`,
2160
- boxShadow: `0 10px 22px ${cat.color}14`
2161
- },
2162
- children: /* @__PURE__ */ jsxRuntime.jsx(cat.icon, { className: "h-4 w-4", color: cat.color })
2163
- }
2164
- ),
2165
- /* @__PURE__ */ jsxRuntime.jsx(
2166
- "span",
2167
- {
2168
- className: "relative text-[13px] font-semibold tracking-[0.01em]",
2169
- style: { color: cat.color },
2170
- children: cat.label
2171
- }
2172
- ),
2173
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative ml-auto rounded-full border border-white/70 bg-white/75 px-2.5 py-1 text-[11px] font-semibold text-[#456575] backdrop-blur-md", children: catTags.length }),
2174
- /* @__PURE__ */ jsxRuntime.jsx(
2175
- lucideReact.ChevronDown,
2176
- {
2177
- className: `relative h-4 w-4 transition-transform duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "rotate-180" : ""}`,
2178
- style: { color: cat.color }
2179
- }
2180
- )
2181
- ]
2320
+ className: "w-full text-[13px] px-3 py-2 rounded-xl border border-slate-200/80 outline-none focus:border-[#15607b] focus:ring-2 focus:ring-[#15607b]/20 transition-all bg-slate-50/50 focus:bg-white font-semibold text-slate-700 placeholder:text-slate-400 placeholder:font-normal"
2182
2321
  }
2183
- ),
2322
+ )
2323
+ ] }),
2324
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
2325
+ /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Age" }),
2184
2326
  /* @__PURE__ */ jsxRuntime.jsx(
2185
- "div",
2327
+ "input",
2186
2328
  {
2187
- className: `grid transition-all duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "grid-rows-[1fr] opacity-100 mt-3" : "grid-rows-[0fr] opacity-0"}`,
2188
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap justify-start gap-2 py-2", children: uniqueTags.map((tag, index) => /* @__PURE__ */ jsxRuntime.jsx(
2189
- "span",
2190
- {
2191
- title: tag.name,
2192
- className: "inline-block max-w-full truncate text-[11px] font-semibold px-3 py-1.5 rounded-full border backdrop-blur-md transition-all duration-300",
2193
- style: {
2194
- color: cat.color,
2195
- background: `linear-gradient(145deg, ${cat.color}18, rgba(255,255,255,0.88))`,
2196
- borderColor: `${cat.color}28`
2197
- },
2198
- children: tag.name
2199
- },
2200
- index
2201
- )) }) })
2329
+ type: "number",
2330
+ min: "0",
2331
+ max: "100",
2332
+ value: tagForm.age,
2333
+ onChange: (e) => {
2334
+ let val = parseInt(e.target.value);
2335
+ if (isNaN(val)) {
2336
+ setTagForm((prev) => __spreadProps(__spreadValues({}, prev), {
2337
+ age: ""
2338
+ }));
2339
+ return;
2340
+ }
2341
+ val = Math.max(0, Math.min(100, val));
2342
+ setTagForm((prev) => __spreadProps(__spreadValues({}, prev), {
2343
+ age: val.toString()
2344
+ }));
2345
+ },
2346
+ className: "w-full text-[13px] px-3 py-2 rounded-xl border border-slate-200/80 outline-none focus:border-[#15607b] focus:ring-2 focus:ring-[#15607b]/20 transition-all bg-slate-50/50 focus:bg-white font-semibold text-slate-700"
2202
2347
  }
2203
2348
  )
2204
- ] }, cat.id);
2205
- }) })
2206
- ] })
2207
- ] })
2208
- }
2209
- )
2210
- ] }) });
2349
+ ] })
2350
+ ] }),
2351
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: /* @__PURE__ */ jsxRuntime.jsx(
2352
+ "button",
2353
+ {
2354
+ onClick: (e) => {
2355
+ e.stopPropagation();
2356
+ if (editingTagData.tag.id) {
2357
+ updateTag == null ? void 0 : updateTag(editingTagData.tag.id, null, __spreadValues(__spreadValues({}, editingTagData.catId === "PROP" || editingTagData.catId === "SET_PROP" ? { quantity: tagForm.quantity } : {}), editingTagData.catId === "CAST" ? { look: tagForm.look, age: tagForm.age } : {}));
2358
+ }
2359
+ setEditingTagData(null);
2360
+ },
2361
+ className: "w-full bg-[#15607b] hover:bg-[#134a61] text-white text-[12px] font-bold py-2.5 rounded-xl transition-all shadow-[0_4px_12px_rgba(21,96,123,0.2)] hover:shadow-[0_6px_16px_rgba(21,96,123,0.3)] active:scale-[0.98]",
2362
+ children: "Update Details"
2363
+ }
2364
+ ) })
2365
+ ]
2366
+ }
2367
+ )
2368
+ ] })
2369
+ ] });
2211
2370
  }
2212
2371
  function useScriptBreakdownScene(options) {
2213
2372
  const [tags, setTags] = react.useState(options.preLoadedTags || []);
@@ -2305,14 +2464,21 @@ function useScriptBreakdownScene(options) {
2305
2464
  if (!aiTag.block_id || !aiTag.category_id || typeof aiTag.start_index !== "number" || typeof aiTag.end_index !== "number") {
2306
2465
  return;
2307
2466
  }
2308
- newTags.push({
2467
+ const newTag = {
2309
2468
  id: aiTag.id || uuid(),
2310
2469
  block_id: String(aiTag.block_id).startsWith("par") ? String(aiTag.block_id).substring(3) : String(aiTag.block_id),
2311
2470
  category_id: aiTag.category_id,
2312
2471
  name: aiTag.name,
2313
2472
  start_index: aiTag.start_index,
2314
2473
  end_index: aiTag.end_index
2315
- });
2474
+ };
2475
+ if (aiTag.category_id === "PROP" || aiTag.category_id === "SET_PROP") {
2476
+ newTag.quantity = 1;
2477
+ } else if (aiTag.category_id === "CAST") {
2478
+ newTag.look = "";
2479
+ newTag.age = "";
2480
+ }
2481
+ newTags.push(newTag);
2316
2482
  });
2317
2483
  if (newTags.length > 0) {
2318
2484
  const originalTags = tags;
@@ -2364,7 +2530,9 @@ function useScriptBreakdownScene(options) {
2364
2530
  category_id: "CAST",
2365
2531
  name: charName,
2366
2532
  start_index: startIndex,
2367
- end_index: startIndex + charName.length
2533
+ end_index: startIndex + charName.length,
2534
+ look: "",
2535
+ age: ""
2368
2536
  });
2369
2537
  }
2370
2538
  }
@@ -2577,6 +2745,12 @@ function useScriptBreakdownScene(options) {
2577
2745
  start_index: selectionMenu.startIndex,
2578
2746
  end_index: selectionMenu.endIndex
2579
2747
  };
2748
+ if (categoryId === "PROP" || categoryId === "SET_PROP") {
2749
+ newTag.quantity = 1;
2750
+ } else if (categoryId === "CAST") {
2751
+ newTag.look = "";
2752
+ newTag.age = "";
2753
+ }
2580
2754
  setTags((prev) => {
2581
2755
  const filtered = prev.filter(
2582
2756
  (t) => t.block_id !== newTag.block_id || !(newTag.end_index > t.start_index && newTag.start_index < t.end_index)
@@ -2606,22 +2780,36 @@ function useScriptBreakdownScene(options) {
2606
2780
  setTags((prev) => [...prev, tagToRemove]);
2607
2781
  }
2608
2782
  };
2609
- const updateTag = async (id, categoryId) => {
2610
- var _a;
2783
+ const updateTag = async (id, categoryId, details) => {
2784
+ var _a, _b, _c, _d;
2611
2785
  const tagToUpdate = tags.find((t) => t.id === id);
2612
2786
  if (!tagToUpdate) return;
2787
+ const updatedFields = __spreadValues({}, details);
2788
+ if (categoryId) {
2789
+ updatedFields.category_id = categoryId;
2790
+ if (categoryId === "PROP" || categoryId === "SET_PROP") {
2791
+ updatedFields.quantity = (_a = tagToUpdate.quantity) != null ? _a : 1;
2792
+ } else if (categoryId === "CAST") {
2793
+ updatedFields.look = (_b = tagToUpdate.look) != null ? _b : "";
2794
+ updatedFields.age = (_c = tagToUpdate.age) != null ? _c : "";
2795
+ }
2796
+ }
2613
2797
  setTags(
2614
- (prev) => prev.map((t) => t.id === id ? __spreadProps(__spreadValues({}, t), { category_id: categoryId }) : t)
2798
+ (prev) => prev.map((t) => {
2799
+ if (t.id === id) return __spreadValues(__spreadValues({}, t), updatedFields);
2800
+ if (details && t.name === tagToUpdate.name && t.category_id === tagToUpdate.category_id) {
2801
+ return __spreadValues(__spreadValues({}, t), details);
2802
+ }
2803
+ return t;
2804
+ })
2615
2805
  );
2616
- clearSelection();
2806
+ if (categoryId) clearSelection();
2617
2807
  try {
2618
- await ((_a = options.onTagUpdated) == null ? void 0 : _a.call(options, id, categoryId));
2808
+ await ((_d = options.onTagUpdated) == null ? void 0 : _d.call(options, id, categoryId || null, details));
2619
2809
  } catch (error2) {
2620
2810
  console.error("Failed to update tag:", error2);
2621
2811
  setTags(
2622
- (prev) => prev.map(
2623
- (t) => t.id === id ? __spreadProps(__spreadValues({}, t), { category_id: tagToUpdate.category_id }) : t
2624
- )
2812
+ (prev) => prev.map((t) => t.id === id ? tagToUpdate : t)
2625
2813
  );
2626
2814
  }
2627
2815
  };