@ably/ui 17.4.2 → 17.4.3

package/core/styles/buttons.css

@@ -20,11 +20,11 @@
   }
 
   .ui-button-disabled-base {
-    @apply disabled:cursor-not-allowed disabled:bg-gui-unavailable disabled:text-gui-unavailable-dark disabled:hover:bg-gui-unavailable;
+    @apply disabled:cursor-not-allowed disabled:bg-gui-disabled-light disabled:text-gui-disabled-dark disabled:hover:bg-gui-disabled-light;
   }
 
   .ui-button-disabled-base-dark {
-    @apply disabled:cursor-not-allowed disabled:bg-gui-unavailable-dark disabled:text-gui-unavailable disabled:hover:bg-gui-unavailable-dark;
+    @apply disabled:cursor-not-allowed disabled:bg-gui-disabled-dark disabled:text-gui-disabled-light disabled:hover:bg-gui-disabled-dark;
   }
 
   .ui-button-priority-base {
@@ -44,11 +44,11 @@
   }
 
   .ui-button-secondary-base {
-    @apply text-neutral-1300 active:text-neutral-1000 border border-neutral-600 hover:border-neutral-800 active:border-neutral-700 disabled:border-gui-unavailable disabled:text-gui-unavailable;
+    @apply text-neutral-1300 active:text-neutral-1000 border border-neutral-400 hover:border-neutral-600 active:border-neutral-500 disabled:border-gui-disabled-light disabled:text-gui-disabled-light;
   }
 
   .ui-theme-dark .ui-button-secondary-base {
-    @apply text-neutral-000 active:text-neutral-300 border-neutral-700 hover:border-neutral-500 active:border-neutral-600 disabled:border-gui-unavailable-dark disabled:text-gui-unavailable-dark;
+    @apply text-neutral-000 active:text-neutral-300 border-neutral-900 hover:border-neutral-700 active:border-neutral-800 disabled:border-gui-disabled-dark disabled:text-gui-disabled-dark;
   }
 
   .ui-button-priority-lg {
@@ -124,10 +124,10 @@
   }
 
   .ui-button-disabled {
-    @apply select-none pointer-events-none bg-gui-unavailable text-gui-unavailable-dark hover:bg-gui-unavailable;
+    @apply select-none pointer-events-none bg-gui-disabled-light text-gui-disabled-dark hover:bg-gui-disabled-light;
   }
 
   .ui-theme-dark .ui-button-disabled {
-    @apply select-none pointer-events-none bg-gui-unavailable-dark text-gui-unavailable hover:bg-gui-unavailable-dark;
+    @apply select-none pointer-events-none bg-gui-disabled-dark text-gui-disabled-light hover:bg-gui-disabled-dark;
   }
 }

package/core/styles/colors/types.js

@@ -1,2 +1,2 @@
-export const variants=["","dark:"];export const prefixes=["text","bg","from","to","border"];export const colors=["neutral","orange","blue","yellow","green","violet","pink"];export const neutralColors=["neutral-000","neutral-100","neutral-200","neutral-300","neutral-400","neutral-500","neutral-600","neutral-700","neutral-800","neutral-900","neutral-1000","neutral-1100","neutral-1200","neutral-1300"];export const orangeColors=["orange-100","orange-200","orange-300","orange-400","orange-500","orange-600","orange-700","orange-800","orange-900","orange-1000","orange-1100"];export const yellowColors=["yellow-100","yellow-200","yellow-300","yellow-400","yellow-500","yellow-600","yellow-700","yellow-800","yellow-900"];export const greenColors=["green-100","green-200","green-300","green-400","green-500","green-600","green-700","green-800","green-900"];export const blueColors=["blue-100","blue-200","blue-300","blue-400","blue-500","blue-600","blue-700","blue-800","blue-900"];export const violetColors=["violet-100","violet-200","violet-300","violet-400","violet-500","violet-600","violet-700","violet-800","violet-900"];export const pinkColors=["pink-100","pink-200","pink-300","pink-400","pink-500","pink-600","pink-700","pink-800","pink-900"];const secondaryColors=[...yellowColors,...greenColors,...blueColors,...violetColors,...pinkColors];const guiColors=["gui-blue-default-light","gui-blue-hover-light","gui-blue-active-light","gui-blue-default-dark","gui-blue-hover-dark","gui-blue-active-dark","gui-blue-focus","gui-unavailable","gui-success-green","gui-error-red","gui-focus","gui-focus-outline","gui-visited"];export const aliasedColors=["white","extra-light-grey","light-grey","mid-grey","dark-grey","charcoal-grey","cool-black","active-orange","bright-red","red-orange","electric-cyan","zingy-green","jazzy-pink","gui-default","gui-hover","gui-active","gui-error","gui-success","gui-default-dark","gui-hover-dark","gui-active-dark","transparent"];export const colorRoles={neutral:neutralColors,orange:orangeColors,secondary:secondaryColors,gui:guiColors};export const colorGroupLengths={neutral:neutralColors.length,orange:orangeColors.length,blue:blueColors.length,yellow:yellowColors.length,green:greenColors.length,violet:violetColors.length,pink:pinkColors.length};
+export const variants=["","dark:"];export const prefixes=["text","bg","from","to","border"];export const colors=["neutral","orange","blue","yellow","green","violet","pink"];export const neutralColors=["neutral-000","neutral-100","neutral-200","neutral-300","neutral-400","neutral-500","neutral-600","neutral-700","neutral-800","neutral-900","neutral-1000","neutral-1100","neutral-1200","neutral-1300"];export const orangeColors=["orange-100","orange-200","orange-300","orange-400","orange-500","orange-600","orange-700","orange-800","orange-900","orange-1000","orange-1100"];export const yellowColors=["yellow-100","yellow-200","yellow-300","yellow-400","yellow-500","yellow-600","yellow-700","yellow-800","yellow-900"];export const greenColors=["green-100","green-200","green-300","green-400","green-500","green-600","green-700","green-800","green-900"];export const blueColors=["blue-100","blue-200","blue-300","blue-400","blue-500","blue-600","blue-700","blue-800","blue-900"];export const violetColors=["violet-100","violet-200","violet-300","violet-400","violet-500","violet-600","violet-700","violet-800","violet-900"];export const pinkColors=["pink-100","pink-200","pink-300","pink-400","pink-500","pink-600","pink-700","pink-800","pink-900"];export const secondaryColors=[...yellowColors,...greenColors,...blueColors,...violetColors,...pinkColors];export const guiColors=["gui-blue-default-light","gui-blue-hover-light","gui-blue-active-light","gui-blue-default-dark","gui-blue-hover-dark","gui-blue-active-dark","gui-blue-focus","gui-disabled-light","gui-disabled-dark","gui-success-green","gui-error-red","gui-focus","gui-focus-outline","gui-visited"];export const aliasedColors=["white","extra-light-grey","light-grey","mid-grey","dark-grey","charcoal-grey","cool-black","active-orange","bright-red","red-orange","electric-cyan","zingy-green","jazzy-pink","gui-default","gui-hover","gui-active","gui-error","gui-success","gui-default-dark","gui-hover-dark","gui-active-dark","transparent"];export const colorRoles={neutral:neutralColors,orange:orangeColors,secondary:secondaryColors,gui:guiColors};export const colorGroupLengths={neutral:neutralColors.length,orange:orangeColors.length,blue:blueColors.length,yellow:yellowColors.length,green:greenColors.length,violet:violetColors.length,pink:pinkColors.length};
 //# sourceMappingURL=types.js.map

