npm - mtrl - Versions diffs - 0.3.1 → 0.3.3 - Mend

mtrl 0.3.1 → 0.3.3

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.

Files changed (162) hide show

package/.env +15 -0
package/CONTRIBUTING.md +62 -23
package/DOCS.md +3 -3
package/README.md +43 -20
package/TESTING.md +128 -18
package/dist/index.js +14865 -0
package/git-user-stats.js +545 -0
package/index.ts +9 -67
package/package.json +8 -3
package/src/components/badge/api.ts +15 -1
package/src/components/badge/badge.ts +43 -4
package/src/components/badge/config.ts +40 -8
package/src/components/badge/index.ts +64 -3
package/src/components/badge/types.ts +175 -33
package/src/components/button/api.ts +63 -1
package/src/components/button/button.ts +39 -3
package/src/components/button/config.ts +21 -4
package/src/components/button/index.ts +26 -1
package/src/components/button/types.ts +7 -1
package/src/components/card/api.ts +78 -9
package/src/components/card/card.ts +58 -3
package/src/components/card/config.ts +41 -11
package/src/components/card/features.ts +39 -12
package/src/components/card/index.ts +84 -19
package/src/components/card/types.ts +218 -29
package/src/components/carousel/carousel.ts +92 -28
package/src/components/carousel/constants.ts +107 -21
package/src/components/carousel/index.ts +31 -13
package/src/components/checkbox/checkbox.ts +83 -16
package/src/components/checkbox/index.ts +43 -1
package/src/components/checkbox/types.ts +219 -32
package/src/components/chips/api.ts +194 -0
package/src/components/{chip → chips/chip}/api.ts +42 -2
package/src/components/chips/chip/chip.ts +131 -0
package/src/components/{chip → chips/chip}/config.ts +3 -3
package/src/components/chips/chip/index.ts +3 -0
package/src/components/chips/chips.md +481 -0
package/src/components/chips/chips.ts +75 -0
package/src/components/chips/config.ts +109 -0
package/src/components/chips/constants.ts +61 -0
package/src/components/chips/features/chip-items.ts +33 -0
package/src/components/chips/features/container.ts +77 -0
package/src/components/chips/features/controller.ts +448 -0
package/src/components/chips/features/index.ts +5 -0
package/src/components/chips/features/label.ts +108 -0
package/src/components/chips/index.ts +11 -0
package/src/components/chips/schema.ts +61 -0
package/src/components/{chip → chips}/types.ts +203 -92
package/src/components/dialog/dialog.ts +99 -16
package/src/components/dialog/index.ts +97 -1
package/src/components/dialog/types.ts +375 -69
package/src/components/divider/config.ts +90 -6
package/src/components/divider/divider.ts +32 -2
package/src/components/divider/features.ts +26 -0
package/src/components/divider/index.ts +30 -0
package/src/components/divider/types.ts +86 -9
package/src/components/extended-fab/api.ts +53 -1
package/src/components/extended-fab/config.ts +29 -1
package/src/components/extended-fab/extended-fab.ts +28 -0
package/src/components/extended-fab/index.ts +36 -0
package/src/components/extended-fab/types.ts +458 -13
package/src/components/fab/api.ts +42 -2
package/src/components/fab/config.ts +29 -1
package/src/components/fab/fab.ts +16 -2
package/src/components/fab/index.ts +35 -0
package/src/components/fab/types.ts +374 -10
package/src/components/list/api.ts +12 -2
package/src/components/list/config.ts +21 -0
package/src/components/list/features.ts +6 -0
package/src/components/list/index.ts +56 -1
package/src/components/list/list-item.ts +46 -2
package/src/components/list/list.ts +73 -2
package/src/components/list/types.ts +172 -0
package/src/components/list/utils.ts +26 -2
package/src/components/menu/api.ts +217 -20
package/src/components/menu/config.ts +27 -0
package/src/components/menu/features/visibility.ts +55 -6
package/src/components/menu/index.ts +64 -0
package/src/components/menu/menu-item.ts +46 -3
package/src/components/menu/menu.ts +77 -1
package/src/components/menu/types.ts +404 -39
package/src/components/navigation/nav-item.ts +13 -2
package/src/components/sheet/config.ts +1 -2
package/src/components/sheet/features/gestures.ts +1 -1
package/src/components/sheet/features/position.ts +1 -2
package/src/components/sheet/features/state.ts +1 -1
package/src/components/sheet/index.ts +10 -2
package/src/components/sheet/sheet.ts +1 -2
package/src/components/sheet/types.ts +29 -1
package/src/components/slider/api.ts +1 -1
package/src/components/slider/config.ts +1 -1
package/src/components/slider/features/controller.ts +1 -1
package/src/components/slider/features/handlers.ts +1 -1
package/src/components/slider/features/states.ts +1 -1
package/src/components/slider/index.ts +12 -5
package/src/components/slider/schema.ts +1 -1
package/src/components/slider/types.ts +31 -0
package/src/components/tabs/tab-api.ts +1 -1
package/src/components/tabs/types.ts +1 -1
package/src/components/tooltip/api.ts +6 -2
package/src/components/tooltip/config.ts +9 -28
package/src/components/tooltip/index.ts +10 -1
package/src/components/tooltip/types.ts +38 -3
package/src/core/dom/create.ts +57 -51
package/src/index.ts +129 -31
package/src/styles/abstract/_mixins.scss +23 -9
package/src/styles/abstract/_variables.scss +14 -4
package/src/styles/components/_card.scss +1 -1
package/src/styles/components/_chip.scss +323 -113
package/src/styles/components/_tabs.scss +1 -1
package/src/styles/themes/_autumn.scss +3 -0
package/CLAUDE.md +0 -33
package/src/components/checkbox/constants.ts +0 -37
package/src/components/chip/chip-set.ts +0 -225
package/src/components/chip/chip.ts +0 -118
package/src/components/chip/constants.ts +0 -28
package/src/components/chip/index.ts +0 -12
package/src/components/list/constants.ts +0 -116
package/src/components/sheet/constants.ts +0 -20
package/src/components/slider/constants.ts +0 -32
package/src/components/tooltip/constants.ts +0 -27
package/test/components/badge.test.ts +0 -545
package/test/components/bottom-app-bar.test.ts +0 -303
package/test/components/button.test.ts +0 -233
package/test/components/card.test.ts +0 -560
package/test/components/carousel.test.ts +0 -951
package/test/components/checkbox.test.ts +0 -462
package/test/components/chip.test.ts +0 -692
package/test/components/datepicker.test.ts +0 -1124
package/test/components/dialog.test.ts +0 -990
package/test/components/divider.test.ts +0 -412
package/test/components/extended-fab.test.ts +0 -672
package/test/components/fab.test.ts +0 -561
package/test/components/list.test.ts +0 -365
package/test/components/menu.test.ts +0 -718
package/test/components/navigation.test.ts +0 -186
package/test/components/progress.test.ts +0 -567
package/test/components/radios.test.ts +0 -699
package/test/components/search.test.ts +0 -1135
package/test/components/segmented-button.test.ts +0 -732
package/test/components/sheet.test.ts +0 -641
package/test/components/slider.test.ts +0 -1220
package/test/components/snackbar.test.ts +0 -461
package/test/components/switch.test.ts +0 -452
package/test/components/tabs.test.ts +0 -1369
package/test/components/textfield.test.ts +0 -400
package/test/components/timepicker.test.ts +0 -592
package/test/components/tooltip.test.ts +0 -630
package/test/components/top-app-bar.test.ts +0 -566
package/test/core/dom.attributes.test.ts +0 -148
package/test/core/dom.classes.test.ts +0 -152
package/test/core/dom.events.test.ts +0 -243
package/test/core/emitter.test.ts +0 -141
package/test/core/ripple.test.ts +0 -99
package/test/core/state.store.test.ts +0 -189
package/test/core/utils.normalize.test.ts +0 -61
package/test/core/utils.object.test.ts +0 -120
package/test/setup.js +0 -371
package/test/setup.ts +0 -451
package/tsconfig.json +0 -22
package/typedoc.json +0 -28
package/typedoc.simple.json +0 -14

