Skip to content

@gluonjs/core / packages/molecules/src / sheetStyles

Variable: sheetStyles ​

const sheetStyles: CSSStyleSheet

Example ​

Inspect the separately tree-shakable Sheet stylesheet and its tenant-safe CSS-variable hooks:

ts
import { buttonStyles, checkboxStyles, iconStyles, inputStyles, labelStyles, progressStyles, radioStyles, selectStyles, sliderStyles, statusBadgeStyles, switchStyles, textareaStyles, toggleButtonStyles } from '@gluonjs/atoms';
import { accordionStyles, breadcrumbsStyles, buttonGroupStyles, cardStyles, choiceGroupStyles, controlFieldStyles, dataListStyles, dialogSurfaceStyles, disclosureStyles, emptyStateStyles, filterBarStyles, formFieldStyles, inlineNoticeStyles, listboxFieldStyles, menuToolbarStyles, navigationMenuStyles, navigationStripStyles, paginationStyles, popoverStyles, segmentedControlStyles, sheetStyles, sortControlStyles, stepperStyles, tableRegionStyles, tabsStyles, tooltipStyles, toolbarStyles } from '@gluonjs/molecules';
import { appShellStyles } from '@gluonjs/organisms';

const exactSheets = [buttonStyles, checkboxStyles, iconStyles, inputStyles, labelStyles, progressStyles, radioStyles, selectStyles, sliderStyles, statusBadgeStyles, switchStyles, textareaStyles, toggleButtonStyles, accordionStyles, breadcrumbsStyles, buttonGroupStyles, cardStyles, choiceGroupStyles, controlFieldStyles, dataListStyles, dialogSurfaceStyles, disclosureStyles, emptyStateStyles, filterBarStyles, formFieldStyles, inlineNoticeStyles, listboxFieldStyles, menuToolbarStyles, navigationMenuStyles, navigationStripStyles, paginationStyles, popoverStyles, segmentedControlStyles, sheetStyles, sortControlStyles, stepperStyles, tableRegionStyles, tabsStyles, tooltipStyles, toolbarStyles, appShellStyles];
console.log(exactSheets.length);

Version-matched documentation. Examples are checked against the public package contracts.