package/core/styles/colors/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/core/styles/colors/types.ts"],"sourcesContent":["export type ColorName =\n  | (typeof neutralColors)[number]\n  | (typeof orangeColors)[number]\n  | (typeof secondaryColors)[number]\n  | (typeof guiColors)[number]\n  | (typeof aliasedColors)[number];\n\nexport const variants = [\"\", \"dark:\"] as const;\n\ntype ColorClassVariants = (typeof variants)[number];\n\nexport const prefixes = [\"text\", \"bg\", \"from\", \"to\", \"border\"] as const;\n\ntype ColorClassPrefixes = (typeof prefixes)[number];\n\nexport const colors = [\n  \"neutral\",\n  \"orange\",\n  \"blue\",\n  \"yellow\",\n  \"green\",\n  \"violet\",\n  \"pink\",\n] as const;\n\nexport type ColorClassColorGroups = (typeof colors)[number];\n\nexport type Theme = \"light\" | \"dark\";\n\nexport type ColorClass =\n  `${ColorClassVariants}${ColorClassPrefixes}-${ColorName}`;\n\nexport type ColorThemeSet = `${string} dark:${string}`;\n\nexport const neutralColors = [\n  \"neutral-000\",\n  \"neutral-100\",\n  \"neutral-200\",\n  \"neutral-300\",\n  \"neutral-400\",\n  \"neutral-500\",\n  \"neutral-600\",\n  \"neutral-700\",\n  \"neutral-800\",\n  \"neutral-900\",\n  \"neutral-1000\",\n  \"neutral-1100\",\n  \"neutral-1200\",\n  \"neutral-1300\",\n] as const;\n\nexport const orangeColors = [\n  \"orange-100\",\n  \"orange-200\",\n  \"orange-300\",\n  \"orange-400\",\n  \"orange-500\",\n  \"orange-600\",\n  \"orange-700\",\n  \"orange-800\",\n  \"orange-900\",\n  \"orange-1000\",\n  \"orange-1100\",\n] as const;\n\nexport const yellowColors = [\n  \"yellow-100\",\n  \"yellow-200\",\n  \"yellow-300\",\n  \"yellow-400\",\n  \"yellow-500\",\n  \"yellow-600\",\n  \"yellow-700\",\n  \"yellow-800\",\n  \"yellow-900\",\n] as const;\n\nexport const greenColors = [\n  \"green-100\",\n  \"green-200\",\n  \"green-300\",\n  \"green-400\",\n  \"green-500\",\n  \"green-600\",\n  \"green-700\",\n  \"green-800\",\n  \"green-900\",\n] as const;\n\nexport const blueColors = [\n  \"blue-100\",\n  \"blue-200\",\n  \"blue-300\",\n  \"blue-400\",\n  \"blue-500\",\n  \"blue-600\",\n  \"blue-700\",\n  \"blue-800\",\n  \"blue-900\",\n] as const;\n\nexport const violetColors = [\n  \"violet-100\",\n  \"violet-200\",\n  \"violet-300\",\n  \"violet-400\",\n  \"violet-500\",\n  \"violet-600\",\n  \"violet-700\",\n  \"violet-800\",\n  \"violet-900\",\n] as const;\n\nexport const pinkColors = [\n  \"pink-100\",\n  \"pink-200\",\n  \"pink-300\",\n  \"pink-400\",\n  \"pink-500\",\n  \"pink-600\",\n  \"pink-700\",\n  \"pink-800\",\n  \"pink-900\",\n] as const;\n\nconst secondaryColors = [\n  ...yellowColors,\n  ...greenColors,\n  ...blueColors,\n  ...violetColors,\n  ...pinkColors,\n] as const;\n\nconst guiColors = [\n  \"gui-blue-default-light\",\n  \"gui-blue-hover-light\",\n  \"gui-blue-active-light\",\n  \"gui-blue-default-dark\",\n  \"gui-blue-hover-dark\",\n  \"gui-blue-active-dark\",\n  \"gui-blue-focus\",\n  \"gui-unavailable\",\n  \"gui-success-green\",\n  \"gui-error-red\",\n  \"gui-focus\",\n  \"gui-focus-outline\",\n  \"gui-visited\",\n] as const;\n\nexport const aliasedColors = [\n  \"white\",\n  \"extra-light-grey\",\n  \"light-grey\",\n  \"mid-grey\",\n  \"dark-grey\",\n  \"charcoal-grey\",\n  \"cool-black\",\n  \"active-orange\",\n  \"bright-red\",\n  \"red-orange\",\n  \"electric-cyan\",\n  \"zingy-green\",\n  \"jazzy-pink\",\n  \"gui-default\",\n  \"gui-hover\",\n  \"gui-active\",\n  \"gui-error\",\n  \"gui-success\",\n  \"gui-default-dark\",\n  \"gui-hover-dark\",\n  \"gui-active-dark\",\n  \"transparent\",\n] as const;\n\nexport const colorRoles = {\n  neutral: neutralColors,\n  orange: orangeColors,\n  secondary: secondaryColors,\n  gui: guiColors,\n};\n\nexport const colorGroupLengths = {\n  neutral: neutralColors.length,\n  orange: orangeColors.length,\n  blue: blueColors.length,\n  yellow: yellowColors.length,\n  green: greenColors.length,\n  violet: violetColors.length,\n  pink: pinkColors.length,\n};\n"],"names":["variants","prefixes","colors","neutralColors","orangeColors","yellowColors","greenColors","blueColors","violetColors","pinkColors","secondaryColors","guiColors","aliasedColors","colorRoles","neutral","orange","secondary","gui","colorGroupLengths","length","blue","yellow","green","violet","pink"],"mappings":"AAOA,OAAO,MAAMA,SAAW,CAAC,GAAI,QAAQ,AAAU,AAI/C,QAAO,MAAMC,SAAW,CAAC,OAAQ,KAAM,OAAQ,KAAM,SAAS,AAAU,AAIxE,QAAO,MAAMC,OAAS,CACpB,UACA,SACA,OACA,SACA,QACA,SACA,OACD,AAAU,AAWX,QAAO,MAAMC,cAAgB,CAC3B,cACA,cACA,cACA,cACA,cACA,cACA,cACA,cACA,cACA,cACA,eACA,eACA,eACA,eACD,AAAU,AAEX,QAAO,MAAMC,aAAe,CAC1B,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACA,cACA,cACD,AAAU,AAEX,QAAO,MAAMC,aAAe,CAC1B,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACD,AAAU,AAEX,QAAO,MAAMC,YAAc,CACzB,YACA,YACA,YACA,YACA,YACA,YACA,YACA,YACA,YACD,AAAU,AAEX,QAAO,MAAMC,WAAa,CACxB,WACA,WACA,WACA,WACA,WACA,WACA,WACA,WACA,WACD,AAAU,AAEX,QAAO,MAAMC,aAAe,CAC1B,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACD,AAAU,AAEX,QAAO,MAAMC,WAAa,CACxB,WACA,WACA,WACA,WACA,WACA,WACA,WACA,WACA,WACD,AAAU,CAEX,MAAMC,gBAAkB,IACnBL,gBACAC,eACAC,cACAC,gBACAC,WACJ,CAED,MAAME,UAAY,CAChB,yBACA,uBACA,wBACA,wBACA,sBACA,uBACA,iBACA,kBACA,oBACA,gBACA,YACA,oBACA,cACD,AAED,QAAO,MAAMC,cAAgB,CAC3B,QACA,mBACA,aACA,WACA,YACA,gBACA,aACA,gBACA,aACA,aACA,gBACA,cACA,aACA,cACA,YACA,aACA,YACA,cACA,mBACA,iBACA,kBACA,cACD,AAAU,AAEX,QAAO,MAAMC,WAAa,CACxBC,QAASX,cACTY,OAAQX,aACRY,UAAWN,gBACXO,IAAKN,SACP,CAAE,AAEF,QAAO,MAAMO,kBAAoB,CAC/BJ,QAASX,cAAcgB,MAAM,CAC7BJ,OAAQX,aAAae,MAAM,CAC3BC,KAAMb,WAAWY,MAAM,CACvBE,OAAQhB,aAAac,MAAM,CAC3BG,MAAOhB,YAAYa,MAAM,CACzBI,OAAQf,aAAaW,MAAM,CAC3BK,KAAMf,WAAWU,MAAM,AACzB,CAAE"}
+{"version":3,"sources":["../../../../src/core/styles/colors/types.ts"],"sourcesContent":["export type ColorName =\n  | (typeof neutralColors)[number]\n  | (typeof orangeColors)[number]\n  | (typeof secondaryColors)[number]\n  | (typeof guiColors)[number]\n  | (typeof aliasedColors)[number];\n\nexport const variants = [\"\", \"dark:\"] as const;\n\ntype ColorClassVariants = (typeof variants)[number];\n\nexport const prefixes = [\"text\", \"bg\", \"from\", \"to\", \"border\"] as const;\n\ntype ColorClassPrefixes = (typeof prefixes)[number];\n\nexport const colors = [\n  \"neutral\",\n  \"orange\",\n  \"blue\",\n  \"yellow\",\n  \"green\",\n  \"violet\",\n  \"pink\",\n] as const;\n\nexport type ColorClassColorGroups = (typeof colors)[number];\n\nexport type Theme = \"light\" | \"dark\";\n\nexport type ColorClass =\n  `${ColorClassVariants}${ColorClassPrefixes}-${ColorName}`;\n\nexport type ColorThemeSet = `${string} dark:${string}`;\n\nexport const neutralColors = [\n  \"neutral-000\",\n  \"neutral-100\",\n  \"neutral-200\",\n  \"neutral-300\",\n  \"neutral-400\",\n  \"neutral-500\",\n  \"neutral-600\",\n  \"neutral-700\",\n  \"neutral-800\",\n  \"neutral-900\",\n  \"neutral-1000\",\n  \"neutral-1100\",\n  \"neutral-1200\",\n  \"neutral-1300\",\n] as const;\n\nexport const orangeColors = [\n  \"orange-100\",\n  \"orange-200\",\n  \"orange-300\",\n  \"orange-400\",\n  \"orange-500\",\n  \"orange-600\",\n  \"orange-700\",\n  \"orange-800\",\n  \"orange-900\",\n  \"orange-1000\",\n  \"orange-1100\",\n] as const;\n\nexport const yellowColors = [\n  \"yellow-100\",\n  \"yellow-200\",\n  \"yellow-300\",\n  \"yellow-400\",\n  \"yellow-500\",\n  \"yellow-600\",\n  \"yellow-700\",\n  \"yellow-800\",\n  \"yellow-900\",\n] as const;\n\nexport const greenColors = [\n  \"green-100\",\n  \"green-200\",\n  \"green-300\",\n  \"green-400\",\n  \"green-500\",\n  \"green-600\",\n  \"green-700\",\n  \"green-800\",\n  \"green-900\",\n] as const;\n\nexport const blueColors = [\n  \"blue-100\",\n  \"blue-200\",\n  \"blue-300\",\n  \"blue-400\",\n  \"blue-500\",\n  \"blue-600\",\n  \"blue-700\",\n  \"blue-800\",\n  \"blue-900\",\n] as const;\n\nexport const violetColors = [\n  \"violet-100\",\n  \"violet-200\",\n  \"violet-300\",\n  \"violet-400\",\n  \"violet-500\",\n  \"violet-600\",\n  \"violet-700\",\n  \"violet-800\",\n  \"violet-900\",\n] as const;\n\nexport const pinkColors = [\n  \"pink-100\",\n  \"pink-200\",\n  \"pink-300\",\n  \"pink-400\",\n  \"pink-500\",\n  \"pink-600\",\n  \"pink-700\",\n  \"pink-800\",\n  \"pink-900\",\n] as const;\n\nexport const secondaryColors = [\n  ...yellowColors,\n  ...greenColors,\n  ...blueColors,\n  ...violetColors,\n  ...pinkColors,\n] as const;\n\nexport const guiColors = [\n  \"gui-blue-default-light\",\n  \"gui-blue-hover-light\",\n  \"gui-blue-active-light\",\n  \"gui-blue-default-dark\",\n  \"gui-blue-hover-dark\",\n  \"gui-blue-active-dark\",\n  \"gui-blue-focus\",\n  \"gui-disabled-light\",\n  \"gui-disabled-dark\",\n  \"gui-success-green\",\n  \"gui-error-red\",\n  \"gui-focus\",\n  \"gui-focus-outline\",\n  \"gui-visited\",\n] as const;\n\nexport const aliasedColors = [\n  \"white\",\n  \"extra-light-grey\",\n  \"light-grey\",\n  \"mid-grey\",\n  \"dark-grey\",\n  \"charcoal-grey\",\n  \"cool-black\",\n  \"active-orange\",\n  \"bright-red\",\n  \"red-orange\",\n  \"electric-cyan\",\n  \"zingy-green\",\n  \"jazzy-pink\",\n  \"gui-default\",\n  \"gui-hover\",\n  \"gui-active\",\n  \"gui-error\",\n  \"gui-success\",\n  \"gui-default-dark\",\n  \"gui-hover-dark\",\n  \"gui-active-dark\",\n  \"transparent\",\n] as const;\n\nexport const colorRoles = {\n  neutral: neutralColors,\n  orange: orangeColors,\n  secondary: secondaryColors,\n  gui: guiColors,\n};\n\nexport const colorGroupLengths = {\n  neutral: neutralColors.length,\n  orange: orangeColors.length,\n  blue: blueColors.length,\n  yellow: yellowColors.length,\n  green: greenColors.length,\n  violet: violetColors.length,\n  pink: pinkColors.length,\n};\n"],"names":["variants","prefixes","colors","neutralColors","orangeColors","yellowColors","greenColors","blueColors","violetColors","pinkColors","secondaryColors","guiColors","aliasedColors","colorRoles","neutral","orange","secondary","gui","colorGroupLengths","length","blue","yellow","green","violet","pink"],"mappings":"AAOA,OAAO,MAAMA,SAAW,CAAC,GAAI,QAAQ,AAAU,AAI/C,QAAO,MAAMC,SAAW,CAAC,OAAQ,KAAM,OAAQ,KAAM,SAAS,AAAU,AAIxE,QAAO,MAAMC,OAAS,CACpB,UACA,SACA,OACA,SACA,QACA,SACA,OACD,AAAU,AAWX,QAAO,MAAMC,cAAgB,CAC3B,cACA,cACA,cACA,cACA,cACA,cACA,cACA,cACA,cACA,cACA,eACA,eACA,eACA,eACD,AAAU,AAEX,QAAO,MAAMC,aAAe,CAC1B,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACA,cACA,cACD,AAAU,AAEX,QAAO,MAAMC,aAAe,CAC1B,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACD,AAAU,AAEX,QAAO,MAAMC,YAAc,CACzB,YACA,YACA,YACA,YACA,YACA,YACA,YACA,YACA,YACD,AAAU,AAEX,QAAO,MAAMC,WAAa,CACxB,WACA,WACA,WACA,WACA,WACA,WACA,WACA,WACA,WACD,AAAU,AAEX,QAAO,MAAMC,aAAe,CAC1B,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACA,aACD,AAAU,AAEX,QAAO,MAAMC,WAAa,CACxB,WACA,WACA,WACA,WACA,WACA,WACA,WACA,WACA,WACD,AAAU,AAEX,QAAO,MAAMC,gBAAkB,IAC1BL,gBACAC,eACAC,cACAC,gBACAC,WACJ,AAAU,AAEX,QAAO,MAAME,UAAY,CACvB,yBACA,uBACA,wBACA,wBACA,sBACA,uBACA,iBACA,qBACA,oBACA,oBACA,gBACA,YACA,oBACA,cACD,AAAU,AAEX,QAAO,MAAMC,cAAgB,CAC3B,QACA,mBACA,aACA,WACA,YACA,gBACA,aACA,gBACA,aACA,aACA,gBACA,cACA,aACA,cACA,YACA,aACA,YACA,cACA,mBACA,iBACA,kBACA,cACD,AAAU,AAEX,QAAO,MAAMC,WAAa,CACxBC,QAASX,cACTY,OAAQX,aACRY,UAAWN,gBACXO,IAAKN,SACP,CAAE,AAEF,QAAO,MAAMO,kBAAoB,CAC/BJ,QAASX,cAAcgB,MAAM,CAC7BJ,OAAQX,aAAae,MAAM,CAC3BC,KAAMb,WAAWY,MAAM,CACvBE,OAAQhB,aAAac,MAAM,CAC3BG,MAAOhB,YAAYa,MAAM,CACzBI,OAAQf,aAAaW,MAAM,CAC3BK,KAAMf,WAAWU,MAAM,AACzB,CAAE"}

package/core/styles/forms.css

@@ -59,11 +59,11 @@
   }
 
   .ui-theme-dark .ui-checkbox-input:disabled + .ui-checkbox-styled {
-    @apply bg-neutral-1000 border border-gui-unavailable-dark;
+    @apply bg-neutral-1000 border border-gui-disabled-dark;
   }
 
   .ui-theme-dark .ui-checkbox-input:checked + .ui-checkbox-styled {
-    @apply bg-active-orange border-gui-unavailable-dark;
+    @apply bg-active-orange border-gui-disabled-dark;
   }
 
   .ui-textarea {
@@ -110,7 +110,7 @@
   }
 
   .ui-toggle input:disabled + .ui-toggle-slider {
-    @apply bg-gui-unavailable;
+    @apply bg-gui-disabled-light dark:bg-gui-disabled-dark;
   }
 
   .ui-toggle input:checked + .ui-toggle-slider:before {
@@ -132,11 +132,11 @@
   }
 
   .ui-input:disabled {
-    @apply bg-gui-unavailable placeholder-neutral-500 text-neutral-500;
+    @apply bg-gui-disabled-light placeholder-neutral-500 text-neutral-500;
   }
 
   .ui-theme-dark .ui-input:disabled {
-    @apply bg-gui-unavailable-dark text-neutral-800 placeholder-neutral-800;
+    @apply bg-gui-disabled-dark text-neutral-800 placeholder-neutral-800;
   }
 
   .ui-radio {

package/core/styles/legacy-buttons.css

@@ -4,7 +4,7 @@
     @apply hover:text-white hover:bg-neutral-1100;
     @apply active:text-white active:bg-neutral-1200;
     @apply focus:text-white focus:bg-cool-black focus-base;
-    @apply disabled:text-mid-grey disabled:bg-gui-unavailable disabled:cursor-not-allowed;
+    @apply disabled:text-mid-grey disabled:bg-gui-disabled-light disabled:cursor-not-allowed;
     @apply transition-colors;
     @apply inline-flex items-center justify-center;
   }
