@markuplint/types 4.4.1 → 4.5.1

package/CHANGELOG.md

@@ -3,6 +3,19 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.5.1](https://github.com/markuplint/markuplint/compare/@markuplint/types@4.5.0...@markuplint/types@4.5.1) (2024-05-28)
+
+**Note:** Version bump only for package @markuplint/types
+
+# [4.5.0](https://github.com/markuplint/markuplint/compare/@markuplint/types@4.4.1...@markuplint/types@4.5.0) (2024-05-12)
+
+### Features
+
+- **types:** add `checkDirective` function ([5b9f55b](https://github.com/markuplint/markuplint/commit/5b9f55b9b6255800f1014633c0b2f73da2f49c73))
+- **types:** add `directive` type to schemas ([fc0cc0d](https://github.com/markuplint/markuplint/commit/fc0cc0d5b59c4a24abe8dc78a5bd8ab6cc346f9f))
+- **types:** add `JSON` to types ([6dc6e06](https://github.com/markuplint/markuplint/commit/6dc6e0623f596fcf03961167a5acadfd4f627832))
+- **types:** add directive checking to `check` function ([0dc8d07](https://github.com/markuplint/markuplint/commit/0dc8d0748c9e603282b61308421806e826d5c98f))
+
 ## [4.4.1](https://github.com/markuplint/markuplint/compare/@markuplint/types@4.4.1-alpha.0...@markuplint/types@4.4.1) (2024-05-04)
 
 **Note:** Version bump only for package @markuplint/types

package/README.md

@@ -41,6 +41,7 @@ check('2020-02-30', 'DateTime');
 | `Zero`                             | Some attributes                             |                                                                                                                    | ✅        |
 | `Number`                           | Some attributes                             |                                                                                                                    | ✅        |
 | `Uint`                             | Some attributes                             |                                                                                                                    | ✅        |
+| `JSON`                             | Attributes on some frameworks etc.          |                                                                                                                    | ✅        |
 | `XMLName`                          | `svg\|[attributeName]` and more             | [XML](https://www.w3.org/TR/xml/#d0e804)                                                                           | ✅        |
 | `DOMID`                            | The `id` attribute and more                 | [WHATWG](https://html.spec.whatwg.org/multipage/dom.html#global-attributes:concept-id)                             | ✅        |
 | `FunctionBody`                     | Event handler attributes                    |                                                                                                                    | 🚧        |

package/lib/check.d.ts

@@ -1,9 +1,10 @@
-import type { Type, Result, List, CustomSyntax, CustomCssSyntax, Enum, KeywordDefinedType, Number } from './types.js';
+import type { Type, Result, List, CustomSyntax, CustomCssSyntax, Enum, KeywordDefinedType, Number, Directive } from './types.js';
 import type { ReadonlyDeep } from 'type-fest';
 export declare function check(value: string, type: ReadonlyDeep<Type>, ref?: string, cache?: boolean): Result;
 export declare function isKeyword(type: ReadonlyDeep<Type>): type is ReadonlyDeep<KeywordDefinedType>;
 export declare function isList(type: ReadonlyDeep<Type>): type is ReadonlyDeep<List>;
 export declare function isEnum(type: ReadonlyDeep<Type>): type is ReadonlyDeep<Enum>;
 export declare function isNumber(type: ReadonlyDeep<Type>): type is ReadonlyDeep<Number>;
+export declare function isDirective(type: ReadonlyDeep<Type>): type is ReadonlyDeep<Directive>;
 export declare function isCSSSyntax(type: CustomSyntax | CustomCssSyntax): type is CustomCssSyntax;
 export declare function isCustomSyntax(type: CustomSyntax | CustomCssSyntax): type is CustomSyntax;

package/lib/check.js

@@ -1,4 +1,5 @@
 import { log } from './debug.js';
+import { checkDirective } from './directive.js';
 import { checkEnum } from './enum.js';
 import { checkKeywordType } from './keyword-type.js';
 import { checkList } from './list.js';
@@ -16,20 +17,30 @@ export function check(value, type, ref, cache = true) {
         log('Check enum: %O', type);
         return checkEnum(value, type, ref);
     }
-    log('Check number: %O', type);
-    return checkNumber(value, type, ref);
+    if (isNumber(type)) {
+        log('Check number: %O', type);
+        return checkNumber(value, type, ref);
+    }
+    if (isDirective(type)) {
+        log('Check directive: %O', type);
+        return checkDirective(value, type, ref);
+    }
+    throw new Error('Unknown type');
 }
 export function isKeyword(type) {
     return typeof type === 'string';
 }
 export function isList(type) {
-    return typeof type !== 'string' && 'token' in type;
+    return typeof type !== 'string' && 'separator' in type;
 }
 export function isEnum(type) {
     return typeof type !== 'string' && 'enum' in type;
 }
 export function isNumber(type) {
-    return typeof type !== 'string' && 'enum' in type;
+    return typeof type !== 'string' && 'type' in type && (type.type === 'float' || type.type === 'integer');
+}
+export function isDirective(type) {
+    return typeof type !== 'string' && 'directive' in type;
 }
 export function isCSSSyntax(type) {
     return typeof type === 'string' || 'syntax' in type;

package/lib/defs.js

@@ -79,6 +79,24 @@ export const types = {
         ],
         is: value => (isUint(value) ? matched() : unmatched(value, 'unexpected-token')),
     },
+    JSON: {
+        ref: '',
+        expects: [
+            {
+                type: 'format',
+                value: 'JSON',
+            },
+        ],
+        is: value => {
+            try {
+                JSON.parse(value);
+            }
+            catch {
+                return unmatched(value, 'syntax-error');
+            }
+            return matched();
+        },
+    },
     XMLName: {
         ref: 'https://www.w3.org/TR/xml/#NT-Name',
         expects: [

package/lib/directive.d.ts

@@ -0,0 +1,3 @@
+import type { Result, Directive } from './types.js';
+import type { ReadonlyDeep } from 'type-fest';
+export declare function checkDirective(value: string, type: ReadonlyDeep<Directive>, ref?: string, cache?: boolean): Result;

package/lib/directive.js

@@ -0,0 +1,35 @@
+import { regexParser } from '@markuplint/shared';
+import { check } from './check.js';
+import { matched, unmatched } from './match-result.js';
+export function checkDirective(value, type, ref, cache = true) {
+    const unmatches = [];
+    for (const directive of type.directive) {
+        const directiveMatcher = regexParser(directive);
+        let tokenPart;
+        if (directiveMatcher) {
+            const matched = directiveMatcher.exec(value);
+            if (!matched) {
+                unmatches.push(unmatched(value, 'missing-token', {
+                    ref: ref ?? type.ref,
+                }));
+                continue;
+            }
+            tokenPart = matched.groups?.token ?? matched[1] ?? '';
+        }
+        else {
+            if (!value.startsWith(directive)) {
+                unmatches.push(unmatched(value, 'missing-token', {
+                    ref: ref ?? type.ref,
+                }));
+                continue;
+            }
+            tokenPart = value.slice(directive.length);
+        }
+        const result = check(tokenPart, type.token, ref, cache);
+        if (result.matched) {
+            return result;
+        }
+        unmatches.push(result);
+    }
+    return unmatches.at(0) ?? matched();
+}

package/lib/types.d.ts

@@ -1,5 +1,5 @@
 import type { cssSyntaxMatch } from './css-syntax.js';
-export type { Type, List, Enum, CssSyntax, KeywordDefinedType, Number } from './types.schema.js';
+export type { Type, List, Enum, CssSyntax, KeywordDefinedType, Number, Directive } from './types.schema.js';
 export type Result = UnmatchedResult | MatchedResult;
 export type UnmatchedResult = {
     readonly matched: false;

package/lib/types.schema.d.ts

@@ -3,10 +3,10 @@
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run json-schema-to-typescript to regenerate this file.
  */
-export type Type = KeywordDefinedType | List | Enum | Number;
+export type Type = KeywordDefinedType | List | Enum | Number | Directive;
 export type KeywordDefinedType = CssSyntax | ExtendedType | HtmlAttrRequirement;
 export type CssSyntax = "<'--*'>" | "<'-moz-appearance'>" | "<'-moz-background-clip'>" | "<'-moz-binding'>" | "<'-moz-border-bottom-colors'>" | "<'-moz-border-left-colors'>" | "<'-moz-border-radius-bottomleft'>" | "<'-moz-border-radius-bottomright'>" | "<'-moz-border-radius-topleft'>" | "<'-moz-border-radius-topright'>" | "<'-moz-border-right-colors'>" | "<'-moz-border-top-colors'>" | "<'-moz-context-properties'>" | "<'-moz-control-character-visibility'>" | "<'-moz-float-edge'>" | "<'-moz-force-broken-image-icon'>" | "<'-moz-image-region'>" | "<'-moz-orient'>" | "<'-moz-osx-font-smoothing'>" | "<'-moz-outline-radius'>" | "<'-moz-outline-radius-bottomleft'>" | "<'-moz-outline-radius-bottomright'>" | "<'-moz-outline-radius-topleft'>" | "<'-moz-outline-radius-topright'>" | "<'-moz-stack-sizing'>" | "<'-moz-text-blink'>" | "<'-moz-user-focus'>" | "<'-moz-user-input'>" | "<'-moz-user-modify'>" | "<'-moz-user-select'>" | "<'-moz-window-dragging'>" | "<'-moz-window-shadow'>" | "<'-ms-accelerator'>" | "<'-ms-block-progression'>" | "<'-ms-content-zoom-chaining'>" | "<'-ms-content-zoom-limit'>" | "<'-ms-content-zoom-limit-max'>" | "<'-ms-content-zoom-limit-min'>" | "<'-ms-content-zoom-snap'>" | "<'-ms-content-zoom-snap-points'>" | "<'-ms-content-zoom-snap-type'>" | "<'-ms-content-zooming'>" | "<'-ms-filter'>" | "<'-ms-flex-align'>" | "<'-ms-flex-item-align'>" | "<'-ms-flex-line-pack'>" | "<'-ms-flex-negative'>" | "<'-ms-flex-order'>" | "<'-ms-flex-pack'>" | "<'-ms-flex-positive'>" | "<'-ms-flex-preferred-size'>" | "<'-ms-flow-from'>" | "<'-ms-flow-into'>" | "<'-ms-grid-column-align'>" | "<'-ms-grid-columns'>" | "<'-ms-grid-row-align'>" | "<'-ms-grid-rows'>" | "<'-ms-high-contrast-adjust'>" | "<'-ms-hyphenate-limit-chars'>" | "<'-ms-hyphenate-limit-last'>" | "<'-ms-hyphenate-limit-lines'>" | "<'-ms-hyphenate-limit-zone'>" | "<'-ms-ime-align'>" | "<'-ms-interpolation-mode'>" | "<'-ms-overflow-style'>" | "<'-ms-scroll-chaining'>" | "<'-ms-scroll-limit'>" | "<'-ms-scroll-limit-x-max'>" | "<'-ms-scroll-limit-x-min'>" | "<'-ms-scroll-limit-y-max'>" | "<'-ms-scroll-limit-y-min'>" | "<'-ms-scroll-rails'>" | "<'-ms-scroll-snap-points-x'>" | "<'-ms-scroll-snap-points-y'>" | "<'-ms-scroll-snap-type'>" | "<'-ms-scroll-snap-x'>" | "<'-ms-scroll-snap-y'>" | "<'-ms-scroll-translation'>" | "<'-ms-scrollbar-3dlight-color'>" | "<'-ms-scrollbar-arrow-color'>" | "<'-ms-scrollbar-base-color'>" | "<'-ms-scrollbar-darkshadow-color'>" | "<'-ms-scrollbar-face-color'>" | "<'-ms-scrollbar-highlight-color'>" | "<'-ms-scrollbar-shadow-color'>" | "<'-ms-scrollbar-track-color'>" | "<'-ms-text-autospace'>" | "<'-ms-touch-select'>" | "<'-ms-user-select'>" | "<'-ms-wrap-flow'>" | "<'-ms-wrap-margin'>" | "<'-ms-wrap-through'>" | "<'-webkit-appearance'>" | "<'-webkit-background-clip'>" | "<'-webkit-border-before'>" | "<'-webkit-border-before-color'>" | "<'-webkit-border-before-style'>" | "<'-webkit-border-before-width'>" | "<'-webkit-box-reflect'>" | "<'-webkit-column-break-after'>" | "<'-webkit-column-break-before'>" | "<'-webkit-column-break-inside'>" | "<'-webkit-font-smoothing'>" | "<'-webkit-line-clamp'>" | "<'-webkit-mask'>" | "<'-webkit-mask-attachment'>" | "<'-webkit-mask-box-image'>" | "<'-webkit-mask-clip'>" | "<'-webkit-mask-composite'>" | "<'-webkit-mask-image'>" | "<'-webkit-mask-origin'>" | "<'-webkit-mask-position'>" | "<'-webkit-mask-position-x'>" | "<'-webkit-mask-position-y'>" | "<'-webkit-mask-repeat'>" | "<'-webkit-mask-repeat-x'>" | "<'-webkit-mask-repeat-y'>" | "<'-webkit-mask-size'>" | "<'-webkit-overflow-scrolling'>" | "<'-webkit-print-color-adjust'>" | "<'-webkit-tap-highlight-color'>" | "<'-webkit-text-fill-color'>" | "<'-webkit-text-security'>" | "<'-webkit-text-stroke'>" | "<'-webkit-text-stroke-color'>" | "<'-webkit-text-stroke-width'>" | "<'-webkit-touch-callout'>" | "<'-webkit-user-drag'>" | "<'-webkit-user-modify'>" | "<'-webkit-user-select'>" | "<'accent-color'>" | "<'align-content'>" | "<'align-items'>" | "<'align-self'>" | "<'align-tracks'>" | "<'alignment-baseline'>" | "<'all'>" | "<'animation'>" | "<'animation-composition'>" | "<'animation-delay'>" | "<'animation-direction'>" | "<'animation-duration'>" | "<'animation-fill-mode'>" | "<'animation-iteration-count'>" | "<'animation-name'>" | "<'animation-play-state'>" | "<'animation-timeline'>" | "<'animation-timing-function'>" | "<'appearance'>" | "<'aspect-ratio'>" | "<'azimuth'>" | "<'backdrop-filter'>" | "<'backface-visibility'>" | "<'background'>" | "<'background-attachment'>" | "<'background-blend-mode'>" | "<'background-clip'>" | "<'background-color'>" | "<'background-image'>" | "<'background-origin'>" | "<'background-position'>" | "<'background-position-x'>" | "<'background-position-y'>" | "<'background-repeat'>" | "<'background-size'>" | "<'baseline-shift'>" | "<'behavior'>" | "<'block-overflow'>" | "<'block-size'>" | "<'border'>" | "<'border-block'>" | "<'border-block-color'>" | "<'border-block-end'>" | "<'border-block-end-color'>" | "<'border-block-end-style'>" | "<'border-block-end-width'>" | "<'border-block-start'>" | "<'border-block-start-color'>" | "<'border-block-start-style'>" | "<'border-block-start-width'>" | "<'border-block-style'>" | "<'border-block-width'>" | "<'border-bottom'>" | "<'border-bottom-color'>" | "<'border-bottom-left-radius'>" | "<'border-bottom-right-radius'>" | "<'border-bottom-style'>" | "<'border-bottom-width'>" | "<'border-collapse'>" | "<'border-color'>" | "<'border-end-end-radius'>" | "<'border-end-start-radius'>" | "<'border-image'>" | "<'border-image-outset'>" | "<'border-image-repeat'>" | "<'border-image-slice'>" | "<'border-image-source'>" | "<'border-image-width'>" | "<'border-inline'>" | "<'border-inline-color'>" | "<'border-inline-end'>" | "<'border-inline-end-color'>" | "<'border-inline-end-style'>" | "<'border-inline-end-width'>" | "<'border-inline-start'>" | "<'border-inline-start-color'>" | "<'border-inline-start-style'>" | "<'border-inline-start-width'>" | "<'border-inline-style'>" | "<'border-inline-width'>" | "<'border-left'>" | "<'border-left-color'>" | "<'border-left-style'>" | "<'border-left-width'>" | "<'border-radius'>" | "<'border-right'>" | "<'border-right-color'>" | "<'border-right-style'>" | "<'border-right-width'>" | "<'border-spacing'>" | "<'border-start-end-radius'>" | "<'border-start-start-radius'>" | "<'border-style'>" | "<'border-top'>" | "<'border-top-color'>" | "<'border-top-left-radius'>" | "<'border-top-right-radius'>" | "<'border-top-style'>" | "<'border-top-width'>" | "<'border-width'>" | "<'bottom'>" | "<'box-align'>" | "<'box-decoration-break'>" | "<'box-direction'>" | "<'box-flex'>" | "<'box-flex-group'>" | "<'box-lines'>" | "<'box-ordinal-group'>" | "<'box-orient'>" | "<'box-pack'>" | "<'box-shadow'>" | "<'box-sizing'>" | "<'break-after'>" | "<'break-before'>" | "<'break-inside'>" | "<'caption-side'>" | "<'caret'>" | "<'caret-color'>" | "<'caret-shape'>" | "<'clear'>" | "<'clip'>" | "<'clip-path'>" | "<'clip-rule'>" | "<'color'>" | "<'color-scheme'>" | "<'column-count'>" | "<'column-fill'>" | "<'column-gap'>" | "<'column-rule'>" | "<'column-rule-color'>" | "<'column-rule-style'>" | "<'column-rule-width'>" | "<'column-span'>" | "<'column-width'>" | "<'columns'>" | "<'contain'>" | "<'contain-intrinsic-block-size'>" | "<'contain-intrinsic-height'>" | "<'contain-intrinsic-inline-size'>" | "<'contain-intrinsic-size'>" | "<'contain-intrinsic-width'>" | "<'content'>" | "<'content-visibility'>" | "<'counter-increment'>" | "<'counter-reset'>" | "<'counter-set'>" | "<'cue'>" | "<'cue-after'>" | "<'cue-before'>" | "<'cursor'>" | "<'direction'>" | "<'display'>" | "<'dominant-baseline'>" | "<'empty-cells'>" | "<'fill'>" | "<'fill-opacity'>" | "<'fill-rule'>" | "<'filter'>" | "<'flex'>" | "<'flex-basis'>" | "<'flex-direction'>" | "<'flex-flow'>" | "<'flex-grow'>" | "<'flex-shrink'>" | "<'flex-wrap'>" | "<'float'>" | "<'font'>" | "<'font-family'>" | "<'font-feature-settings'>" | "<'font-kerning'>" | "<'font-language-override'>" | "<'font-optical-sizing'>" | "<'font-size'>" | "<'font-size-adjust'>" | "<'font-smooth'>" | "<'font-stretch'>" | "<'font-style'>" | "<'font-synthesis'>" | "<'font-variant'>" | "<'font-variant-alternates'>" | "<'font-variant-caps'>" | "<'font-variant-east-asian'>" | "<'font-variant-ligatures'>" | "<'font-variant-numeric'>" | "<'font-variant-position'>" | "<'font-variation-settings'>" | "<'font-weight'>" | "<'forced-color-adjust'>" | "<'gap'>" | "<'glyph-orientation-horizontal'>" | "<'glyph-orientation-vertical'>" | "<'grid'>" | "<'grid-area'>" | "<'grid-auto-columns'>" | "<'grid-auto-flow'>" | "<'grid-auto-rows'>" | "<'grid-column'>" | "<'grid-column-end'>" | "<'grid-column-gap'>" | "<'grid-column-start'>" | "<'grid-gap'>" | "<'grid-row'>" | "<'grid-row-end'>" | "<'grid-row-gap'>" | "<'grid-row-start'>" | "<'grid-template'>" | "<'grid-template-areas'>" | "<'grid-template-columns'>" | "<'grid-template-rows'>" | "<'hanging-punctuation'>" | "<'height'>" | "<'hyphenate-character'>" | "<'hyphens'>" | "<'image-orientation'>" | "<'image-rendering'>" | "<'image-resolution'>" | "<'ime-mode'>" | "<'initial-letter'>" | "<'initial-letter-align'>" | "<'inline-size'>" | "<'input-security'>" | "<'inset'>" | "<'inset-block'>" | "<'inset-block-end'>" | "<'inset-block-start'>" | "<'inset-inline'>" | "<'inset-inline-end'>" | "<'inset-inline-start'>" | "<'isolation'>" | "<'justify-content'>" | "<'justify-items'>" | "<'justify-self'>" | "<'justify-tracks'>" | "<'kerning'>" | "<'left'>" | "<'letter-spacing'>" | "<'line-break'>" | "<'line-clamp'>" | "<'line-height'>" | "<'line-height-step'>" | "<'list-style'>" | "<'list-style-image'>" | "<'list-style-position'>" | "<'list-style-type'>" | "<'margin'>" | "<'margin-block'>" | "<'margin-block-end'>" | "<'margin-block-start'>" | "<'margin-bottom'>" | "<'margin-inline'>" | "<'margin-inline-end'>" | "<'margin-inline-start'>" | "<'margin-left'>" | "<'margin-right'>" | "<'margin-top'>" | "<'margin-trim'>" | "<'marker'>" | "<'marker-end'>" | "<'marker-mid'>" | "<'marker-start'>" | "<'mask'>" | "<'mask-border'>" | "<'mask-border-mode'>" | "<'mask-border-outset'>" | "<'mask-border-repeat'>" | "<'mask-border-slice'>" | "<'mask-border-source'>" | "<'mask-border-width'>" | "<'mask-clip'>" | "<'mask-composite'>" | "<'mask-image'>" | "<'mask-mode'>" | "<'mask-origin'>" | "<'mask-position'>" | "<'mask-repeat'>" | "<'mask-size'>" | "<'mask-type'>" | "<'masonry-auto-flow'>" | "<'math-depth'>" | "<'math-shift'>" | "<'math-style'>" | "<'max-block-size'>" | "<'max-height'>" | "<'max-inline-size'>" | "<'max-lines'>" | "<'max-width'>" | "<'min-block-size'>" | "<'min-height'>" | "<'min-inline-size'>" | "<'min-width'>" | "<'mix-blend-mode'>" | "<'object-fit'>" | "<'object-position'>" | "<'offset'>" | "<'offset-anchor'>" | "<'offset-distance'>" | "<'offset-path'>" | "<'offset-position'>" | "<'offset-rotate'>" | "<'opacity'>" | "<'order'>" | "<'orphans'>" | "<'outline'>" | "<'outline-color'>" | "<'outline-offset'>" | "<'outline-style'>" | "<'outline-width'>" | "<'overflow'>" | "<'overflow-anchor'>" | "<'overflow-block'>" | "<'overflow-clip-box'>" | "<'overflow-clip-margin'>" | "<'overflow-inline'>" | "<'overflow-wrap'>" | "<'overflow-x'>" | "<'overflow-y'>" | "<'overscroll-behavior'>" | "<'overscroll-behavior-block'>" | "<'overscroll-behavior-inline'>" | "<'overscroll-behavior-x'>" | "<'overscroll-behavior-y'>" | "<'padding'>" | "<'padding-block'>" | "<'padding-block-end'>" | "<'padding-block-start'>" | "<'padding-bottom'>" | "<'padding-inline'>" | "<'padding-inline-end'>" | "<'padding-inline-start'>" | "<'padding-left'>" | "<'padding-right'>" | "<'padding-top'>" | "<'page-break-after'>" | "<'page-break-before'>" | "<'page-break-inside'>" | "<'paint-order'>" | "<'pause'>" | "<'pause-after'>" | "<'pause-before'>" | "<'perspective'>" | "<'perspective-origin'>" | "<'place-content'>" | "<'place-items'>" | "<'place-self'>" | "<'pointer-events'>" | "<'position'>" | "<'print-color-adjust'>" | "<'quotes'>" | "<'resize'>" | "<'rest'>" | "<'rest-after'>" | "<'rest-before'>" | "<'right'>" | "<'rotate'>" | "<'row-gap'>" | "<'ruby-align'>" | "<'ruby-merge'>" | "<'ruby-position'>" | "<'scale'>" | "<'scroll-behavior'>" | "<'scroll-margin'>" | "<'scroll-margin-block'>" | "<'scroll-margin-block-end'>" | "<'scroll-margin-block-start'>" | "<'scroll-margin-bottom'>" | "<'scroll-margin-inline'>" | "<'scroll-margin-inline-end'>" | "<'scroll-margin-inline-start'>" | "<'scroll-margin-left'>" | "<'scroll-margin-right'>" | "<'scroll-margin-top'>" | "<'scroll-padding'>" | "<'scroll-padding-block'>" | "<'scroll-padding-block-end'>" | "<'scroll-padding-block-start'>" | "<'scroll-padding-bottom'>" | "<'scroll-padding-inline'>" | "<'scroll-padding-inline-end'>" | "<'scroll-padding-inline-start'>" | "<'scroll-padding-left'>" | "<'scroll-padding-right'>" | "<'scroll-padding-top'>" | "<'scroll-snap-align'>" | "<'scroll-snap-coordinate'>" | "<'scroll-snap-destination'>" | "<'scroll-snap-points-x'>" | "<'scroll-snap-points-y'>" | "<'scroll-snap-stop'>" | "<'scroll-snap-type'>" | "<'scroll-snap-type-x'>" | "<'scroll-snap-type-y'>" | "<'scroll-timeline'>" | "<'scroll-timeline-axis'>" | "<'scroll-timeline-name'>" | "<'scrollbar-color'>" | "<'scrollbar-gutter'>" | "<'scrollbar-width'>" | "<'shape-image-threshold'>" | "<'shape-margin'>" | "<'shape-outside'>" | "<'shape-rendering'>" | "<'speak'>" | "<'speak-as'>" | "<'src'>" | "<'stroke'>" | "<'stroke-dasharray'>" | "<'stroke-dashoffset'>" | "<'stroke-linecap'>" | "<'stroke-linejoin'>" | "<'stroke-miterlimit'>" | "<'stroke-opacity'>" | "<'stroke-width'>" | "<'tab-size'>" | "<'table-layout'>" | "<'text-align'>" | "<'text-align-last'>" | "<'text-anchor'>" | "<'text-combine-upright'>" | "<'text-decoration'>" | "<'text-decoration-color'>" | "<'text-decoration-line'>" | "<'text-decoration-skip'>" | "<'text-decoration-skip-ink'>" | "<'text-decoration-style'>" | "<'text-decoration-thickness'>" | "<'text-emphasis'>" | "<'text-emphasis-color'>" | "<'text-emphasis-position'>" | "<'text-emphasis-style'>" | "<'text-indent'>" | "<'text-justify'>" | "<'text-orientation'>" | "<'text-overflow'>" | "<'text-rendering'>" | "<'text-shadow'>" | "<'text-size-adjust'>" | "<'text-transform'>" | "<'text-underline-offset'>" | "<'text-underline-position'>" | "<'top'>" | "<'touch-action'>" | "<'transform'>" | "<'transform-box'>" | "<'transform-origin'>" | "<'transform-style'>" | "<'transition'>" | "<'transition-delay'>" | "<'transition-duration'>" | "<'transition-property'>" | "<'transition-timing-function'>" | "<'translate'>" | "<'unicode-bidi'>" | "<'unicode-range'>" | "<'user-select'>" | "<'vertical-align'>" | "<'visibility'>" | "<'voice-balance'>" | "<'voice-duration'>" | "<'voice-family'>" | "<'voice-pitch'>" | "<'voice-range'>" | "<'voice-rate'>" | "<'voice-stress'>" | "<'voice-volume'>" | "<'white-space'>" | "<'widows'>" | "<'width'>" | "<'will-change'>" | "<'word-break'>" | "<'word-spacing'>" | "<'word-wrap'>" | "<'writing-mode'>" | "<'z-index'>" | "<'zoom'>" | '<(-token>' | '<)-token>' | '<-legacy-gradient>' | '<-legacy-linear-gradient-arguments>' | '<-legacy-linear-gradient>' | '<-legacy-radial-gradient-arguments>' | '<-legacy-radial-gradient-shape>' | '<-legacy-radial-gradient-size>' | '<-legacy-radial-gradient>' | '<-legacy-repeating-linear-gradient>' | '<-legacy-repeating-radial-gradient>' | '<-ms-filter-function-legacy>' | '<-ms-filter-function-list>' | '<-ms-filter-function-progid>' | '<-ms-filter-function>' | '<-ms-filter>' | '<-non-standard-color>' | '<-non-standard-display>' | '<-non-standard-font>' | '<-non-standard-image-rendering>' | '<-non-standard-overflow>' | '<-non-standard-width>' | '<-webkit-gradient()>' | '<-webkit-gradient-color-stop>' | '<-webkit-gradient-point>' | '<-webkit-gradient-radius>' | '<-webkit-gradient-type>' | '<-webkit-mask-box-repeat>' | '<-webkit-mask-clip-style>' | '<CDC-token>' | '<CDO-token>' | '<[-token>' | '<]-token>' | '<abs()>' | '<absolute-size>' | '<acos()>' | '<age>' | '<alpha-value>' | '<an-plus-b>' | '<angle-percentage>' | '<angle>' | '<angular-color-hint>' | '<angular-color-stop-list>' | '<angular-color-stop>' | '<animateable-feature>' | '<any-value>' | '<asin()>' | '<at-keyword-token>' | '<atan()>' | '<atan2()>' | '<attachment>' | '<attr()>' | '<attr-fallback>' | '<attr-matcher>' | '<attr-modifier>' | '<attr-name>' | '<attribute-selector>' | '<auto-repeat>' | '<auto-track-list>' | '<axis>' | '<bad-string-token>' | '<bad-url-token>' | '<baseline-position>' | '<basic-shape>' | '<bcp-47>' | '<bg-clip>' | '<bg-image>' | '<bg-layer>' | '<bg-position>' | '<bg-size>' | '<blend-mode>' | '<blur()>' | '<bottom>' | '<box>' | '<brightness()>' | '<calc()>' | '<calc-constant>' | '<calc-product>' | '<calc-sum>' | '<calc-value>' | '<cf-final-image>' | '<cf-mixing-image>' | '<circle()>' | '<clamp()>' | '<class-selector>' | '<clip-source>' | '<colon-token>' | '<color-stop-angle>' | '<color-stop-length>' | '<color-stop-list>' | '<color-stop>' | '<color>' | '<combinator>' | '<comma-token>' | '<common-lig-values>' | '<compat-auto>' | '<complex-selector-list>' | '<complex-selector>' | '<composite-style>' | '<compositing-operator>' | '<compound-selector-list>' | '<compound-selector>' | '<conic-gradient()>' | '<content-distribution>' | '<content-list>' | '<content-position>' | '<content-replacement>' | '<contextual-alt-values>' | '<contrast()>' | '<cos()>' | '<counter()>' | '<counter-name>' | '<counter-style-name>' | '<counter-style>' | '<counter>' | '<counters()>' | '<cross-fade()>' | '<cubic-bezier-timing-function>' | '<custom-ident>' | '<custom-property-name>' | '<decibel>' | '<declaration-list>' | '<declaration-value>' | '<declaration>' | '<delim-token>' | '<deprecated-system-color>' | '<dimension-token>' | '<dimension>' | '<discretionary-lig-values>' | '<display-box>' | '<display-inside>' | '<display-internal>' | '<display-legacy>' | '<display-listitem>' | '<display-outside>' | '<drop-shadow()>' | '<easing-function>' | '<east-asian-variant-values>' | '<east-asian-width-values>' | '<element()>' | '<ellipse()>' | '<ending-shape>' | '<env()>' | '<exp()>' | '<explicit-track-list>' | '<family-name>' | '<feature-tag-value>' | '<feature-type>' | '<feature-value-block-list>' | '<feature-value-block>' | '<feature-value-declaration-list>' | '<feature-value-declaration>' | '<feature-value-name>' | '<fill-rule>' | '<filter-function-list>' | '<filter-function>' | '<final-bg-layer>' | '<fixed-breadth>' | '<fixed-repeat>' | '<fixed-size>' | '<flex>' | '<font-stretch-absolute>' | '<font-variant-css21>' | '<font-weight-absolute>' | '<frequency-percentage>' | '<frequency>' | '<function-token>' | '<gender>' | '<general-enclosed>' | '<generic-family>' | '<generic-name>' | '<generic-voice>' | '<geometry-box>' | '<gradient>' | '<grayscale()>' | '<grid-line>' | '<hash-token>' | '<hex-color>' | '<historical-lig-values>' | '<hsl()>' | '<hsla()>' | '<hue-rotate()>' | '<hue>' | '<hwb()>' | '<hypot()>' | '<id-selector>' | '<ident-token>' | '<ident>' | '<image()>' | '<image-set()>' | '<image-set-option>' | '<image-src>' | '<image-tags>' | '<image>' | '<inflexible-breadth>' | '<inset()>' | '<integer>' | '<invert()>' | '<keyframe-block-list>' | '<keyframe-block>' | '<keyframe-selector>' | '<keyframes-name>' | '<lab()>' | '<layer()>' | '<layer-name>' | '<lch()>' | '<leader()>' | '<leader-type>' | '<left>' | '<length-percentage>' | '<length>' | '<line-name-list>' | '<line-names>' | '<line-style>' | '<line-width>' | '<linear-color-hint>' | '<linear-color-stop>' | '<linear-gradient()>' | '<log()>' | '<mask-image>' | '<mask-layer>' | '<mask-position>' | '<mask-reference>' | '<mask-source>' | '<masking-mode>' | '<matrix()>' | '<matrix3d()>' | '<max()>' | '<media-and>' | '<media-condition-without-or>' | '<media-condition>' | '<media-feature>' | '<media-in-parens>' | '<media-not>' | '<media-or>' | '<media-query-list>' | '<media-query>' | '<media-type>' | '<mf-boolean>' | '<mf-name>' | '<mf-plain>' | '<mf-range>' | '<mf-value>' | '<min()>' | '<minmax()>' | '<mod()>' | '<name-repeat>' | '<named-color>' | '<namespace-prefix>' | '<ns-prefix>' | '<nth>' | '<number-one-or-greater>' | '<number-percentage>' | '<number-token>' | '<number-zero-one>' | '<number>' | '<numeric-figure-values>' | '<numeric-fraction-values>' | '<numeric-spacing-values>' | '<opacity()>' | '<outline-radius>' | '<overflow-position>' | '<page-body>' | '<page-margin-box-type>' | '<page-margin-box>' | '<page-selector-list>' | '<page-selector>' | '<page-size>' | '<paint()>' | '<paint>' | '<path()>' | '<percentage-token>' | '<percentage>' | '<perspective()>' | '<polygon()>' | '<position>' | '<pow()>' | '<pseudo-class-selector>' | '<pseudo-element-selector>' | '<pseudo-page>' | '<quote>' | '<radial-gradient()>' | '<ratio>' | '<relative-selector-list>' | '<relative-selector>' | '<relative-size>' | '<rem()>' | '<repeat-style>' | '<repeating-conic-gradient()>' | '<repeating-linear-gradient()>' | '<repeating-radial-gradient()>' | '<resolution>' | '<reversed-counter-name>' | '<rgb()>' | '<rgba()>' | '<right>' | '<rotate()>' | '<rotate3d()>' | '<rotateX()>' | '<rotateY()>' | '<rotateZ()>' | '<round()>' | '<rounding-strategy>' | '<saturate()>' | '<scale()>' | '<scale3d()>' | '<scaleX()>' | '<scaleY()>' | '<scaleZ()>' | '<scroll-timeline-axis>' | '<scroll-timeline-name>' | '<scroller>' | '<self-position>' | '<semicolon-token>' | '<semitones>' | '<sepia()>' | '<shadow-t>' | '<shadow>' | '<shape-box>' | '<shape-radius>' | '<shape>' | '<side-or-corner>' | '<sign()>' | '<sin()>' | '<single-animation-composition>' | '<single-animation-direction>' | '<single-animation-fill-mode>' | '<single-animation-iteration-count>' | '<single-animation-play-state>' | '<single-animation-timeline>' | '<single-animation>' | '<single-transition-property>' | '<single-transition>' | '<size>' | '<skew()>' | '<skewX()>' | '<skewY()>' | '<sqrt()>' | '<step-position>' | '<step-timing-function>' | '<string-token>' | '<string>' | '<subclass-selector>' | '<supports-condition>' | '<supports-decl>' | '<supports-feature>' | '<supports-in-parens>' | '<supports-selector-fn>' | '<svg-length>' | '<svg-writing-mode>' | '<symbol>' | '<tan()>' | '<target-counter()>' | '<target-counters()>' | '<target-text()>' | '<target>' | '<time-percentage>' | '<time>' | '<timeline-name>' | '<top>' | '<track-breadth>' | '<track-list>' | '<track-repeat>' | '<track-size>' | '<transform-function>' | '<transform-list>' | '<translate()>' | '<translate3d()>' | '<translateX()>' | '<translateY()>' | '<translateZ()>' | '<type-or-unit>' | '<type-selector>' | '<urange>' | '<url-modifier>' | '<url-token>' | '<url>' | '<var()>' | '<viewport-length>' | '<visual-box>' | '<whitespace-token>' | '<wq-name>' | '<x>' | '<y>' | '<zero>' | '<{-token>' | '<}-token>';
-export type ExtendedType = "<'color-profile'>" | "<'color-rendering'>" | "<'enable-background'>" | '<animatable-value>' | '<begin-value-list>' | '<class-list>' | '<clock-value>' | '<color-matrix>' | '<css-declaration-list>' | '<dasharray>' | '<end-value-list>' | '<key-points>' | '<key-splines>' | '<key-times>' | '<list-of-lengths>' | '<list-of-numbers>' | '<list-of-percentages>' | '<list-of-svg-feature-string>' | '<list-of-value>' | '<number-optional-number>' | '<origin>' | '<points>' | '<preserve-aspect-ratio>' | '<rotate>' | '<svg-font-size-adjust>' | '<svg-font-size>' | '<svg-path>' | '<system-language>' | '<text-coordinate>' | '<view-box>' | 'AbsoluteURL' | 'Accept' | 'Any' | 'AutoComplete' | 'BCP47' | 'BaseURL' | 'BrowsingContextName' | 'BrowsingContextNameOrKeyword' | 'CustomElementName' | 'DOMID' | 'DateTime' | 'FunctionBody' | 'HTTPSchemaURL' | 'HashName' | 'IconSize' | 'Int' | 'ItemProp' | 'MIMEType' | 'NavigableTargetName' | 'NavigableTargetNameOrKeyword' | 'NoEmptyAny' | 'Number' | 'OneCodePointChar' | 'OneLineAny' | 'Pattern' | 'SerializedPermissionsPolicy' | 'SourceSizeList' | 'Srcset' | 'TabIndex' | 'URL' | 'Uint' | 'XMLName' | 'Zero';
+export type ExtendedType = "<'color-profile'>" | "<'color-rendering'>" | "<'enable-background'>" | '<animatable-value>' | '<begin-value-list>' | '<class-list>' | '<clock-value>' | '<color-matrix>' | '<css-declaration-list>' | '<dasharray>' | '<end-value-list>' | '<key-points>' | '<key-splines>' | '<key-times>' | '<list-of-lengths>' | '<list-of-numbers>' | '<list-of-percentages>' | '<list-of-svg-feature-string>' | '<list-of-value>' | '<number-optional-number>' | '<origin>' | '<points>' | '<preserve-aspect-ratio>' | '<rotate>' | '<svg-font-size-adjust>' | '<svg-font-size>' | '<svg-path>' | '<system-language>' | '<text-coordinate>' | '<view-box>' | 'AbsoluteURL' | 'Accept' | 'Any' | 'AutoComplete' | 'BCP47' | 'BaseURL' | 'BrowsingContextName' | 'BrowsingContextNameOrKeyword' | 'CustomElementName' | 'DOMID' | 'DateTime' | 'FunctionBody' | 'HTTPSchemaURL' | 'HashName' | 'IconSize' | 'Int' | 'ItemProp' | 'JSON' | 'MIMEType' | 'NavigableTargetName' | 'NavigableTargetNameOrKeyword' | 'NoEmptyAny' | 'Number' | 'OneCodePointChar' | 'OneLineAny' | 'Pattern' | 'SerializedPermissionsPolicy' | 'SourceSizeList' | 'Srcset' | 'TabIndex' | 'URL' | 'Uint' | 'XMLName' | 'Zero';
 export type HtmlAttrRequirement = 'Boolean';
 export interface TypesSchema {
     type?: Type;
@@ -55,3 +55,14 @@ export interface Number {
     lte?: number;
     clampable?: boolean;
 }
+/**
+ * Allows separating and individually validating directives and tokens within attribute values. Ensures precise validation for complex attributes by checking each part according to its rules.
+ */
+export interface Directive {
+    /**
+     * @minItems 1
+     */
+    directive: [string, ...string[]];
+    token: Type;
+    ref?: string;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@markuplint/types",
-	"version": "4.4.1",
+	"version": "4.5.1",
 	"description": "Type declaration and value checker",
 	"repository": "git@github.com:markuplint/markuplint.git",
 	"author": "Yusuke Hirao <yusukehirao@me.com>",
@@ -29,6 +29,7 @@
 		"schema:prettier": "prettier --write \"./src/types.schema.ts\" \"./types.schema.json\" --log-level warn"
 	},
 	"dependencies": {
+		"@markuplint/shared": "4.4.1",
 		"@types/css-tree": "2.3.7",
 		"@types/debug": "4.1.12",
 		"@types/whatwg-mimetype": "3.0.2",
@@ -36,8 +37,8 @@
 		"css-tree": "2.3.1",
 		"debug": "4.3.4",
 		"leven": "4.0.0",
-		"type-fest": "4.18.1",
+		"type-fest": "4.18.3",
 		"whatwg-mimetype": "4.0.0"
 	},
-	"gitHead": "7a5967fce14fdf66f0d8eae9d93ae5b350648d3d"
+	"gitHead": "bf70c41b1d2497e85b73c9ecd5551eb522e6bdfc"
 }

package/types.schema.json

@@ -1049,6 +1049,7 @@
 				"IconSize",
 				"Int",
 				"ItemProp",
+				"JSON",
 				"MIMEType",
 				"NavigableTargetName",
 				"NavigableTargetNameOrKeyword",
@@ -1135,12 +1136,29 @@
 				"clampable": { "type": "boolean" }
 			}
 		},
+		"directive": {
+			"description": "Allows separating and individually validating directives and tokens within attribute values. Ensures precise validation for complex attributes by checking each part according to its rules.",
+			"type": "object",
+			"required": ["directive", "token"],
+			"additionalProperties": false,
+			"properties": {
+				"directive": {
+					"type": "array",
+					"minItems": 1,
+					"uniqueItems": true,
+					"items": { "type": "string", "minLength": 1 }
+				},
+				"token": { "$ref": "#/definitions/type" },
+				"ref": { "type": "string" }
+			}
+		},
 		"type": {
 			"oneOf": [
 				{ "$ref": "#/definitions/keyword-defined-type" },
 				{ "$ref": "#/definitions/list" },
 				{ "$ref": "#/definitions/enum" },
-				{ "$ref": "#/definitions/number" }
+				{ "$ref": "#/definitions/number" },
+				{ "$ref": "#/definitions/directive" }
 			]
 		}
 	},