@usefragments/core 1.10.0 → 1.10.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,3 +1,7 @@
1
+ import {
2
+ CompiledFragmentsFileValidationError,
3
+ parseCompiledFragmentsFile
4
+ } from "./chunk-RANPUC6C.js";
1
5
  import {
2
6
  generateContext
3
7
  } from "./chunk-X34IA4LR.js";
@@ -185,10 +189,6 @@ import {
185
189
  severitySchema,
186
190
  sortBySeverity
187
191
  } from "./chunk-V4VQB57N.js";
188
- import {
189
- CompiledFragmentsFileValidationError,
190
- parseCompiledFragmentsFile
191
- } from "./chunk-RANPUC6C.js";
192
192
 
193
193
  // src/constants.ts
194
194
  var BRAND = {
@@ -2010,359 +2010,6 @@ function compileBlock(definition, filePath) {
2010
2010
  }
2011
2011
  var compileRecipe = compileBlock;
2012
2012
 
2013
- // src/storyAdapter.ts
2014
- import { createElement } from "react";
2015
-
2016
- // src/storybook-csf.ts
2017
- import {
2018
- toId as storybookToId,
2019
- storyNameFromExport as storybookStoryNameFromExport,
2020
- isExportStory as storybookIsExportStory
2021
- } from "@storybook/csf";
2022
- var toId = (...args) => storybookToId(...args);
2023
- var storyNameFromExport = (...args) => storybookStoryNameFromExport(...args);
2024
- var isExportStory = (...args) => storybookIsExportStory(...args);
2025
-
2026
- // src/storyAdapter.ts
2027
- var globalPreviewConfig = {};
2028
- function setPreviewConfig(config) {
2029
- globalPreviewConfig = config;
2030
- }
2031
- function getPreviewConfig() {
2032
- return globalPreviewConfig;
2033
- }
2034
- function storyModuleToFragment(storyModule, filePath) {
2035
- const meta = storyModule.default;
2036
- const component = meta.component;
2037
- if (!component) {
2038
- return null;
2039
- }
2040
- const componentName = extractComponentName(meta, filePath);
2041
- const category = extractCategory(meta.title);
2042
- const props = convertArgTypes(meta.argTypes ?? {}, globalPreviewConfig.argTypes);
2043
- const variants = extractVariants(storyModule, component, meta);
2044
- const figmaUrl = extractFigmaUrl(meta.parameters);
2045
- const fragmentMeta = {
2046
- name: componentName,
2047
- description: meta.parameters?.docs?.description?.component ?? `${componentName} component`,
2048
- category,
2049
- tags: meta.tags?.filter((t) => t !== "autodocs"),
2050
- status: "stable",
2051
- figma: figmaUrl
2052
- };
2053
- const usage = {
2054
- when: [`Use ${componentName} for its intended purpose`],
2055
- whenNot: ["When a more specific component is available"]
2056
- };
2057
- return {
2058
- component,
2059
- meta: fragmentMeta,
2060
- usage,
2061
- props,
2062
- variants
2063
- };
2064
- }
2065
- function extractComponentName(meta, filePath) {
2066
- if (meta.title) {
2067
- const parts = meta.title.split("/");
2068
- return parts[parts.length - 1];
2069
- }
2070
- if (meta.component?.displayName) {
2071
- return meta.component.displayName;
2072
- }
2073
- if (meta.component?.name && meta.component.name !== "Component") {
2074
- return meta.component.name;
2075
- }
2076
- const match = filePath.match(/([^/\\]+)\.stories\.(tsx?|jsx?)$/);
2077
- return match?.[1] ?? "Unknown";
2078
- }
2079
- function extractCategory(title) {
2080
- if (!title) return "general";
2081
- const parts = title.split("/");
2082
- if (parts.length >= 3) {
2083
- return parts[parts.length - 2].toLowerCase();
2084
- }
2085
- return "general";
2086
- }
2087
- function extractFigmaUrl(parameters) {
2088
- if (!parameters) return void 0;
2089
- const design = parameters.design;
2090
- if (design?.url && typeof design.url === "string") {
2091
- return design.url;
2092
- }
2093
- if (typeof parameters.figma === "string") {
2094
- return parameters.figma;
2095
- }
2096
- return void 0;
2097
- }
2098
- function convertArgTypes(argTypes, globalArgTypes) {
2099
- const props = {};
2100
- const mergedArgTypes = { ...globalArgTypes, ...argTypes };
2101
- for (const [name, argType] of Object.entries(mergedArgTypes)) {
2102
- if (argType.table?.disable) continue;
2103
- if (argType.control === false && argType.action) continue;
2104
- const { controlType, controlOptions } = extractControlInfo(argType);
2105
- props[name] = {
2106
- type: inferPropType(argType),
2107
- description: argType.description ?? `${name} prop`,
2108
- ...argType.options && { values: argType.options },
2109
- ...argType.table?.defaultValue && {
2110
- default: argType.table.defaultValue.summary
2111
- },
2112
- ...argType.defaultValue !== void 0 && {
2113
- default: argType.defaultValue
2114
- },
2115
- ...argType.type?.required && { required: true },
2116
- ...controlType && { controlType },
2117
- ...controlOptions && Object.keys(controlOptions).length > 0 && { controlOptions }
2118
- };
2119
- }
2120
- return props;
2121
- }
2122
- function extractControlInfo(argType) {
2123
- if (argType.control === void 0 || argType.control === false) {
2124
- return {};
2125
- }
2126
- const control = typeof argType.control === "string" ? { type: argType.control } : argType.control;
2127
- const validControlTypes = [
2128
- "text",
2129
- "number",
2130
- "range",
2131
- "boolean",
2132
- "select",
2133
- "multi-select",
2134
- "radio",
2135
- "inline-radio",
2136
- "check",
2137
- "inline-check",
2138
- "object",
2139
- "file",
2140
- "color",
2141
- "date"
2142
- ];
2143
- const controlType = validControlTypes.includes(control.type) ? control.type : void 0;
2144
- const controlOptions = {};
2145
- if (control.min !== void 0) controlOptions.min = control.min;
2146
- if (control.max !== void 0) controlOptions.max = control.max;
2147
- if (control.step !== void 0) controlOptions.step = control.step;
2148
- if (control.presetColors) controlOptions.presetColors = control.presetColors;
2149
- return {
2150
- controlType,
2151
- controlOptions: Object.keys(controlOptions).length > 0 ? controlOptions : void 0
2152
- };
2153
- }
2154
- function inferPropType(argType) {
2155
- if (argType.action) return "function";
2156
- if (argType.options?.length) return "enum";
2157
- if (argType.type?.name) {
2158
- const typeMap = {
2159
- string: "string",
2160
- number: "number",
2161
- boolean: "boolean",
2162
- object: "object",
2163
- array: "array",
2164
- function: "function"
2165
- };
2166
- const mapped = typeMap[argType.type.name];
2167
- if (mapped) return mapped;
2168
- }
2169
- const control = typeof argType.control === "string" ? argType.control : argType.control ? argType.control.type : void 0;
2170
- if (control) {
2171
- const controlMap = {
2172
- // Text controls
2173
- text: "string",
2174
- // Number controls
2175
- number: "number",
2176
- range: "number",
2177
- // Boolean controls
2178
- boolean: "boolean",
2179
- check: "boolean",
2180
- "inline-check": "boolean",
2181
- // Enum/selection controls
2182
- select: "enum",
2183
- "multi-select": "enum",
2184
- radio: "enum",
2185
- "inline-radio": "enum",
2186
- // Object controls
2187
- object: "object",
2188
- file: "object",
2189
- // Special string controls
2190
- color: "string",
2191
- date: "string"
2192
- };
2193
- const mapped = controlMap[control];
2194
- if (mapped) return mapped;
2195
- }
2196
- return "string";
2197
- }
2198
- function isStory(value) {
2199
- if (typeof value === "object" && value !== null) {
2200
- const obj = value;
2201
- if ("args" in obj || "render" in obj || "play" in obj) return true;
2202
- }
2203
- if (typeof value === "function") {
2204
- const fn = value;
2205
- if ("args" in fn) return true;
2206
- }
2207
- return false;
2208
- }
2209
- function extractVariants(storyModule, component, meta) {
2210
- const variants = [];
2211
- for (const [exportName, exportValue] of Object.entries(storyModule)) {
2212
- if (exportName === "default") continue;
2213
- if (!isExportStory(exportName, meta)) continue;
2214
- if (!isStory(exportValue)) continue;
2215
- const story = exportValue;
2216
- const storyName = typeof story === "object" && story.name || typeof story === "object" && story.storyName || typeof story === "function" && story.storyName || storyNameFromExport(exportName);
2217
- const storyId = toId(meta.title || "Unknown", exportName);
2218
- let description = `${storyName} variant`;
2219
- if (typeof story === "object" && story.parameters?.docs?.description?.story) {
2220
- description = story.parameters.docs.description.story;
2221
- }
2222
- const storyPlayFn = typeof story === "object" ? story.play : story.play;
2223
- const hasPlayFunction = !!storyPlayFn;
2224
- const wrappedPlay = storyPlayFn ? async (context) => {
2225
- const args = {
2226
- ...globalPreviewConfig.args,
2227
- ...meta.args,
2228
- ...typeof story === "function" ? story.args : story.args
2229
- };
2230
- const fullContext = buildStoryContext(meta, story, args, storyId, storyName);
2231
- const playContext = {
2232
- ...fullContext,
2233
- canvasElement: context.canvasElement,
2234
- args: context.args,
2235
- step: context.step
2236
- };
2237
- await storyPlayFn(playContext);
2238
- } : void 0;
2239
- const storyTags = typeof story === "object" ? story.tags : void 0;
2240
- const loaders = collectLoaders(meta, story);
2241
- const variantArgs = {
2242
- ...globalPreviewConfig.args,
2243
- ...meta.args,
2244
- ...typeof story === "function" ? story.args : story.args
2245
- };
2246
- const hasArgs = Object.keys(variantArgs).length > 0;
2247
- variants.push({
2248
- name: storyName,
2249
- description,
2250
- render: createRenderFunction(story, component, meta, storyId, storyName),
2251
- // Store Storybook-specific metadata
2252
- ...hasPlayFunction && { hasPlayFunction: true },
2253
- ...wrappedPlay && { play: wrappedPlay },
2254
- ...storyId && { storyId },
2255
- ...storyTags && { tags: storyTags },
2256
- ...loaders.length > 0 && { loaders },
2257
- ...hasArgs && { args: variantArgs }
2258
- });
2259
- }
2260
- return variants;
2261
- }
2262
- function collectLoaders(meta, story) {
2263
- const allLoaders = [
2264
- ...globalPreviewConfig.loaders ?? [],
2265
- ...meta.loaders ?? [],
2266
- ...typeof story === "function" ? story.loaders ?? [] : story.loaders ?? []
2267
- ];
2268
- if (allLoaders.length === 0) {
2269
- return [];
2270
- }
2271
- return allLoaders.map((loader) => {
2272
- return async () => {
2273
- const minimalContext = {
2274
- args: {},
2275
- argTypes: {},
2276
- globals: {},
2277
- parameters: {},
2278
- id: "",
2279
- kind: meta.title || "Unknown",
2280
- name: "",
2281
- story: "",
2282
- viewMode: "story",
2283
- loaded: {},
2284
- abortSignal: new AbortController().signal,
2285
- componentId: "",
2286
- title: meta.title || "Unknown"
2287
- };
2288
- return loader(minimalContext);
2289
- };
2290
- });
2291
- }
2292
- function buildStoryContext(meta, story, args, storyId, storyName, loadedData) {
2293
- const mergedArgs = {
2294
- ...globalPreviewConfig.args,
2295
- ...meta.args,
2296
- ...typeof story === "object" ? story.args : story.args,
2297
- ...args
2298
- };
2299
- const mergedArgTypes = {
2300
- ...globalPreviewConfig.argTypes,
2301
- ...meta.argTypes,
2302
- ...typeof story === "object" ? story.argTypes : story.argTypes
2303
- };
2304
- const mergedParameters = {
2305
- ...globalPreviewConfig.parameters,
2306
- ...meta.parameters,
2307
- ...typeof story === "object" ? story.parameters : story.parameters
2308
- };
2309
- return {
2310
- args: mergedArgs,
2311
- argTypes: mergedArgTypes ?? {},
2312
- globals: {},
2313
- parameters: mergedParameters ?? {},
2314
- id: storyId,
2315
- kind: meta.title || "Unknown",
2316
- name: storyName,
2317
- story: storyName,
2318
- viewMode: "story",
2319
- loaded: loadedData ?? {},
2320
- abortSignal: new AbortController().signal,
2321
- componentId: toId(meta.title || "Unknown", ""),
2322
- title: meta.title || "Unknown"
2323
- };
2324
- }
2325
- function createRenderFunction(story, component, meta, storyId, storyName) {
2326
- return (options) => {
2327
- const args = {
2328
- ...globalPreviewConfig.args,
2329
- ...meta.args,
2330
- ...typeof story === "function" ? story.args : story.args,
2331
- ...options?.args
2332
- // Runtime overrides from viewer props panel
2333
- };
2334
- const loadedData = options?.loadedData;
2335
- const context = buildStoryContext(meta, story, args, storyId, storyName, loadedData);
2336
- let renderFn;
2337
- if (typeof story === "function") {
2338
- renderFn = () => story(args);
2339
- } else if (story.render) {
2340
- renderFn = () => story.render.length >= 2 ? story.render(args, context) : story.render(args);
2341
- } else if (meta.render) {
2342
- renderFn = () => meta.render.length >= 2 ? meta.render(args, context) : meta.render(args);
2343
- } else {
2344
- renderFn = () => createElement(component, args);
2345
- }
2346
- const allDecorators = [
2347
- ...globalPreviewConfig.decorators ?? [],
2348
- ...meta.decorators ?? [],
2349
- ...typeof story === "function" ? story.decorators ?? [] : story.decorators ?? []
2350
- ].reverse();
2351
- if (allDecorators.length > 0) {
2352
- return applyDecorators(renderFn, allDecorators, context);
2353
- }
2354
- return renderFn();
2355
- };
2356
- }
2357
- function applyDecorators(renderFn, decorators, context) {
2358
- let storyFn = renderFn;
2359
- for (const decorator of decorators) {
2360
- const wrappedFn = storyFn;
2361
- storyFn = () => decorator(wrappedFn, context);
2362
- }
2363
- return storyFn();
2364
- }
2365
-
2366
2013
  // src/storyFilters.ts
2367
2014
  var EXCLUDED_TAGS = /* @__PURE__ */ new Set(["hidden", "internal", "no-fragment"]);
2368
2015
  var SVG_ICON_RE = /^Svg[A-Z]/;
@@ -4555,91 +4202,6 @@ function findBestCategoryCandidate(fragments, category, selectedSet, suggestedSe
4555
4202
  return best;
4556
4203
  }
4557
4204
 
4558
- // src/preview-runtime.tsx
4559
- import { useEffect, useState } from "react";
4560
- import { Fragment, jsx } from "react/jsx-runtime";
4561
- var EMPTY_STATE = {
4562
- content: null,
4563
- isLoading: false,
4564
- error: null,
4565
- loadedData: void 0
4566
- };
4567
- function toError(error) {
4568
- return error instanceof Error ? error : new Error(String(error));
4569
- }
4570
- async function executeVariantLoaders(loaders, loadedData) {
4571
- const hasLoaders = !!loaders && loaders.length > 0;
4572
- if (!hasLoaders) {
4573
- return loadedData;
4574
- }
4575
- const results = await Promise.all(loaders.map((loader) => loader()));
4576
- const mergedFromLoaders = results.reduce(
4577
- (acc, result) => ({ ...acc, ...result }),
4578
- {}
4579
- );
4580
- return loadedData ? { ...mergedFromLoaders, ...loadedData } : mergedFromLoaders;
4581
- }
4582
- async function resolvePreviewRuntimeState(options) {
4583
- const { variant, loadedData } = options;
4584
- if (!variant) {
4585
- return EMPTY_STATE;
4586
- }
4587
- try {
4588
- const mergedLoadedData = await executeVariantLoaders(variant.loaders, loadedData);
4589
- const content = variant.render({ loadedData: mergedLoadedData });
4590
- return {
4591
- content,
4592
- isLoading: false,
4593
- error: null,
4594
- loadedData: mergedLoadedData
4595
- };
4596
- } catch (error) {
4597
- return {
4598
- content: null,
4599
- isLoading: false,
4600
- error: toError(error),
4601
- loadedData: void 0
4602
- };
4603
- }
4604
- }
4605
- function usePreviewVariantRuntime(options) {
4606
- const { variant, loadedData } = options;
4607
- const [state, setState] = useState(EMPTY_STATE);
4608
- useEffect(() => {
4609
- let cancelled = false;
4610
- if (!variant) {
4611
- setState(EMPTY_STATE);
4612
- return () => {
4613
- cancelled = true;
4614
- };
4615
- }
4616
- const hasLoaders = !!variant.loaders && variant.loaders.length > 0;
4617
- setState({
4618
- content: null,
4619
- isLoading: hasLoaders,
4620
- error: null,
4621
- loadedData: void 0
4622
- });
4623
- resolvePreviewRuntimeState({ variant, loadedData }).then((nextState) => {
4624
- if (!cancelled) {
4625
- setState(nextState);
4626
- }
4627
- });
4628
- return () => {
4629
- cancelled = true;
4630
- };
4631
- }, [variant, loadedData]);
4632
- return state;
4633
- }
4634
- function PreviewVariantRuntime({
4635
- variant,
4636
- loadedData,
4637
- children: children2
4638
- }) {
4639
- const state = usePreviewVariantRuntime({ variant, loadedData });
4640
- return /* @__PURE__ */ jsx(Fragment, { children: children2(state) });
4641
- }
4642
-
4643
4205
  // src/component-discovery.ts
4644
4206
  function isReactComponent(value) {
4645
4207
  if (!value) return false;
@@ -10400,7 +9962,6 @@ export {
10400
9962
  PRESET_NAMES,
10401
9963
  PROVE_DEFAULT_MAX_PASSES,
10402
9964
  PROVE_MAX_PASSES,
10403
- PreviewVariantRuntime,
10404
9965
  RAW_HTML_ADVISORY_TAGS,
10405
9966
  RAW_HTML_CANONICAL_TAGS,
10406
9967
  RAW_HTML_INPUT_TYPE_CANONICALS,
@@ -10513,7 +10074,6 @@ export {
10513
10074
  emptyConformResult,
10514
10075
  evaluateGovernanceIntegrity,
10515
10076
  excludeGlobToRegExp,
10516
- executeVariantLoaders,
10517
10077
  explainUrlForCode,
10518
10078
  factEvidenceSchema,
10519
10079
  factId,
@@ -10554,7 +10114,6 @@ export {
10554
10114
  generateSCSSVariables,
10555
10115
  generateTailwindConfig,
10556
10116
  getComplianceBadge,
10557
- getPreviewConfig,
10558
10117
  globalGovernanceRecordSchema,
10559
10118
  globalJsxGovernanceRecordSchema,
10560
10119
  globalStyleGovernanceRecordSchema,
@@ -10581,7 +10140,6 @@ export {
10581
10140
  isDenyEligible,
10582
10141
  isEffectiveCanonicalSource,
10583
10142
  isEnforceableHtmlEquivalent,
10584
- isExportStory,
10585
10143
  isFigmaPropMapping,
10586
10144
  isForceIncluded,
10587
10145
  isPortableRepoPath,
@@ -10727,7 +10285,6 @@ export {
10727
10285
  resolveFigmaMapping,
10728
10286
  resolveOwnedPackageImport,
10729
10287
  resolvePerformanceConfig,
10730
- resolvePreviewRuntimeState,
10731
10288
  resolveProveVerdict,
10732
10289
  resolveSpacingValue,
10733
10290
  resolveTokenValue,
@@ -10758,20 +10315,15 @@ export {
10758
10315
  scaleGovernanceRecordSchema,
10759
10316
  selectedRegistryComponentNames,
10760
10317
  serializeContractStamp,
10761
- setPreviewConfig,
10762
10318
  severityLevel,
10763
10319
  severitySchema,
10764
10320
  sha256Hex,
10765
10321
  sortBySeverity,
10766
10322
  sourceToRegistryTargetPath,
10767
- storyModuleToFragment,
10768
- storyNameFromExport,
10769
10323
  suppressionDirectiveSchema,
10770
10324
  tierFor,
10771
- toId,
10772
10325
  tokenIncludesFromConfig,
10773
10326
  topologyBase,
10774
- usePreviewVariantRuntime,
10775
10327
  validatorResultSchema,
10776
10328
  verifiedContractPreimageFromPin,
10777
10329
  violationSchema,