@@ -36,7 +36,7 @@
 
   .ui-btn-alt:disabled {
     background: linear-gradient(var(--gradient-transparent));
-    @apply bg-gui-unavailable text-mid-grey cursor-not-allowed;
+    @apply bg-gui-disabled-light text-mid-grey cursor-not-allowed;
   }
 
   .ui-btn-invert {
@@ -44,7 +44,7 @@
     @apply hover:text-white hover:bg-active-orange;
     @apply active:text-white active:bg-red-orange;
     @apply focus:text-white focus:bg-cool-black focus-base;
-    @apply disabled:text-mid-grey disabled:bg-gui-unavailable disabled:cursor-not-allowed;
+    @apply disabled:text-mid-grey disabled:bg-gui-disabled-light disabled:cursor-not-allowed;
     @apply transition-colors;
     @apply inline-flex items-center justify-center;
   }
@@ -54,7 +54,7 @@
     @apply hover:text-cool-black hover:border-active-orange hover:bg-white;
     @apply active:border-red-orange active:bg-white;
     @apply focus:border-cool-black focus:bg-white focus-base;
-    @apply disabled:text-gui-unavailable disabled:border-gui-unavailable disabled:bg-white disabled:cursor-not-allowed;
+    @apply disabled:text-gui-disabled-light disabled:border-gui-disabled-light disabled:bg-white disabled:cursor-not-allowed;
     @apply transition-colors;
     @apply inline-flex items-center justify-center;
   }
@@ -64,7 +64,7 @@
     @apply hover:text-white hover:border-active-orange;
     @apply active:border-red-orange;
     @apply focus-base;
-    @apply disabled:text-gui-unavailable disabled:border-gui-unavailable disabled:cursor-not-allowed;
+    @apply disabled:text-gui-disabled-light disabled:border-gui-disabled-light disabled:cursor-not-allowed;
     @apply transition-colors;
     @apply inline-flex items-center justify-center;
   }
@@ -82,14 +82,14 @@
   }
   .ui-btn.ui-btn-disabled,
   .ui-btn-invert.ui-btn-disabled {
-    @apply text-mid-grey bg-gui-unavailable cursor-not-allowed pointer-events-none select-none;
+    @apply text-mid-grey bg-gui-disabled-light cursor-not-allowed pointer-events-none select-none;
   }
 
   .ui-btn-secondary.ui-btn-disabled {
-    @apply text-gui-unavailable border-gui-unavailable bg-white cursor-not-allowed pointer-events-none select-none;
+    @apply text-gui-disabled-light border-gui-disabled-light bg-white cursor-not-allowed pointer-events-none select-none;
   }
 
   .ui-btn-secondary-invert.ui-btn-disabled {
-    @apply text-gui-unavailable border-gui-unavailable cursor-not-allowed pointer-events-none select-none;
+    @apply text-gui-disabled-light border-gui-disabled-light cursor-not-allowed pointer-events-none select-none;
   }
 }

package/core/styles/properties.css

@@ -10,8 +10,8 @@
     --color-neutral-600: #a7b1be;
     --color-neutral-700: #8992a4;
     --color-neutral-800: #687288;
-    --color-neutral-900: #5b5a72;
-    --color-neutral-1000: #434356;
+    --color-neutral-900: #575d71;
+    --color-neutral-1000: #3f4555;
     --color-neutral-1100: #2c3344;
     --color-neutral-1200: #141924;
     --color-neutral-1300: #03020d;
@@ -85,8 +85,8 @@
     --color-gui-blue-hover-dark: #2894ff;
     --color-gui-blue-active-dark: #0080ff;
     --color-gui-blue-focus: #80b9f2;
