@storybook/csf - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2--canary.50.45981a0.0

dist/index.d.ts

 export declare const sanitize: (string: string) => string;
-export declare const toId: (kind: string, name: string) => string;
+export declare const toId: (kind: string, name?: string | undefined) => string;
 export declare const storyNameFromExport: (key: string) => string;
@@ -18,2 +18,2 @@ declare type StoryDescriptor = string[] | RegExp;
 };
-export {};
+export * from './story';

dist/index.js

@@ -6,2 +6,9 @@ "use strict";
 });
+var _exportNames = {
+  sanitize: true,
+  toId: true,
+  storyNameFromExport: true,
+  isExportStory: true,
+  parseKind: true
+};
 exports.isExportStory = isExportStory;
@@ -12,10 +19,27 @@ exports.parseKind = exports.storyNameFromExport = exports.toId = exports.sanitize = void 0;
 
+var _story = require("./story");
+
+Object.keys(_story).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _story[key];
+    }
+  });
+});
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
@@ -50,3 +74,3 @@
 var toId = function toId(kind, name) {
-  return "".concat(sanitizeSafe(kind, 'kind'), "--").concat(sanitizeSafe(name, 'name'));
+  return "".concat(sanitizeSafe(kind, 'kind')).concat(name ? "--".concat(sanitizeSafe(name, 'name')) : '');
 };
