@popsure/dirty-swan 0.59.0-alpha → 0.59.0-beta-2

package/dist/esm/scss/public/borders.stories.js

@@ -0,0 +1,86 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { c as classNames } from '../../index-6ea95111.js';
+
+var borders = [
+    {
+        name: 'Strong Default',
+        className: 'border-strong-default',
+        variable: '$border-strong-default',
+        description: '1px solid neutral-400',
+    },
+    {
+        name: 'Strong Hover',
+        className: 'border-strong-hover',
+        variable: '$border-strong-hover',
+        description: '1px solid neutral-600',
+    },
+    {
+        name: 'Strong Active',
+        className: 'border-strong-active',
+        variable: '$border-strong-active',
+        description: '1px solid neutral-900',
+    },
+    {
+        name: 'Medium Default',
+        className: 'border-medium-default',
+        variable: '$border-medium-default',
+        description: '1px solid neutral-300',
+    },
+    {
+        name: 'Medium Hover',
+        className: 'border-medium-hover',
+        variable: '$border-medium-hover',
+        description: '1px solid neutral-500',
+    },
+    {
+        name: 'Medium Active',
+        className: 'border-medium-active',
+        variable: '$border-medium-active',
+        description: '1px solid neutral-800',
+    },
+    {
+        name: 'Soft Default',
+        className: 'border-soft-default',
+        variable: '$border-soft-default',
+        description: '1px solid neutral-200',
+    },
+    {
+        name: 'Soft Hover',
+        className: 'border-soft-hover',
+        variable: '$border-soft-hover',
+        description: '1px solid neutral-400',
+    },
+    {
+        name: 'Soft Active',
+        className: 'border-soft-active',
+        variable: '$border-soft-active',
+        description: '1px solid neutral-600',
+    },
+    {
+        name: 'Focus',
+        className: 'border-focus',
+        variable: '$border-focus',
+        description: '2px solid neutral-900',
+    },
+];
+var Borders = function () { return (jsxs("div", { className: "bg-white", children: [jsx("h2", { className: "p-h2 mb24", children: "Border Tokens" }), jsxs("table", { style: { width: '100%', borderCollapse: 'collapse' }, children: [jsx("thead", { children: jsxs("tr", { style: {
+                            height: '40px',
+                            lineHeight: '40px',
+                            textAlign: 'left',
+                            borderBottom: '1px solid #e7e7ed',
+                        }, children: [jsx("th", { className: "pl16 fw-bold", children: "Preview" }), jsx("th", { className: "pl16 fw-bold", children: "Name" }), jsx("th", { className: "pl16 fw-bold", children: "CSS Class" }), jsx("th", { className: "pl16 fw-bold", children: "SCSS Variable" }), jsx("th", { className: "pl16 fw-bold", children: "Description" })] }) }), jsx("tbody", { children: borders.map(function (border) { return (jsxs("tr", { style: { height: '80px' }, children: [jsx("td", { className: "px24", style: { verticalAlign: 'middle' }, children: jsx("div", { className: classNames('br8 bg-neutral-200', border.className), style: { width: '64px', height: '64px' } }) }), jsx("td", { className: "p16", style: { verticalAlign: 'middle' }, children: border.name }), jsx("td", { className: "p16", style: { verticalAlign: 'middle' }, children: border.className }), jsx("td", { className: "p16", style: { verticalAlign: 'middle' }, children: border.variable }), jsx("td", { className: "p16", style: { verticalAlign: 'middle' }, children: border.description })] }, border.className)); }) })] })] })); };
+var borders_stories = {
+    title: 'CSS/Base',
+    component: Borders,
+    parameters: {
+        docs: {
+            description: {
+                component: 'Border tokens for consistent border styling across the design system. Includes strong, medium, and soft variants with default, hover, active, and focus states.',
+            },
+        },
+    },
+};
+
+export default borders_stories;
+export { Borders };
+//# sourceMappingURL=borders.stories.js.map