-    --color-gui-unavailable: #a8a8a8;
-    --color-gui-unavailable-dark: #575757;
+    --color-gui-disabled-light: #afb9c5;
+    --color-gui-disabled-dark: #676b7a;
     --color-gui-success-green: #11cb24;
     --color-gui-error-red: #fb0c0c;
     --color-gui-focus: #80b9f2;

package/core/styles/text.css

@@ -159,13 +159,13 @@
 
   .ui-link {
     @apply text-gui-default;
-    @apply hover:text-gui-hover active:text-gui-active disabled:text-gui-unavailable;
+    @apply hover:text-gui-hover active:text-gui-active disabled:text-gui-disabled-light dark:disabled:text-gui-disabled-dark;
     @apply focus:text-gui-default focus-base;
     @apply no-underline;
   }
 
   .ui-link-neutral {
-    @apply hover:text-dark-grey active:text-cool-black disabled:text-gui-unavailable;
+    @apply hover:text-dark-grey active:text-cool-black disabled:text-gui-disabled-light dark:disabled:text-gui-disabled-dark;
     @apply focus:text-charcoal-grey focus-base;
     @apply underline;
   }

package/core/styles.components.css

@@ -38,19 +38,19 @@
      in a way that handles margin collapsing as well (hence not an exact opposite) */
   .ui-section-spacing-collapse,
   .ui-section-spacing-collapse-full {
-    @apply -my-4 sm:-my-8 md:-my-16;
+    @apply -my-4 sm:-my-8 md:-my-16 first:-mb-8 sm:first:-mb-16 md:first:-mb-32 last:-mt-8 sm:last:-mt-16 md:last:-mt-32;
   }
 
   .ui-section-spacing-collapse-half {
-    @apply -my-2 sm:-my-4 md:-my-8;
+    @apply -my-2 sm:-my-4 md:-my-8 first:-mb-4 sm:first:-mb-8 md:first:-mb-16 last:-mt-4 sm:last:-mt-8 md:last:-mt-16;
   }
 
   .ui-section-spacing-collapse-quarter {
-    @apply -my-1 sm:-my-2 md:-my-4;
+    @apply -my-1 sm:-my-2 md:-my-4 first:-mb-2 sm:first:-mb-4 md:first:-mb-8 last:-mt-2 sm:last:-mt-4 md:last:-mt-8;
   }
 
   .ui-section-spacing-collapse-eighth {
-    @apply -my-0.5 sm:-my-1 md:-my-2;
+    @apply -my-0.5 sm:-my-1 md:-my-2 first:-mb-1 sm:first:-mb-2 md:first:-mb-4 last:-mt-1 sm:last:-mt-2 md:last:-mt-4;
   }
 
   .ui-content-spacing {

package/core/utils/syntax-highlighter.css

@@ -128,4 +128,35 @@
   .ui-theme-dark .hljs-tag {
     /* purposely ignored */
   }
+
+  /* Line highlighting styles – rail + subtle tint */
+  .code-line-addition {
+    background-color: var(--color-green-100);
+    box-shadow: inset 3px 0 0 var(--color-green-400);
+  }
+
+  .code-line-removal {
+    background-color: var(--color-orange-100);
+    box-shadow: inset 3px 0 0 var(--color-gui-error-red);
+  }
+
+  .code-line-highlight {
+    background-color: var(--color-yellow-100);
+    box-shadow: inset 3px 0 0 var(--color-yellow-400);
+  }
+
+  .ui-theme-dark .code-line-addition {
+    background-color: var(--color-green-900);
+    box-shadow: inset 3px 0 0 var(--color-green-600);
+  }
+
+  .ui-theme-dark .code-line-removal {
+    background-color: var(--color-orange-1100);
+    box-shadow: inset 3px 0 0 var(--color-gui-error-red);
+  }
+
+  .ui-theme-dark .code-line-highlight {
+    background-color: var(--color-yellow-900);
+    box-shadow: inset 3px 0 0 var(--color-yellow-600);
+  }
 }

package/core/utils/syntax-highlighter.js

@@ -1,2 +1,2 @@
-import hljs from"highlight.js/lib/core";const languageToHighlightKey=lang=>{let id;if(!lang){lang="text"}switch(lang.toLowerCase()){case"android":id="java";break;case".net":case"net":case"dotnet":case"csharp":case"c#":id="cs";break;case"objc":case"objective c":id="objectivec";break;case"laravel":id="php";break;case"flutter":id="dart";break;case"node.js":case"js":id="javascript";break;case"ts":id="typescript";break;case"kotlin":case"kt":id="kotlin";break;case"shell":case"fh":case"sh":id="bash";break;case"https":case"http":case"txt":case"plaintext":id="text";break;case"cmd":case"bat":id="dos";break;case"yml":id="yaml";break;case"erl":id="erlang";break;case"patch":id="diff";break;case"svg":id="xml";break;default:break}return id||lang};const registerDefaultLanguages=register=>{register.forEach(({key,module})=>hljs.registerLanguage(key,module))};const highlightSnippet=(languageKeyword,snippet)=>{const language=languageToHighlightKey(languageKeyword);if(typeof snippet!=="string"||!snippet||!language)return;return hljs.highlight(snippet,{language}).value};export{highlightSnippet,languageToHighlightKey,registerDefaultLanguages};
+import hljs from"highlight.js/lib/core";const languageToHighlightKey=lang=>{let id;if(!lang){lang="text"}switch(lang.toLowerCase()){case"android":id="java";break;case".net":case"net":case"dotnet":case"csharp":case"c#":id="cs";break;case"objc":case"objective c":id="objectivec";break;case"laravel":id="php";break;case"flutter":id="dart";break;case"node.js":case"js":id="javascript";break;case"ts":id="typescript";break;case"kotlin":case"kt":id="kotlin";break;case"shell":case"fh":case"sh":id="bash";break;case"https":case"http":case"txt":case"plaintext":id="text";break;case"cmd":case"bat":id="dos";break;case"yml":id="yaml";break;case"erl":id="erlang";break;case"patch":id="diff";break;case"svg":id="xml";break;default:break}return id||lang};const registerDefaultLanguages=register=>{register.forEach(({key,module})=>hljs.registerLanguage(key,module))};const highlightSnippet=(languageKeyword,snippet)=>{const language=languageToHighlightKey(languageKeyword);if(typeof snippet!=="string"||!snippet||!language)return;return hljs.highlight(snippet,{language}).value};const parseLineHighlights=(languageString,meta)=>{if(!meta){return{lang:languageString,highlights:{}}}const match=meta.match(/highlight=["']?([^"']+)["']?/);if(!match){return{lang:languageString,highlights:{}}}const spec=match[1];const highlights={};const tokens=spec.split(",");for(const token of tokens){const trimmed=token.trim();if(!trimmed)continue;let type="highlight";let rangePart=trimmed;if(trimmed.startsWith("+")){type="addition";rangePart=trimmed.slice(1)}else if(trimmed.startsWith("-")){type="removal";rangePart=trimmed.slice(1)}const rangeMatch=rangePart.match(/^(\d+)(?:-(\d+))?$/);if(!rangeMatch)continue;const start=parseInt(rangeMatch[1],10);const end=rangeMatch[2]?parseInt(rangeMatch[2],10):start;for(let i=start;i<=end;i++){highlights[i]=type}}return{lang:languageString,highlights}};const splitHtmlLines=html=>{const rawLines=html.split("\n");const result=[];let openTags=[];for(const rawLine of rawLines){let line=openTags.join("")+rawLine;const tagPattern=/<(\/?)span([^>]*)>/g;let m;while((m=tagPattern.exec(rawLine))!==null){if(m[1]==="/"){openTags.pop()}else{openTags.push(m[0])}}for(let i=0;i<openTags.length;i++){line+="</span>"}result.push(line)}return result};const LINE_HIGHLIGHT_CLASSES={addition:"code-line-addition",removal:"code-line-removal",highlight:"code-line-highlight"};export{highlightSnippet,languageToHighlightKey,LINE_HIGHLIGHT_CLASSES,parseLineHighlights,registerDefaultLanguages,splitHtmlLines};
 //# sourceMappingURL=syntax-highlighter.js.map

package/core/utils/syntax-highlighter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/utils/syntax-highlighter.js"],"sourcesContent":["import hljs from \"highlight.js/lib/core\";\n\n// Map certain frameworks, protocols etc to available langauage packs\nconst languageToHighlightKey = (lang) => {\n  let id;\n\n  if (!lang) {\n    lang = \"text\";\n  }\n\n  switch (lang.toLowerCase()) {\n    case \"android\":\n      id = \"java\";\n      break;\n\n    case \".net\":\n    case \"net\":\n    case \"dotnet\":\n    case \"csharp\":\n    case \"c#\":\n      id = \"cs\";\n      break;\n\n    case \"objc\":\n    case \"objective c\":\n      id = \"objectivec\";\n      break;\n\n    case \"laravel\":\n      id = \"php\";\n      break;\n\n    case \"flutter\":\n      id = \"dart\";\n      break;\n\n    case \"node.js\":\n    case \"js\":\n      id = \"javascript\";\n      break;\n\n    case \"ts\":\n      id = \"typescript\";\n      break;\n\n    case \"kotlin\":\n    case \"kt\":\n      id = \"kotlin\";\n      break;\n\n    case \"shell\":\n    case \"fh\":\n    case \"sh\":\n      id = \"bash\";\n      break;\n\n    case \"https\":\n    case \"http\":\n    case \"txt\":\n    case \"plaintext\":\n      id = \"text\";\n      break;\n\n    case \"cmd\":\n    case \"bat\":\n      id = \"dos\";\n      break;\n\n    case \"yml\":\n      id = \"yaml\";\n      break;\n\n    case \"erl\":\n      id = \"erlang\";\n      break;\n\n    case \"patch\":\n      id = \"diff\";\n      break;\n\n    case \"svg\":\n      id = \"xml\";\n      break;\n\n    default:\n      break;\n  }\n\n  return id || lang;\n};\n\nconst registerDefaultLanguages = (register) => {\n  register.forEach(({ key, module }) => hljs.registerLanguage(key, module));\n};\n\nconst highlightSnippet = (languageKeyword, snippet) => {\n  const language = languageToHighlightKey(languageKeyword);\n  if (typeof snippet !== \"string\" || !snippet || !language) return;\n\n  return hljs.highlight(snippet, { language }).value;\n};\n\nexport { highlightSnippet, languageToHighlightKey, registerDefaultLanguages };\n"],"names":["hljs","languageToHighlightKey","lang","id","toLowerCase","registerDefaultLanguages","register","forEach","key","module","registerLanguage","highlightSnippet","languageKeyword","snippet","language","highlight","value"],"mappings":"AAAA,OAAOA,SAAU,uBAAwB,CAGzC,MAAMC,uBAAyB,AAACC,OAC9B,IAAIC,GAEJ,GAAI,CAACD,KAAM,CACTA,KAAO,MACT,CAEA,OAAQA,KAAKE,WAAW,IACtB,IAAK,UACHD,GAAK,OACL,KAEF,KAAK,OACL,IAAK,MACL,IAAK,SACL,IAAK,SACL,IAAK,KACHA,GAAK,KACL,KAEF,KAAK,OACL,IAAK,cACHA,GAAK,aACL,KAEF,KAAK,UACHA,GAAK,MACL,KAEF,KAAK,UACHA,GAAK,OACL,KAEF,KAAK,UACL,IAAK,KACHA,GAAK,aACL,KAEF,KAAK,KACHA,GAAK,aACL,KAEF,KAAK,SACL,IAAK,KACHA,GAAK,SACL,KAEF,KAAK,QACL,IAAK,KACL,IAAK,KACHA,GAAK,OACL,KAEF,KAAK,QACL,IAAK,OACL,IAAK,MACL,IAAK,YACHA,GAAK,OACL,KAEF,KAAK,MACL,IAAK,MACHA,GAAK,MACL,KAEF,KAAK,MACHA,GAAK,OACL,KAEF,KAAK,MACHA,GAAK,SACL,KAEF,KAAK,QACHA,GAAK,OACL,KAEF,KAAK,MACHA,GAAK,MACL,KAEF,SACE,KACJ,CAEA,OAAOA,IAAMD,IACf,EAEA,MAAMG,yBAA2B,AAACC,WAChCA,SAASC,OAAO,CAAC,CAAC,CAAEC,GAAG,CAAEC,MAAM,CAAE,GAAKT,KAAKU,gBAAgB,CAACF,IAAKC,QACnE,EAEA,MAAME,iBAAmB,CAACC,gBAAiBC,WACzC,MAAMC,SAAWb,uBAAuBW,iBACxC,GAAI,OAAOC,UAAY,UAAY,CAACA,SAAW,CAACC,SAAU,OAE1D,OAAOd,KAAKe,SAAS,CAACF,QAAS,CAAEC,QAAS,GAAGE,KAAK,AACpD,CAEA,QAASL,gBAAgB,CAAEV,sBAAsB,CAAEI,wBAAwB,CAAG"}
+{"version":3,"sources":["../../../src/core/utils/syntax-highlighter.js"],"sourcesContent":["import hljs from \"highlight.js/lib/core\";\n\n// Map certain frameworks, protocols etc to available langauage packs\nconst languageToHighlightKey = (lang) => {\n  let id;\n\n  if (!lang) {\n    lang = \"text\";\n  }\n\n  switch (lang.toLowerCase()) {\n    case \"android\":\n      id = \"java\";\n      break;\n\n    case \".net\":\n    case \"net\":\n    case \"dotnet\":\n    case \"csharp\":\n    case \"c#\":\n      id = \"cs\";\n      break;\n\n    case \"objc\":\n    case \"objective c\":\n      id = \"objectivec\";\n      break;\n\n    case \"laravel\":\n      id = \"php\";\n      break;\n\n    case \"flutter\":\n      id = \"dart\";\n      break;\n\n    case \"node.js\":\n    case \"js\":\n      id = \"javascript\";\n      break;\n\n    case \"ts\":\n      id = \"typescript\";\n      break;\n\n    case \"kotlin\":\n    case \"kt\":\n      id = \"kotlin\";\n      break;\n\n    case \"shell\":\n    case \"fh\":\n    case \"sh\":\n      id = \"bash\";\n      break;\n\n    case \"https\":\n    case \"http\":\n    case \"txt\":\n    case \"plaintext\":\n      id = \"text\";\n      break;\n\n    case \"cmd\":\n    case \"bat\":\n      id = \"dos\";\n      break;\n\n    case \"yml\":\n      id = \"yaml\";\n      break;\n\n    case \"erl\":\n      id = \"erlang\";\n      break;\n\n    case \"patch\":\n      id = \"diff\";\n      break;\n\n    case \"svg\":\n      id = \"xml\";\n      break;\n\n    default:\n      break;\n  }\n\n  return id || lang;\n};\n\nconst registerDefaultLanguages = (register) => {\n  register.forEach(({ key, module }) => hljs.registerLanguage(key, module));\n};\n\nconst highlightSnippet = (languageKeyword, snippet) => {\n  const language = languageToHighlightKey(languageKeyword);\n  if (typeof snippet !== \"string\" || !snippet || !language) return;\n\n  return hljs.highlight(snippet, { language }).value;\n};\n\n/**\n * Parse line highlight specifications from a meta string.\n *\n * Syntax: `highlight=\"+1-3,-5,7\"`\n *   - `+` prefix: addition (green)\n *   - `-` prefix: removal (red)\n *   - no prefix: neutral highlight (blue)\n *   - `N-M`: inclusive line range\n *   - comma-separated for multiple specs\n *\n * @param {string} languageString - the language, e.g. \"javascript\"\n * @param {string} [meta] - string containing highlight specs, e.g. 'highlight=\"+1-3,-5,7\"'\n * @returns {{ lang: string, highlights: Record<number, 'addition' | 'removal' | 'highlight'> }}\n */\nconst parseLineHighlights = (languageString, meta) => {\n  if (!meta) {\n    return { lang: languageString, highlights: {} };\n  }\n\n  const match = meta.match(/highlight=[\"']?([^\"']+)[\"']?/);\n  if (!match) {\n    return { lang: languageString, highlights: {} };\n  }\n\n  const spec = match[1];\n  const highlights = {};\n\n  const tokens = spec.split(\",\");\n  for (const token of tokens) {\n    const trimmed = token.trim();\n    if (!trimmed) continue;\n\n    let type = \"highlight\";\n    let rangePart = trimmed;\n\n    if (trimmed.startsWith(\"+\")) {\n      type = \"addition\";\n      rangePart = trimmed.slice(1);\n    } else if (trimmed.startsWith(\"-\")) {\n      type = \"removal\";\n      rangePart = trimmed.slice(1);\n    }\n\n    const rangeMatch = rangePart.match(/^(\\d+)(?:-(\\d+))?$/);\n    if (!rangeMatch) continue;\n\n    const start = parseInt(rangeMatch[1], 10);\n    const end = rangeMatch[2] ? parseInt(rangeMatch[2], 10) : start;\n\n    for (let i = start; i <= end; i++) {\n      highlights[i] = type;\n    }\n  }\n\n  return { lang: languageString, highlights };\n};\n\n/**\n * Split highlighted HTML by newlines, repairing any spans that cross\n * line boundaries so each line fragment is valid HTML.\n *\n * @param {string} html - HTML string produced by highlight.js\n * @returns {string[]} one HTML fragment per source line\n */\nconst splitHtmlLines = (html) => {\n  const rawLines = html.split(\"\\n\");\n  const result = [];\n  let openTags = [];\n\n  for (const rawLine of rawLines) {\n    let line = openTags.join(\"\") + rawLine;\n\n    // Process open/close tags in document order\n    const tagPattern = /<(\\/?)span([^>]*)>/g;\n    let m;\n    while ((m = tagPattern.exec(rawLine)) !== null) {\n      if (m[1] === \"/\") {\n        openTags.pop();\n      } else {\n        openTags.push(m[0]);\n      }\n    }\n\n    // Close any tags still open so this line is valid HTML\n    for (let i = 0; i < openTags.length; i++) {\n      line += \"</span>\";\n    }\n\n    result.push(line);\n  }\n\n  return result;\n};\n\nconst LINE_HIGHLIGHT_CLASSES = {\n  addition: \"code-line-addition\",\n  removal: \"code-line-removal\",\n  highlight: \"code-line-highlight\",\n};\n\nexport {\n  highlightSnippet,\n  languageToHighlightKey,\n  LINE_HIGHLIGHT_CLASSES,\n  parseLineHighlights,\n  registerDefaultLanguages,\n  splitHtmlLines,\n};\n"],"names":["hljs","languageToHighlightKey","lang","id","toLowerCase","registerDefaultLanguages","register","forEach","key","module","registerLanguage","highlightSnippet","languageKeyword","snippet","language","highlight","value","parseLineHighlights","languageString","meta","highlights","match","spec","tokens","split","token","trimmed","trim","type","rangePart","startsWith","slice","rangeMatch","start","parseInt","end","i","splitHtmlLines","html","rawLines","result","openTags","rawLine","line","join","tagPattern","m","exec","pop","push","length","LINE_HIGHLIGHT_CLASSES","addition","removal"],"mappings":"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"}

