@nova-design-system/nova-base 3.29.0 → 3.31.0

package/dist/plugin/nova-safelist.js

@@ -1,355 +0,0 @@
-/**
- * @fileoverview Tailwind safelists for Nova
- *
- * This file defines various Tailwind safelists used to compile a CSS file
- * containing utility classes frequently needed in Nova. The output CSS is
- * comprehensive and may be large. If users prefer a more lightweight approach,
- * they can configure Tailwind directly without using the predefined safelists.
- */
-import { spacing } from './nova-theme.js';
-import { NOVA_TAILWIND_TOKENS } from '../generated/nova-tailwind-tokens.js';
-import { NOVA_TAILWIND_COMPONENTS } from '../generated/nova-tailwind-components.js';
-// Enables responsive spacing modifiers for safelist variants
-export const responsive = ['xs', 'sm', 'md', 'lg', 'xl', '2xl', '3xl'];
-// Enables responsive color schemes for safelist variants
-export const colorSchemes = ['light', 'dark'];
-// Enables pointer states for safelist variants
-export const pointer = ['hover', 'focus', 'active'];
-export const padding = [
-    {
-        pattern: new RegExp(`^p-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^py-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^px-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^pt-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^pr-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^pb-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^pl-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-];
-export const margin = [
-    {
-        pattern: new RegExp(`^m-(${Object.keys(spacing).join('|')}|auto)$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^my-(${Object.keys(spacing).join('|')}|auto)$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^mx-(${Object.keys(spacing).join('|')}|auto)$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^mt-(${Object.keys(spacing).join('|')}|auto)$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^mr-(${Object.keys(spacing).join('|')}|auto)$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^mb-(${Object.keys(spacing).join('|')}|auto)$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^ml-(${Object.keys(spacing).join('|')}|auto)$`),
-        variants: responsive,
-    },
-];
-export const gap = [
-    {
-        pattern: new RegExp(`^gap-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^gap-x-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-    {
-        pattern: new RegExp(`^gap-y-(${Object.keys(spacing).join('|')})$`),
-        variants: responsive,
-    },
-];
-const flexBox = [
-    { pattern: /^flex$/, variants: responsive },
-    { pattern: /^inline-flex$/, variants: responsive },
-    { pattern: /^flex-row$/, variants: responsive },
-    { pattern: /^flex-row-reverse$/, variants: responsive },
-    { pattern: /^flex-col$/, variants: responsive },
-    { pattern: /^flex-col-reverse$/, variants: responsive },
-    { pattern: /^flex-wrap$/, variants: responsive },
-    { pattern: /^flex-wrap-reverse$/, variants: responsive },
-    { pattern: /^flex-nowrap$/, variants: responsive },
-    {
-        pattern: /^place-content-(start|end|center|between|around|evenly)$/,
-        variants: responsive,
-    },
-    { pattern: /^place-items-(start|end|center|stretch)$/, variants: responsive },
-    {
-        pattern: /^place-self-(auto|start|end|center|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^justify-(start|end|center|between|around|evenly)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^justify-items-(start|end|center|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^justify-self-(auto|start|end|center|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^align-(start|end|center|baseline|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^items-(start|end|center|baseline|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^self-(auto|start|end|center|baseline|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^content-(start|end|center|between|around|evenly)$/,
-        variants: responsive,
-    },
-    { pattern: /^order-(\d+|first|last|none)$/, variants: responsive },
-    { pattern: /^flex-(\d+|none|auto|initial)$/, variants: responsive },
-    { pattern: /^grow-(0|1)$/, variants: responsive },
-    { pattern: /^shrink-(0|1)$/, variants: responsive },
-];
-const grid = [
-    { pattern: /^grid$/, variants: responsive },
-    { pattern: /^inline-grid$/, variants: responsive },
-    { pattern: /^grid-cols-(\d+|none|auto)$/, variants: responsive },
-    { pattern: /^grid-rows-(\d+|none|auto)$/, variants: responsive },
-    { pattern: /^col-span-(\d+|full)$/, variants: responsive },
-    { pattern: /^col-start-(\d+|auto)$/, variants: responsive },
-    { pattern: /^col-end-(\d+|auto)$/, variants: responsive },
-    { pattern: /^row-span-(\d+|full)$/, variants: responsive },
-    { pattern: /^row-start-(\d+|auto)$/, variants: responsive },
-    { pattern: /^row-end-(\d+|auto)$/, variants: responsive },
-    { pattern: /^gap-(\d+|px)$/, variants: responsive },
-    { pattern: /^gap-x-(\d+|px)$/, variants: responsive },
-    { pattern: /^gap-y-(\d+|px)$/, variants: responsive },
-    {
-        pattern: /^auto-cols-(auto|min|max|fr)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^auto-rows-(auto|min|max|fr)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^place-content-(start|end|center|between|around|evenly|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^place-items-(start|end|center|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^place-self-(auto|start|end|center|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^justify-items-(start|end|center|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^justify-self-(auto|start|end|center|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^align-(start|end|center|baseline|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^items-(start|end|center|baseline|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^self-(auto|start|end|center|baseline|stretch)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^content-(start|end|center|between|around|evenly|stretch)$/,
-        variants: responsive,
-    },
-];
-const spaceBetween = [
-    {
-        pattern: /^space-x-(\d+|px|reverse)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^space-y-(\d+|px|reverse)$/,
-        variants: responsive,
-    },
-];
-const overflow = [
-    { pattern: /^overflow-(auto|hidden|visible|scroll)$/, variants: responsive },
-    {
-        pattern: /^overflow-x-(auto|hidden|visible|scroll)$/,
-        variants: responsive,
-    },
-    {
-        pattern: /^overflow-y-(auto|hidden|visible|scroll)$/,
-        variants: responsive,
-    },
-];
-const position = [
-    {
-        pattern: /^(static|fixed|absolute|relative|sticky)$/,
-        variants: responsive,
-    },
-    { pattern: /^inset-(0|auto|full)$/ },
-    { pattern: /^inset-x-(0|auto|full)$/ },
-    { pattern: /^inset-y-(0|auto|full)$/ },
-    { pattern: /^top-(0|auto|full)$/, variants: responsive },
-    { pattern: /^right-(0|auto|full)$/, variants: responsive },
-    { pattern: /^bottom-(0|auto|full)$/, variants: responsive },
-    { pattern: /^left-(0|auto|full)$/, variants: responsive },
-    { pattern: /^z-(\d+|auto)$/ },
-];
-const display = [
-    {
-        pattern: /^(block|inline-block|inline|flex|inline-flex|table|inline-table|table-caption|table-cell|table-column|table-column-group|table-footer-group|table-header-group|table-row-group|table-row|flow-root|grid|inline-grid|contents|hidden)$/,
-    },
-];
-const textAlign = [
-    { pattern: /^text-(left|center|right|justify)$/, variants: responsive },
-];
-const textSize = [
-    {
-        pattern: /^text-(xs|sm|base|lg|xl|2xl|3xl|4xl|5xl|6xl|7xl|8xl|9xl)$/,
-        variants: responsive,
-    },
-];
-const whitespace = [
-    {
-        pattern: /^whitespace-(normal|nowrap|pre|pre-line|pre-wrap)$/,
-        variants: responsive,
-    },
-];
-const verticalAlign = [
-    { pattern: /^align-(baseline|top|middle|bottom|text-top|text-bottom)$/ },
-];
-const fontWeight = [
-    {
-        pattern: /^font-(thin|extralight|light|normal|medium|semibold|bold|extrabold|black)$/,
-    },
-];
-const fontFamily = [{ pattern: /^font-(sans|serif|mono)$/ }];
-const borders = [
-    { pattern: /^border$/ },
-    { pattern: /^border-(\d+|0)$/ },
-    { pattern: /^border-(solid|dashed|dotted|double|none)$/ },
-    { pattern: /^border-(t|r|b|l|x|y)$/ },
-    { pattern: /^border-(t|r|b|l|x|y)-(\d+|0)$/ },
-    { pattern: /^rounded$/ },
-    { pattern: /^rounded-(t|r|b|l|full|none)$/ },
-    { pattern: /^rounded-(tl|tr|bl|br)$/ },
-    { pattern: /^rounded-(\d+|sm|md|lg|xl|2xl|3xl)$/ },
-];
-const width = [
-    {
-        pattern: /^w-(\d+|auto|full|screen|inherit|initial|max-content|min-content|revert|unset)$/,
-    },
-    {
-        pattern: /^max-w-(\d+|xs|sm|md|lg|xl|2xl|3xl|4xl|5xl|6xl|7xl|full|min|max|prose|screen-(sm|md|lg|xl|2xl))$/,
-    },
-];
-const height = [
-    { pattern: /^h-(\d+|auto|full|screen)$/ },
-    {
-        pattern: /^max-h-(\d+|xs|sm|md|lg|xl|2xl|3xl|4xl|5xl|6xl|7xl|full|min|max|prose|screen-(sm|md|lg|xl|2xl))$/,
-    },
-];
-const colors = [
-    { pattern: /^bg-(\w+)$/, variants: colorSchemes },
-    { pattern: /^text-(\w+)$/, variants: colorSchemes },
-    {
-        pattern: /^bg-(green|turquoise|petrol|lime|crimson|red|yellow|gray|amber|orange)-(?!(950))\d{1,3}$/,
-        variants: colorSchemes,
-    },
-    {
-        pattern: /^text-(green|turquoise|petrol|lime|crimson|red|yellow|gray|amber|orange)-(?!(950))\d{1,3}$/,
-        variants: colorSchemes,
-    },
-];
-const cursors = [
-    {
-        pattern: /^cursor-(auto|default|pointer|wait|text|move|help|not-allowed|none|progress|crosshair|zoom-in|zoom-out|grab|grabbing|col-resize|row-resize|all-scroll)$/,
-    },
-];
-const resize = [
-    {
-        pattern: /^resize-(none|y|x)$/,
-        variants: responsive,
-    },
-];
-// From the nova tailwind plugin (nova-plugin.ts)
-/*const utils = [
-  { pattern: /^text-(high|medium|low)$/ },
-  { pattern: /^bg-level-(00|10|20|30|40)(-hover)?$/ },
-  { pattern: /^border-(high|medium|low)$/ },
-];*/
-// From the nova tailwind components (nova-tailwind-components.ts)
-const components = [
-    ...Object.keys(NOVA_TAILWIND_COMPONENTS).filter((key) => /^\.[a-zA-Z0-9-]+$/.test(key)),
-];
-// From the nova tailwind tokens (nova-tailwind-tokens.ts)
-const tokens = [
-    ...Object.keys(NOVA_TAILWIND_TOKENS),
-    { pattern: /-hover$/, variants: ['hover'] },
-];
-export const novaThemeSafelist = [
-    ...padding,
-    ...margin,
-    ...gap,
-    ...flexBox,
-    ...grid,
-    ...spaceBetween,
-    ...overflow,
-    ...position,
-    ...display,
-    ...textAlign,
-    ...textSize,
-    ...whitespace,
-    ...verticalAlign,
-    ...fontWeight,
-    ...fontFamily,
-    ...borders,
-    ...width,
-    ...height,
-    ...colors,
-    ...cursors,
-    ...resize,
-    //...utils,
-    ...components,
-    ...tokens,
-];