Hiding parts

The hide option of a part’s configuration controls how to hide it and/or its dependencies.

TIP
A hidden part will not be included in the output when it’s rendered
TIP
The hide configuration from parts that you include in your design will always override configuration from inherited parts.

Settings

hide.after

To hide the explicitly included after parts, set hide.after to a truthy value

Javascript
import exampleBase from './base.mjs'

const part = {
  name: 'example.front',
  after: [exampleBase],
  // hide `exampleBase`
  hide: {after: true},
  draft: ({ part }
) => part
}

hide.always

To hide a specific part that would otherwise not be hidden by other configuration, add its name to the hide.always array

Javascript
import { exampleBase } from './base.mjs'
import { exampleBack } from './back.mjs'
const part = {
  name: 'example.front',
  after: [exampleBase, exampleBack],
  // hide `exampleBack`
  hide: {always: ['example.back']},
  draft: ({ part }
) => part
}

hide.from

To hide the explicitly included from part, set hide.from to a truthy value.

Javascript
import exampleBase from './base.mjs'

const part = {
  name: 'other.base',
  from: exampleBase,
  // hide exampleBase
  hide: {from: true},
  draft: ({ part }
) => part
}

hide.inherited

To hide parts that you have not explicitly included in this part that may be pulled in by the explicitly included from and after parts, set hide.inherited to a truthy value.

NOTE
This setting will hide any part included as from or after by your explicitly included from part or its dependency chain. It will also hide any part included as from by your explicitly included after part or its dependency chain. It will not hide the after parts of after parts
Javascript
// the "after" chain
const mainFrontParent = {
  name: 'other.mainFront',
  draft: ({part}
) => part
}
const mainFrontBase = {
  name: 'example.mainFrontBase',
  draft: ({part}
) => part
}
const mainFront = {
  name: 'example.mainFront',
  after: mainFrontBase,
  from: mainFrontParent,
  draft: ({part}
) => part
}

// the "from" chain
const grandParentBase = {
  name: 'other.grandParentBase',
  draft: ({part}
) => part
}
const grandParent = {
  name: 'other.grandParent',
  after: grandParentBase
  draft: ({ part }
) => part
}
const parent = {
  name: 'other.parent',
  from: grandParent
  draft: ({ part }
) => part
}


const mainBack = {
  name: 'example.mainBack',
  from: parent,
  after: mainFront,
  // hide grandParentBase, grandParent, mainFrontParent
  // don't hide parent, mainFront, or mainFrontBase
  hide: { inherited: true },
  draft: ({part}
) => part
}
TIP
Need more clarity?

In the above example, the dependency tree for the part example.mainBack resolves to the following, with from dependencies in bold and after dependencies italicized.

PartDependency TypeHidden
example.mainBackrootfalse
- other.parentfromfalse
- - other.grandParentinherited fromtrue
- - - other.grandParentBaseinherited aftertrue
- example.mainFrontafterfalse
- - example.mainFrontBaseafterfalse
- - other.mainFrontinherited fromtrue

Dependencies are considered inherited if they have two or more dashes (-) next to them, and are either bold themselves, or underneath a bold part.

hide.never

To not hide a specific part that would otherwise be hidden by other configuration, add its name to the hide.never array

Javascript
import { exampleBase } from './base.mjs'
import { exampleBack } from './back.mjs'
const part = {
  name: 'example.front',
  after: [exampleBase, exampleBack],
  hide: {
    // hide exampleBase and exampleBack
    after: true,
    // override hiding exampleBack so that it is shown
    never: ['example.back']
  },
  draft: ({ part }
) => part
}

hide.self

To hide the current part, set hide.self to a truthy value:

Javascript
const part = {
  name: 'example.front',
  // hide `example.front`
  hide: {self: true},
  draft: (({ part }
) => part)
}

Presets

We provide two presets for common hiding configurations. For convenience, you can pass a preset to the hide configuration as a string like hide: <preset name>, or you can use import { hidePresets } from '@freesewing.core and pass hide: hidePresets.<preset name>

TIP
If you don’t like to remember strings and you’re working in development a environment that has code completion, importing the presets from @freesewing/core will help you be sure you’re definitely using an available preset

HIDE_ALL

For a shortcut to setting all boolean hiding options (after, from, inherited, and self) to true, use HIDE_ALL

NOTE

This is equivalent to using

Javascript
{
  self: true,
  after: true,
  from: true,
  inherited: true
}

To use it as an imported preset:

Javascript
import { hidePresets } from '@freesewing/core'
import { exampleBase } from './base.mjs'
import { exampleBack } from './back.mjs'

const part = {
  name: 'example.front',
  from: exampleBase
  after: [exampleBack],
  // hide `example.front`, `exmpleBase`, and `exampleBack`
  // as well as any inherited parts
  hide: hidePresets.HIDE_ALL,
  draft: ({ part }
) => part
}

To use it as a string

Javascript
import { exampleBase } from './base.mjs'
import { exampleBack } from './back.mjs'

const part = {
  name: 'example.front',
  from: exampleBase,
  after: [exampleBack],
  // hide `example.front`, `exmpleBase`, and `exampleBack`
  // as well as any inherited parts
  hide: 'HIDE_ALL',
  draft: ({ part }
) => part
}

HIDE_TREE

For a shortcut to setting from: true and inherited: true, use HIDE_TREE

NOTE

This is equivalent to using

Javascript
{
  from: true,
  inherited: true
}
RELATED

See hide.inherited for a full explanation of how that option works

To use it as an imported preset:

Javascript
import { hidePresets } from '@freesewing/core'
import { exampleBase } from './base.mjs'
import { exampleBack } from './back.mjs'

const part = {
  name: 'example.front',
  from: exampleBase,
  // hide `exmpleBase`, and all inherited parts
  hide: hidePresets.HIDE_TREE,
  draft: ({ part }
) => part
}

To use it as a string

Javascript
import { exampleBase } from './base.mjs'
import { exampleBack } from './back.mjs'

const part = {
  name: 'example.front',
  from: exampleBase,
  // hide `exmpleBase`, and all inherited parts
  hide: 'HIDE_TREE',
  draft: ({ part }
) => part
}
Assigning parts to stacksNaming parts