# @dreamworld/web-util

> Misc Web Development utility functions

Latest version **1.7.2** (published 2024-04-30) · ISC license · 0 weekly downloads

## Install

```sh
npm install @dreamworld/web-util
pnpm add @dreamworld/web-util
yarn add @dreamworld/web-util
bun add @dreamworld/web-util
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 1.7.2 |
| Published | 2024-04-30 |
| First published | 2019-12-06 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 71.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Nirmal Baldaniya |
| Maintainers | chiragmoradiya, chetang7, ajay-dhameliya, dw-devops |
| Keywords | lit, input |

## Links

- npm: https://www.npmjs.com/package/@dreamworld/web-util
- Repository: https://github.com/DreamworldSolutions/web-util
- Homepage: https://github.com/DreamworldSolutions/web-util#readme
- Issues: https://github.com/DreamworldSolutions/web-util/issues
- npm.io page: https://npm.io/package/@dreamworld/web-util

## Dependencies (2)

- [bowser](https://npm.io/package/bowser.md) ^2.11.0
- [lodash-es](https://npm.io/package/lodash-es.md) ^4.17.21

## Alternatives

- [lodash.assign](https://npm.io/package/lodash.assign.md) — 2.3M weekly downloads
- [lodash.chunk](https://npm.io/package/lodash.chunk.md) — 1.8M weekly downloads
- [react-native-ios-utilities](https://npm.io/package/react-native-ios-utilities.md) — 138.5K weekly downloads
- [@technically/lodash](https://npm.io/package/@technically/lodash.md) — 50.9K weekly downloads
- [@fluid-topics/ft-icon](https://npm.io/package/@fluid-topics/ft-icon.md) — 20.6K weekly downloads

## Recent versions

- 1.7.2 (latest) — 2024-04-30
- 1.7.2-add-is-element-visible.1 (add-is-element-visible) — 2024-04-30
- 1.5.1-development.1 (development) — 2022-01-21
- 1.5.1-debug-history-back.1 (debug-history-back) — 2022-01-21
- 1.5.0-history.2 (history) — 2021-11-16
- 1.4.7-fix-clienHeight-of-null.1 (fix-clienHeight-of-null) — 2021-09-09
- 1.4.6-update-touch-logic.3 (update-touch-logic) — 2021-08-19
- 1.4.5-refactor-scrollintoview.2 (refactor-scrollintoview) — 2021-05-06
- 1.4.4-fix-regration-for-visual-viewport.1 (fix-regration-for-visual-viewport) — 2020-12-07
- 1.4.3-fix-visual-viewport-issue-for-ios.7 (fix-visual-viewport-issue-for-ios) — 2020-11-30
- 1.4.2-scrolling-issue-fix.1 (scrolling-issue-fix) — 2020-11-11
- 1.4.0-trigger-version-release.1 (trigger-version-release) — 2020-11-04
- 1.4.0-trigger-release.1 (trigger-release) — 2020-11-04
- 1.3.4-trigger.1 (trigger) — 2020-11-04
- 1.3.4-prevent-scroll-on-focus.1 (prevent-scroll-on-focus) — 2020-11-04
- … 63 more at https://npm.io/package/@dreamworld/web-util/versions

## README

# web-util
Misc Web Development utility functions

## htmlTrim
 - Removes empty nodes/html from the both side of a given html template or String.

#### Examples

###### Example-1: Remove all begining empty nodes
- **Input:**
  ```
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div>hello</div>
  ```
- **Output:**
  ```
    <div>hello</div>
  ```

###### Example-2: Remove all end empty nodes
- **Input:**
  ```
    <div>hello</div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
  ```
- **Output:**
  ```
    <div>hello</div>
  ```


###### Example-3: Trim start of first non empty nodes
- **Input:**
  ```
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div>      hello</div>
  ```
- **Output:**
  ```
    <div>hello</div>
  ```

###### Example-4: Trim end of last non empty nodes
- **Input:**
  ```
    <div>hello     </div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
  ```
- **Output:**
  ```
    <div>hello</div>
  ```

###### Example-5: Remove all empty nodes from begining and end also start trim first non empty nodes and end trim last non empty nodes.
- **Input:**
  ```
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div>   hello1     </div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div>   hello2     </div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
  ```
- **Output:**
  ```
    <div>hello1     </div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div>   hello2</div>
  ```

###### Example-6 nested div with text nodes
- **Input:**
  ```
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div>
      <div></div>
      <div></div>
      <div></div>
      <div></div>
      <div>  hello1  </div>
      <div></div>
      <div></div>
      <div>  hello2  </div>
      <div></div>
      <div></div>
    </div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
  ```
- **Output:**
  ```
    <div>
      <div>hello1  </div>
      <div></div>
      <div></div>
      <div>  hello2</div>
    </div>
  ```

###### Example-7 First node as text node
- **Input:**
  ```
    hello1
    <div>
      <div></div>
      <div>  hello2  </div>
      <div></div>
      <div></div>
      <div>  hello3  </div>
      <div></div>
      <div></div>
    </div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
  ```
- **Output:**
  ```
    hello1
    <div>
      <div></div>
      <div>  hello2  </div>
      <div></div>
      <div></div>
      <div>  hello3</div>
    </div>
  ```

## openVirtualKeyboard
  - Opens virtual keyboard in touch devices

## replaceAll
- There is no support of replaceAll method in old browsers, so it is its wrapper method which if browser's replaceAll method is available, it will use it, otherwise it will replace with custom logic using lodash's replace method.

---
_Source: https://npm.io/package/@dreamworld/web-util · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._