FTX LibrariesShared Libraries & Components

Quick Start ​

Prerequisites: Azure Artifacts Authentication ​

These packages are published to Azure Artifacts and require authentication. Before installing, you need to:

1. Generate a Personal Access Token (PAT) from Azure DevOps
2. Configure .npmrc file in your project root

See the Installation Guide for detailed setup instructions.

Install Packages ​

Once authenticated, install the packages:

npm install @ftx/ui @ftx/utils
# or
pnpm add @ftx/ui @ftx/utils
# or
yarn add @ftx/ui @ftx/utils

Use UI Components ​

<template>
  <FTxButton @click="handleClick">
    Click Me
  </FTxButton>
</template>

<script setup>
import { FTxButton } from '@ftx/ui';

function handleClick() {
  console.log('Button clicked');
}
</script>

Use Utilities ​

import { convertArrayToObject, sleep, cloneDeep, isEqual } from '@ftx/utils';

const users = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' }
];

const usersById = convertArrayToObject(users, 'id');
await sleep(1000);

// Object utilities
const cloned = cloneDeep(users);
const areEqual = isEqual(users, cloned); // true

Packages ​

@ftx/ui ​

A Vue 3 UI component library built on top of Quasar Framework. Provides reusable Vue components, plugins, and composables that follow FTX design patterns and standards.

View UI Documentation →

@ftx/utils ​

A collection of utility functions that can be used across different FTX projects. These utilities provide common functionality for data manipulation, string processing, async operations, object cloning, type checking, and equality comparison.

View Utils Documentation →

Requirements ​

• Node.js 18.x or higher
• npm 9.x or higher (or pnpm/yarn)

Contributing ​

1. Create a feature branch
2. Make your changes
3. Ensure all packages build successfully
4. Submit a pull request