Compare commits
1 commit
master
...
chore/add-
| Author | SHA1 | Date | |
|---|---|---|---|
| 0cf0ce4fb3 |
8 changed files with 8 additions and 148 deletions
|
|
@ -1,5 +0,0 @@
|
||||||
---
|
|
||||||
'@lion/ui': patch
|
|
||||||
---
|
|
||||||
|
|
||||||
fix(LionInputStepper): improve handling of decimal step values and alignment closes #2615
|
|
||||||
29
README.md
29
README.md
|
|
@ -54,35 +54,6 @@ They provide an unopinionated, white-label layer that can be extended to your ow
|
||||||
<a href="https://lion.js.org/guides/"><strong>Explore the Lion Guides ▶</strong></a>
|
<a href="https://lion.js.org/guides/"><strong>Explore the Lion Guides ▶</strong></a>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<details>
|
|
||||||
<summary><h2>Table of Contents</h2></summary>
|
|
||||||
<ul>
|
|
||||||
<li><a href="#astro-migration"> Astro migration </a>
|
|
||||||
<ul>
|
|
||||||
<li><a href="#astro-how-to"> Astro how to </a></li>
|
|
||||||
<li><a href="#issues-which-are-not-caused-by-the-migration-not-to-be-fixed-now"> Issues which are not caused by migration </a></li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li><a href="#how-to-install"> Installation </a></li>
|
|
||||||
<li><a href="#how-to-use"> How to use </a>
|
|
||||||
<ul>
|
|
||||||
<li><a href="#extend-a-web-component"> Extend a web component </a></li>
|
|
||||||
<li><a href="#use-a-javascript-system"> Use a JavaScript system </a></li>
|
|
||||||
<li><a href="#use-a-web-component"> Use a Web Component </a></li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li><a href="#issues"> Issues </a></li>
|
|
||||||
<li><a href="#feature-requests"> Feature request </a></li>
|
|
||||||
<li><a href="#content"> Content </a></li>
|
|
||||||
<li><a href="#technologies"> Technologies </a></li>
|
|
||||||
<li><a href="#rationale"> Rationale </a></li>
|
|
||||||
<li><a href="#coding-guidelines"> Coding guidelines </a></li>
|
|
||||||
<li><a href="#how-to-contribute"> How to contribute </a></li>
|
|
||||||
<li><a href="#site-deployment"> Site deployment </a></li>
|
|
||||||
<li><a href="#content"> Contact </a></li>
|
|
||||||
</ul>
|
|
||||||
</details>
|
|
||||||
|
|
||||||
## Astro migration
|
## Astro migration
|
||||||
|
|
||||||
- Keep using `/docs` on the root level as we used it in the `master` branch. The documentation is copied into Astro related directories on `npm run start` and when when anything in `/docs` is updated.
|
- Keep using `/docs` on the root level as we used it in the `master` branch. The documentation is copied into Astro related directories on `npm run start` and when when anything in `/docs` is updated.
|
||||||
|
|
|
||||||
|
|
@ -130,13 +130,3 @@ rocket-navigation ul > li:nth-child(n + 6).active > ul {
|
||||||
font-size: inherit;
|
font-size: inherit;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.announcement-bar {
|
|
||||||
background: var(--primary-color);
|
|
||||||
color: white;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
& a {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,11 +0,0 @@
|
||||||
<div class="announcement-bar">
|
|
||||||
<p>A new portal is coming! Check out <a href="/about/astro">the technical release of our Astro portal</a></p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<header id="main-header">
|
|
||||||
<div class="content-area">
|
|
||||||
{% for blockName, blockPath in _joiningBlocks.header %}
|
|
||||||
{% include blockPath %}
|
|
||||||
{% endfor %}
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
@ -1,27 +0,0 @@
|
||||||
---
|
|
||||||
title: Astro portal
|
|
||||||
description: Technically live with Astro (while still fully compatible with Rocket content!)
|
|
||||||
---
|
|
||||||
|
|
||||||
# Astro Portal Announcement
|
|
||||||
|
|
||||||
We are excited to introduce the new version of our portal, now built with the Astro framework! You can access it at <a href="https://lion.js.org/next" rel="noopener noreferrer">/next</a>.
|
|
||||||
|
|
||||||
## What’s New?
|
|
||||||
|
|
||||||
- **Modern Look & Feel:** The UI will be redesigned in close collaboration with our designers. Expect further improvements as the design team continues to enhance the user experience.
|
|
||||||
- **Search Functionality:** Quickly find components and documentation with the new search feature.
|
|
||||||
- **Upgraded Dependencies:** All major dependencies and approaches have been updated for better performance, security, and maintainability.
|
|
||||||
|
|
||||||
## Compatibility
|
|
||||||
|
|
||||||
The new Astro portal is fully compatible with the previous Rocket-based portal. Maintaining the same structure and functionality was a key challenge and priority, ensuring a seamless experience for all users. Both portals will run in parallel in the near term future. During the course of 2026 the Astro portal will become the default.
|
|
||||||
|
|
||||||
## For Developers
|
|
||||||
|
|
||||||
The technical release of the Astro portal is primarily aimed at developers. We encourage you to explore the new features and provide feedback.
|
|
||||||
|
|
||||||
**Found an issue or have a suggestion?**
|
|
||||||
Please open an issue on [GitHub](https://github.com/ing-bank/lion/issues) and use the tag `#astro`.
|
|
||||||
|
|
||||||
Stay tuned for more updates as we continue to improve the portal!
|
|
||||||
|
|
@ -267,19 +267,12 @@ export class LionInputStepper extends LocalizeMixin(LionInput) {
|
||||||
_increment() {
|
_increment() {
|
||||||
const { step, min, max } = this.values;
|
const { step, min, max } = this.values;
|
||||||
const stepMin = min !== Infinity ? min : 0;
|
const stepMin = min !== Infinity ? min : 0;
|
||||||
const epsilon = 1e-10; // Tolerance for floating-point comparison
|
|
||||||
|
|
||||||
let newValue;
|
let newValue = this.currentValue + step;
|
||||||
|
|
||||||
const remainder = (this.currentValue - stepMin) % step;
|
if ((this.currentValue + stepMin) % step !== 0) {
|
||||||
const isAligned = Math.abs(remainder) < epsilon || Math.abs(remainder - step) < epsilon;
|
// If the value is not aligned to step, align it to the nearest step
|
||||||
|
newValue = Math.floor(this.currentValue / step) * step + step + (stepMin % step);
|
||||||
if (!isAligned) {
|
|
||||||
// If the value is not aligned to step, align it to the next valid step
|
|
||||||
newValue = Math.ceil((this.currentValue - stepMin) / step) * step + stepMin;
|
|
||||||
} else {
|
|
||||||
// If the value is aligned, just add the step
|
|
||||||
newValue = this.currentValue + step;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (newValue <= max || max === Infinity) {
|
if (newValue <= max || max === Infinity) {
|
||||||
|
|
@ -296,19 +289,12 @@ export class LionInputStepper extends LocalizeMixin(LionInput) {
|
||||||
_decrement() {
|
_decrement() {
|
||||||
const { step, max, min } = this.values;
|
const { step, max, min } = this.values;
|
||||||
const stepMin = min !== Infinity ? min : 0;
|
const stepMin = min !== Infinity ? min : 0;
|
||||||
const epsilon = 1e-10; // Tolerance for floating-point comparison
|
|
||||||
|
|
||||||
let newValue;
|
let newValue = this.currentValue - step;
|
||||||
|
|
||||||
const remainder = (this.currentValue - stepMin) % step;
|
if ((this.currentValue + stepMin) % step !== 0) {
|
||||||
const isAligned = Math.abs(remainder) < epsilon || Math.abs(remainder - step) < epsilon;
|
// If the value is not aligned to step, align it to the nearest step
|
||||||
|
newValue = Math.floor(this.currentValue / step) * step + (stepMin % step);
|
||||||
if (!isAligned) {
|
|
||||||
// If the value is not aligned to step, align it to the previous valid step
|
|
||||||
newValue = Math.floor((this.currentValue - stepMin) / step) * step + stepMin;
|
|
||||||
} else {
|
|
||||||
// If the value is aligned, just subtract the step
|
|
||||||
newValue = this.currentValue - step;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (newValue >= min || min === Infinity) {
|
if (newValue >= min || min === Infinity) {
|
||||||
|
|
|
||||||
|
|
@ -359,47 +359,6 @@ describe('<lion-input-stepper>', () => {
|
||||||
await el.updateComplete;
|
await el.updateComplete;
|
||||||
expect(el.modelValue).to.equal(-13, 'Fail - : (-23 > 100 by 10; val 55)'); // -23 > -13 > -3 > 7
|
expect(el.modelValue).to.equal(-13, 'Fail - : (-23 > 100 by 10; val 55)'); // -23 > -13 > -3 > 7
|
||||||
});
|
});
|
||||||
|
|
||||||
it('handles decimal step values correctly', async () => {
|
|
||||||
// Test with decimal step 0.1
|
|
||||||
let el = await fixture(
|
|
||||||
html`<lion-input-stepper step="0.1" min="0" max="9" value="5.55"></lion-input-stepper>`,
|
|
||||||
);
|
|
||||||
|
|
||||||
// Test increment with decimal step
|
|
||||||
let incrementButton = el.querySelector('[slot=suffix]');
|
|
||||||
incrementButton?.dispatchEvent(new Event('click'));
|
|
||||||
await el.updateComplete;
|
|
||||||
expect(el.modelValue).to.equal(5.6, 'Fail + : (0 > 9 by 0.1; val 5.55)');
|
|
||||||
|
|
||||||
// Test decrement with decimal step
|
|
||||||
let decrementButton = el.querySelector('[slot=prefix]');
|
|
||||||
decrementButton?.dispatchEvent(new Event('click'));
|
|
||||||
await el.updateComplete;
|
|
||||||
expect(el.modelValue).to.equal(5.5, 'Fail - : (0 > 9 by 0.1; val 5.6)');
|
|
||||||
|
|
||||||
// Test with value that needs alignment
|
|
||||||
el = await fixture(
|
|
||||||
html`<lion-input-stepper step="0.1" min="0" max="9" value="3.27"></lion-input-stepper>`,
|
|
||||||
);
|
|
||||||
|
|
||||||
// Should align to next step when incrementing
|
|
||||||
incrementButton = el.querySelector('[slot=suffix]');
|
|
||||||
incrementButton?.dispatchEvent(new Event('click'));
|
|
||||||
await el.updateComplete;
|
|
||||||
expect(el.modelValue).to.equal(3.3, 'Fail + alignment: (0 > 9 by 0.1; val 3.27)');
|
|
||||||
|
|
||||||
// Reset and test decrement alignment
|
|
||||||
el = await fixture(
|
|
||||||
html`<lion-input-stepper step="0.1" min="0" max="9" value="3.27"></lion-input-stepper>`,
|
|
||||||
);
|
|
||||||
|
|
||||||
// Should align to previous step when decrementing
|
|
||||||
decrementButton = el.querySelector('[slot=prefix]');
|
|
||||||
decrementButton?.dispatchEvent(new Event('click'));
|
|
||||||
await el.updateComplete;
|
|
||||||
expect(el.modelValue).to.equal(3.2, 'Fail - alignment: (0 > 9 by 0.1; val 3.27)');
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -34,9 +34,6 @@ export default {
|
||||||
eleventyConfig.setUseGitIgnore(false);
|
eleventyConfig.setUseGitIgnore(false);
|
||||||
eleventyConfig.addPassthroughCopy('CNAME');
|
eleventyConfig.addPassthroughCopy('CNAME');
|
||||||
},
|
},
|
||||||
checkLinks: {
|
|
||||||
ignoreLinkPatterns: ['**/astro'],
|
|
||||||
},
|
|
||||||
absoluteBaseUrl: absoluteBaseUrlNetlify('http://localhost:8080'),
|
absoluteBaseUrl: absoluteBaseUrlNetlify('http://localhost:8080'),
|
||||||
setupUnifiedPlugins: [
|
setupUnifiedPlugins: [
|
||||||
adjustPluginOptions(mdjsSetupCode, {
|
adjustPluginOptions(mdjsSetupCode, {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue