@warp-ds/elements 2.3.0-next.9 → 2.3.1

package/dist/packages/steps/steps.stories.js

@@ -1,172 +0,0 @@
-import { html } from 'lit';
-import './index.js';
-const meta = {
-    title: 'Components/Steps',
-    component: 'w-steps',
-    argTypes: {
-        horizontal: {
-            control: { type: 'boolean' },
-            description: 'Display steps in horizontal layout',
-            defaultValue: false,
-        },
-        right: {
-            control: { type: 'boolean' },
-            description: 'Align steps to the right (vertical layout only)',
-            defaultValue: false,
-        },
-    },
-};
-export default meta;
-export const Default = {
-    args: {
-        horizontal: false,
-        right: false,
-    },
-    render: (args) => html `
-    <w-steps ?horizontal=${args.horizontal} ?right=${args.right}>
-      <w-step completed>
-        <h3>Step 1: Account Setup</h3>
-        <p>Create your account and verify your email address.</p>
-      </w-step>
-      <w-step active>
-        <h3>Step 2: Profile Information</h3>
-        <p>Fill in your personal details and preferences.</p>
-      </w-step>
-      <w-step>
-        <h3>Step 3: Payment Method</h3>
-        <p>Add a payment method to complete your registration.</p>
-      </w-step>
-      <w-step>
-        <h3>Step 4: Confirmation</h3>
-        <p>Review and confirm your information.</p>
-      </w-step>
-    </w-steps>
-  `,
-};
-export const Horizontal = {
-    args: {
-        horizontal: true,
-        right: false,
-    },
-    render: (args) => html `
-    <w-steps ?horizontal=${args.horizontal} ?right=${args.right}>
-      <w-step completed>
-        <h4>Setup</h4>
-        <p>Account created</p>
-      </w-step>
-      <w-step completed>
-        <h4>Profile</h4>
-        <p>Information added</p>
-      </w-step>
-      <w-step active>
-        <h4>Payment</h4>
-        <p>Add payment method</p>
-      </w-step>
-      <w-step>
-        <h4>Done</h4>
-        <p>Complete setup</p>
-      </w-step>
-    </w-steps>
-  `,
-};
-export const RightAligned = {
-    args: {
-        horizontal: false,
-        right: true,
-    },
-    render: (args) => html `
-    <w-steps ?horizontal=${args.horizontal} ?right=${args.right}>
-      <w-step completed>
-        <h3>Order Placed</h3>
-        <p>Your order has been received and is being processed.</p>
-        <small>2:34 PM</small>
-      </w-step>
-      <w-step completed>
-        <h3>Payment Confirmed</h3>
-        <p>Payment has been successfully processed.</p>
-        <small>2:35 PM</small>
-      </w-step>
-      <w-step active>
-        <h3>Preparing for Shipment</h3>
-        <p>Your items are being prepared for shipment.</p>
-      </w-step>
-      <w-step>
-        <h3>Shipped</h3>
-        <p>Your order is on its way!</p>
-      </w-step>
-    </w-steps>
-  `,
-};
-export const SimpleSteps = {
-    render: () => html `
-    <w-steps>
-      <w-step completed>
-        <strong>Step 1</strong>
-      </w-step>
-      <w-step completed>
-        <strong>Step 2</strong>
-      </w-step>
-      <w-step active>
-        <strong>Step 3</strong>
-      </w-step>
-      <w-step>
-        <strong>Step 4</strong>
-      </w-step>
-      <w-step>
-        <strong>Step 5</strong>
-      </w-step>
-    </w-steps>
-  `,
-};
-export const SimpleHorizontal = {
-    render: () => html `
-    <w-steps horizontal>
-      <w-step completed>
-        <strong>Start</strong>
-      </w-step>
-      <w-step completed>
-        <strong>Progress</strong>
-      </w-step>
-      <w-step active>
-        <strong>Current</strong>
-      </w-step>
-      <w-step>
-        <strong>Next</strong>
-      </w-step>
-      <w-step>
-        <strong>End</strong>
-      </w-step>
-    </w-steps>
-  `,
-};
-export const AllCompleted = {
-    render: () => html `
-    <w-steps>
-      <w-step completed>
-        <h3>Registration</h3>
-        <p>Account successfully created</p>
-      </w-step>
-      <w-step completed>
-        <h3>Verification</h3>
-        <p>Email address verified</p>
-      </w-step>
-      <w-step completed>
-        <h3>Setup</h3>
-        <p>Profile information completed</p>
-      </w-step>
-      <w-step completed>
-        <h3>Welcome</h3>
-        <p>You're all set to get started!</p>
-      </w-step>
-    </w-steps>
-  `,
-};
-export const MinimalExample = {
-    render: () => html `
-    <w-steps>
-      <w-step completed>First</w-step>
-      <w-step active>Second</w-step>
-      <w-step>Third</w-step>
-    </w-steps>
-  `,
-};

package/dist/packages/steps/styles.d.ts

@@ -1 +0,0 @@
-export declare const styles: import("lit").CSSResult;

package/dist/packages/steps/styles.js

@@ -1,2 +0,0 @@
-import { css } from 'lit';
-export const styles = css `*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.text-center{text-align:center}.text-right{text-align:right}.border-2{border-width:2px}.rounded-full{border-radius:9999px}.flex{display:flex}.grid{display:grid}.flex-1{flex:1}.gap-x-16{column-gap:1.6rem}.gap-y-16{row-gap:1.6rem}.row-span-2{grid-row:span 2/span 2}.col-span-3{grid-column:span 3/span 3}.row-start-1{grid-row-start:1}.row-start-2{grid-row-start:2}.col-start-2{grid-column-start:2}.grid-flow-col{grid-auto-flow:column}.grid-rows-\\[20px_auto\\]{grid-template-rows:20px auto}.grid-rows-\\[auto_20px\\]{grid-template-rows:auto 20px}.grid-cols-\\[1fr_20px_1fr\\]{grid-template-columns:1fr 20px 1fr}.grid-cols-\\[1fr_20px\\]{grid-template-columns:1fr 20px}.grid-cols-\\[20px_1fr\\]{grid-template-columns:20px 1fr}.items-center{align-items:center}.justify-self-end{justify-self:end}.justify-self-center{justify-self:center}.static{position:static}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled{background-color:var(--w-s-color-background-disabled)}.s-bg-primary{background-color:var(--w-s-color-background-primary)}.s-icon-inverted{color:var(--w-s-color-icon-inverted)}.s-border{border-color:var(--w-s-color-border)}.s-border-primary{border-color:var(--w-s-color-border-primary)}.h-2{height:.2rem}.h-20{height:2rem}.h-full{height:100%}.w-2{width:.2rem}.w-20{width:2rem}.w-full{width:100%}.last\\:mb-0:last-child{margin-bottom:0}.px-16{padding-left:1.6rem;padding-right:1.6rem}.pb-0{padding-bottom:0}.pb-32{padding-bottom:3.2rem}.invisible{visibility:hidden}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}`;

package/dist/packages/switch/index.d.ts

@@ -1,15 +0,0 @@
-import { LitElement } from 'lit';
-export declare class WarpSwitch extends LitElement {
-    value: boolean;
-    disabled: boolean;
-    static styles: import("lit").CSSResult[];
-    /** @internal */
-    get _baseClasses(): string;
-    /** @internal */
-    get _trackClasses(): string;
-    /** @internal */
-    get _handleClasses(): string;
-    /** @internal */
-    _handleClick(): void;
-    render(): import("lit").TemplateResult<1>;
-}