diff --git a/examples/createElement.html b/examples/createElement.html index 9432e27..61b91f6 100644 --- a/examples/createElement.html +++ b/examples/createElement.html @@ -11,7 +11,33 @@ diff --git a/examples/takeWhile.html b/examples/takeWhile.html index fef7c94..9c717c3 100644 --- a/examples/takeWhile.html +++ b/examples/takeWhile.html @@ -23,13 +23,14 @@ import { $$, $ } from "../index.js" const elems = $$("span") + .css("border", "2px solid black") .takeWhile((el) => parseInt(el.textContent) < 5) .css("background-color", "yellow") .do((el) => console.log(el.textContent)) .refresh() - .css("border", "2px solid black") .takeWhile((el) => parseInt(el.textContent) > 5, true) .css("background-color", "pink") + .refresh() diff --git a/examples/whenIFinallyRealizedIWasDumb.html b/examples/whenIFinallyRealizedIWasDumb.html deleted file mode 100644 index 67fac0a..0000000 --- a/examples/whenIFinallyRealizedIWasDumb.html +++ /dev/null @@ -1,40 +0,0 @@ - - - - - - Setting Loading Indicator - - -
Initial content
- - - - - diff --git a/index.d.ts b/index.d.ts index a010c28..5c6387c 100644 --- a/index.d.ts +++ b/index.d.ts @@ -888,7 +888,7 @@ declare module "jessquery" { * if the current element does not match the predicate. The `refresh()` method * can be used to restore the proxy to its original state. * - * Usually, the {@link DomProxy.if} method is a better choice for conditional logic. + * Usually, the {@link DomProxy.if} method or a simple ternary operator is a better choice for conditional logic. * * @param {Function} predicate A function that tests the element for a specific condition. * @returns This {@link DomProxy} either filtered or emptied based on the predicate. @@ -906,7 +906,10 @@ declare module "jessquery" { * .css('border', '1px solid red') * // Only applies the border style if the div with class 'container' has more than 3 children. */ - takeWhile: (predicate: (el: Element) => boolean) => DomProxy + takeWhile: ( + predicate: (el: Element) => boolean, + reverse?: boolean + ) => DomProxy /** * Restores the proxy to its original state (when the variable was created). @@ -1836,9 +1839,11 @@ declare module "jessquery" { * The collection will be modified to contain only those elements that * satisfy the predicate consecutively from the start. * - * This method provides a more natural way to filter elements in the proxy. - * It's powerful but should be used with caution. The `refresh()` method - * can be employed to restore the proxy to its original state if the filtering becomes confusing. + * This method is useful for filtering out elements that are not needed + * for a particular operation. The {@link DomProxyCollection.refresh} + * can be employed to restore the proxy to its original state. + * + * Remember-- the filter array method can be used for a more general filtering operation. * * For simple conditional logic, use the {@link DomProxyCollection.if} method instead. * @@ -1858,6 +1863,14 @@ declare module "jessquery" { * .takeWhile(el => el.dataset.value && parseInt(el.dataset.value, 10) > 5) * .css('font-weight', 'bold') * // Only makes the list items bold if they have a data-value attribute greater than 5, and it's consecutive from the start. + * + * @example + * // Complex example with reverse + * $$('.list-items') + * .css('color', 'blue') + * .takeWhile(el => el.dataset.value && parseInt(el.dataset.value, 10) > 5, true) + * .css('font-weight', 'bold') + * // Only makes the list items bold if they have a data-value attribute greater than 5, and it's consecutive from the end. */ takeWhile: ( predicate: (el: DomProxyCollection) => boolean,