package/core/utils/syntax-highlighter.test.js

@@ -0,0 +1,2 @@
+import{describe,expect,it}from"vitest";import{splitHtmlLines,parseLineHighlights}from"./syntax-highlighter";describe("splitHtmlLines",()=>{it("splits plain text with no spans",()=>{expect(splitHtmlLines("hello\nworld")).toEqual(["hello","world"])});it("repairs a span crossing a line boundary",()=>{const html='<span class="a">hello\nworld</span>';expect(splitHtmlLines(html)).toEqual(['<span class="a">hello</span>','<span class="a">world</span>'])});it("handles close then open on the same line",()=>{const html='<span class="a">first\n</span><span class="b">second\nthird</span>';const result=splitHtmlLines(html);expect(result[0]).toBe('<span class="a">first</span>');expect(result[1]).toBe('<span class="a"></span><span class="b">second</span>');expect(result[2]).toBe('<span class="b">third</span>')});it("re-opens nested spans crossing lines",()=>{const html='<span class="a"><span class="b">text\nmore</span></span>';const result=splitHtmlLines(html);expect(result[0]).toBe('<span class="a"><span class="b">text</span></span>');expect(result[1]).toBe('<span class="a"><span class="b">more</span></span>')});it("preserves empty lines",()=>{expect(splitHtmlLines("line1\n\nline3")).toEqual(["line1","","line3"])});it("does not carry forward complete spans on one line",()=>{const html='<span class="a">x</span><span class="b">y</span>\nnext';expect(splitHtmlLines(html)).toEqual(['<span class="a">x</span><span class="b">y</span>',"next"])});it("handles a single line with no newlines",()=>{expect(splitHtmlLines('<span class="a">hello</span>')).toEqual(['<span class="a">hello</span>'])})});describe("parseLineHighlights",()=>{it("returns empty highlights when no meta is provided",()=>{expect(parseLineHighlights("javascript")).toEqual({lang:"javascript",highlights:{}})});it("parses addition ranges",()=>{const result=parseLineHighlights("js",'highlight="+1-3"');expect(result.highlights).toEqual({1:"addition",2:"addition",3:"addition"})});it("parses removal lines",()=>{const result=parseLineHighlights("js",'highlight="-5"');expect(result.highlights).toEqual({5:"removal"})});it("parses neutral highlight lines",()=>{const result=parseLineHighlights("js",'highlight="7"');expect(result.highlights).toEqual({7:"highlight"})});it("parses mixed specs",()=>{const result=parseLineHighlights("js",'highlight="+1-3,-5,7"');expect(result.highlights).toEqual({1:"addition",2:"addition",3:"addition",5:"removal",7:"highlight"})})});
+//# sourceMappingURL=syntax-highlighter.test.js.map

