https://github.com/ozluy/calculate-text-width

Function that calculates width of typed text. Auto calculate input width.
https://github.com/ozluy/calculate-text-width

auto-width autoresize calculate input react-input-autowidth react-input-size text text-width width width-calculation

Last synced: 3 months ago
JSON representation

Function that calculates width of typed text. Auto calculate input width.

• Host: GitHub
• URL: https://github.com/ozluy/calculate-text-width
• Owner: ozluy
• License: mit
• Created: 2020-03-05T19:42:42.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2020-03-06T08:12:05.000Z (about 5 years ago)
• Last Synced: 2025-01-31T10:51:15.639Z (4 months ago)
• Topics: auto-width, autoresize, calculate, input, react-input-autowidth, react-input-size, text, text-width, width, width-calculation
• Language: JavaScript
• Homepage: https://codesandbox.io/s/calculate-text-width-okr46
• Size: 22.5 KB
• Stars: 4
• Watchers: 2
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Calculate Text Width

Function that calculates width of typed text

[![npm version](https://badge.fury.io/js/calculate-text-width.svg)](https://badge.fury.io/js/calculate-text-width)

![npm download](https://img.shields.io/npm/dt/calculate-text-width.svg)

 Code Sandbox Demo 

How to use

===

 

```js

import calculateTextWidth from "calculate-text-width";

/*

 requires two props "value" and "font"

  - defaultFont: normal 500 14px sans-serif 

 */

const calculatedWidth = calculateTextWidth('calculate my width', 'normal 500 14px sans-serif')

console.log(calculatedWidth) // 114.37890625

```

How to use with React

===

```jsx

import React, { useState, useMemo } from "react"

import calculateTextWidth from "calculate-text-width"

export default () => {

  const [value, setValue] = useState("change me")

  return (

    <>

      
Calcule Text Width

       setValue(evt.target.value)}

      />

    >

  )

}


```

 

Thank you

#### Yusuf Özlü