@@ -53,0 +77,0 @@ /**

dist/index.test.js

@@ -5,13 +5,18 @@ "use strict";
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 describe('toId', function () {
-  [// name, kind, story, output
-  ['handles simple cases', 'kind', 'story', 'kind--story'], ['handles basic substitution', 'a b$c?d😀e', '1-2:3', 'a-b-c-d😀e--1-2-3'], ['handles runs of non-url chars', 'a?&*b', 'story', 'a-b--story'], ['removes non-url chars from start and end', '?ab-', 'story', 'ab--story'], ['downcases', 'KIND', 'STORY', 'kind--story'], ['non-latin', 'Кнопки', 'нормальный', 'кнопки--нормальный'], ['korean', 'kind', '바보 (babo)', 'kind--바보-babo'], ['all punctuation', 'kind', 'unicorns,’–—―′¿`"<>()!.!!!{}[]%^&$*#&', 'kind--unicorns']].forEach(function (_ref) {
+  var testCases = [// name, kind, story, output
+  ['handles simple cases', 'kind', 'story', 'kind--story'], ['handles kind without story', 'kind', undefined, 'kind'], ['handles basic substitution', 'a b$c?d😀e', '1-2:3', 'a-b-c-d😀e--1-2-3'], ['handles runs of non-url chars', 'a?&*b', 'story', 'a-b--story'], ['removes non-url chars from start and end', '?ab-', 'story', 'ab--story'], ['downcases', 'KIND', 'STORY', 'kind--story'], ['non-latin', 'Кнопки', 'нормальный', 'кнопки--нормальный'], ['korean', 'kind', '바보 (babo)', 'kind--바보-babo'], ['all punctuation', 'kind', 'unicorns,’–—―′¿`"<>()!.!!!{}[]%^&$*#&', 'kind--unicorns']];
+  testCases.forEach(function (_ref) {
     var _ref2 = _slicedToArray(_ref, 4),
@@ -42,6 +47,6 @@ name = _ref2[0],
   });
-  it('does not allow empty story', function () {
+  it('allows empty story', function () {
     expect(function () {
       return (0, _.toId)('kind', '');
-    }).toThrow("Invalid name '', must include alphanumeric characters");
+    }).not.toThrow();
   });
@@ -48,0 +53,0 @@ });

package.json

 {
   "name": "@storybook/csf",
-  "version": "0.0.1",
-  "description": "Storybook Component Story Format (CSF) utilities",
+  "version": "0.0.2--canary.50.45981a0.0",
+  "description": "Component Story Format (CSF) utilities",
   "keywords": [
@@ -11,9 +11,9 @@ "storybook",
   ],
-  "homepage": "https://github.com/storybookjs/csf",
+  "homepage": "https://github.com/ComponentDriven/csf",
   "bugs": {
-    "url": "https://github.com/storybookjs/csf/issues"
+    "url": "https://github.com/ComponentDriven/csf/issues"
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/storybookjs/csf.git"
+    "url": "https://github.com/ComponentDriven/csf.git"
   },
@@ -32,4 +32,4 @@ "license": "MIT",
     "lint": "eslint src --ext .js,.ts",
-    "prepublish": "yarn build",
-    "test": "jest"
+    "test": "jest",
+    "release": "yarn build && auto shipit"
   },
@@ -49,9 +49,11 @@ "eslintConfig": {
   "devDependencies": {
-    "@babel/cli": "^7.7.4",
-    "@babel/core": "^7.7.4",
-    "@babel/preset-env": "^7.7.4",
-    "@babel/preset-typescript": "^7.7.4",
+    "@auto-it/released": "^10.37.1",
+    "@babel/cli": "^7.8.4",
+    "@babel/core": "^7.9.0",
+    "@babel/preset-env": "^7.9.5",
+    "@babel/preset-typescript": "^7.9.0",
     "@storybook/eslint-config-storybook": "^2.1.0",
     "@types/jest": "^24.0.23",
     "@types/lodash": "^4.14.149",
+    "auto": "^10.31.0",
     "babel-core": "7.0.0-bridge.0",
@@ -65,2 +67,8 @@ "babel-jest": "^24.9.0",
   },
+  "auto": {
+    "plugins": [
+      "npm",
+      "released"
+    ]
+  },
   "publishConfig": {
@@ -67,0 +75,0 @@ "access": "public"

README.md

@@ -1,15 +0,55 @@
-# Storybook Component Story Format (CSF)
+<img src="https://user-images.githubusercontent.com/42671/89649515-eceafc00-d88e-11ea-9728-5ef80cdf8462.png" width="321px" height="236px" />
 
-A minimal set of utility functions for dealing with Storybook [Component Story Format (CSF)](https://storybook.js.org/docs/formats/component-story-format/).
+# Component Story Format (CSF)
 
-## Install
+### Why a standard format?
+Components have risen to dominate the UI landscape. There are new component-oriented tools for development, testing, design, and prototyping. These tools engage in the creation and consumption of components and component examples (a.k.a. stories). But each tool has its own proprietary format because a simple, platform-agnostic way to express component examples doesn't yet exist.
 
+### The "Story" is the source of truth for a component.
+A story is a code snippet that renders an example of a component in a specific state. Think about it like a "[user story](https://en.wikipedia.org/wiki/User_story)".
+
+It uses the production code shipped to users, making it the most accurate representation of a component example. What's more, stories are expressed in the view layer you use to build your app.
+
+
+### Component Story Format
+The Component Story Format is an open standard for component examples based on JavaScript ES6 modules. This enables interoperation between development, testing, and design tools.
+
+```js
+export default { title: 'atoms/Button' };
+export const text = () => <Button>Hello</Button>;
+export const emoji = () => <Button>😀😎👍💯</Button>;
+```
+
+💎 **Simple.** Writing component "stories" is as easy as exporting ES6 functions using a clean, widely-used format.
+
+🚚 **Non-proprietary.** CSF doesn't require any vendor-specific libraries. Component stories are easily consumed anywhere ES6 modules live, including your favourite testing tools like Jest and Cypress.
+
+☝️ **Declarative.** The declarative syntax is isomorphic to higher-level formats like MDX, enabling clean, verifiable transformations.
+
+🔥 **Optimized.** Component stories don't need any libraries other than your components. And because they're ES6 modules, they're even tree-shakeable!
+
+### Who uses CSF?
+
+**Tools:** [Storybook](https://storybook.js.org), [WebComponents.dev](https://webcomponents.dev), [Components.studio](https://components.studio), [RedwoodJS](https://redwoodjs.com/), [UXPin](https://www.uxpin.com/)
+
+**Compatible with:** [Jest](https://jestjs.io/), [Enzyme](https://enzymejs.github.io/enzyme), [Testing Library](https://testing-library.com), [Cypress](https://www.cypress.io/), [Playwright](https://playwright.dev/), [Mocha](https://mochajs.org), etc.
+
+
+## CSF utilities
+
+A minimal set of utility functions for dealing with [Component Story Format (CSF)](https://storybook.js.org/docs/formats/component-story-format/).
+
+
+### Install
+
 ```sh
-yarn add @storybook/csf
+yarn add @componentdriven/csf
 ```
 
-## API
+### API
 
 See package source for function definitions and types:
 
+- `storyNameFromExport(key)` - Enhance export name (`key`) of the story. Currently implemented with [startCase](https://lodash.com/docs/4.17.11#startCase).
+
 - `isExportStory(key, { includeStories, excludeStories })` - Does a named export match CSF inclusion/exclusion options?
@@ -16,0 +56,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

27572

increased by125.26%

Number of package files

13

increased by85.71%

Lines of code

583

increased by150.21%

Number of lines in readme file

74

increased by117.65%

Worsened metrics

Dev dependency count

16

increased by14.29%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes