update a couple of fallback components (#839)

CHANGELOG.md

@@ -4,6 +4,11 @@ All notable changes to this project will be documented in this file.
 
 This projects adheres to [Semantic Versioning](https://semver.org/) and [Keep a CHANGELOG](https://keepachangelog.com/).
 
+## [13.0.1]
+
+### Changed
+- Updated a couple of fallbacks for old FE libs components.
+
 ## [13.0.0]
 
 > [!NOTE]
@@ -1342,6 +1347,7 @@ Follow this migration script in order for you project to work correctly with the
 - Initial tagged release.
 
 [Unreleased]: https://github.com/infinum/eightshift-frontend-libs/compare/master...HEAD
+[13.0.1]: https://github.com/infinum/eightshift-frontend-libs/compare/13.0.0...13.0.1
 [13.0.0]: https://github.com/infinum/eightshift-frontend-libs/compare/12.1.6...13.0.0
 [12.1.6]: https://github.com/infinum/eightshift-frontend-libs/compare/12.1.5...12.1.6
 [12.1.5]: https://github.com/infinum/eightshift-frontend-libs/compare/12.1.4...12.1.5

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@eightshift/frontend-libs",
-	"version": "13.0.0",
+	"version": "13.0.1",
 	"description": "A collection of useful frontend utility modules. powered by Eightshift",
 	"author": {
 		"name": "Eightshift team",
@@ -36,7 +36,7 @@
 		"@dnd-kit/modifiers": "^7.0.0",
 		"@dnd-kit/sortable": "^8.0.0",
 		"@dnd-kit/utilities": "^3.2.2",
-		"@eightshift/ui-components": "^1.4.5",
+		"@eightshift/ui-components": "^1.4.6",
 		"@stylistic/eslint-plugin-js": "^2.3.0",
 		"@stylistic/stylelint-plugin": "^2.1.2",
 		"@swc/core": "^1.7.2",

scripts/components/toggle/toggle.js

@@ -1,9 +1,5 @@
 import React from 'react';
-import {
-	Checkbox,
-	ToggleButton,
-	Toggle as EsUicToggle,
-} from '@eightshift/ui-components';
+import { Checkbox, Toggle as EsUicToggle } from '@eightshift/ui-components';
 
 /**
  * Custom toggle control.
@@ -35,22 +31,6 @@ export const Toggle = ({
 
 	additionalClasses,
 }) => {
-	if (type === 'button' || type === 'iconButton' || type === 'tileButton') {
-		return (
-			<ToggleButton
-				icon={icon}
-				onChange={onChange}
-				selected={checked}
-				disabled={disabled}
-				tooltip={type === 'iconButton' && label}
-				aria-label={type === 'iconButton' && label}
-				className={additionalClasses}
-			>
-				{(type === 'button' || type === 'tileButton') && label}
-			</ToggleButton>
-		);
-	}
-
 	if (type === 'checkbox') {
 		return (
 			<Checkbox

scripts/components/use-toggle/use-toggle.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { __ } from '@wordpress/i18n';
 import { checkAttr, getAttrKey } from '@eightshift/frontend-libs/scripts';
-import { ComponentToggle } from '@eightshift/ui-components';
+import { ComponentToggle, Spacer } from '@eightshift/ui-components';
 
 export const generateUseToggleConfig = (
 	attributes,
@@ -78,6 +78,16 @@ export const UseToggle = ({
 		return null;
 	}
 
+	if (noUseToggle && noExpandButton && !noLabel) {
+		return (
+			<>
+				<Spacer size='s' />
+				<Spacer icon={icon} text={label} />
+				{children}
+			</>
+		);
+	}
+
 	return (
 		<ComponentToggle
 			label={label}