mirror of
https://github.com/symfony/ux-typed.git
synced 2026-03-23 23:52:16 +01:00
[Typed] Deprecate the package
Co-authored-by: Simon André <smn.andre@gmail.com>
This commit is contained in:
@@ -1,5 +1,9 @@
|
||||
# CHANGELOG
|
||||
|
||||
## 2.27.0
|
||||
|
||||
- Deprecate the package
|
||||
|
||||
## 2.13.2
|
||||
|
||||
- Revert "Change JavaScript package to `type: module`"
|
||||
|
||||
116
README.md
116
README.md
@@ -1,5 +1,121 @@
|
||||
# Symfony UX Typed
|
||||
|
||||
> [!WARNING]
|
||||
> **Deprecated**: This package has been **deprecated** in 2.x and will be removed in the next major version.
|
||||
|
||||
To keep the same functionality in your Symfony application, follow these migration steps:
|
||||
|
||||
1. Install the `typed.js` library:
|
||||
|
||||
```bash
|
||||
# If using Symfony AssetMapper:
|
||||
php bin/console importmap:require typed.js
|
||||
|
||||
# If using NPM (e.g.: with Webpack Encore):
|
||||
npm install typed.js
|
||||
```
|
||||
|
||||
2. Add the following code to your app:
|
||||
|
||||
<details><summary><code>assets/controllers/typed_controller.js</code></summary>
|
||||
|
||||
```javascript
|
||||
import { Controller } from '@hotwired/stimulus';
|
||||
import Typed from 'typed.js';
|
||||
|
||||
export default class extends Controller {
|
||||
static values = {
|
||||
strings: Array,
|
||||
typeSpeed: { type: Number, default: 30 },
|
||||
smartBackspace: { type: Boolean, default: true },
|
||||
startDelay: Number,
|
||||
backSpeed: Number,
|
||||
shuffle: Boolean,
|
||||
backDelay: { type: Number, default: 700 },
|
||||
fadeOut: Boolean,
|
||||
fadeOutClass: { type: String, default: 'typed-fade-out' },
|
||||
fadeOutDelay: { type: Number, default: 500 },
|
||||
loop: Boolean,
|
||||
loopCount: { type: Number, default: Number.POSITIVE_INFINITY },
|
||||
showCursor: { type: Boolean, default: true },
|
||||
cursorChar: { type: String, default: '.' },
|
||||
autoInsertCss: { type: Boolean, default: true },
|
||||
attr: String,
|
||||
bindInputFocusEvents: Boolean,
|
||||
contentType: { type: String, default: 'html' },
|
||||
};
|
||||
|
||||
connect() {
|
||||
const options = {
|
||||
strings: this.stringsValue,
|
||||
typeSpeed: this.typeSpeedValue,
|
||||
smartBackspace: this.smartBackspaceValue,
|
||||
startDelay: this.startDelayValue,
|
||||
backSpeed: this.backSpeedValue,
|
||||
shuffle: this.shuffleValue,
|
||||
backDelay: this.backDelayValue,
|
||||
fadeOut: this.fadeOutValue,
|
||||
fadeOutClass: this.fadeOutClassValue,
|
||||
fadeOutDelay: this.fadeOutDelayValue,
|
||||
loop: this.loopValue,
|
||||
loopCount: this.loopCountValue,
|
||||
showCursor: this.showCursorValue,
|
||||
cursorChar: this.cursorCharValue,
|
||||
autoInsertCss: this.autoInsertCssValue,
|
||||
attr: this.attrValue,
|
||||
bindInputFocusEvents: this.bindInputFocusEventsValue,
|
||||
contentType: this.contentTypeValue,
|
||||
};
|
||||
|
||||
this.dispatchEvent('pre-connect', { options });
|
||||
const typed = new Typed(this.element, options);
|
||||
this.dispatchEvent('connect', { typed, options });
|
||||
}
|
||||
|
||||
dispatchEvent(name, payload) {
|
||||
this.dispatch(name, { detail: payload, prefix: 'typed' });
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
</details>
|
||||
|
||||
3. Replace the `symfony--ux-typed` occurrences in your templates with `typed`, for example:
|
||||
|
||||
```diff
|
||||
{% set strings = [
|
||||
'I ❤️ Symfony UX!',
|
||||
'Symfony UX Typed loves to type',
|
||||
'Symfony UX Typed and backspace',
|
||||
'Control the speed',
|
||||
'Control the cursor',
|
||||
'Control your destiny!!!',
|
||||
'Control your destiny... sort of',
|
||||
] %}
|
||||
<span
|
||||
- data-controller="symfony--ux-typed"
|
||||
- data-symfony--ux-typed-loop-value="true"
|
||||
- data-symfony--ux-typed-show-cursor-value="true"
|
||||
- data-symfony--ux-typed-cursor-char-value="✨"
|
||||
- data-symfony--ux-typed-strings-value="{{ strings|json_encode|e('html_attr') }}"
|
||||
+ data-controller="typed"
|
||||
+ data-typed-loop-value="true"
|
||||
+ data-typed-show-cursor-value="true"
|
||||
+ data-typed-cursor-char-value="✨"
|
||||
+ data-typed-strings-value="{{ strings|json_encode|e('html_attr') }}"
|
||||
></span>
|
||||
```
|
||||
|
||||
4. Remove `symfony/ux-typed` from your dependencies:
|
||||
|
||||
```bash
|
||||
composer remove symfony/ux-typed
|
||||
```
|
||||
|
||||
You're done!
|
||||
|
||||
---
|
||||
|
||||
Symfony UX Typed is a Symfony bundle integrating [Typed](https://github.com/mattboldt/typed.js/blob/master/README.md) in
|
||||
Symfony applications. It is part of [the Symfony UX initiative](https://ux.symfony.com/).
|
||||
|
||||
|
||||
@@ -22,6 +22,10 @@
|
||||
"Symfony\\UX\\Typed\\": "src/"
|
||||
}
|
||||
},
|
||||
"require": {
|
||||
"php": ">=8.1",
|
||||
"symfony/deprecation-contracts": "^2.5|^3"
|
||||
},
|
||||
"conflict": {
|
||||
"symfony/flex": "<1.13"
|
||||
},
|
||||
|
||||
@@ -1,6 +1,13 @@
|
||||
Symfony UX Typed
|
||||
================
|
||||
|
||||
.. warning::
|
||||
|
||||
**Deprecated: This package has been deprecated in 2.x and will be removed in the next major version.**
|
||||
|
||||
To keep the same functionality in your Symfony application, please follow the migration steps
|
||||
from the `Symfony UX Typed README.md`_.
|
||||
|
||||
Symfony UX Typed is a Symfony bundle integrating `Typed`_ in
|
||||
Symfony applications. It is part of `the Symfony UX initiative`_.
|
||||
|
||||
@@ -156,3 +163,4 @@ https://symfony.com/doc/current/contributing/code/bc.html
|
||||
.. _`typed library`: https://github.com/mattboldt/typed.js/blob/master/README.md
|
||||
.. _StimulusBundle configured in your app: https://symfony.com/bundles/StimulusBundle/current/index.html
|
||||
.. _`@symfony/ux-typed npm package`: https://www.npmjs.com/package/@symfony/ux-typed
|
||||
.. _`Symfony UX Typed README.md`: https://github.com/symfony/ux/tree/2.x/src/Typed
|
||||
|
||||
@@ -16,6 +16,8 @@ use Symfony\Component\DependencyInjection\ContainerBuilder;
|
||||
use Symfony\Component\DependencyInjection\Extension\PrependExtensionInterface;
|
||||
use Symfony\Component\HttpKernel\DependencyInjection\Extension;
|
||||
|
||||
trigger_deprecation('symfony/ux-typed', '2.27.0', 'The package is deprecated and will be removed in 3.0. Follow the migration steps in https://github.com/symfony/ux/tree/2.x/src/Typed to keep using Typed in your Symfony application.');
|
||||
|
||||
/**
|
||||
* @internal
|
||||
*/
|
||||
|
||||
@@ -13,6 +13,8 @@ namespace Symfony\UX\Typed;
|
||||
|
||||
use Symfony\Component\HttpKernel\Bundle\Bundle;
|
||||
|
||||
trigger_deprecation('symfony/ux-typed', '2.27.0', 'The package is deprecated and will be removed in 3.0. Follow the migration steps in https://github.com/symfony/ux/tree/2.x/src/Typed to keep using Typed in your Symfony application.');
|
||||
|
||||
/**
|
||||
* @final
|
||||
*/
|
||||
|
||||
Reference in New Issue
Block a user