@pie-lib/render-ui 6.1.4-next.35 → 6.1.4-next.58

package/lib/color.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.white = exports.visualElementsColors = exports.v = exports.transparent = exports.text = exports.tertiaryLight = exports.tertiary = exports.secondaryText = exports.secondaryLight = exports.secondaryDark = exports.secondaryBackground = exports.secondary = exports.primaryText = exports.primaryLight = exports.primaryDark = exports.primary = exports.missingWithIcon = exports.missing = exports.keypadEmptyPlaceholder = exports.keypadButtonOperatorHover = exports.keypadButtonOperator = exports.keypadButtonHover = exports.keypadButton = exports.keyBoardFocusIndicator = exports.incorrectWithIcon = exports.incorrectSecondary = exports.incorrect = exports.focusUncheckedBorder = exports.focusUnchecked = exports.focusCheckedBorder = exports.focusChecked = exports.fadedPrimary = exports.dropdownBackground = exports.disabledSecondary = exports.disabled = exports.defaults = exports.correctWithIcon = exports.correctTertiary = exports.correctSecondary = exports.correct = exports.buttonHoverBg = exports.buttonBorder = exports.borderLight = exports.borderGray = exports.borderDark = exports.border = exports.blueGrey900 = exports.blueGrey600 = exports.blueGrey300 = exports.blueGrey100 = exports.black = exports.backgroundDark = exports.background = void 0;
+exports.white = exports.visualElementsColors = exports.v = exports.transparent = exports.text = exports.tertiaryLight = exports.tertiary = exports.tableStripe = exports.tableGridLight = exports.tableGrid = exports.secondaryText = exports.secondaryLight = exports.secondaryDark = exports.secondaryBackground = exports.secondary = exports.primaryText = exports.primaryLight = exports.primaryDark = exports.primary = exports.missingWithIcon = exports.missing = exports.keypadEmptyPlaceholder = exports.keypadButtonOperatorHover = exports.keypadButtonOperator = exports.keypadButtonHover = exports.keypadButton = exports.keyBoardFocusIndicator = exports.incorrectWithIcon = exports.incorrectSecondary = exports.incorrect = exports.focusUncheckedBorder = exports.focusUnchecked = exports.focusCheckedBorder = exports.focusChecked = exports.fadedPrimary = exports.dropdownBackground = exports.disabledSecondary = exports.disabled = exports.defaults = exports.correctWithIcon = exports.correctTertiary = exports.correctSecondary = exports.correct = exports.buttonHoverBg = exports.buttonFocusOutline = exports.buttonBorder = exports.borderLight = exports.borderGray = exports.borderDark = exports.border = exports.blueGrey900 = exports.blueGrey600 = exports.blueGrey300 = exports.blueGrey100 = exports.black = exports.backgroundDark = exports.background = void 0;
 var _colors = require("@mui/material/colors");
 var defaults = exports.defaults = {
   TEXT: 'black',
@@ -36,6 +36,10 @@ var defaults = exports.defaults = {
   BORDER_LIGHT: '#D1D1D1',
   BORDER_DARK: '#646464',
   BORDER_GRAY: '#7E8494',
+  // these are used for authored tables
+  TABLE_GRID: 'black',
+  TABLE_GRID_LIGHT: '#dfe2e5',
+  TABLE_STRIPE: '#f6f8fa',
   BLACK: '#000000',
   WHITE: '#ffffff',
   TRANSPARENT: 'transparent',
@@ -44,6 +48,8 @@ var defaults = exports.defaults = {
   FOCUS_CHECKED_BORDER: '#1565C0',
   FOCUS_UNCHECKED: '#E0E0E0',
   FOCUS_UNCHECKED_BORDER: '#757575',
+  // the keyboard focus ring on a button or toolbar control
+  BUTTON_FOCUS_OUTLINE: '#3B82F6',
   // this is used for select text tokens
   BLUE_GREY100: '#F3F5F7',
   BLUE_GREY300: '#C0C3CF',
@@ -168,6 +174,15 @@ var borderDark = exports.borderDark = function borderDark() {
 var borderGray = exports.borderGray = function borderGray() {
   return pv('border-gray', defaults.BORDER_GRAY);
 };
+var tableGrid = exports.tableGrid = function tableGrid() {
+  return pv('table-grid', 'text', defaults.TABLE_GRID);
+};
+var tableGridLight = exports.tableGridLight = function tableGridLight() {
+  return pv('table-grid-light', 'border-light', defaults.TABLE_GRID_LIGHT);
+};
+var tableStripe = exports.tableStripe = function tableStripe() {
+  return pv('table-stripe', 'background-dark', defaults.TABLE_STRIPE);
+};
 var black = exports.black = function black() {
   return pv('black', defaults.BLACK);
 };
@@ -189,6 +204,9 @@ var focusUnchecked = exports.focusUnchecked = function focusUnchecked() {
 var focusUncheckedBorder = exports.focusUncheckedBorder = function focusUncheckedBorder() {
   return pv('focus-unchecked-border', defaults.FOCUS_UNCHECKED_BORDER);
 };
+var buttonFocusOutline = exports.buttonFocusOutline = function buttonFocusOutline() {
+  return pv('button-focus-outline', defaults.BUTTON_FOCUS_OUTLINE);
+};
 var blueGrey100 = exports.blueGrey100 = function blueGrey100() {
   return pv('blue-grey-100', defaults.BLUE_GREY100);
 };

package/lib/color.js.map

@@ -1 +1 @@
-{"version":3,"file":"color.js","names":["_colors","require","defaults","exports","TEXT","DISABLED","DISABLED_SECONDARY","CORRECT","green","CORRECT_SECONDARY","CORRECT_TERTIARY","CORRECT_WITH_ICON","INCORRECT","orange","INCORRECT_SECONDARY","red","INCORRECT_WITH_ICON","MISSING","MISSING_WITH_ICON","PRIMARY","indigo","PRIMARY_LIGHT","PRIMARY_DARK","SECONDARY","pink","A400","SECONDARY_LIGHT","SECONDARY_DARK","TERTIARY","TERTIARY_LIGHT","BACKGROUND","BACKGROUND_DARK","DROPDOWN_BACKGROUND","SECONDARY_BACKGROUND","BORDER","BORDER_LIGHT","BORDER_DARK","BORDER_GRAY","BLACK","WHITE","TRANSPARENT","FOCUS_CHECKED","FOCUS_CHECKED_BORDER","FOCUS_UNCHECKED","FOCUS_UNCHECKED_BORDER","BLUE_GREY100","BLUE_GREY300","BLUE_GREY600","BLUE_GREY900","FADED_PRIMARY","KEYPAD_BUTTON","KEYPAD_BUTTON_OPERATOR","KEYPAD_EMPTY_PLACEHOLDER","KEYPAD_BUTTON_HOVER","KEYPAD_BUTTON_OPERATOR_HOVER","KEY_BOARD_FOCUS_INDICATOR","BUTTON_BORDER","BUTTON_HOVER_BG","Object","freeze","v","prefix","_len","arguments","length","args","Array","_key","fallback","pop","reduceRight","acc","concat","pv","text","disabled","disabledSecondary","correct","correctSecondary","correctTertiary","correctWithIcon","incorrect","incorrectWithIcon","incorrectSecondary","missing","missingWithIcon","primary","primaryLight","primaryDark","primaryText","fadedPrimary","secondary","secondaryLight","secondaryDark","secondaryText","background","backgroundDark","secondaryBackground","dropdownBackground","tertiary","tertiaryLight","border","borderLight","borderDark","borderGray","black","white","transparent","focusChecked","focusCheckedBorder","focusUnchecked","focusUncheckedBorder","blueGrey100","blueGrey300","blueGrey600","blueGrey900","keypadButton","keypadButtonOperator","keypadEmptyPlaceholder","keypadButtonHover","keypadButtonOperatorHover","keyBoardFocusIndicator","buttonBorder","buttonHoverBg","visualElementsColors","AXIS_LINE_COLOR","ROLLOVER_FILL_BAR_COLOR","GRIDLINES_COLOR","PLOT_FILL_COLOR","SHAPES_FILL_COLOR"],"sources":["../src/color.js"],"sourcesContent":["import { green, indigo, orange, pink, red } from '@mui/material/colors';\n\nexport const defaults = {\n  TEXT: 'black',\n  DISABLED: 'grey',\n  DISABLED_SECONDARY: '#ABABAB',\n  CORRECT: green[500],\n  CORRECT_SECONDARY: green[50],\n  CORRECT_TERTIARY: '#0EA449',\n  CORRECT_WITH_ICON: '#087D38',\n  INCORRECT: orange[500],\n  INCORRECT_SECONDARY: red[50],\n  INCORRECT_WITH_ICON: '#BF0D00',\n  MISSING: red[700],\n  MISSING_WITH_ICON: '#6A78A1',\n  PRIMARY: indigo[500],\n  PRIMARY_LIGHT: indigo[200],\n  PRIMARY_DARK: indigo[800],\n  SECONDARY: pink.A400,\n  SECONDARY_LIGHT: pink[200],\n  SECONDARY_DARK: pink[900],\n  TERTIARY: '#146EB3',\n  TERTIARY_LIGHT: '#D0E2F0',\n  BACKGROUND: 'rgba(255,255,255,0)',\n  BACKGROUND_DARK: '#ECEDF1',\n  DROPDOWN_BACKGROUND: '#E0E1E6', // this is used for inline-dropdown\n  // this is only used for multi-trait-rubric, we might want to use BACKGROUND_DARK instead\n  SECONDARY_BACKGROUND: 'rgba(241,241,241,1)',\n  BORDER: '#9A9A9A',\n  BORDER_LIGHT: '#D1D1D1',\n  BORDER_DARK: '#646464',\n  BORDER_GRAY: '#7E8494',\n  BLACK: '#000000',\n  WHITE: '#ffffff',\n  TRANSPARENT: 'transparent',\n  // this is used for multiple-choice accessibility\n  FOCUS_CHECKED: '#BBDEFB',\n  FOCUS_CHECKED_BORDER: '#1565C0',\n  FOCUS_UNCHECKED: '#E0E0E0',\n  FOCUS_UNCHECKED_BORDER: '#757575',\n  // this is used for select text tokens\n  BLUE_GREY100: '#F3F5F7',\n  BLUE_GREY300: '#C0C3CF',\n  BLUE_GREY600: '#7E8494',\n  BLUE_GREY900: '#152452',\n  // this is used for charting\n  FADED_PRIMARY: '#DCDAFB',\n  // these are used for the math keypad buttons\n  KEYPAD_BUTTON: 'rgb(188, 194, 229)',\n  KEYPAD_BUTTON_OPERATOR: 'rgb(255, 159, 192)',\n  KEYPAD_EMPTY_PLACEHOLDER: 'rgba(245, 0, 87, 0.4)',\n  KEYPAD_BUTTON_HOVER: 'rgb(214, 218, 239)',\n  KEYPAD_BUTTON_OPERATOR_HOVER: 'rgb(255, 197, 217)',\n  KEY_BOARD_FOCUS_INDICATOR: '#2B87FF',\n  // these are used for graphing UI elements\n  BUTTON_BORDER: 'rgba(0, 0, 0, 0.23)',\n  BUTTON_HOVER_BG: 'rgba(0, 0, 0, 0.08)',\n};\n\nObject.freeze(defaults);\n\nexport const v =\n  (prefix) =>\n  (...args) => {\n    const fallback = args.pop();\n    return args.reduceRight((acc, v) => {\n      return `var(--${prefix}-${v}, ${acc})`;\n    }, fallback);\n  };\n\nconst pv = v('pie');\n\nexport const text = () => pv('text', defaults.TEXT);\nexport const disabled = () => pv('disabled', defaults.DISABLED);\nexport const disabledSecondary = () => pv('disabled-secondary', defaults.DISABLED_SECONDARY);\nexport const correct = () => pv('correct', defaults.CORRECT);\nexport const correctSecondary = () => pv('correct-secondary', defaults.CORRECT_SECONDARY);\nexport const correctTertiary = () => pv('correct-tertiary', defaults.CORRECT_TERTIARY);\nexport const correctWithIcon = () => pv('correct-icon', defaults.CORRECT_WITH_ICON);\nexport const incorrect = () => pv('incorrect', defaults.INCORRECT);\nexport const incorrectWithIcon = () => pv('incorrect-icon', defaults.INCORRECT_WITH_ICON);\nexport const incorrectSecondary = () => pv('incorrect-secondary', defaults.INCORRECT_SECONDARY);\nexport const missing = () => pv('missing', defaults.MISSING);\nexport const missingWithIcon = () => pv('missing-icon', defaults.MISSING_WITH_ICON);\n\nexport const primary = () => pv('primary', defaults.PRIMARY);\nexport const primaryLight = () => pv('primary-light', defaults.PRIMARY_LIGHT);\nexport const primaryDark = () => pv('primary-dark', defaults.PRIMARY_DARK);\nexport const primaryText = () => pv('primary-text', 'text', defaults.TEXT);\nexport const fadedPrimary = () => pv('faded-primary', defaults.FADED_PRIMARY);\n\nexport const secondary = () => pv('secondary', defaults.SECONDARY);\nexport const secondaryLight = () => pv('secondary-light', defaults.SECONDARY_LIGHT);\nexport const secondaryDark = () => pv('secondary-dark', defaults.SECONDARY_DARK);\n\nexport const secondaryText = () => pv('secondary-text', 'text', defaults.TEXT);\nexport const background = () => pv('background', defaults.BACKGROUND);\nexport const backgroundDark = () => pv('background-dark', defaults.BACKGROUND_DARK);\nexport const secondaryBackground = () => pv('secondary-background', defaults.SECONDARY_BACKGROUND);\nexport const dropdownBackground = () => pv('dropdown-background', defaults.DROPDOWN_BACKGROUND);\n\nexport const tertiary = () => pv('tertiary', defaults.TERTIARY);\nexport const tertiaryLight = () => pv('tertiary-light', defaults.TERTIARY_LIGHT);\n\nexport const border = () => pv('border', defaults.BORDER);\nexport const borderLight = () => pv('border-light', defaults.BORDER_LIGHT);\nexport const borderDark = () => pv('border-dark', defaults.BORDER_DARK);\nexport const borderGray = () => pv('border-gray', defaults.BORDER_GRAY);\n\nexport const black = () => pv('black', defaults.BLACK);\nexport const white = () => pv('white', defaults.WHITE);\nexport const transparent = () => defaults.TRANSPARENT;\n\nexport const focusChecked = () => pv('focus-checked', defaults.FOCUS_CHECKED);\nexport const focusCheckedBorder = () => pv('focus-checked-border', defaults.FOCUS_CHECKED_BORDER);\nexport const focusUnchecked = () => pv('focus-unchecked', defaults.FOCUS_UNCHECKED);\nexport const focusUncheckedBorder = () => pv('focus-unchecked-border', defaults.FOCUS_UNCHECKED_BORDER);\n\nexport const blueGrey100 = () => pv('blue-grey-100', defaults.BLUE_GREY100);\nexport const blueGrey300 = () => pv('blue-grey-300', defaults.BLUE_GREY300);\nexport const blueGrey600 = () => pv('blue-grey-600', defaults.BLUE_GREY600);\nexport const blueGrey900 = () => pv('blue-grey-900', defaults.BLUE_GREY900);\n\nexport const keypadButton = () => pv('keypad-button', defaults.KEYPAD_BUTTON);\nexport const keypadButtonOperator = () => pv('keypad-button-operator', defaults.KEYPAD_BUTTON_OPERATOR);\nexport const keypadEmptyPlaceholder = () => pv('keypad-empty-placeholder', defaults.KEYPAD_EMPTY_PLACEHOLDER);\nexport const keypadButtonHover = () => pv('keypad-button-hover', defaults.KEYPAD_BUTTON_HOVER);\nexport const keypadButtonOperatorHover = () => pv('keypad-button-operator-hover', defaults.KEYPAD_BUTTON_OPERATOR_HOVER);\nexport const keyBoardFocusIndicator = () => pv('keyboard-focus-indicator', defaults.KEY_BOARD_FOCUS_INDICATOR);\nexport const buttonBorder = () => pv('button-border', defaults.BUTTON_BORDER);\nexport const buttonHoverBg = () => pv('button-hover-bg', defaults.BUTTON_HOVER_BG);\n\nexport const visualElementsColors = {\n  AXIS_LINE_COLOR: '#5A53C9',\n  ROLLOVER_FILL_BAR_COLOR: '#050F2D',\n  GRIDLINES_COLOR: '#8E88EA',\n  PLOT_FILL_COLOR: '#1463B3',\n  SHAPES_FILL_COLOR: '#7986cb',\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"color.js","names":["_colors","require","defaults","exports","TEXT","DISABLED","DISABLED_SECONDARY","CORRECT","green","CORRECT_SECONDARY","CORRECT_TERTIARY","CORRECT_WITH_ICON","INCORRECT","orange","INCORRECT_SECONDARY","red","INCORRECT_WITH_ICON","MISSING","MISSING_WITH_ICON","PRIMARY","indigo","PRIMARY_LIGHT","PRIMARY_DARK","SECONDARY","pink","A400","SECONDARY_LIGHT","SECONDARY_DARK","TERTIARY","TERTIARY_LIGHT","BACKGROUND","BACKGROUND_DARK","DROPDOWN_BACKGROUND","SECONDARY_BACKGROUND","BORDER","BORDER_LIGHT","BORDER_DARK","BORDER_GRAY","TABLE_GRID","TABLE_GRID_LIGHT","TABLE_STRIPE","BLACK","WHITE","TRANSPARENT","FOCUS_CHECKED","FOCUS_CHECKED_BORDER","FOCUS_UNCHECKED","FOCUS_UNCHECKED_BORDER","BUTTON_FOCUS_OUTLINE","BLUE_GREY100","BLUE_GREY300","BLUE_GREY600","BLUE_GREY900","FADED_PRIMARY","KEYPAD_BUTTON","KEYPAD_BUTTON_OPERATOR","KEYPAD_EMPTY_PLACEHOLDER","KEYPAD_BUTTON_HOVER","KEYPAD_BUTTON_OPERATOR_HOVER","KEY_BOARD_FOCUS_INDICATOR","BUTTON_BORDER","BUTTON_HOVER_BG","Object","freeze","v","prefix","_len","arguments","length","args","Array","_key","fallback","pop","reduceRight","acc","concat","pv","text","disabled","disabledSecondary","correct","correctSecondary","correctTertiary","correctWithIcon","incorrect","incorrectWithIcon","incorrectSecondary","missing","missingWithIcon","primary","primaryLight","primaryDark","primaryText","fadedPrimary","secondary","secondaryLight","secondaryDark","secondaryText","background","backgroundDark","secondaryBackground","dropdownBackground","tertiary","tertiaryLight","border","borderLight","borderDark","borderGray","tableGrid","tableGridLight","tableStripe","black","white","transparent","focusChecked","focusCheckedBorder","focusUnchecked","focusUncheckedBorder","buttonFocusOutline","blueGrey100","blueGrey300","blueGrey600","blueGrey900","keypadButton","keypadButtonOperator","keypadEmptyPlaceholder","keypadButtonHover","keypadButtonOperatorHover","keyBoardFocusIndicator","buttonBorder","buttonHoverBg","visualElementsColors","AXIS_LINE_COLOR","ROLLOVER_FILL_BAR_COLOR","GRIDLINES_COLOR","PLOT_FILL_COLOR","SHAPES_FILL_COLOR"],"sources":["../src/color.js"],"sourcesContent":["import { green, indigo, orange, pink, red } from '@mui/material/colors';\n\nexport const defaults = {\n  TEXT: 'black',\n  DISABLED: 'grey',\n  DISABLED_SECONDARY: '#ABABAB',\n  CORRECT: green[500],\n  CORRECT_SECONDARY: green[50],\n  CORRECT_TERTIARY: '#0EA449',\n  CORRECT_WITH_ICON: '#087D38',\n  INCORRECT: orange[500],\n  INCORRECT_SECONDARY: red[50],\n  INCORRECT_WITH_ICON: '#BF0D00',\n  MISSING: red[700],\n  MISSING_WITH_ICON: '#6A78A1',\n  PRIMARY: indigo[500],\n  PRIMARY_LIGHT: indigo[200],\n  PRIMARY_DARK: indigo[800],\n  SECONDARY: pink.A400,\n  SECONDARY_LIGHT: pink[200],\n  SECONDARY_DARK: pink[900],\n  TERTIARY: '#146EB3',\n  TERTIARY_LIGHT: '#D0E2F0',\n  BACKGROUND: 'rgba(255,255,255,0)',\n  BACKGROUND_DARK: '#ECEDF1',\n  DROPDOWN_BACKGROUND: '#E0E1E6', // this is used for inline-dropdown\n  // this is only used for multi-trait-rubric, we might want to use BACKGROUND_DARK instead\n  SECONDARY_BACKGROUND: 'rgba(241,241,241,1)',\n  BORDER: '#9A9A9A',\n  BORDER_LIGHT: '#D1D1D1',\n  BORDER_DARK: '#646464',\n  BORDER_GRAY: '#7E8494',\n  // these are used for authored tables\n  TABLE_GRID: 'black',\n  TABLE_GRID_LIGHT: '#dfe2e5',\n  TABLE_STRIPE: '#f6f8fa',\n  BLACK: '#000000',\n  WHITE: '#ffffff',\n  TRANSPARENT: 'transparent',\n  // this is used for multiple-choice accessibility\n  FOCUS_CHECKED: '#BBDEFB',\n  FOCUS_CHECKED_BORDER: '#1565C0',\n  FOCUS_UNCHECKED: '#E0E0E0',\n  FOCUS_UNCHECKED_BORDER: '#757575',\n  // the keyboard focus ring on a button or toolbar control\n  BUTTON_FOCUS_OUTLINE: '#3B82F6',\n  // this is used for select text tokens\n  BLUE_GREY100: '#F3F5F7',\n  BLUE_GREY300: '#C0C3CF',\n  BLUE_GREY600: '#7E8494',\n  BLUE_GREY900: '#152452',\n  // this is used for charting\n  FADED_PRIMARY: '#DCDAFB',\n  // these are used for the math keypad buttons\n  KEYPAD_BUTTON: 'rgb(188, 194, 229)',\n  KEYPAD_BUTTON_OPERATOR: 'rgb(255, 159, 192)',\n  KEYPAD_EMPTY_PLACEHOLDER: 'rgba(245, 0, 87, 0.4)',\n  KEYPAD_BUTTON_HOVER: 'rgb(214, 218, 239)',\n  KEYPAD_BUTTON_OPERATOR_HOVER: 'rgb(255, 197, 217)',\n  KEY_BOARD_FOCUS_INDICATOR: '#2B87FF',\n  // these are used for graphing UI elements\n  BUTTON_BORDER: 'rgba(0, 0, 0, 0.23)',\n  BUTTON_HOVER_BG: 'rgba(0, 0, 0, 0.08)',\n};\n\nObject.freeze(defaults);\n\nexport const v =\n  (prefix) =>\n  (...args) => {\n    const fallback = args.pop();\n    return args.reduceRight((acc, v) => {\n      return `var(--${prefix}-${v}, ${acc})`;\n    }, fallback);\n  };\n\nconst pv = v('pie');\n\nexport const text = () => pv('text', defaults.TEXT);\nexport const disabled = () => pv('disabled', defaults.DISABLED);\nexport const disabledSecondary = () => pv('disabled-secondary', defaults.DISABLED_SECONDARY);\nexport const correct = () => pv('correct', defaults.CORRECT);\nexport const correctSecondary = () => pv('correct-secondary', defaults.CORRECT_SECONDARY);\nexport const correctTertiary = () => pv('correct-tertiary', defaults.CORRECT_TERTIARY);\nexport const correctWithIcon = () => pv('correct-icon', defaults.CORRECT_WITH_ICON);\nexport const incorrect = () => pv('incorrect', defaults.INCORRECT);\nexport const incorrectWithIcon = () => pv('incorrect-icon', defaults.INCORRECT_WITH_ICON);\nexport const incorrectSecondary = () => pv('incorrect-secondary', defaults.INCORRECT_SECONDARY);\nexport const missing = () => pv('missing', defaults.MISSING);\nexport const missingWithIcon = () => pv('missing-icon', defaults.MISSING_WITH_ICON);\n\nexport const primary = () => pv('primary', defaults.PRIMARY);\nexport const primaryLight = () => pv('primary-light', defaults.PRIMARY_LIGHT);\nexport const primaryDark = () => pv('primary-dark', defaults.PRIMARY_DARK);\nexport const primaryText = () => pv('primary-text', 'text', defaults.TEXT);\nexport const fadedPrimary = () => pv('faded-primary', defaults.FADED_PRIMARY);\n\nexport const secondary = () => pv('secondary', defaults.SECONDARY);\nexport const secondaryLight = () => pv('secondary-light', defaults.SECONDARY_LIGHT);\nexport const secondaryDark = () => pv('secondary-dark', defaults.SECONDARY_DARK);\n\nexport const secondaryText = () => pv('secondary-text', 'text', defaults.TEXT);\nexport const background = () => pv('background', defaults.BACKGROUND);\nexport const backgroundDark = () => pv('background-dark', defaults.BACKGROUND_DARK);\nexport const secondaryBackground = () => pv('secondary-background', defaults.SECONDARY_BACKGROUND);\nexport const dropdownBackground = () => pv('dropdown-background', defaults.DROPDOWN_BACKGROUND);\n\nexport const tertiary = () => pv('tertiary', defaults.TERTIARY);\nexport const tertiaryLight = () => pv('tertiary-light', defaults.TERTIARY_LIGHT);\n\nexport const border = () => pv('border', defaults.BORDER);\nexport const borderLight = () => pv('border-light', defaults.BORDER_LIGHT);\nexport const borderDark = () => pv('border-dark', defaults.BORDER_DARK);\nexport const borderGray = () => pv('border-gray', defaults.BORDER_GRAY);\n\nexport const tableGrid = () => pv('table-grid', 'text', defaults.TABLE_GRID);\nexport const tableGridLight = () => pv('table-grid-light', 'border-light', defaults.TABLE_GRID_LIGHT);\nexport const tableStripe = () => pv('table-stripe', 'background-dark', defaults.TABLE_STRIPE);\n\nexport const black = () => pv('black', defaults.BLACK);\nexport const white = () => pv('white', defaults.WHITE);\nexport const transparent = () => defaults.TRANSPARENT;\n\nexport const focusChecked = () => pv('focus-checked', defaults.FOCUS_CHECKED);\nexport const focusCheckedBorder = () => pv('focus-checked-border', defaults.FOCUS_CHECKED_BORDER);\nexport const focusUnchecked = () => pv('focus-unchecked', defaults.FOCUS_UNCHECKED);\nexport const focusUncheckedBorder = () => pv('focus-unchecked-border', defaults.FOCUS_UNCHECKED_BORDER);\nexport const buttonFocusOutline = () => pv('button-focus-outline', defaults.BUTTON_FOCUS_OUTLINE);\n\nexport const blueGrey100 = () => pv('blue-grey-100', defaults.BLUE_GREY100);\nexport const blueGrey300 = () => pv('blue-grey-300', defaults.BLUE_GREY300);\nexport const blueGrey600 = () => pv('blue-grey-600', defaults.BLUE_GREY600);\nexport const blueGrey900 = () => pv('blue-grey-900', defaults.BLUE_GREY900);\n\nexport const keypadButton = () => pv('keypad-button', defaults.KEYPAD_BUTTON);\nexport const keypadButtonOperator = () => pv('keypad-button-operator', defaults.KEYPAD_BUTTON_OPERATOR);\nexport const keypadEmptyPlaceholder = () => pv('keypad-empty-placeholder', defaults.KEYPAD_EMPTY_PLACEHOLDER);\nexport const keypadButtonHover = () => pv('keypad-button-hover', defaults.KEYPAD_BUTTON_HOVER);\nexport const keypadButtonOperatorHover = () =>\n  pv('keypad-button-operator-hover', defaults.KEYPAD_BUTTON_OPERATOR_HOVER);\nexport const keyBoardFocusIndicator = () => pv('keyboard-focus-indicator', defaults.KEY_BOARD_FOCUS_INDICATOR);\nexport const buttonBorder = () => pv('button-border', defaults.BUTTON_BORDER);\nexport const buttonHoverBg = () => pv('button-hover-bg', defaults.BUTTON_HOVER_BG);\n\nexport const visualElementsColors = {\n  AXIS_LINE_COLOR: '#5A53C9',\n  ROLLOVER_FILL_BAR_COLOR: '#050F2D',\n  GRIDLINES_COLOR: '#8E88EA',\n  PLOT_FILL_COLOR: '#1463B3',\n  SHAPES_FILL_COLOR: '#7986cb',\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/preview-prompt.js

@@ -32,15 +32,26 @@ var StyledPromptContainer = (0, _styles.styled)('div')(function (_ref) {
     '&:not(.MathJax) > table:not([role="presentation"])': {
       borderCollapse: 'collapse'
     },
-    // Apply vertical striping when first column is a header (th) and NOT mixed with td
+    /*
+     * The editor writes border="1", and the UA answers it with `border-style: outset`
+     * on the table and `inset` on the cells -- which browsers paint as synthesized 3D
+     * shades rather than the colour the border resolves to, so the grid comes out grey
+     * on every scheme (1.19:1 on black-on-violet). `solid` is what removes the
+     * shading; without it, setting the colour has no effect.
+     */
+    '&:not(.MathJax) table[border]:not([role="presentation"]), &:not(.MathJax) table[border]:not([role="presentation"]) td, &:not(.MathJax) table[border]:not([role="presentation"]) th': {
+      borderStyle: 'solid',
+      borderColor: color.tableGrid()
+    },
+    // Apply vertical striping when first column is a header (th) and NOT mixed with td.
+    // Ink stays at 5.44:1 or better on tableStripe in every scheme, so the cell inherits
+    // its text colour rather than pinning the `color: black` this used to carry.
     '&:not(.MathJax) > table:not([role="presentation"]):has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)': {
-      backgroundColor: '#f6f8fa',
-      color: theme.palette.common.black
+      backgroundColor: color.tableStripe()
     },
     // Apply horizontal striping for tables where first element is a data cell (td)
     '&:not(.MathJax) > table:not([role="presentation"]):has(tbody tr > td:first-child) tbody tr:nth-child(even) td': {
-      backgroundColor: '#f6f8fa',
-      color: theme.palette.common.black
+      backgroundColor: color.tableStripe()
     },
     // align table content to left as per STAR requirement PD-3687
     '&:not(.MathJax) table:not([role="presentation"]) td, &:not(.MathJax) table:not([role="presentation"]) th': {
@@ -80,6 +91,10 @@ var StyledPromptContainer = (0, _styles.styled)('div')(function (_ref) {
 //Used these below to replace \\embed{newLine} with \\newline from prompt which will get parsed in MathJax
 var NEWLINE_BLOCK_REGEX = /\\embed\{newLine\}\[\]/g;
 var NEWLINE_LATEX = '\\newline ';
+
+// stable hook for 'is this node inside a prompt' checks - a class rather than an id,
+// so it stays valid when a page renders more than one prompt
+var PROMPT_CLASS = 'preview-prompt';
 var PreviewPrompt = exports.PreviewPrompt = /*#__PURE__*/function (_Component) {
   function PreviewPrompt() {
     var _this;
@@ -88,6 +103,7 @@ var PreviewPrompt = exports.PreviewPrompt = /*#__PURE__*/function (_Component) {
       args[_key] = arguments[_key];
     }
     _this = _callSuper(this, PreviewPrompt, [].concat(args));
+    (0, _defineProperty2["default"])(_this, "promptRef", /*#__PURE__*/_react["default"].createRef());
     (0, _defineProperty2["default"])(_this, "parsedText", function (text) {
       var customAudioButton = _this.props.customAudioButton;
       var div = document.createElement('div');
@@ -213,7 +229,7 @@ var PreviewPrompt = exports.PreviewPrompt = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderMathContent",
     value: function renderMathContent() {
-      var container = document.getElementById('preview-prompt');
+      var container = this.promptRef.current;
       if (container && typeof _mathRendering.renderMath === 'function') {
         (0, _mathRendering.renderMath)(container);
       }
@@ -221,39 +237,40 @@ var PreviewPrompt = exports.PreviewPrompt = /*#__PURE__*/function (_Component) {
   }, {
     key: "alignImages",
     value: function alignImages() {
-      var previewPrompts = document.querySelectorAll('#preview-prompt');
-      previewPrompts.forEach(function (previewPrompt) {
-        var images = previewPrompt.getElementsByTagName('img');
-        if (images && images.length) {
-          var _iterator = _createForOfIteratorHelper(images),
-            _step;
-          try {
-            for (_iterator.s(); !(_step = _iterator.n()).done;) {
-              var image = _step.value;
-              if (image.attributes && image.attributes.alignment && image.attributes.alignment.value) {
-                var alignment = image.attributes.alignment.value;
-                var justifyContent = alignment === 'center' ? 'center' : alignment === 'right' ? 'flex-end' : 'flex-start';
-                var parentNode = image.parentElement;
-                if (parentNode.tagName === 'DIV' && parentNode.style.display === 'flex' && parentNode.style.width === '100%') {
-                  parentNode.style.justifyContent = justifyContent;
-                } else {
-                  var div = document.createElement('div');
-                  div.style.display = 'flex';
-                  div.style.width = '100%';
-                  div.style.justifyContent = justifyContent;
-                  var copyImage = image.cloneNode(true);
-                  div.appendChild(copyImage);
-                  parentNode.replaceChild(div, image);
-                }
+      var previewPrompt = this.promptRef.current;
+      if (!previewPrompt) {
+        return;
+      }
+      var images = previewPrompt.getElementsByTagName('img');
+      if (images && images.length) {
+        var _iterator = _createForOfIteratorHelper(images),
+          _step;
+        try {
+          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+            var image = _step.value;
+            if (image.attributes && image.attributes.alignment && image.attributes.alignment.value) {
+              var alignment = image.attributes.alignment.value;
+              var justifyContent = alignment === 'center' ? 'center' : alignment === 'right' ? 'flex-end' : 'flex-start';
+              var parentNode = image.parentElement;
+              if (parentNode.tagName === 'DIV' && parentNode.style.display === 'flex' && parentNode.style.width === '100%') {
+                parentNode.style.justifyContent = justifyContent;
+              } else {
+                var div = document.createElement('div');
+                div.style.display = 'flex';
+                div.style.width = '100%';
+                div.style.justifyContent = justifyContent;
+                var copyImage = image.cloneNode(true);
+                div.appendChild(copyImage);
+                parentNode.replaceChild(div, image);
               }
             }
-          } catch (err) {
-            _iterator.e(err);
-          } finally {
-            _iterator.f();
           }
+        } catch (err) {
+          _iterator.e(err);
+        } finally {
+          _iterator.f();
         }
-      });
+      }
     }
   }, {
     key: "render",
@@ -266,10 +283,10 @@ var PreviewPrompt = exports.PreviewPrompt = /*#__PURE__*/function (_Component) {
         defaultClassName = _this$props2.defaultClassName;
       // legend tag was added once with accessibility tasks, we need extra style to make it work with images alignment
       var legendClass = tagName === 'legend' ? 'legend' : '';
-      var customClasses = "".concat(className || '', " ").concat(defaultClassName || '', " ").concat(legendClass).trim();
+      var customClasses = "".concat(className || '', " ").concat(defaultClassName || '', " ").concat(legendClass, " ").concat(PROMPT_CLASS).trim();
       return /*#__PURE__*/_react["default"].createElement(StyledPromptContainer, {
         as: tagName || 'div',
-        id: 'preview-prompt',
+        ref: this.promptRef,
         onClick: onClick,
         className: customClasses,
         tagName: tagName,

package/lib/preview-prompt.js.map

@@ -1 +1 @@
-{"version":3,"file":"preview-prompt.js","names":["_react","_interopRequireWildcard","require","_styles","_propTypes","_interopRequireDefault","color","_mathRendering","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_createForOfIteratorHelper","Symbol","iterator","Array","isArray","_unsupportedIterableToArray","length","_n","F","s","done","value","TypeError","a","u","next","_arrayLikeToArray","toString","slice","constructor","name","from","test","_callSuper","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","apply","Boolean","prototype","valueOf","StyledPromptContainer","styled","_ref","theme","tagName","borderCollapse","backgroundColor","palette","common","black","padding","textAlign","verticalAlign","text","width","fontSize","paddingLeft","spacing","paddingBottom","concat","display","flexDirection","cursor","margin","NEWLINE_BLOCK_REGEX","NEWLINE_LATEX","PreviewPrompt","exports","_Component","_this","_classCallCheck2","_len","arguments","args","_key","_defineProperty2","customAudioButton","props","div","document","createElement","innerHTML","audio","querySelector","source","setAttribute","getAttribute","removeAttribute","appendChild","style","playButton","id","assign","height","backgroundImage","pauseImage","backgroundSize","borderRadius","border","parentNode","insertBefore","_inherits2","_createClass2","key","addCustomAudioButtonControls","_this$props","autoplayAudioEnabled","getElementById","play","then","addEventListener","handleAudioEnded","error","console","handlePlayClick","paused","includes","playImage","handleAudioPlay","handleAudioPause","_handlePlayClick","_handleAudioPlay","_handleAudioPause","_handleAudioEnded","removeCustomAudioButtonListeners","removeEventListener","componentDidMount","alignImages","setupMathRendering","componentDidUpdate","prevProps","prompt","renderMathContent","componentWillUnmount","container","renderMath","previewPrompts","querySelectorAll","forEach","previewPrompt","images","getElementsByTagName","_iterator","_step","image","attributes","alignment","justifyContent","parentElement","copyImage","cloneNode","replaceChild","err","render","_this$props2","className","onClick","defaultClassName","legendClass","customClasses","trim","as","dangerouslySetInnerHTML","__html","parsedText","replace","Component","PropTypes","string","func","bool","_default"],"sources":["../src/preview-prompt.jsx"],"sourcesContent":["import React, { Component } from 'react';\nimport { styled } from '@mui/material/styles';\nimport PropTypes from 'prop-types';\nimport * as color from './color';\nimport { renderMath } from '@pie-lib/math-rendering';\n\nconst StyledPromptContainer = styled('div')(({ theme, tagName }) => ({\n  // presentation tables should not have any custom style\n  // Base promptTable styles\n  '&:not(.MathJax) > table:not([role=\"presentation\"])': {\n    borderCollapse: 'collapse',\n  },\n  // Apply vertical striping when first column is a header (th) and NOT mixed with td\n  '&:not(.MathJax) > table:not([role=\"presentation\"]):has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)':\n    {\n      backgroundColor: '#f6f8fa',\n      color: theme.palette.common.black,\n    },\n  // Apply horizontal striping for tables where first element is a data cell (td)\n  '&:not(.MathJax) > table:not([role=\"presentation\"]):has(tbody tr > td:first-child) tbody tr:nth-child(even) td': {\n    backgroundColor: '#f6f8fa',\n    color: theme.palette.common.black,\n  },\n  // align table content to left as per STAR requirement PD-3687\n  '&:not(.MathJax) table:not([role=\"presentation\"]) td, &:not(.MathJax) table:not([role=\"presentation\"]) th': {\n    padding: '.6em 1em',\n    textAlign: 'left',\n  },\n  // added this to fix alignment of text in prompt imported from studio (PD-3423)\n  '&:not(.MathJax) > table td > p.kds-indent': {\n    textAlign: 'initial',\n  },\n\n  // Conditional styles based on class names\n  '&.prompt': {\n    verticalAlign: 'middle',\n    color: color.text(),\n  },\n  '&.legend': {\n    width: '100%',\n    fontSize: 'inherit !important',\n  },\n  '&.rationale': {\n    paddingLeft: theme.spacing(4),\n    paddingBottom: theme.spacing(1),\n  },\n  '&.prompt-label': {\n    color: `${color.text()} !important`,\n    display: 'flex',\n    flexDirection: 'column',\n    verticalAlign: 'middle',\n    cursor: 'pointer',\n    '& > p': {\n      margin: '0 0 0 0 !important',\n    },\n  },\n}));\n\n//Used these below to replace \\\\embed{newLine} with \\\\newline from prompt which will get parsed in MathJax\nconst NEWLINE_BLOCK_REGEX = /\\\\embed\\{newLine\\}\\[\\]/g;\nconst NEWLINE_LATEX = '\\\\newline ';\n\nexport class PreviewPrompt extends Component {\n  static propTypes = {\n    prompt: PropTypes.string,\n    tagName: PropTypes.string,\n    className: PropTypes.string,\n    onClick: PropTypes.func,\n    defaultClassName: PropTypes.string,\n    autoplayAudioEnabled: PropTypes.bool,\n    customAudioButton: {\n      playImage: PropTypes.string,\n      pauseImage: PropTypes.string,\n    },\n  };\n\n  static defaultProps = {\n    onClick: () => {},\n  };\n\n  parsedText = (text) => {\n    const { customAudioButton } = this.props;\n    const div = document.createElement('div');\n    div.innerHTML = text;\n\n    const audio = div.querySelector('audio');\n    if (audio) {\n      const source = document.createElement('source');\n\n      source.setAttribute('type', 'audio/mp3');\n      source.setAttribute('src', audio.getAttribute('src'));\n\n      audio.removeAttribute('src');\n      audio.setAttribute('id', 'pie-prompt-audio-player');\n\n      audio.appendChild(source);\n\n      if (customAudioButton) {\n        audio.style.display = 'none';\n\n        const playButton = document.createElement('div');\n        playButton.id = 'play-audio-button';\n\n        Object.assign(playButton.style, {\n          cursor: 'pointer',\n          display: 'block',\n          width: '128px',\n          height: '128px',\n          backgroundImage: `url(${customAudioButton.pauseImage})`,\n          backgroundSize: 'cover',\n          borderRadius: '50%',\n          border: '1px solid #326295',\n        });\n\n        audio.parentNode.insertBefore(playButton, audio);\n      }\n    }\n\n    return div.innerHTML;\n  };\n\n  addCustomAudioButtonControls() {\n    const { autoplayAudioEnabled, customAudioButton } = this.props;\n    const playButton = document.getElementById('play-audio-button');\n    const audio = document.getElementById('pie-prompt-audio-player');\n\n    if (autoplayAudioEnabled && audio) {\n      audio\n        .play()\n        .then(() => {\n          if (playButton && customAudioButton) {\n            audio.addEventListener('ended', handleAudioEnded);\n          }\n        })\n        .catch((error) => {\n          console.error('Error playing audio', error);\n        });\n    }\n\n    if (!playButton || !audio || !customAudioButton) return;\n\n    const handlePlayClick = () => {\n      // if already playing, don't play again\n      if (!audio.paused) return;\n      if (playButton.style.backgroundImage.includes(customAudioButton.pauseImage)) return;\n\n      audio.play();\n    };\n\n    const handleAudioEnded = () => {\n      playButton.style.backgroundImage = `url(${customAudioButton.playImage})`;\n    };\n\n    const handleAudioPlay = () => {\n      Object.assign(playButton.style, {\n        backgroundImage: `url(${customAudioButton.pauseImage})`,\n        border: '1px solid #ccc',\n      });\n    };\n\n    const handleAudioPause = () => {\n      Object.assign(playButton.style, {\n        backgroundImage: `url(${customAudioButton.playImage})`,\n        border: '1px solid #326295',\n      });\n    };\n\n    playButton.addEventListener('click', handlePlayClick);\n    audio.addEventListener('play', handleAudioPlay);\n    audio.addEventListener('pause', handleAudioPause);\n    audio.addEventListener('ended', handleAudioEnded);\n\n    // store event handler references so they can be removed later\n    this._handlePlayClick = handlePlayClick;\n    this._handleAudioPlay = handleAudioPlay;\n    this._handleAudioPause = handleAudioPause;\n    this._handleAudioEnded = handleAudioEnded;\n  }\n\n  removeCustomAudioButtonListeners() {\n    const playButton = document.getElementById('play-audio-button');\n    const audio = document.querySelector('audio');\n\n    if (!playButton || !audio) return;\n\n    // remove event listeners using stored references\n    playButton.removeEventListener('click', this._handlePlayClick);\n    audio.removeEventListener('play', this._handleAudioPlay);\n    audio.removeEventListener('pause', this._handleAudioPause);\n    audio.removeEventListener('ended', this._handleAudioEnded);\n  }\n\n  componentDidMount() {\n    this.alignImages();\n    this.addCustomAudioButtonControls();\n    this.setupMathRendering();\n  }\n\n  componentDidUpdate(prevProps) {\n    this.alignImages();\n\n    if (prevProps.prompt !== this.props.prompt) {\n      this.renderMathContent();\n    }\n  }\n\n  componentWillUnmount() {\n    this.removeCustomAudioButtonListeners();\n  }\n\n  setupMathRendering() {\n    this.renderMathContent();\n  }\n\n  renderMathContent() {\n    const container = document.getElementById('preview-prompt');\n    if (container && typeof renderMath === 'function') {\n      renderMath(container);\n    }\n  }\n\n  alignImages() {\n    const previewPrompts = document.querySelectorAll('#preview-prompt');\n\n    previewPrompts.forEach((previewPrompt) => {\n      const images = previewPrompt.getElementsByTagName('img');\n\n      if (images && images.length) {\n        for (let image of images) {\n          if (image.attributes && image.attributes.alignment && image.attributes.alignment.value) {\n            const alignment = image.attributes.alignment.value;\n            const justifyContent =\n              alignment === 'center' ? 'center' : alignment === 'right' ? 'flex-end' : 'flex-start';\n\n            const parentNode = image.parentElement;\n\n            if (\n              parentNode.tagName === 'DIV' &&\n              parentNode.style.display === 'flex' &&\n              parentNode.style.width === '100%'\n            ) {\n              parentNode.style.justifyContent = justifyContent;\n            } else {\n              const div = document.createElement('div');\n              div.style.display = 'flex';\n              div.style.width = '100%';\n              div.style.justifyContent = justifyContent;\n\n              const copyImage = image.cloneNode(true);\n              div.appendChild(copyImage);\n              parentNode.replaceChild(div, image);\n            }\n          }\n        }\n      }\n    });\n  }\n\n  render() {\n    const { prompt, tagName, className, onClick, defaultClassName } = this.props;\n    // legend tag was added once with accessibility tasks, we need extra style to make it work with images alignment\n    const legendClass = tagName === 'legend' ? 'legend' : '';\n    const customClasses = `${className || ''} ${defaultClassName || ''} ${legendClass}`.trim();\n\n    return (\n      <StyledPromptContainer\n        as={tagName || 'div'}\n        id={'preview-prompt'}\n        onClick={onClick}\n        className={customClasses}\n        tagName={tagName}\n        dangerouslySetInnerHTML={{\n          __html: this.parsedText(prompt || '').replace(NEWLINE_BLOCK_REGEX, NEWLINE_LATEX),\n        }}\n      />\n    );\n  }\n}\n\nexport default PreviewPrompt;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"preview-prompt.js","names":["_react","_interopRequireWildcard","require","_styles","_propTypes","_interopRequireDefault","color","_mathRendering","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_createForOfIteratorHelper","Symbol","iterator","Array","isArray","_unsupportedIterableToArray","length","_n","F","s","done","value","TypeError","a","u","next","_arrayLikeToArray","toString","slice","constructor","name","from","test","_callSuper","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","apply","Boolean","prototype","valueOf","StyledPromptContainer","styled","_ref","theme","tagName","borderCollapse","borderStyle","borderColor","tableGrid","backgroundColor","tableStripe","padding","textAlign","verticalAlign","text","width","fontSize","paddingLeft","spacing","paddingBottom","concat","display","flexDirection","cursor","margin","NEWLINE_BLOCK_REGEX","NEWLINE_LATEX","PROMPT_CLASS","PreviewPrompt","exports","_Component","_this","_classCallCheck2","_len","arguments","args","_key","_defineProperty2","React","createRef","customAudioButton","props","div","document","createElement","innerHTML","audio","querySelector","source","setAttribute","getAttribute","removeAttribute","appendChild","style","playButton","id","assign","height","backgroundImage","pauseImage","backgroundSize","borderRadius","border","parentNode","insertBefore","_inherits2","_createClass2","key","addCustomAudioButtonControls","_this$props","autoplayAudioEnabled","getElementById","play","then","addEventListener","handleAudioEnded","error","console","handlePlayClick","paused","includes","playImage","handleAudioPlay","handleAudioPause","_handlePlayClick","_handleAudioPlay","_handleAudioPause","_handleAudioEnded","removeCustomAudioButtonListeners","removeEventListener","componentDidMount","alignImages","setupMathRendering","componentDidUpdate","prevProps","prompt","renderMathContent","componentWillUnmount","container","promptRef","current","renderMath","previewPrompt","images","getElementsByTagName","_iterator","_step","image","attributes","alignment","justifyContent","parentElement","copyImage","cloneNode","replaceChild","err","render","_this$props2","className","onClick","defaultClassName","legendClass","customClasses","trim","as","ref","dangerouslySetInnerHTML","__html","parsedText","replace","Component","PropTypes","string","func","bool","_default"],"sources":["../src/preview-prompt.jsx"],"sourcesContent":["import React, { Component } from 'react';\nimport { styled } from '@mui/material/styles';\nimport PropTypes from 'prop-types';\nimport * as color from './color';\nimport { renderMath } from '@pie-lib/math-rendering';\n\nconst StyledPromptContainer = styled('div')(({ theme, tagName }) => ({\n  // presentation tables should not have any custom style\n  // Base promptTable styles\n  '&:not(.MathJax) > table:not([role=\"presentation\"])': {\n    borderCollapse: 'collapse',\n  },\n  /*\n   * The editor writes border=\"1\", and the UA answers it with `border-style: outset`\n   * on the table and `inset` on the cells -- which browsers paint as synthesized 3D\n   * shades rather than the colour the border resolves to, so the grid comes out grey\n   * on every scheme (1.19:1 on black-on-violet). `solid` is what removes the\n   * shading; without it, setting the colour has no effect.\n   */\n  '&:not(.MathJax) table[border]:not([role=\"presentation\"]), &:not(.MathJax) table[border]:not([role=\"presentation\"]) td, &:not(.MathJax) table[border]:not([role=\"presentation\"]) th':\n    {\n      borderStyle: 'solid',\n      borderColor: color.tableGrid(),\n    },\n  // Apply vertical striping when first column is a header (th) and NOT mixed with td.\n  // Ink stays at 5.44:1 or better on tableStripe in every scheme, so the cell inherits\n  // its text colour rather than pinning the `color: black` this used to carry.\n  '&:not(.MathJax) > table:not([role=\"presentation\"]):has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)':\n    {\n      backgroundColor: color.tableStripe(),\n    },\n  // Apply horizontal striping for tables where first element is a data cell (td)\n  '&:not(.MathJax) > table:not([role=\"presentation\"]):has(tbody tr > td:first-child) tbody tr:nth-child(even) td': {\n    backgroundColor: color.tableStripe(),\n  },\n  // align table content to left as per STAR requirement PD-3687\n  '&:not(.MathJax) table:not([role=\"presentation\"]) td, &:not(.MathJax) table:not([role=\"presentation\"]) th': {\n    padding: '.6em 1em',\n    textAlign: 'left',\n  },\n  // added this to fix alignment of text in prompt imported from studio (PD-3423)\n  '&:not(.MathJax) > table td > p.kds-indent': {\n    textAlign: 'initial',\n  },\n\n  // Conditional styles based on class names\n  '&.prompt': {\n    verticalAlign: 'middle',\n    color: color.text(),\n  },\n  '&.legend': {\n    width: '100%',\n    fontSize: 'inherit !important',\n  },\n  '&.rationale': {\n    paddingLeft: theme.spacing(4),\n    paddingBottom: theme.spacing(1),\n  },\n  '&.prompt-label': {\n    color: `${color.text()} !important`,\n    display: 'flex',\n    flexDirection: 'column',\n    verticalAlign: 'middle',\n    cursor: 'pointer',\n    '& > p': {\n      margin: '0 0 0 0 !important',\n    },\n  },\n}));\n\n//Used these below to replace \\\\embed{newLine} with \\\\newline from prompt which will get parsed in MathJax\nconst NEWLINE_BLOCK_REGEX = /\\\\embed\\{newLine\\}\\[\\]/g;\nconst NEWLINE_LATEX = '\\\\newline ';\n\n// stable hook for 'is this node inside a prompt' checks - a class rather than an id,\n// so it stays valid when a page renders more than one prompt\nconst PROMPT_CLASS = 'preview-prompt';\n\nexport class PreviewPrompt extends Component {\n  static propTypes = {\n    prompt: PropTypes.string,\n    tagName: PropTypes.string,\n    className: PropTypes.string,\n    onClick: PropTypes.func,\n    defaultClassName: PropTypes.string,\n    autoplayAudioEnabled: PropTypes.bool,\n    customAudioButton: {\n      playImage: PropTypes.string,\n      pauseImage: PropTypes.string,\n    },\n  };\n\n  static defaultProps = {\n    onClick: () => {},\n  };\n\n  promptRef = React.createRef();\n\n  parsedText = (text) => {\n    const { customAudioButton } = this.props;\n    const div = document.createElement('div');\n    div.innerHTML = text;\n\n    const audio = div.querySelector('audio');\n    if (audio) {\n      const source = document.createElement('source');\n\n      source.setAttribute('type', 'audio/mp3');\n      source.setAttribute('src', audio.getAttribute('src'));\n\n      audio.removeAttribute('src');\n      audio.setAttribute('id', 'pie-prompt-audio-player');\n\n      audio.appendChild(source);\n\n      if (customAudioButton) {\n        audio.style.display = 'none';\n\n        const playButton = document.createElement('div');\n        playButton.id = 'play-audio-button';\n\n        Object.assign(playButton.style, {\n          cursor: 'pointer',\n          display: 'block',\n          width: '128px',\n          height: '128px',\n          backgroundImage: `url(${customAudioButton.pauseImage})`,\n          backgroundSize: 'cover',\n          borderRadius: '50%',\n          border: '1px solid #326295',\n        });\n\n        audio.parentNode.insertBefore(playButton, audio);\n      }\n    }\n\n    return div.innerHTML;\n  };\n\n  addCustomAudioButtonControls() {\n    const { autoplayAudioEnabled, customAudioButton } = this.props;\n    const playButton = document.getElementById('play-audio-button');\n    const audio = document.getElementById('pie-prompt-audio-player');\n\n    if (autoplayAudioEnabled && audio) {\n      audio\n        .play()\n        .then(() => {\n          if (playButton && customAudioButton) {\n            audio.addEventListener('ended', handleAudioEnded);\n          }\n        })\n        .catch((error) => {\n          console.error('Error playing audio', error);\n        });\n    }\n\n    if (!playButton || !audio || !customAudioButton) return;\n\n    const handlePlayClick = () => {\n      // if already playing, don't play again\n      if (!audio.paused) return;\n      if (playButton.style.backgroundImage.includes(customAudioButton.pauseImage)) return;\n\n      audio.play();\n    };\n\n    const handleAudioEnded = () => {\n      playButton.style.backgroundImage = `url(${customAudioButton.playImage})`;\n    };\n\n    const handleAudioPlay = () => {\n      Object.assign(playButton.style, {\n        backgroundImage: `url(${customAudioButton.pauseImage})`,\n        border: '1px solid #ccc',\n      });\n    };\n\n    const handleAudioPause = () => {\n      Object.assign(playButton.style, {\n        backgroundImage: `url(${customAudioButton.playImage})`,\n        border: '1px solid #326295',\n      });\n    };\n\n    playButton.addEventListener('click', handlePlayClick);\n    audio.addEventListener('play', handleAudioPlay);\n    audio.addEventListener('pause', handleAudioPause);\n    audio.addEventListener('ended', handleAudioEnded);\n\n    // store event handler references so they can be removed later\n    this._handlePlayClick = handlePlayClick;\n    this._handleAudioPlay = handleAudioPlay;\n    this._handleAudioPause = handleAudioPause;\n    this._handleAudioEnded = handleAudioEnded;\n  }\n\n  removeCustomAudioButtonListeners() {\n    const playButton = document.getElementById('play-audio-button');\n    const audio = document.querySelector('audio');\n\n    if (!playButton || !audio) return;\n\n    // remove event listeners using stored references\n    playButton.removeEventListener('click', this._handlePlayClick);\n    audio.removeEventListener('play', this._handleAudioPlay);\n    audio.removeEventListener('pause', this._handleAudioPause);\n    audio.removeEventListener('ended', this._handleAudioEnded);\n  }\n\n  componentDidMount() {\n    this.alignImages();\n    this.addCustomAudioButtonControls();\n    this.setupMathRendering();\n  }\n\n  componentDidUpdate(prevProps) {\n    this.alignImages();\n\n    if (prevProps.prompt !== this.props.prompt) {\n      this.renderMathContent();\n    }\n  }\n\n  componentWillUnmount() {\n    this.removeCustomAudioButtonListeners();\n  }\n\n  setupMathRendering() {\n    this.renderMathContent();\n  }\n\n  renderMathContent() {\n    const container = this.promptRef.current;\n    if (container && typeof renderMath === 'function') {\n      renderMath(container);\n    }\n  }\n\n  alignImages() {\n    const previewPrompt = this.promptRef.current;\n\n    if (!previewPrompt) {\n      return;\n    }\n\n    const images = previewPrompt.getElementsByTagName('img');\n\n    if (images && images.length) {\n      for (let image of images) {\n        if (image.attributes && image.attributes.alignment && image.attributes.alignment.value) {\n          const alignment = image.attributes.alignment.value;\n          const justifyContent =\n            alignment === 'center' ? 'center' : alignment === 'right' ? 'flex-end' : 'flex-start';\n\n          const parentNode = image.parentElement;\n\n          if (\n            parentNode.tagName === 'DIV' &&\n            parentNode.style.display === 'flex' &&\n            parentNode.style.width === '100%'\n          ) {\n            parentNode.style.justifyContent = justifyContent;\n          } else {\n            const div = document.createElement('div');\n            div.style.display = 'flex';\n            div.style.width = '100%';\n            div.style.justifyContent = justifyContent;\n\n            const copyImage = image.cloneNode(true);\n            div.appendChild(copyImage);\n            parentNode.replaceChild(div, image);\n          }\n        }\n      }\n    }\n  }\n\n  render() {\n    const { prompt, tagName, className, onClick, defaultClassName } = this.props;\n    // legend tag was added once with accessibility tasks, we need extra style to make it work with images alignment\n    const legendClass = tagName === 'legend' ? 'legend' : '';\n    const customClasses = `${className || ''} ${defaultClassName || ''} ${legendClass} ${PROMPT_CLASS}`.trim();\n\n    return (\n      <StyledPromptContainer\n        as={tagName || 'div'}\n        ref={this.promptRef}\n        onClick={onClick}\n        className={customClasses}\n        tagName={tagName}\n        dangerouslySetInnerHTML={{\n          __html: this.parsedText(prompt || '').replace(NEWLINE_BLOCK_REGEX, NEWLINE_LATEX),\n        }}\n      />\n    );\n  }\n}\n\nexport default PreviewPrompt;\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/render-ui",
-  "version": "6.1.4-next.35+fb8ae2fcd",
+  "version": "6.1.4-next.58+dc4465159",
   "description": "Some shared ui elements when rendering - but not worthy of their own package yet.",
   "module": "src/index.js",
   "main": "lib/index.js",
@@ -14,8 +14,8 @@
     "@emotion/styled": "^11.14.1",
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
-    "@pie-lib/icons": "^4.0.4-next.88+fb8ae2fcd",
-    "@pie-lib/math-rendering": "^5.1.1-next.35+fb8ae2fcd",
+    "@pie-lib/icons": "^4.0.3",
+    "@pie-lib/math-rendering": "^5.1.0",
     "@pie-lib/test-utils": "^2.0.2",
     "debug": "^4.1.1",
     "lodash-es": "^4.17.23",
@@ -31,5 +31,5 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
-  "gitHead": "fb8ae2fcdb9b694e4d9db31209e59f280e63fab4"
+  "gitHead": "dc4465159da9d72020651fab10b4ab5281ad3bdd"
 }

package/src/__tests__/preview-prompt.test.jsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import PreviewPrompt from '../preview-prompt';
+import * as color from '../color';
 
 jest.mock('@pie-lib/math-rendering', () => ({
   renderMath: jest.fn(),
@@ -317,6 +318,37 @@ describe('PreviewPrompt - Extended Tests', () => {
       expect(screen.getByText('Header')).toBeInTheDocument();
       expect(screen.getByText('Data')).toBeInTheDocument();
     });
+
+    // Asserted against the CSS emotion emitted rather than through toHaveStyle: jsdom
+    // does not resolve custom properties, so it normalises `var()` away. Emotion
+    // inserts through the CSSOM, so the <style> tags themselves carry no text.
+    describe('authored table painting', () => {
+      const emittedCss = () =>
+        Array.from(document.querySelectorAll('style'))
+          .flatMap((tag) => Array.from(tag.sheet?.cssRules || []))
+          .map((rule) => rule.cssText)
+          .join('\n');
+
+      it('paints a bordered table flat, from the ink token', () => {
+        render(<PreviewPrompt prompt={'<div><table border="1"><tbody><tr><td>A</td></tr></tbody></table></div>'} />);
+
+        const css = emittedCss();
+        expect(css).toContain('table[border]');
+        expect(css).toContain('border-style: solid');
+        expect(css).toContain(`border-color: ${color.tableGrid()}`);
+      });
+
+      it('takes the stripe from a scheme-following fill, not a fixed near-white one', () => {
+        render(<PreviewPrompt prompt={'<table><tbody><tr><td>A</td></tr></tbody></table>'} />);
+
+        const css = emittedCss();
+        expect(css).toContain(`background-color: ${color.tableStripe()}`);
+        // #f6f8fa still appears as the var() chain's last resort, so this checks that
+        // nothing paints it bare - along with the `color: black` it used to be paired with.
+        expect(css).not.toContain('background-color: #f6f8fa');
+        expect(css).not.toContain('color: rgb(0, 0, 0)');
+      });
+    });
   });
 
   describe('component lifecycle', () => {
@@ -345,10 +377,30 @@ describe('PreviewPrompt - Extended Tests', () => {
   });
 
   describe('accessibility', () => {
-    it('should have preview-prompt id for accessibility', () => {
-      render(<PreviewPrompt prompt="Accessible text" />);
-      const element = document.getElementById('preview-prompt');
-      expect(element).toBeInTheDocument();
+    it('should mark the container with the stable preview-prompt class', () => {
+      const { container } = render(<PreviewPrompt prompt="Accessible text" />);
+      expect(container.firstChild).toHaveClass('preview-prompt');
+    });
+
+    it('should not emit an id on the container', () => {
+      const { container } = render(<PreviewPrompt prompt="Accessible text" />);
+      expect(container.firstChild).not.toHaveAttribute('id');
+    });
+
+    it('should leave no duplicate ids when a page renders many prompts', () => {
+      const { container } = render(
+        <div>
+          <PreviewPrompt prompt="Item 1" />
+          <PreviewPrompt prompt="Item 2" />
+          <PreviewPrompt prompt="Item 3" />
+          <PreviewPrompt prompt="Item 4" />
+          <PreviewPrompt prompt="Item 5" />
+        </div>,
+      );
+
+      const ids = Array.from(container.querySelectorAll('[id]')).map((el) => el.id);
+
+      expect(ids).toEqual(Array.from(new Set(ids)));
     });
 
     it('should preserve semantic HTML', () => {
@@ -375,5 +427,38 @@ describe('PreviewPrompt - Extended Tests', () => {
       expect(screen.getByText('Second prompt')).toBeInTheDocument();
       expect(screen.getByText('Third prompt')).toBeInTheDocument();
     });
+
+    it('should typeset each instance with its own node rather than the first prompt on the page', () => {
+      renderMath.mockClear();
+
+      render(
+        <div>
+          <PreviewPrompt prompt="First prompt" />
+          <PreviewPrompt prompt="Second prompt" />
+          <PreviewPrompt prompt="Third prompt" />
+        </div>,
+      );
+
+      const typesetNodes = renderMath.mock.calls.map(([node]) => node);
+
+      expect(typesetNodes).toHaveLength(3);
+      expect(new Set(typesetNodes).size).toBe(3);
+      expect(typesetNodes.map((node) => node.textContent)).toEqual(['First prompt', 'Second prompt', 'Third prompt']);
+    });
+
+    it('should align images within each instance independently', () => {
+      const { container } = render(
+        <div>
+          <PreviewPrompt prompt='<img src="a.png" alignment="center" />' />
+          <PreviewPrompt prompt='<img src="b.png" alignment="right" />' />
+        </div>,
+      );
+
+      const wrappers = container.querySelectorAll('.preview-prompt > div');
+
+      expect(wrappers).toHaveLength(2);
+      expect(wrappers[0].style.justifyContent).toBe('center');
+      expect(wrappers[1].style.justifyContent).toBe('flex-end');
+    });
   });
 });

package/src/color.js

@@ -30,6 +30,10 @@ export const defaults = {
   BORDER_LIGHT: '#D1D1D1',
   BORDER_DARK: '#646464',
   BORDER_GRAY: '#7E8494',
+  // these are used for authored tables
+  TABLE_GRID: 'black',
+  TABLE_GRID_LIGHT: '#dfe2e5',
+  TABLE_STRIPE: '#f6f8fa',
   BLACK: '#000000',
   WHITE: '#ffffff',
   TRANSPARENT: 'transparent',
@@ -38,6 +42,8 @@ export const defaults = {
   FOCUS_CHECKED_BORDER: '#1565C0',
   FOCUS_UNCHECKED: '#E0E0E0',
   FOCUS_UNCHECKED_BORDER: '#757575',
+  // the keyboard focus ring on a button or toolbar control
+  BUTTON_FOCUS_OUTLINE: '#3B82F6',
   // this is used for select text tokens
   BLUE_GREY100: '#F3F5F7',
   BLUE_GREY300: '#C0C3CF',
@@ -107,6 +113,10 @@ export const borderLight = () => pv('border-light', defaults.BORDER_LIGHT);
 export const borderDark = () => pv('border-dark', defaults.BORDER_DARK);
 export const borderGray = () => pv('border-gray', defaults.BORDER_GRAY);
 
+export const tableGrid = () => pv('table-grid', 'text', defaults.TABLE_GRID);
+export const tableGridLight = () => pv('table-grid-light', 'border-light', defaults.TABLE_GRID_LIGHT);
+export const tableStripe = () => pv('table-stripe', 'background-dark', defaults.TABLE_STRIPE);
+
 export const black = () => pv('black', defaults.BLACK);
 export const white = () => pv('white', defaults.WHITE);
 export const transparent = () => defaults.TRANSPARENT;
@@ -115,6 +125,7 @@ export const focusChecked = () => pv('focus-checked', defaults.FOCUS_CHECKED);
 export const focusCheckedBorder = () => pv('focus-checked-border', defaults.FOCUS_CHECKED_BORDER);
 export const focusUnchecked = () => pv('focus-unchecked', defaults.FOCUS_UNCHECKED);
 export const focusUncheckedBorder = () => pv('focus-unchecked-border', defaults.FOCUS_UNCHECKED_BORDER);
+export const buttonFocusOutline = () => pv('button-focus-outline', defaults.BUTTON_FOCUS_OUTLINE);
 
 export const blueGrey100 = () => pv('blue-grey-100', defaults.BLUE_GREY100);
 export const blueGrey300 = () => pv('blue-grey-300', defaults.BLUE_GREY300);
@@ -125,7 +136,8 @@ export const keypadButton = () => pv('keypad-button', defaults.KEYPAD_BUTTON);
 export const keypadButtonOperator = () => pv('keypad-button-operator', defaults.KEYPAD_BUTTON_OPERATOR);
 export const keypadEmptyPlaceholder = () => pv('keypad-empty-placeholder', defaults.KEYPAD_EMPTY_PLACEHOLDER);
 export const keypadButtonHover = () => pv('keypad-button-hover', defaults.KEYPAD_BUTTON_HOVER);
-export const keypadButtonOperatorHover = () => pv('keypad-button-operator-hover', defaults.KEYPAD_BUTTON_OPERATOR_HOVER);
+export const keypadButtonOperatorHover = () =>
+  pv('keypad-button-operator-hover', defaults.KEYPAD_BUTTON_OPERATOR_HOVER);
 export const keyBoardFocusIndicator = () => pv('keyboard-focus-indicator', defaults.KEY_BOARD_FOCUS_INDICATOR);
 export const buttonBorder = () => pv('button-border', defaults.BUTTON_BORDER);
 export const buttonHoverBg = () => pv('button-hover-bg', defaults.BUTTON_HOVER_BG);

package/src/preview-prompt.jsx

@@ -10,16 +10,28 @@ const StyledPromptContainer = styled('div')(({ theme, tagName }) => ({
   '&:not(.MathJax) > table:not([role="presentation"])': {
     borderCollapse: 'collapse',
   },
-  // Apply vertical striping when first column is a header (th) and NOT mixed with td
+  /*
+   * The editor writes border="1", and the UA answers it with `border-style: outset`
+   * on the table and `inset` on the cells -- which browsers paint as synthesized 3D
+   * shades rather than the colour the border resolves to, so the grid comes out grey
+   * on every scheme (1.19:1 on black-on-violet). `solid` is what removes the
+   * shading; without it, setting the colour has no effect.
+   */
+  '&:not(.MathJax) table[border]:not([role="presentation"]), &:not(.MathJax) table[border]:not([role="presentation"]) td, &:not(.MathJax) table[border]:not([role="presentation"]) th':
+    {
+      borderStyle: 'solid',
+      borderColor: color.tableGrid(),
+    },
+  // Apply vertical striping when first column is a header (th) and NOT mixed with td.
+  // Ink stays at 5.44:1 or better on tableStripe in every scheme, so the cell inherits
+  // its text colour rather than pinning the `color: black` this used to carry.
   '&:not(.MathJax) > table:not([role="presentation"]):has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)':
     {
-      backgroundColor: '#f6f8fa',
-      color: theme.palette.common.black,
+      backgroundColor: color.tableStripe(),
     },
   // Apply horizontal striping for tables where first element is a data cell (td)
   '&:not(.MathJax) > table:not([role="presentation"]):has(tbody tr > td:first-child) tbody tr:nth-child(even) td': {
-    backgroundColor: '#f6f8fa',
-    color: theme.palette.common.black,
+    backgroundColor: color.tableStripe(),
   },
   // align table content to left as per STAR requirement PD-3687
   '&:not(.MathJax) table:not([role="presentation"]) td, &:not(.MathJax) table:not([role="presentation"]) th': {
@@ -60,6 +72,10 @@ const StyledPromptContainer = styled('div')(({ theme, tagName }) => ({
 const NEWLINE_BLOCK_REGEX = /\\embed\{newLine\}\[\]/g;
 const NEWLINE_LATEX = '\\newline ';
 
+// stable hook for 'is this node inside a prompt' checks - a class rather than an id,
+// so it stays valid when a page renders more than one prompt
+const PROMPT_CLASS = 'preview-prompt';
+
 export class PreviewPrompt extends Component {
   static propTypes = {
     prompt: PropTypes.string,
@@ -78,6 +94,8 @@ export class PreviewPrompt extends Component {
     onClick: () => {},
   };
 
+  promptRef = React.createRef();
+
   parsedText = (text) => {
     const { customAudioButton } = this.props;
     const div = document.createElement('div');
@@ -213,59 +231,61 @@ export class PreviewPrompt extends Component {
   }
 
   renderMathContent() {
-    const container = document.getElementById('preview-prompt');
+    const container = this.promptRef.current;
     if (container && typeof renderMath === 'function') {
       renderMath(container);
     }
   }
 
   alignImages() {
-    const previewPrompts = document.querySelectorAll('#preview-prompt');
-
-    previewPrompts.forEach((previewPrompt) => {
-      const images = previewPrompt.getElementsByTagName('img');
-
-      if (images && images.length) {
-        for (let image of images) {
-          if (image.attributes && image.attributes.alignment && image.attributes.alignment.value) {
-            const alignment = image.attributes.alignment.value;
-            const justifyContent =
-              alignment === 'center' ? 'center' : alignment === 'right' ? 'flex-end' : 'flex-start';
-
-            const parentNode = image.parentElement;
-
-            if (
-              parentNode.tagName === 'DIV' &&
-              parentNode.style.display === 'flex' &&
-              parentNode.style.width === '100%'
-            ) {
-              parentNode.style.justifyContent = justifyContent;
-            } else {
-              const div = document.createElement('div');
-              div.style.display = 'flex';
-              div.style.width = '100%';
-              div.style.justifyContent = justifyContent;
-
-              const copyImage = image.cloneNode(true);
-              div.appendChild(copyImage);
-              parentNode.replaceChild(div, image);
-            }
+    const previewPrompt = this.promptRef.current;
+
+    if (!previewPrompt) {
+      return;
+    }
+
+    const images = previewPrompt.getElementsByTagName('img');
+
+    if (images && images.length) {
+      for (let image of images) {
+        if (image.attributes && image.attributes.alignment && image.attributes.alignment.value) {
+          const alignment = image.attributes.alignment.value;
+          const justifyContent =
+            alignment === 'center' ? 'center' : alignment === 'right' ? 'flex-end' : 'flex-start';
+
+          const parentNode = image.parentElement;
+
+          if (
+            parentNode.tagName === 'DIV' &&
+            parentNode.style.display === 'flex' &&
+            parentNode.style.width === '100%'
+          ) {
+            parentNode.style.justifyContent = justifyContent;
+          } else {
+            const div = document.createElement('div');
+            div.style.display = 'flex';
+            div.style.width = '100%';
+            div.style.justifyContent = justifyContent;
+
+            const copyImage = image.cloneNode(true);
+            div.appendChild(copyImage);
+            parentNode.replaceChild(div, image);
           }
         }
       }
-    });
+    }
   }
 
   render() {
     const { prompt, tagName, className, onClick, defaultClassName } = this.props;
     // legend tag was added once with accessibility tasks, we need extra style to make it work with images alignment
     const legendClass = tagName === 'legend' ? 'legend' : '';
-    const customClasses = `${className || ''} ${defaultClassName || ''} ${legendClass}`.trim();
+    const customClasses = `${className || ''} ${defaultClassName || ''} ${legendClass} ${PROMPT_CLASS}`.trim();
 
     return (
       <StyledPromptContainer
         as={tagName || 'div'}
-        id={'preview-prompt'}
+        ref={this.promptRef}
         onClick={onClick}
         className={customClasses}
         tagName={tagName}