Merge pull request #63 from KevinBatdorf/release/1.8.0

Release 1.8.0

code-block-pro.php

@@ -4,7 +4,7 @@
  * Description: Code highlighting powered by the VS Code engine
  * Requires at least: 6.0
  * Requires PHP: 7.0
- * Version: 1.7.0
+ * Version: 1.8.0
  * Author: Kevin Batdorf
  * License: GPL-2.0-or-later
  * License URI: https://www.gnu.org/licenses/gpl-2.0.html

readme.txt

@@ -2,7 +2,7 @@
 Contributors: kbat82
 Tags: block, code, syntax, highlighting, snippet, highlighter, JavaScript, php, vs code, editor
 Tested up to: 6.1
-Stable tag: 1.7.0
+Stable tag: 1.8.0
 License: GPL-2.0-or-later
 License URI: https://www.gnu.org/licenses/gpl-2.0.html
 
@@ -19,7 +19,8 @@ Beautiful syntax highlighting made easy.
 - Supports over 140 programming languages
 - Optionally load programming fonts
 - Line numbers (custom starting number)
-- Various header styles (more coming soon)
+- Header styles (more coming)
+- Footer styles (more coming)
 - Optionally add a copy button to let users copy the code
 - Native Gutenberg block output - no special requirements
 - No frontend JavaScript required - works in headless mode
@@ -220,6 +221,18 @@ Look under the "Styling" tab and turn on "Clamp Values", which will compute the
 
 == Changelog ==
 
+= 1.8.0 - 2022-11-17 =
+- Feature: Added footer styles
+- Accessibility: Increased line number color contrast
+- Accessibility: Increased copy button contrast
+- Tweak: Disabled autocomplete on settings inputs
+- Tweak: Added help context to variations that have inputs
+- Fix: Fixed a bug where disabling padding on one block would update all
+- Fix: Line numbers + disabled padding no longer formats weird in the editor
+- Fix: Scrollbars are now using auto instead of scroll
+- Fix: The loading screen on the theme viewer now fills the container
+- Fix: With line numbers, changing the font now will recalculate the width
+
 = 1.7.0 - 2022-11-09 =
 - Feature: Add line number support
 

src/editor/Edit.tsx

@@ -21,6 +21,9 @@ export const Edit = ({
  lineNumbers,
  startingLineNumber,
  footerType,
+ fontSize,
+ fontFamily,
+ lineHeight,
  } = attributes;
  const textAreaRef = useRef<HTMLDivElement>(null);
  const handleChange = (code: string) => setAttributes({ code });
@@ -29,8 +32,7 @@ export const Edit = ({
  theme,
  lang: language ?? previousLanguage,
  });
- const hasFooter =
- attributes?.footerType && attributes?.footerType !== 'none';
+ const hasFooter = footerType && footerType !== 'none';
  useDefaults({ attributes, setAttributes });
 
  useEffect(() => {
@@ -94,6 +96,9 @@ export const Edit = ({
  error,
  textAreaRef,
  setAttributes,
+ fontSize,
+ fontFamily,
+ lineHeight,
  ]);
 
  if ((loading && code) || error) {

src/hooks/useDefaults.ts

@@ -49,7 +49,8 @@ export const useDefaults = ({
  }, [previousFontSize, fontSize, setAttributes]);
 
  useEffect(() => {
- if (fontFamily || !previousFontFamily) return;
+ if (fontFamily || fontFamily === '' || previousFontFamily === undefined)
+ return;
  setAttributes({ fontFamily: previousFontFamily });
  }, [previousFontFamily, fontFamily, setAttributes]);
 
@@ -64,22 +65,29 @@ export const useDefaults = ({
  }, [previousHeaderType, headerType, setAttributes]);
 
  useEffect(() => {
- if (footerType || !previousFooterType) return;
+ if (footerType !== undefined || previousFooterType === undefined)
+ return;
  setAttributes({ footerType: previousFooterType });
  }, [previousFooterType, footerType, setAttributes]);
 
  useEffect(() => {
- if (clampFonts !== undefined || !previousClampFonts) return;
+ if (clampFonts !== undefined || previousClampFonts === undefined)
+ return;
  setAttributes({ clampFonts: previousClampFonts });
  }, [previousClampFonts, clampFonts, setAttributes]);
 
  useEffect(() => {
- if (disablePadding !== undefined || !previousDisablePadding) return;
+ if (
+ disablePadding !== undefined ||
+ previousDisablePadding === undefined
+ )
+ return;
  setAttributes({ disablePadding: previousDisablePadding });
  }, [previousDisablePadding, disablePadding, setAttributes]);
 
  useEffect(() => {
- if (lineNumbers !== undefined || !previousLineNumbers) return;
+ if (lineNumbers !== undefined || previousLineNumbers === undefined)
+ return;
  setAttributes({ lineNumbers: previousLineNumbers });
  }, [previousLineNumbers, lineNumbers, setAttributes]);
 };

src/index.tsx

@@ -69,6 +69,9 @@ registerBlockType<Attributes>(blockConfig.name, {
  {...blockProps({
  className: classnames('code-block-pro-editor', {
  'padding-disabled': attributes.disablePadding,
+ 'padding-bottom-disabled':
+ attributes?.footerType &&
+ attributes?.footerType !== 'none',
  'cbp-has-line-numbers': attributes.lineNumbers,
  }),
  style: {

src/state/theme.ts

@@ -6,13 +6,13 @@ import { Attributes } from '../types';
 type ThemeType = {
  previousTheme: string;
  previousLineHeight: string;
- previousFontFamily: string;
+ previousFontFamily?: string;
  previousFontSize: string;
  previousHeaderType: string;
- previousFooterType: string;
- previousClampFonts: boolean;
- previousDisablePadding: boolean;
- previousLineNumbers: boolean;
+ previousFooterType?: string;
+ previousClampFonts?: boolean;
+ previousDisablePadding?: boolean;
+ previousLineNumbers?: boolean;
  updateThemeHistory: (settings: Partial<Attributes>) => void;
 };
 const path = '/wp/v2/settings';
@@ -28,13 +28,13 @@ export const useThemeStore = create<ThemeType>()(
  (set) => ({
  previousTheme: 'nord',
  previousLineHeight: '1.25rem',
- previousFontFamily: '',
+ previousFontFamily: undefined,
  previousFontSize: '.875rem',
  previousHeaderType: 'headlights',
- previousFooterType: 'none',
- previousClampFonts: false,
- previousDisablePadding: false,
- previousLineNumbers: false,
+ previousFooterType: undefined,
+ previousClampFonts: undefined,
+ previousDisablePadding: undefined,
+ previousLineNumbers: undefined,
  updateThemeHistory(attributes) {
  set((state) => ({
  ...state,