package/core/utils/syntax-highlighter.test.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/core/utils/syntax-highlighter.test.js"],"sourcesContent":["import { describe, expect, it } from \"vitest\";\n\nimport { splitHtmlLines, parseLineHighlights } from \"./syntax-highlighter\";\n\ndescribe(\"splitHtmlLines\", () => {\n  it(\"splits plain text with no spans\", () => {\n    expect(splitHtmlLines(\"hello\\nworld\")).toEqual([\"hello\", \"world\"]);\n  });\n\n  it(\"repairs a span crossing a line boundary\", () => {\n    const html = '<span class=\"a\">hello\\nworld</span>';\n    expect(splitHtmlLines(html)).toEqual([\n      '<span class=\"a\">hello</span>',\n      '<span class=\"a\">world</span>',\n    ]);\n  });\n\n  it(\"handles close then open on the same line\", () => {\n    const html =\n      '<span class=\"a\">first\\n</span><span class=\"b\">second\\nthird</span>';\n    const result = splitHtmlLines(html);\n\n    // Line 1: carries nothing, opens \"a\" → \"first\" with closing tag\n    expect(result[0]).toBe('<span class=\"a\">first</span>');\n    // Line 2: carries \"a\", raw line closes \"a\" then opens \"b\" → only \"b\" open\n    expect(result[1]).toBe(\n      '<span class=\"a\"></span><span class=\"b\">second</span>',\n    );\n    // Line 3: carries only \"b\"\n    expect(result[2]).toBe('<span class=\"b\">third</span>');\n  });\n\n  it(\"re-opens nested spans crossing lines\", () => {\n    const html = '<span class=\"a\"><span class=\"b\">text\\nmore</span></span>';\n    const result = splitHtmlLines(html);\n    expect(result[0]).toBe(\n      '<span class=\"a\"><span class=\"b\">text</span></span>',\n    );\n    expect(result[1]).toBe(\n      '<span class=\"a\"><span class=\"b\">more</span></span>',\n    );\n  });\n\n  it(\"preserves empty lines\", () => {\n    expect(splitHtmlLines(\"line1\\n\\nline3\")).toEqual([\"line1\", \"\", \"line3\"]);\n  });\n\n  it(\"does not carry forward complete spans on one line\", () => {\n    const html = '<span class=\"a\">x</span><span class=\"b\">y</span>\\nnext';\n    expect(splitHtmlLines(html)).toEqual([\n      '<span class=\"a\">x</span><span class=\"b\">y</span>',\n      \"next\",\n    ]);\n  });\n\n  it(\"handles a single line with no newlines\", () => {\n    expect(splitHtmlLines('<span class=\"a\">hello</span>')).toEqual([\n      '<span class=\"a\">hello</span>',\n    ]);\n  });\n});\n\ndescribe(\"parseLineHighlights\", () => {\n  it(\"returns empty highlights when no meta is provided\", () => {\n    expect(parseLineHighlights(\"javascript\")).toEqual({\n      lang: \"javascript\",\n      highlights: {},\n    });\n  });\n\n  it(\"parses addition ranges\", () => {\n    const result = parseLineHighlights(\"js\", 'highlight=\"+1-3\"');\n    expect(result.highlights).toEqual({\n      1: \"addition\",\n      2: \"addition\",\n      3: \"addition\",\n    });\n  });\n\n  it(\"parses removal lines\", () => {\n    const result = parseLineHighlights(\"js\", 'highlight=\"-5\"');\n    expect(result.highlights).toEqual({ 5: \"removal\" });\n  });\n\n  it(\"parses neutral highlight lines\", () => {\n    const result = parseLineHighlights(\"js\", 'highlight=\"7\"');\n    expect(result.highlights).toEqual({ 7: \"highlight\" });\n  });\n\n  it(\"parses mixed specs\", () => {\n    const result = parseLineHighlights(\"js\", 'highlight=\"+1-3,-5,7\"');\n    expect(result.highlights).toEqual({\n      1: \"addition\",\n      2: \"addition\",\n      3: \"addition\",\n      5: \"removal\",\n      7: \"highlight\",\n    });\n  });\n});\n"],"names":["describe","expect","it","splitHtmlLines","parseLineHighlights","toEqual","html","result","toBe","lang","highlights"],"mappings":"AAAA,OAASA,QAAQ,CAAEC,MAAM,CAAEC,EAAE,KAAQ,QAAS,AAE9C,QAASC,cAAc,CAAEC,mBAAmB,KAAQ,sBAAuB,CAE3EJ,SAAS,iBAAkB,KACzBE,GAAG,kCAAmC,KACpCD,OAAOE,eAAe,iBAAiBE,OAAO,CAAC,CAAC,QAAS,QAAQ,CACnE,GAEAH,GAAG,0CAA2C,KAC5C,MAAMI,KAAO,sCACbL,OAAOE,eAAeG,OAAOD,OAAO,CAAC,CACnC,+BACA,+BACD,CACH,GAEAH,GAAG,2CAA4C,KAC7C,MAAMI,KACJ,qEACF,MAAMC,OAASJ,eAAeG,MAG9BL,OAAOM,MAAM,CAAC,EAAE,EAAEC,IAAI,CAAC,gCAEvBP,OAAOM,MAAM,CAAC,EAAE,EAAEC,IAAI,CACpB,wDAGFP,OAAOM,MAAM,CAAC,EAAE,EAAEC,IAAI,CAAC,+BACzB,GAEAN,GAAG,uCAAwC,KACzC,MAAMI,KAAO,2DACb,MAAMC,OAASJ,eAAeG,MAC9BL,OAAOM,MAAM,CAAC,EAAE,EAAEC,IAAI,CACpB,sDAEFP,OAAOM,MAAM,CAAC,EAAE,EAAEC,IAAI,CACpB,qDAEJ,GAEAN,GAAG,wBAAyB,KAC1BD,OAAOE,eAAe,mBAAmBE,OAAO,CAAC,CAAC,QAAS,GAAI,QAAQ,CACzE,GAEAH,GAAG,oDAAqD,KACtD,MAAMI,KAAO,yDACbL,OAAOE,eAAeG,OAAOD,OAAO,CAAC,CACnC,mDACA,OACD,CACH,GAEAH,GAAG,yCAA0C,KAC3CD,OAAOE,eAAe,iCAAiCE,OAAO,CAAC,CAC7D,+BACD,CACH,EACF,GAEAL,SAAS,sBAAuB,KAC9BE,GAAG,oDAAqD,KACtDD,OAAOG,oBAAoB,eAAeC,OAAO,CAAC,CAChDI,KAAM,aACNC,WAAY,CAAC,CACf,EACF,GAEAR,GAAG,yBAA0B,KAC3B,MAAMK,OAASH,oBAAoB,KAAM,oBACzCH,OAAOM,OAAOG,UAAU,EAAEL,OAAO,CAAC,CAChC,EAAG,WACH,EAAG,WACH,EAAG,UACL,EACF,GAEAH,GAAG,uBAAwB,KACzB,MAAMK,OAASH,oBAAoB,KAAM,kBACzCH,OAAOM,OAAOG,UAAU,EAAEL,OAAO,CAAC,CAAE,EAAG,SAAU,EACnD,GAEAH,GAAG,iCAAkC,KACnC,MAAMK,OAASH,oBAAoB,KAAM,iBACzCH,OAAOM,OAAOG,UAAU,EAAEL,OAAO,CAAC,CAAE,EAAG,WAAY,EACrD,GAEAH,GAAG,qBAAsB,KACvB,MAAMK,OAASH,oBAAoB,KAAM,yBACzCH,OAAOM,OAAOG,UAAU,EAAEL,OAAO,CAAC,CAChC,EAAG,WACH,EAAG,WACH,EAAG,WACH,EAAG,UACH,EAAG,WACL,EACF,EACF"}