[!CAUTION] Quilt is no longer maintained. The packages listed below are deprecated.

Functionality can be replaced with more modern and maintained open source projects, or implemented in userland along side the latest versions of koa/react/etc.

Shopifolk, see Shopify/quilt-internal for information on the latest packages available for use internally.

Quilt

A loosely related set of packages for JavaScript/TypeScript projects at Shopify.

These libraries compose together to help you create performant modern JS apps that you love to develop and test. These packages are developed primarily to be used on top of the stack we like best for our JS apps; Typescript for the flavor, Koa for the server, React for UI, Apollo for data fetching, and Jest for tests. That said, you can mix and match as you like.

⚠️ Over the past few years, this repo has become a dumping ground for a variety of packages unrelated to the core problems Quilt, and it's stewards - the Admin Web Foundation team - aims to solve. Before submitting a pull request, please speak with the Admin Web Platform team on guidance as to whether a package might belong in Quilt. The Admin Web Platform team's focus is on the web codebase. If you're proposing a package that has not already been widely used in the web codebase then it is unlikely that it would be merged into Quilt.

Usage

The Quilt repo is managed as a monorepo that is composed of 67 npm packages and one Ruby gem. Each package/gem has its own README.md and documentation describing usage.

Package Index

| Package | Version | Status | Description | | ------- | ------- | ------ | ----------- | | @shopify/address | <a href="https://badge.fury.io/js/%40shopify%2Faddress"><img src="https://badge.fury.io/js/%40shopify%2Faddress.svg" width="200px" /></a> | ⚠️ Deprecated | Address utilities for formatting addresses | | @shopify/address-consts | <a href="https://badge.fury.io/js/%40shopify%2Faddress-consts"><img src="https://badge.fury.io/js/%40shopify%2Faddress-consts.svg" width="200px" /></a> | ⚠️ Deprecated | Constants and types relating to @shopify/address | | @shopify/address-mocks | <a href="https://badge.fury.io/js/%40shopify%2Faddress-mocks"><img src="https://badge.fury.io/js/%40shopify%2Faddress-mocks.svg" width="200px" /></a> | ⚠️ Deprecated | Address mocks for @shopify/address | | @shopify/admin-graphql-api-utilities | <a href="https://badge.fury.io/js/%40shopify%2Fadmin-graphql-api-utilities"><img src="https://badge.fury.io/js/%40shopify%2Fadmin-graphql-api-utilities.svg" width="200px" /></a> | ⚠️ Deprecated | A set of utilities to use when consuming Shopify’s admin GraphQL API | | @shopify/async | <a href="https://badge.fury.io/js/%40shopify%2Fasync"><img src="https://badge.fury.io/js/%40shopify%2Fasync.svg" width="200px" /></a> | ⚠️ Deprecated | Primitives for loading parts of an application asynchronously | | @shopify/browser | <a href="https://badge.fury.io/js/%40shopify%2Fbrowser"><img src="https://badge.fury.io/js/%40shopify%2Fbrowser.svg" width="200px" /></a> | ⚠️ Deprecated | Utilities for extracting browser information from user-agents | | @shopify/csrf-token-fetcher | <a href="https://badge.fury.io/js/%40shopify%2Fcsrf-token-fetcher"><img src="https://badge.fury.io/js/%40shopify%2Fcsrf-token-fetcher.svg" width="200px" /></a> | ⚠️ Deprecated | JavaScript utility function to fetch the CSRF token required to make requests to a Rails server | | @shopify/css-utilities | <a href="https://badge.fury.io/js/%40shopify%2Fcss-utilities"><img src="https://badge.fury.io/js/%40shopify%2Fcss-utilities.svg" width="200px" /></a> | ⚠️ Deprecated | A set of CSS styling-related utilities | | @shopify/dates | <a href="https://badge.fury.io/js/%40shopify%2Fdates"><img src="https://badge.fury.io/js/%40shopify%2Fdates.svg" width="200px" /></a> | ⚠️ Deprecated | Lightweight date operations library | | @shopify/function-enhancers | <a href="https://badge.fury.io/js/%40shopify%2Ffunction-enhancers"><img src="https://badge.fury.io/js/%40shopify%2Ffunction-enhancers.svg" width="200px" /></a> | ⚠️ Deprecated | A set of helpers to enhance functions | | graphql-config-utilities | <a href="https://badge.fury.io/js/graphql-config-utilities"><img src="https://badge.fury.io/js/graphql-config-utilities.svg" width="200px" /></a> | ⚠️ Deprecated | Common utilities for graphql-config | | graphql-fixtures | <a href="https://badge.fury.io/js/graphql-fixtures"><img src="https://badge.fury.io/js/graphql-fixtures.svg" width="200px" /></a> | ⚠️ Deprecated | Utilities for generating fixture objects from GraphQL documents. | | graphql-mini-transforms | <a href="https://badge.fury.io/js/graphql-mini-transforms"><img src="https://badge.fury.io/js/graphql-mini-transforms.svg" width="200px" /></a> | ⚠️ Deprecated | Transformers for importing .graphql files in various build tools. | | @shopify/graphql-testing | <a href="https://badge.fury.io/js/%40shopify%2Fgraphql-testing"><img src="https://badge.fury.io/js/%40shopify%2Fgraphql-testing.svg" width="200px" /></a> | ⚠️ Deprecated | Utilities to create mock GraphQL factories | | graphql-tool-utilities | <a href="https://badge.fury.io/js/graphql-tool-utilities"><img src="https://badge.fury.io/js/graphql-tool-utilities.svg" width="200px" /></a> | ⚠️ Deprecated | Common utilities for GraphQL developer tools | | graphql-typed | <a href="https://badge.fury.io/js/graphql-typed"><img src="https://badge.fury.io/js/graphql-typed.svg" width="200px" /></a> | ⚠️ Deprecated | A more strongly typed version of GraphQL's DocumentNode. | | graphql-typescript-definitions | <a href="https://badge.fury.io/js/graphql-typescript-definitions"><img src="https://badge.fury.io/js/graphql-typescript-definitions.svg" width="200px" /></a> | ⚠️ Deprecated | Generate TypeScript definition files from .graphql documents | | @shopify/i18n | <a href="https://badge.fury.io/js/%40shopify%2Fi18n"><img src="https://badge.fury.io/js/%40shopify%2Fi18n.svg" width="200px" /></a> | ⚠️ Deprecated | Generic i18n-related utilities | | @shopify/jest-dom-mocks | <a href="https://badge.fury.io/js/%40shopify%2Fjest-dom-mocks"><img src="https://badge.fury.io/js/%40shopify%2Fjest-dom-mocks.svg" width="200px" /></a> | ⚠️ Deprecated | Jest mocking utilities for working with the DOM | | @shopify/jest-koa-mocks | <a href="https://badge.fury.io/js/%40shopify%2Fjest-koa-mocks"><img src="https://badge.fury.io/js/%40shopify%2Fjest-koa-mocks.svg" width="200px" /></a> | ⚠️ Deprecated | Utilities to easily stub Koa context and cookies | | @shopify/koa-liveness-ping | <a href="https://badge.fury.io/js/%40shopify%2Fkoa-liveness-ping"><img src="https://badge.fury.io/js/%40shopify%2Fkoa-liveness-ping.svg" width="200px" /></a> | ⚠️ Deprecated | A package for creating liveness ping middleware for use with Koa | | @shopify/koa-metrics | <a href="https://badge.fury.io/js/%40shopify%2Fkoa-metrics"><img src="https://badge.fury.io/js/%40shopify%2Fkoa-metrics.svg" width="200px" /></a> | ⚠️ Deprecated | Aims to provide standard middleware and instrumentation tooling for metrics in Koa | | @shopify/koa-performance | <a href="https://badge.fury.io/js/%40shopify%2Fkoa-performance"><img src="https://badge.fury.io/js/%40shopify%2Fkoa-performance.svg" width="200px" /></a> | ⚠️ Deprecated | Creating middleware that sends performance-related data through StatsD | | @shopify/koa-shopify-graphql-proxy | <a href="https://badge.fury.io/js/%40shopify%2Fkoa-shopify-graphql-proxy"><img src="https://badge.fury.io/js/%40shopify%2Fkoa-shopify-graphql-proxy.svg" width="200px" /></a> | ⚠️ Deprecated | A wrapper around koa-better-http-proxy which allows easy proxying of GraphQL requests from an embedded Shopify app | | @shopify/koa-shopify-webhooks | <a href="https://badge.fury.io/js/%40shopify%2Fkoa-shopify-webhooks"><img src="https://badge.fury.io/js/%40shopify%2Fkoa-shopify-webhooks.svg" width="200px" /></a> | ⚠️ Deprecated | Receive webhooks from Shopify with ease | | @shopify/mime-types | <a href="https://badge.fury.io/js/%40shopify%2Fmime-types"><img src="https://badge.fury.io/js/%40shopify%2Fmime-types.svg" width="200px" /></a> | ⚠️ Deprecated | MIME type consistency | | @shopify/name | <a href="https://badge.fury.io/js/%40shopify%2Fname"><img src="https://badge.fury.io/js/%40shopify%2Fname.svg" width="200px" /></a> | ⚠️ Deprecated | Name-related utilities | | @shopify/network | <a href="https://badge.fury.io/js/%40shopify%2Fnetwork"><img src="https://badge.fury.io/js/%40shopify%2Fnetwork.svg" width="200px" /></a> | ⚠️ Deprecated | Common values related to dealing with the network | | [@shopify/performance](packages/p