npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@ohochat/address

v1.0.0-rc5

Published

Suggestion for relation locations detail

Downloads

14

Readme

Address for Thailand

NPM Version Typescript lang All Contributors npm bundle size

Introducing address — a no-nonsense Thailand address helper.

This lightweight package empowers you to focus on building address features faster, rather than wrestling with complexity of address handling. It embraces framework-agnostic and isomorphic design — meaning it can be used with any libraries and works on both client and server out-of-the-box.

With this package, you can effortlessly:

  • Leverage pre-built relationships between address components
  • Filter addresses by various criteria e.g. postcode, province, district and sub district.
  • Build robust address-based applications without worrying about the underlying complexity

By using address, you'll enjoy a more streamlined development experience and deliver high-quality results faster.

This package is designed and brought to you by Oho Chat — the No. 1 customer support and sale management platform!

Getting Started

Install the package:

# npm
npm i @ohochat/address

# yarn
yarn add @ohochat/address

# pnpm
pnpm i @ohochat/address

Location

Use Location to find addresses with search constraints.

Creating an instance

import { Location } from '@ohochat/address';

const location = new Location();

You can create a new instance of Location. A Location let you query addresses based on your criteria, resulting in one or more matched addresses (or zero if not matched!). An address is made up from the following components:

  • postalCode
  • provinceName (changwat)
  • districtName (amphoe)
  • subDistrctName (tambon)

These components can be refered to by a standardized numerical code in 2, 4 and 6 digits. For example, code 10 is "กรุงเทพมหานคร", 1001 is "เขตบางรัก กรุงเทพมหานคร" and 100403 is "แขวงสุริยวงศ์ เขตบางรัก กรุงเทพมหานคร". You can use the following codes in an address interchangeably with the textual components.

  • provinceCode
  • districtCode
  • subDistricteCode

Find Location Address

Find addresses using queries. The resulting addresses can be passed to mapping or map-reduce function for convenience.

// Find address
Location.execute(query)
Location.execute(query, callback) // map results
Location.execute(query, callback, initialValue) // map reduce results

// Example Result
[
    {
        postalCode: 10270,
        provinceCode: 11,
        provinceName: 'สมุทรปราการ',
        districtCode: 1101,
        districtName: 'เมืองสมุทรปราการ',
        subDistrictCode: 110101,
        subDistrictName: 'ปากน้ำ',
    },
    // ... more addresses
]

Location Query

These are the available query options for searching by address components or codes. There are 2 ways to find addresses:

  1. Exact match using MOI code.
  2. Partial match using address component.

You can mix exact and partial matches in a single query. Otherwise, you can pass {} and get all of the addresses (why not!).



{
    // 1. Exact match using MOI code

    // provinceCode in 2 digits like 11
    provinceCode?: number

    // districtCode in 4 digits like 1101
    districtCode?: number

    // subDistrictCode in 6 digits like 110101
    subDistrictCode?: number

    // 2. Partial match using address component

    // province name beginning with กรุง
    provinceName?: string

    // district name beginning with บาง
    districtName?: string

    // sub district name beginning with บาง
    subDistrictName?: string

    // postal code beginning with 10
    postalCode?: number
}

Use Cases

// Get address details
const results1 = location.execute({
    postalCode: 10270,
    subDistrictName: 'ปากน้ำ',
})

// results1
[
    {
        districtCode: 1101,
        districtName: 'เมืองสมุทรปราการ',
        postalCode: 10270,
        provinceCode: 11,
        provinceName: 'สมุทรปราการ',
        subDistrictCode: 110101,
        subDistrictName: 'ปากน้ำ',
    },
]


// Get address details and mapping data
const results2 = location.execute(
    {
        provinceName: 'กรุง',
        districtName: 'บางนา',
        subDistrictName: 'บางนาใต้',
    },
    (row) => ({ a: `${row.provinceName} ${row.postalCode}` }),
)
// results2
[
    {
        a: 'กรุงเทพมหานคร 10260',
    },
]


// Get address detail and restucture data
const results3 = location.execute(
    {
        provinceName: 'กรุง',
        districtName: 'บางนา',
    },
    (acc, row) => {
        acc.add(row.provinceName)
        return acc
    },
    new Set<string>(),
)
// results3
Set(1) { 'กรุงเทพมหานคร' }

Development

Initial Setup

  1. Clone the project from github:

    git clone [email protected]:ohoexperience/address.git
  2. Install the dependencies:

    # npm
    npm i
    
    # yarn
    yarn
    
    # pnpm
    pnpm

Testing

address has two types of tests:

  • Unit tests: pnpm test
  • Coverage tests: pnpm test-coverage

Data Source

The address data is sourced from and managed by thailand-geography-json. Kudos to the team for their great works!

License

MIT © Oho Chat. See LICENSE for details.