package/test/components/snackbar.test.ts DELETED Viewed

@@ -1,461 +0,0 @@
-// test/components/snackbar.test.ts
-import { describe, test, expect, mock, beforeEach, afterEach } from 'bun:test';
-import { JSDOM } from 'jsdom';
-// Set up JSDOM
-const dom = new JSDOM(`<!DOCTYPE html><html><body></body></html>`);
-global.document = dom.window.document;
-global.window = dom.window;
-global.Element = dom.window.Element;
-global.HTMLElement = dom.window.HTMLElement;
-global.Event = dom.window.Event;
-global.CustomEvent = dom.window.CustomEvent;
-// Import types directly to avoid circular dependencies
-import type {
-  SnackbarComponent,
-  SnackbarConfig,
-  SnackbarEvent,
-  SnackbarVariant,
-  SnackbarPosition
-} from '../../src/components/snackbar/types';
-// Define constants here to avoid circular dependencies
-const SNACKBAR_VARIANTS = {
-  BASIC: 'basic',
-  ACTION: 'action'
-} as const;
-const SNACKBAR_POSITIONS = {
-  CENTER: 'center',
-  START: 'start',
-  END: 'end'
-} as const;
-// Define a mock emit function type
-type EmitFunction = (eventName: string, eventData?: any) => void;
-// Create a mock snackbar implementation
-const createMockSnackbar = (config: SnackbarConfig): SnackbarComponent => {
-  // Default configuration
-  const defaultConfig: SnackbarConfig = {
-    message: '',
-    variant: SNACKBAR_VARIANTS.BASIC,
-    position: SNACKBAR_POSITIONS.CENTER,
-    duration: 4000,
-    prefix: 'mtrl'
-  };
-  // Merge with user configuration
-  const mergedConfig = {
-    ...defaultConfig,
-    ...config
-  };
-  // Create main element
-  const element = document.createElement('div');
-  element.className = `${mergedConfig.prefix}-snackbar`;
-  if (mergedConfig.class) {
-    element.className += ` ${mergedConfig.class}`;
-  }
-  // Add variant class
-  element.className += ` ${mergedConfig.prefix}-snackbar--${mergedConfig.variant}`;
-  // Add position class
-  element.className += ` ${mergedConfig.prefix}-snackbar--${mergedConfig.position}`;
-  // Create message element
-  const messageElement = document.createElement('div');
-  messageElement.className = `${mergedConfig.prefix}-snackbar__message`;
-  messageElement.textContent = mergedConfig.message;
-  element.appendChild(messageElement);
-  // Create action button if specified
-  let actionButton: HTMLButtonElement | undefined;
-  if (mergedConfig.action) {
-    actionButton = document.createElement('button');
-    actionButton.className = `${mergedConfig.prefix}-snackbar__action`;
-    actionButton.textContent = mergedConfig.action;
-    element.appendChild(actionButton);
-  }
-  // Event handlers
-  const eventHandlers: Record<string, Function[]> = {};
-  // Timer implementation
-  const timer = {
-    timeoutId: null as number | null,
-    start: () => {
-      if (mergedConfig.duration === 0) return;
-      if (timer.timeoutId) clearTimeout(timer.timeoutId);
-      timer.timeoutId = setTimeout(() => {
-        snackbar.hide();
-      }, mergedConfig.duration) as unknown as number;
-    },
-    stop: () => {
-      if (timer.timeoutId) {
-        clearTimeout(timer.timeoutId);
-        timer.timeoutId = null;
-      }
-    }
-  };
-  // Position implementation
-  const position = {
-    getPosition: () => mergedConfig.position as SnackbarPosition,
-    setPosition: (pos: SnackbarPosition) => {
-      // Remove old position class
-      element.classList.remove(`${mergedConfig.prefix}-snackbar--${mergedConfig.position}`);
-      // Update position
-      mergedConfig.position = pos;
-      // Add new position class
-      element.classList.add(`${mergedConfig.prefix}-snackbar--${mergedConfig.position}`);
-      return snackbar;
-    }
-  };
-  // Emit function
-  const emit: EmitFunction = (eventName, eventData = {}) => {
-    if (!eventHandlers[eventName]) return;
-    const event = {
-      snackbar,
-      originalEvent: null,
-      preventDefault: () => { event.defaultPrevented = true; },
-      defaultPrevented: false,
-      ...eventData
-    };
-    eventHandlers[eventName].forEach(handler => handler(event));
-  };
-  // Create the snackbar instance
-  const snackbar: SnackbarComponent = {
-    element,
-    config: mergedConfig,
-    actionButton,
-    timer,
-    position,
-    state: 'hidden',
-    emit,
-    show: () => {
-      element.classList.add(`${mergedConfig.prefix}-snackbar--visible`);
-      snackbar.state = 'visible';
-      timer.start();
-      emit('open');
-      return snackbar;
-    },
-    hide: () => {
-      element.classList.remove(`${mergedConfig.prefix}-snackbar--visible`);
-      snackbar.state = 'hidden';
-      timer.stop();
-      emit('close');
-      return snackbar;
-    },
-    setMessage: (message: string) => {
-      mergedConfig.message = message;
-      messageElement.textContent = message;
-      return snackbar;
-    },
-    getMessage: () => mergedConfig.message,
-    setAction: (text: string) => {
-      if (!actionButton) {
-        actionButton = document.createElement('button');
-        actionButton.className = `${mergedConfig.prefix}-snackbar__action`;
-        element.appendChild(actionButton);
-      }
-      actionButton.textContent = text;
-      mergedConfig.action = text;
-      return snackbar;
-    },
-    getAction: () => mergedConfig.action || '',
-    setDuration: (duration: number) => {
-      mergedConfig.duration = duration;
-      return snackbar;
-    },
-    getDuration: () => mergedConfig.duration,
-    setPosition: (newPosition: SnackbarPosition) => {
-      return position.setPosition(newPosition);
-    },
-    getPosition: () => position.getPosition(),
-    on: (event: string, handler: Function) => {
-      if (!eventHandlers[event]) {
-        eventHandlers[event] = [];
-      }
-      eventHandlers[event].push(handler);
-      return snackbar;
-    },
-    off: (event: string, handler: Function) => {
-      if (!eventHandlers[event]) return snackbar;
-      eventHandlers[event] = eventHandlers[event].filter(h => h !== handler);
-      return snackbar;
-    },
-    destroy: () => {
-      timer.stop();
-      // Clear event handlers
-      Object.keys(eventHandlers).forEach(key => {
-        eventHandlers[key] = [];
-      });
-      // Remove from DOM if attached
-      if (element.parentNode) {
-        element.parentNode.removeChild(element);
-      }
-    }
-  };
-  return snackbar;
-};
-describe('Snackbar Component', () => {
-  let originalBody: any;
-  let mockBodyAppendChild: ReturnType<typeof mock>;
-  let mockBodyRemoveChild: ReturnType<typeof mock>;
-  beforeEach(() => {
-    // Mock document.body methods for testing
-    originalBody = document.body;
-    mockBodyAppendChild = mock(() => {});
-    mockBodyRemoveChild = mock(() => {});
-    Object.defineProperty(document, 'body', {
-      value: {
-        appendChild: mockBodyAppendChild,
-        removeChild: mockBodyRemoveChild,
-        children: []
-      },
-      writable: true
-    });
-  });
-  afterEach(() => {
-    // Restore original document.body
-    Object.defineProperty(document, 'body', {
-      value: originalBody,
-      writable: true
-    });
-  });
-  test('should create a snackbar element', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message'
-    });
-    expect(snackbar.element).toBeDefined();
-    expect(snackbar.element.tagName).toBe('DIV');
-    expect(snackbar.element.className).toContain('mtrl-snackbar');
-  });
-  test('should apply variant class', () => {
-    const variant = SNACKBAR_VARIANTS.ACTION;
-    const snackbar = createMockSnackbar({
-      message: 'Test message',
-      variant
-    });
-    expect(snackbar.config.variant).toBe(variant);
-  });
-  test('should use basic as default variant', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message'
-    });
-    expect(snackbar.config.variant).toBe(SNACKBAR_VARIANTS.BASIC);
-  });
-  test('should apply position class', () => {
-    const position = SNACKBAR_POSITIONS.START;
-    const snackbar = createMockSnackbar({
-      message: 'Test message',
-      position
-    });
-    expect(snackbar.config.position).toBe(position);
-  });
-  test('should use center as default position', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message'
-    });
-    expect(snackbar.config.position).toBe(SNACKBAR_POSITIONS.CENTER);
-  });
-  test('should set message text', () => {
-    const message = 'Test message';
-    const snackbar = createMockSnackbar({
-      message
-    });
-    expect(snackbar.config.message).toBe(message);
-    expect(typeof snackbar.getMessage).toBe('function');
-  });
-  test('should add action button when specified', () => {
-    const action = 'Undo';
-    const snackbar = createMockSnackbar({
-      message: 'Action completed',
-      action
-    });
-    expect(snackbar.actionButton).toBeDefined();
-    expect(snackbar.actionButton?.textContent).toBe(action);
-  });
-  test('should not add action button when not specified', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Simple message'
-    });
-    expect(snackbar.actionButton).toBeUndefined();
-  });
-  test('should set default duration when not specified', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message'
-    });
-    expect(snackbar.config.duration).toBe(4000);
-  });
-  test('should respect custom duration', () => {
-    const duration = 2000;
-    const snackbar = createMockSnackbar({
-      message: 'Test message',
-      duration
-    });
-    expect(snackbar.config.duration).toBe(duration);
-  });
-  test('should allow duration of 0 (no auto-dismiss)', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message',
-      duration: 0
-    });
-    expect(snackbar.config.duration).toBe(0);
-  });
-  test('should register event handlers', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message'
-    });
-    // Verify event API exists
-    expect(typeof snackbar.on).toBe('function');
-    expect(typeof snackbar.off).toBe('function');
-    // Check event handling
-    const handler = mock(() => {});
-    snackbar.on('dismiss', handler);
-    // Trigger dismiss event
-    if (snackbar.emit) {
-      snackbar.emit('dismiss');
-      expect(handler).toHaveBeenCalled();
-    }
-  });
-  test('should expose show and hide methods', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message'
-    });
-    expect(typeof snackbar.show).toBe('function');
-    expect(typeof snackbar.hide).toBe('function');
-  });
-  test('should allow updating message', () => {
-    const initialMessage = 'Initial message';
-    const snackbar = createMockSnackbar({
-      message: initialMessage
-    });
-    expect(snackbar.getMessage()).toBe(initialMessage);
-    const updatedMessage = 'Updated message';
-    snackbar.setMessage(updatedMessage);
-    expect(snackbar.getMessage()).toBe(updatedMessage);
-  });
-  test('should have dismiss timer functionality', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message'
-    });
-    expect(snackbar.timer).toBeDefined();
-    expect(typeof snackbar.timer?.start).toBe('function');
-    expect(typeof snackbar.timer?.stop).toBe('function');
-  });
-  test('should have an API for position management', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message'
-    });
-    expect(snackbar.position).toBeDefined();
-    if (snackbar.position) {
-      expect(typeof snackbar.position.getPosition).toBe('function');
-      expect(typeof snackbar.position.setPosition).toBe('function');
-    }
-  });
-  test('should clean up resources on destroy', () => {
-    const snackbar = createMockSnackbar({
-      message: 'Test message'
-    });
-    expect(typeof snackbar.destroy).toBe('function');
-    // Mock any internal methods that might be called during destroy
-    if (snackbar.timer) {
-      snackbar.timer.stop = mock(snackbar.timer.stop);
-    }
-    // Call destroy
-    snackbar.destroy();
-    // Check if timer was stopped
-    if (snackbar.timer && typeof snackbar.timer.stop === 'function') {
-      expect(snackbar.timer.stop).toHaveBeenCalled();
-    }
-  });
-  test('should apply custom class', () => {
-    const customClass = 'custom-snackbar';
-    const snackbar = createMockSnackbar({
-      message: 'Test message',
-      class: customClass
-    });
-    expect(snackbar.element.className).toContain(customClass);
-  });
-});