0.2.1 • Published 6 years ago

ansi-fragments v0.2.1

Weekly downloads
447,137
License
MIT
Repository
github
Last release
6 years ago

ansi-fragments

Version

PRs Welcome MIT License Chat Code of Conduct

A tiny library with builders to help making logs/CLI pretty with a nice DX.

Installation

yarn add ansi-fragments

Usage

import { color, modifier, pad, container } from 'ansi-fragments';

const prettyLog = (level, message) => container(
  color('green', modifier('italic', level)),
  pad(1),
  message
).build();

console.log(prettyLog('success', 'Yay!'));

API

Each fragment implements IFragment interface:

interface IFragment {
  build(): string;
}

The build method is responsible for traversing the tree of fragments and create a string representation with ANSI escape codes.

color

color(
  ansiColor: AnsiColor,
  ...children: Array<string | IFragment>
): IFragment

Creates fragment for standard ANSI colors.

color('red', 'Oh no');
color('bgBlue', color('brightBlue', 'Hey'));
color('green', modifier('bold', 'Sup!'));

modifier

modifier(
  ansiModifier: AnsiModifier,
  ...children: Array<string | IFragment>
): IFragment

Creates fragment for standard ANSI modifiers: dim, bold, hidden, italic, underline, strikethrough.

modifier('underline', 'Hello', 'World');
modifier('italic', modifier('bold', 'Hey'));
modifier('bold', color('green', 'Sup!'));

container

container(...children: Array<string | IFragment>): IFragment

Creates fragment, which sole purpose is to hold and build nested fragments.

container(
  color('gray', '[08/01/18 12:00]'),
  pad(1),
  color('green', 'success'),
  pad(1),
  'Some message'
)

pad

pad(count: number, separator?: string): IFragment

Creates fragment, which repeats given separator (default: ) given number of times.

pad(1);
pad(2, '#')
pad(1, '\n')

fixed

fixed(
  value: number,
  bias: 'start' | 'end',
  ...children: Array<string | IFragment>
): IFragment

Creates fragment, which makes sure the children will always build to given number of non-ANSI characters. It will either trim the results or add necessary amount of spaces. The bias control if trimming/padding should be done at the start of the string representing built children or at the end.

fixed(5, 'start', 'ERR'); // => '  ERR'
fixed(8, 'end', color('green', 'success')); // equals to color('green', 'success') + ' '
fixed(10, 'end', 'Hello', pad(2), 'World') // => 'Hello  Wor'

ifElse

ifElse(
  condition: Condition,
  ifTrueFragment: string | IFragment,
  elseFragment: string | IFragment
): IFragment

type ConditionValue = boolean | string | number | null | undefined;
type Condition = ConditionValue | (() => ConditionValue);

Change the output based on condition. Condition can ba a primitive value, which can be casted to boolean or a function. If conation or return value of condition is evaluated to true, the first argument - ifTrueFragment will be used, otherwise elseFragment.

let condition = getConditionValue()
ifElse(
  () => condition,
  color('red', 'ERROR'),
  color('yellow', 'WARNING')
)

provide

provide<T>(
  value: T,
  builder: (value: T) => string | IFragment
): IFragment

Provides given value to a builder function, which should return string or fragment. Useful in situations when the output is connected with some calculated value - using provide you only need to calculate final value once and forward it to custom styling logic.

provide(getMessageFromSomewhere(), value => {
  switch (value.level) {
    case 'error':
      return container(
        color('red', modifier('bold', value.level.toUpperCase())),
        pad(2),
        value.log
      );
    case 'info':
      return container(
        color('blue', value.level.toUpperCase()),
        pad(2),
        value.log
      );
    default:
      return container(value.level.toUpperCase(), pad(2), value.log);
  }
})
easy-select-rnreact-native-bluetooth2killi8n-react-native-fast-imagereact-native-template-rfbaseairscanairscan-examplereact-native-esc-pos-sahaab@borisovart/atol-kkt-moduledeneme323112@ntt_app/react-native-custom-notificationreact-native-custom-text-hwjamesreact-native-covid-sdkreact-native-printer-brothersrn-pdf-reader-offlinereact-native-shekhar-bridge-testwilscanner@oiti/documentoscopy-react-nativequoc-testreact-native-slider-kf@infinitebrahmanuniverse/nolb-ansluminos-ui-core@everything-registry/sub-chunk-1143jawwy-sdkjawwy_gamification_releasereact-native-sphereuisphereuijawwy_libraryreact-native-credit-card-pkgreact-native-jawwy_samplegriffin-ui-librarytest-library-123test-haptik-libtest-npm-jjmessiwifi_configuration_packagetest-zeo-collecttestnpm_lmnvision-camera-plugin-face-detectorvision-camera-plugin-scan-facesvision-camera-base64-resizedvantiq-react@cs6/react-native-test-native-view-library@con-test/react-native-concent-common@damian.lnc/core@damruravihara/react-native-testing-package@corelmax/react-native-my2c2p-sdk@praella/localisationist@routebuddies/react-native-mapbox-navigationjrennsoh88-react-native-scroll-indicatorjesh-calculationjnf-accesscontrol-rnttljordy-frijters-test-libkhaled-salem-custom-componentsjawwy_library_newjawy_library_v1gamification-jawwy-libraryframework_test_library_sixdee_new_jawwyreact-native-experts-sdktest_lib_module_aarquickcapture_react_nativern-agora-ios-mreact-native-omental-frameworkreact-native-sixdee_test_lib@amirdiafi/react-native-ios-haptics@apardellass/react-native-audio-stream@assystant/firebase@aviinash_jha/react-native-test_multiply@affinidi/affinidi-auth-sdk-kernel@ali5049/react-native-buttons@ajaykewat/myboilerplate@alanastor/robylon-react-native-sdk@baloochat/react-native-svg-uri@aysea/react-native-ui-library@brantalikp/rn-resize@10102004tan/react-native-select-dropdown-v2@adatechnology/react-native-android-getnet-pos@adembacaj/react-native-google-pay@_nomtek/react-native-shimmer-animation@azalpacir/react-native-dhp-printeryarn-react-hook-form@felipesimmi/react-native-datalogic-module@haul-bundler/cli@haul-bundler/core@haul-bundler/inspector@hbglobal/react-native-actions-shortcuts@idas1/ui-component-lib@edwinpb/scany@geeky-apo/react-native-advanced-clipboard@glyw/react-native-tabbed-section-list@labiebhn_/react-native-multiplier@lehuyaa/my-assets@lejimsft/haul-bundler-cli@navabi/react-native-ssl-pinning@ndjoe/react-native-bluetooth-escpos-printer@enkeledi/react-native-week-month-date-picker@extrieve_technologies/quickcapture_react_native@meerasolution/react-native-ms-upi-payment@iyansr/react-native-image-viewing@ko-developerhong/react-native-multiple-image-picker@jfilipe-sparta/react-native-module_2@hemith/react-native-tnk
0.2.1

6 years ago

0.1.1

6 years ago

0.2.0

6 years ago

0.1.0

6 years ago