Blessed Tab Container

Common errors

• ReferenceError: require is not defined in ES module scope

  cause Attempting to use `require()` in an ES module file (e.g., `type: 'module'` in package.json or `.mjs` file).
  fix Ensure your file is treated as CommonJS (e.g., `.js` file without `type: 'module'` in `package.json`). For `blessed-tab-container@1.0.0`, direct ESM imports are not supported. Stick to CommonJS `require()`.

• TypeError: BlessedTabContainer is not a function

  cause Incorrect import statement, typically trying to use named import syntax (`import { BlessedTabContainer } from 'blessed-tab-container'`) instead of default import for a CommonJS module that exports a function.
  fix If using CommonJS, ensure `const BlessedTabContainer = require('blessed-tab-container')` is used. If attempting ESM with a bundler, ensure it handles default CJS exports correctly, e.g., `import BlessedTabContainer from 'blessed-tab-container'` after appropriate transpilation/bundling.

Warnings

• gotcha The `blessed` ecosystem, including `blessed-tab-container`, largely predates widespread native ESM support in Node.js. This package is primarily CommonJS, and direct `import` statements will likely fail without a transpiler or ESM loader.
  Fix: Always use `require()` for importing `blessed-tab-container` and other `blessed` related modules in projects not explicitly set up for CJS-to-ESM interoperability.
• gotcha The `blessed` library, on which this package depends, has not been actively maintained by its original author (chjj) since around 2016. While `blessed-tab-container` is stable, the underlying `blessed` library itself may have unaddressed bugs or compatibility issues with newer terminal features.
  Fix: Consider using `reblessed` (a community-maintained fork of `blessed`) if active development and modern Node.js compatibility are critical, though `blessed-tab-container` might need testing for `reblessed` compatibility.
• gotcha The package was last published 6 years ago. While stable at `1.0.0`, lack of recent updates means it may not fully leverage modern JavaScript features, `blessed` advancements (e.g., in `neo-blessed`), or address security concerns found in older dependencies.
  Fix: Thoroughly test integration in modern Node.js environments. Review dependency tree for known vulnerabilities in older packages if used in production. Be prepared to fork or extend if new features are required.

Install

• npm install blessed-tab-container npm
• yarn add blessed-tab-container yarn
• pnpm add blessed-tab-container pnpm

Imports

• BlessedTabContainer
  wrong:

  import BlessedTabContainer from 'blessed-tab-container'

  correct:

  const BlessedTabContainer = require('blessed-tab-container')

  Package `1.0.0` was published 6 years ago and targets Node.js >=8.3.0, making it primarily CommonJS. Direct ESM import (`import ... from 'pkg'`) is not natively supported and will fail unless bundled or transpiled.
• screen
  wrong:

  import { screen } from 'blessed'

  correct:

  const blessed = require('blessed'); const screen = blessed.screen({ smartCSR: true });

  `blessed` itself is a CommonJS-first library, typically imported as a default object containing its exports.

Quickstart

This example demonstrates setting up two `blessed-tab-container` instances within a `blessed-contrib` grid, populating them with simple `blessed.element` components, and programmatically setting the visible tab. It shows basic initialization and interaction.

const BlessedTabContainer = require('blessed-tab-container')
const blessed = require('blessed')
const blessedContrib = require('blessed-contrib')
const colors = require('colors')

const screen = blessed.screen({ smartCSR: true })

screen.enableInput()
screen.key(['escape', 'q', 'C-c'], () => {
  screen.destroy()
  process.exit(0)
})

const grid = new blessedContrib.grid({
  screen: screen,
  rows: 1,
  cols: 2
})

const tabGroupA = []
const tabGroupB = []

for (let i = 0; i < 2; i += 1) {
  tabGroupA.push(grid.set(0, 0, 1, 1, blessed.element, {
    content: `Content for Tab ${i + 1}`
  }))
}

for (let i = 0; i < 5; i += 1) {
  tabGroupB.push(grid.set(0, 1, 1, 1, blessed.element, {
    content: `Content for Tab ${i + 1}`
  }))
}

const tabContainerSettings = {
  screen,
  tabSeperator: ' | ',
  activeColorFunc: colors.bgBrightBlue.black,
  dirtyColorFunc: colors.underline
}

const tabContainerA = BlessedTabContainer({
  ...tabContainerSettings,
  defaultVisible: 'Tab 1',
  tabs: tabGroupA.map((t, i) => ({
    label: `Tab ${i + 1}`,
    component: t
  }))
})

const tabContainerB = BlessedTabContainer({
  ...tabContainerSettings,
  defaultVisible: 'Tab 1',
  tabs: tabGroupB.map((t, i) => ({
    label: `Tab ${i + 1}`,
    component: t
  }))
})

// Do something with the containers
tabContainerA.setVisibleTab('Tab 2')
tabContainerB.setVisibleTab('Tab 4')

screen.render()