package/dist/esm/scss/public/borders.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"borders.stories.js","sources":["../../../../../src/lib/scss/public/borders.stories.tsx"],"sourcesContent":["import classNames from \"classnames\";\n\nconst borders = [\n  {\n    name: 'Strong Default',\n    className: 'border-strong-default',\n    variable: '$border-strong-default',\n    description: '1px solid neutral-400',\n  },\n  {\n    name: 'Strong Hover',\n    className: 'border-strong-hover',\n    variable: '$border-strong-hover',\n    description: '1px solid neutral-600',\n  },\n  {\n    name: 'Strong Active',\n    className: 'border-strong-active',\n    variable: '$border-strong-active',\n    description: '1px solid neutral-900',\n  },\n  {\n    name: 'Medium Default',\n    className: 'border-medium-default',\n    variable: '$border-medium-default',\n    description: '1px solid neutral-300',\n  },\n  {\n    name: 'Medium Hover',\n    className: 'border-medium-hover',\n    variable: '$border-medium-hover',\n    description: '1px solid neutral-500',\n  },\n  {\n    name: 'Medium Active',\n    className: 'border-medium-active',\n    variable: '$border-medium-active',\n    description: '1px solid neutral-800',\n  },\n  {\n    name: 'Soft Default',\n    className: 'border-soft-default',\n    variable: '$border-soft-default',\n    description: '1px solid neutral-200',\n  },\n  {\n    name: 'Soft Hover',\n    className: 'border-soft-hover',\n    variable: '$border-soft-hover',\n    description: '1px solid neutral-400',\n  },\n  {\n    name: 'Soft Active',\n    className: 'border-soft-active',\n    variable: '$border-soft-active',\n    description: '1px solid neutral-600',\n  },\n  {\n    name: 'Focus',\n    className: 'border-focus',\n    variable: '$border-focus',\n    description: '2px solid neutral-900',\n  },\n];\n\nexport const Borders = () => (\n  <div className=\"bg-white\">\n    <h2 className=\"p-h2 mb24\">Border Tokens</h2>\n    <table style={{ width: '100%', borderCollapse: 'collapse' }}>\n      <thead>\n        <tr\n          style={{\n            height: '40px',\n            lineHeight: '40px',\n            textAlign: 'left',\n            borderBottom: '1px solid #e7e7ed',\n          }}\n        >\n          <th className=\"pl16 fw-bold\">Preview</th>\n          <th className=\"pl16 fw-bold\">Name</th>\n          <th className=\"pl16 fw-bold\">CSS Class</th>\n          <th className=\"pl16 fw-bold\">SCSS Variable</th>\n          <th className=\"pl16 fw-bold\">Description</th>\n        </tr>\n      </thead>\n      <tbody>\n        {borders.map((border) => (\n          <tr key={border.className} style={{ height: '80px' }}>\n            <td className=\"px24\" style={{ verticalAlign: 'middle' }}>\n              <div\n                className={classNames('br8 bg-neutral-200', border.className)}\n                style={{ width: '64px', height: '64px' }}\n              />\n            </td>\n            <td className=\"p16\" style={{ verticalAlign: 'middle' }}>\n              {border.name}\n            </td>\n            <td className=\"p16\" style={{ verticalAlign: 'middle' }}>\n              {border.className}\n            </td>\n            <td className=\"p16\" style={{ verticalAlign: 'middle' }}>\n              {border.variable}\n            </td>\n            <td className=\"p16\" style={{ verticalAlign: 'middle' }}>\n              {border.description}\n            </td>\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  </div>\n);\n\nexport default {\n  title: 'CSS/Base',\n  component: Borders,\n  parameters: {\n    docs: {\n      description: {\n        component: 'Border tokens for consistent border styling across the design system. Includes strong, medium, and soft variants with default, hover, active, and focus states.',\n      },\n    },\n  },\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}