@api-client/ui 0.2.13 → 0.3.0

package/test/ui/button/UiButton.test.ts

@@ -2,20 +2,20 @@ import { assert, fixture, html, nextFrame } from '@open-wc/testing'
 import UiButton from '../../../src/md/button/internals/button.js'
 import { UiMock } from '../../helpers/UiMock.js'
 
-import '../../../src/md/button/ui-filled-button.js'
+import '../../../src/md/button/ui-button.js'
 import '../../../src/md/icons/ui-icon.js'
 
 describe('md', () => {
   describe('UiButton', () => {
     async function basicFixture(): Promise<UiButton> {
-      return fixture(html`<ui-filled-button>Label</ui-filled-button>`)
+      return fixture(html`<ui-button color="filled">Label</ui-button>`)
     }
 
     async function formFixture(): Promise<HTMLFormElement> {
       return fixture(
         html`<form>
           <input name="text" value="abc" />
-          <ui-filled-button>Label</ui-filled-button>
+          <ui-button color="filled">Label</ui-button>
         </form>`
       )
     }
@@ -24,7 +24,7 @@ describe('md', () => {
       return fixture(
         html`<form>
           <input name="text" value="abc" />
-          <ui-filled-button name="button" value="ok" type="submit">Label</ui-filled-button>
+          <ui-button color="filled" name="button" value="ok" type="submit">Label</ui-button>
         </form>`
       )
     }
@@ -33,34 +33,52 @@ describe('md', () => {
       return fixture(
         html`<form>
           <input name="text" value="abc" />
-          <ui-filled-button name="button" value="ok" type="submit" disabled>Label</ui-filled-button>
+          <ui-button color="filled" name="button" value="ok" type="submit" disabled>Label</ui-button>
         </form>`
       )
     }
 
     async function disabledFixture(): Promise<UiButton> {
-      return fixture(html`<ui-filled-button disabled>Label</ui-filled-button>`)
+      return fixture(html`<ui-button color="filled" disabled>Label</ui-button>`)
     }
 
     async function tabindexFixture(): Promise<UiButton> {
-      return fixture(html`<ui-filled-button tabindex="1">Label</ui-filled-button>`)
+      return fixture(html`<ui-button color="filled" tabindex="1">Label</ui-button>`)
     }
 
     async function iconFixture(): Promise<UiButton> {
       return fixture(
-        html`<ui-filled-button>
+        html`<ui-button color="filled">
           <ui-icon slot="icon" icon="add"></ui-icon>
           Label
-        </ui-filled-button>`
+        </ui-button>`
       )
     }
 
     async function trailingIconFixture(): Promise<UiButton> {
       return fixture(
-        html`<ui-filled-button trailingIcon>
+        html`<ui-button color="filled" trailingIcon>
           <ui-icon slot="icon" icon="add"></ui-icon>
           Label
-        </ui-filled-button>`
+        </ui-button>`
+      )
+    }
+
+    async function toggleFixture(): Promise<UiButton> {
+      return fixture(
+        html`<ui-button color="filled" toggle>
+          <ui-icon slot="icon" icon="add"></ui-icon>
+          Label
+        </ui-button>`
+      )
+    }
+
+    async function toggleSelectedFixture(): Promise<UiButton> {
+      return fixture(
+        html`<ui-button color="filled" toggle selected>
+          <ui-icon slot="icon" icon="add"></ui-icon>
+          Label
+        </ui-button>`
       )
     }
 
@@ -76,14 +94,14 @@ describe('md', () => {
 
       it('has form when in a form', async () => {
         const form = await formFixture()
-        const button = form.querySelector('ui-filled-button')!
+        const button = form.querySelector('ui-button')!
         assert.ok(button.form, 'has a form')
         assert.isTrue(button.form === form, 'has the parent form')
       })
 
       it('does not trigger submit when not "submit"', async () => {
         const form = await formFixture()
-        const button = form.querySelector('ui-filled-button')!
+        const button = form.querySelector('ui-button')!
         let event: Event | undefined
         form.addEventListener('submit', (e: SubmitEvent) => {
           e.preventDefault()
@@ -95,7 +113,7 @@ describe('md', () => {
 
       it('removes the native "button" after submitting', async () => {
         const form = await submitFormFixture()
-        const button = form.querySelector('ui-filled-button')!
+        const button = form.querySelector('ui-button')!
         form.addEventListener('submit', (e: SubmitEvent) => {
           e.preventDefault()
         })
@@ -106,13 +124,13 @@ describe('md', () => {
 
       it('registers the form values', async () => {
         const form = await submitFormFixture()
-        const button = form.querySelector('ui-filled-button')!
+        const button = form.querySelector('ui-button')!
         assert.isTrue(form.elements[1] === button, 'the form has the button')
       })
 
       it('submits the form when clicking on the button', async () => {
         const form = await submitFormFixture()
-        const button = form.querySelector('ui-filled-button')!
+        const button = form.querySelector('ui-button')!
         let event: SubmitEvent | undefined
         form.addEventListener('submit', (e: SubmitEvent) => {
           e.preventDefault()
@@ -127,7 +145,7 @@ describe('md', () => {
 
       it('submits the form with Space bar', async () => {
         const form = await submitFormFixture()
-        const button = form.querySelector('ui-filled-button')!
+        const button = form.querySelector('ui-button')!
         let event: SubmitEvent | undefined
         form.addEventListener('submit', (e: SubmitEvent) => {
           e.preventDefault()
@@ -139,7 +157,7 @@ describe('md', () => {
 
       it('submits the form with Enter', async () => {
         const form = await submitFormFixture()
-        const button = form.querySelector('ui-filled-button')!
+        const button = form.querySelector('ui-button')!
         let event: SubmitEvent | undefined
         form.addEventListener('submit', (e: SubmitEvent) => {
           e.preventDefault()
@@ -195,7 +213,7 @@ describe('md', () => {
 
       it('does not trigger submit when disabled', async () => {
         const form = await disabledFormFixture()
-        const button = form.querySelector('ui-filled-button')!
+        const button = form.querySelector('ui-button')!
         let event: Event | undefined
         form.addEventListener('submit', (e: SubmitEvent) => {
           e.preventDefault()
@@ -209,20 +227,14 @@ describe('md', () => {
     describe('Icon placement', () => {
       it('places the icon as a prefix by default', async () => {
         const button = await iconFixture()
-        const content = button.shadowRoot!.querySelector('.content')
-        assert.equal(content?.children[0].localName, 'slot')
+        const content = button.shadowRoot!
+        assert.equal(content?.children[2].localName, 'slot')
       })
 
       it('places the icon as a suffix', async () => {
         const button = await trailingIconFixture()
-        const content = button.shadowRoot!.querySelector('.content')
-        assert.equal(content?.children[1].localName, 'slot')
-      })
-
-      it('recognizes it has an icon', async () => {
-        const button = await iconFixture()
-        const surface = button.shadowRoot!.querySelector('.surface') as HTMLElement
-        assert.isTrue(surface.classList.contains('withIcon'))
+        const content = button.shadowRoot!
+        assert.equal(content?.children[3].localName, 'slot')
       })
     })
 
@@ -259,6 +271,16 @@ describe('md', () => {
         const button = await tabindexFixture()
         assert.equal(button.getAttribute('tabindex'), '1')
       })
+
+      it('is accessible when not selected', async () => {
+        const button = await toggleFixture()
+        await assert.isAccessible(button)
+      })
+
+      it('is accessible when selected', async () => {
+        const button = await toggleSelectedFixture()
+        await assert.isAccessible(button)
+      })
     })
 
     describe('Value and Name', () => {

package/test/ui/button/UiIconButton.test.ts

@@ -31,32 +31,40 @@ describe('md', () => {
 
     async function labeledToggleFixture(icon: IconType): Promise<UiIconButton> {
       return fixture(
-        html`<ui-icon-button aria-label="My button" title="My button description"
+        html`<ui-icon-button aria-label="My button" title="My button description" toggle
+          ><ui-icon .icon="${icon}"></ui-icon
+        ></ui-icon-button>`
+      )
+    }
+
+    async function labeledSelectedToggleFixture(icon: IconType): Promise<UiIconButton> {
+      return fixture(
+        html`<ui-icon-button aria-label="My button" title="My button description" toggle selected
           ><ui-icon .icon="${icon}"></ui-icon
         ></ui-icon-button>`
       )
     }
 
     describe('toggle button', () => {
-      it('sets button active when pressing the button with space', async () => {
+      it('sets button selected when pressing the button with space', async () => {
         const button = await toggleFixture('add')
         await UiMock.keyPress(button, 'Space')
         await nextFrame()
-        assert.isTrue(button.active, 'button is active')
+        assert.isTrue(button.selected, 'button is selected')
       })
 
-      it('sets button active when pressing the button with enter', async () => {
+      it('sets button selected when pressing the button with enter', async () => {
         const button = await toggleFixture('add')
         await UiMock.keyPress(button, 'Enter')
         await nextFrame()
-        assert.isTrue(button.active, 'button is active')
+        assert.isTrue(button.selected, 'button is selected')
       })
 
-      it('sets button active when clicking on the button', async () => {
+      it('sets button selected when clicking on the button', async () => {
         const button = await toggleFixture('add')
         button.click()
         await nextFrame()
-        assert.isTrue(button.active, 'button is active')
+        assert.isTrue(button.selected, 'button is selected')
       })
 
       it('sets "aria-pressed" when toggling the button', async () => {
@@ -66,29 +74,29 @@ describe('md', () => {
         assert.equal(button.getAttribute('aria-pressed'), 'true')
       })
 
-      it('dispatches the "active" event when toggling', async () => {
+      it('dispatches the "toggle" event when toggling', async () => {
         const button = await toggleFixture('add')
         UiMock.keyPress(button, 'Space')
-        const e = await oneEvent(button, 'active')
+        const e = await oneEvent(button, 'toggle')
         assert.ok(e, 'dispatches the event')
       })
 
-      it('does not dispatch the "active" event toggling attribute', async () => {
+      it('does not dispatch the "toggle" event toggling attribute', async () => {
         const button = await toggleFixture('add')
         const spy = sinon.spy()
-        button.addEventListener('active', spy)
-        button.active = true
+        button.addEventListener('toggle', spy)
+        button.selected = true
         await nextFrame()
         assert.isFalse(spy.called)
       })
 
-      it('does not dispatch the "click" event when toggling', async () => {
+      it('dispatches the "click" event when toggling', async () => {
         const button = await toggleFixture('add')
         const spy = sinon.spy()
         button.addEventListener('click', spy)
         await UiMock.keyPress(button, 'Space')
         await nextFrame()
-        assert.isFalse(spy.called)
+        assert.isTrue(spy.called)
       })
     })
 
@@ -133,15 +141,13 @@ describe('md', () => {
         await assert.isAccessible(button)
       })
 
-      it('is accessible when not active', async () => {
+      it('is accessible when not selected', async () => {
         const button = await labeledToggleFixture('add')
         await assert.isAccessible(button)
       })
 
-      it('is accessible when active', async () => {
-        const button = await labeledToggleFixture('add')
-        button.active = true
-        await nextFrame()
+      it('is accessible when selected', async () => {
+        const button = await labeledSelectedToggleFixture('add')
         await assert.isAccessible(button)
       })
     })

package/test/ui/dialog/UiDialog.test.ts

@@ -6,7 +6,7 @@ import UiButton from '../../../src/md/button/internals/button.js'
 
 import '../../../src/md/dialog/ui-dialog.js'
 import '../../../src/md/icons/ui-icon.js'
-import '../../../src/md/button/ui-text-button.js'
+import '../../../src/md/button/ui-button.js'
 
 describe('md', () => {
   describe('Dialog', () => {
@@ -40,9 +40,9 @@ describe('md', () => {
       return fixture(
         html` <ui-dialog>
           Content
-          <ui-text-button slot="button">Learn more</ui-text-button>
-          <ui-text-button slot="button" value="dismiss">Cancel</ui-text-button>
-          <ui-text-button slot="button" value="confirm">Accept</ui-text-button>
+          <ui-button color="text" slot="button">Learn more</ui-button>
+          <ui-button color="text" slot="button" value="dismiss">Cancel</ui-button>
+          <ui-button color="text" slot="button" value="confirm">Accept</ui-button>
         </ui-dialog>`
       )
     }
@@ -64,7 +64,7 @@ describe('md', () => {
       it('closes the dialog via the Escape button', async () => {
         const element = await buttonFixture()
         // the dialog requires a focusable element
-        const button = element.querySelector('ui-text-button')!
+        const button = element.querySelector('ui-button')!
         button.focus()
         await UiMock.keyPress(element, 'Escape', { key: 'Escape' })
         assert.equal(element.open, false)
@@ -72,14 +72,14 @@ describe('md', () => {
 
       it('closes the dialog via the dismiss slotted button', async () => {
         const element = await buttonFixture()
-        const button = element.querySelector('ui-text-button[value="dismiss"]') as UiButton
+        const button = element.querySelector('ui-button[value="dismiss"]') as UiButton
         button.click()
         assert.equal(element.open, false)
       })
 
       it('closes the dialog via the confirm slotted button', async () => {
         const element = await buttonFixture()
-        const button = element.querySelector('ui-text-button[value="confirm"]') as UiButton
+        const button = element.querySelector('ui-button[value="confirm"]') as UiButton
         button.click()
         assert.equal(element.open, false)
       })
@@ -106,7 +106,7 @@ describe('md', () => {
         const element = await buttonFixture()
         const spy = sinon.spy()
         element.addEventListener('close', spy)
-        const button = element.querySelector('ui-text-button[value="dismiss"]') as UiButton
+        const button = element.querySelector('ui-button[value="dismiss"]') as UiButton
         button.click()
         assert.isTrue(spy.calledOnce, 'the event was dispatched')
         const event = spy.args[0][0] as CustomEvent<UiDialogClosingReason>
@@ -117,7 +117,7 @@ describe('md', () => {
         const element = await buttonFixture()
         const spy = sinon.spy()
         element.addEventListener('close', spy)
-        const button = element.querySelector('ui-text-button[value="confirm"]') as UiButton
+        const button = element.querySelector('ui-button[value="confirm"]') as UiButton
         button.click()
         assert.isTrue(spy.calledOnce, 'the event was dispatched')
         const event = spy.args[0][0] as CustomEvent<UiDialogClosingReason>
@@ -129,7 +129,7 @@ describe('md', () => {
         element.dialogValue = 'test'
         const spy = sinon.spy()
         element.addEventListener('close', spy)
-        const button = element.querySelector('ui-text-button[value="confirm"]') as UiButton
+        const button = element.querySelector('ui-button[value="confirm"]') as UiButton
         button.click()
         assert.isTrue(spy.calledOnce, 'the event was dispatched')
         const event = spy.args[0][0] as CustomEvent<UiDialogClosingReason>

package/build/src/md/button/internals/button-styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"button-styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/button/internals/button-styles.ts"],"names":[],"mappings":";AAEA,wBA4IC"}

package/build/src/md/button/internals/button-styles.js

@@ -1,143 +0,0 @@
-import { css } from 'lit';
-export default css `
-  :host {
-    display: inline-block;
-    vertical-align: middle;
-    box-sizing: content-box;
-    outline: none;
-    writing-mode: horizontal-tb !important;
-    text-rendering: auto;
-    cursor: default;
-    user-select: none;
-    height: 40px;
-    width: fit-content;
-    -webkit-tap-highlight-color: transparent;
-
-    position: relative;
-
-    border-radius: 20px;
-
-    --_label-text-font: var(
-      --ui-button-label-text-font,
-      var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto))
-    );
-    --_label-text-weight: var(
-      --ui-button-label-text-weight,
-      var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500))
-    );
-    --_label-text-line-height: var(
-      --ui-button-label-text-line-height,
-      var(--md-sys-typescale-label-large-height, 1.25rem)
-    );
-    --_label-text-size: var(--ui-button-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));
-    --_icon-size: var(--md-elevated-button-icon-size, 18px);
-    --_content-padding: 0px 24px;
-    --_content-opacity: 1;
-    --_content-background-color: initial;
-    --_content-color: inherit;
-    --_container-background-color: initial;
-    --_container-opacity: 1;
-    --_container-elevation: var(--md-sys-elevation-0);
-    --_surface-color: inherit;
-    --_state-opacity: 0;
-    --_state-background-color: initial;
-
-    letter-spacing: var(--md-sys-typescale-label-large-tracking);
-    font-family: var(--_label-text-font);
-    font-size: var(--_label-text-size);
-    line-height: var(--_label-text-line-height);
-    font-weight: var(--_label-text-weight);
-    text-overflow: ellipsis;
-  }
-
-  :host([disabled]) {
-    --_content-opacity: 0.38;
-  }
-
-  .surface {
-    width: inherit;
-    height: inherit;
-    position: relative;
-    border-radius: inherit;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    color: var(--_surface-color);
-  }
-
-  .container,
-  .state {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    border-radius: inherit;
-  }
-
-  .container {
-    z-index: 1;
-    transition:
-      box-shadow 160ms cubic-bezier(0.4, 0, 0.2, 1),
-      background-color 230ms cubic-bezier(0.4, 0, 0.2, 1);
-    background-color: var(--_container-background-color);
-    opacity: var(--_container-opacity);
-    box-shadow: var(--_container-elevation);
-  }
-
-  .state {
-    z-index: 2;
-    opacity: var(--_state-opacity);
-    background-color: var(--_state-background-color);
-    transition: opacity 260ms cubic-bezier(0.4, 0, 0.2, 1);
-  }
-
-  .content {
-    z-index: 3;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    position: relative;
-    padding: var(--_content-padding);
-    opacity: var(--_content-opacity);
-    white-space: nowrap;
-    color: var(--_content-color);
-    background-color: var(--_content-background-color);
-  }
-
-  .content slot::slotted(*) {
-    color: var(--_content-color);
-    fill: var(--_content-color);
-  }
-
-  .ripple {
-    border-radius: inherit;
-    z-index: 3;
-  }
-
-  .surface.withIcon {
-    --_content-padding: 0px 24px 0px 16px;
-  }
-
-  :host([trailingIcon]) .surface.withIcon {
-    --_content-padding: 0px 16px 0px 24px;
-  }
-
-  .surface.withIcon slot[name='icon']::slotted(*) {
-    margin-right: 8px;
-    margin-left: 0px;
-    font-size: var(--_icon-size);
-    inline-size: var(--_icon-size);
-    block-size: var(--_icon-size);
-  }
-
-  :host([trailingIcon]) .surface.withIcon slot[name='icon']::slotted(*) {
-    margin-left: 8px;
-    margin-right: 0px;
-  }
-
-  :host([disabled]) {
-    pointer-events: none;
-  }
-`;
-//# sourceMappingURL=button-styles.js.map

package/build/src/md/button/internals/button-styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"button-styles.js","sourceRoot":"","sources":["../../../../../src/md/button/internals/button-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4IjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    display: inline-block;\n    vertical-align: middle;\n    box-sizing: content-box;\n    outline: none;\n    writing-mode: horizontal-tb !important;\n    text-rendering: auto;\n    cursor: default;\n    user-select: none;\n    height: 40px;\n    width: fit-content;\n    -webkit-tap-highlight-color: transparent;\n\n    position: relative;\n\n    border-radius: 20px;\n\n    --_label-text-font: var(\n      --ui-button-label-text-font,\n      var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto))\n    );\n    --_label-text-weight: var(\n      --ui-button-label-text-weight,\n      var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500))\n    );\n    --_label-text-line-height: var(\n      --ui-button-label-text-line-height,\n      var(--md-sys-typescale-label-large-height, 1.25rem)\n    );\n    --_label-text-size: var(--ui-button-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));\n    --_icon-size: var(--md-elevated-button-icon-size, 18px);\n    --_content-padding: 0px 24px;\n    --_content-opacity: 1;\n    --_content-background-color: initial;\n    --_content-color: inherit;\n    --_container-background-color: initial;\n    --_container-opacity: 1;\n    --_container-elevation: var(--md-sys-elevation-0);\n    --_surface-color: inherit;\n    --_state-opacity: 0;\n    --_state-background-color: initial;\n\n    letter-spacing: var(--md-sys-typescale-label-large-tracking);\n    font-family: var(--_label-text-font);\n    font-size: var(--_label-text-size);\n    line-height: var(--_label-text-line-height);\n    font-weight: var(--_label-text-weight);\n    text-overflow: ellipsis;\n  }\n\n  :host([disabled]) {\n    --_content-opacity: 0.38;\n  }\n\n  .surface {\n    width: inherit;\n    height: inherit;\n    position: relative;\n    border-radius: inherit;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    color: var(--_surface-color);\n  }\n\n  .container,\n  .state {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    border-radius: inherit;\n  }\n\n  .container {\n    z-index: 1;\n    transition:\n      box-shadow 160ms cubic-bezier(0.4, 0, 0.2, 1),\n      background-color 230ms cubic-bezier(0.4, 0, 0.2, 1);\n    background-color: var(--_container-background-color);\n    opacity: var(--_container-opacity);\n    box-shadow: var(--_container-elevation);\n  }\n\n  .state {\n    z-index: 2;\n    opacity: var(--_state-opacity);\n    background-color: var(--_state-background-color);\n    transition: opacity 260ms cubic-bezier(0.4, 0, 0.2, 1);\n  }\n\n  .content {\n    z-index: 3;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    position: relative;\n    padding: var(--_content-padding);\n    opacity: var(--_content-opacity);\n    white-space: nowrap;\n    color: var(--_content-color);\n    background-color: var(--_content-background-color);\n  }\n\n  .content slot::slotted(*) {\n    color: var(--_content-color);\n    fill: var(--_content-color);\n  }\n\n  .ripple {\n    border-radius: inherit;\n    z-index: 3;\n  }\n\n  .surface.withIcon {\n    --_content-padding: 0px 24px 0px 16px;\n  }\n\n  :host([trailingIcon]) .surface.withIcon {\n    --_content-padding: 0px 16px 0px 24px;\n  }\n\n  .surface.withIcon slot[name='icon']::slotted(*) {\n    margin-right: 8px;\n    margin-left: 0px;\n    font-size: var(--_icon-size);\n    inline-size: var(--_icon-size);\n    block-size: var(--_icon-size);\n  }\n\n  :host([trailingIcon]) .surface.withIcon slot[name='icon']::slotted(*) {\n    margin-left: 8px;\n    margin-right: 0px;\n  }\n\n  :host([disabled]) {\n    pointer-events: none;\n  }\n`\n"]}

package/build/src/md/button/internals/elevated-button.d.ts

@@ -1,4 +0,0 @@
-import Button from './button.js';
-export default class ElevatedButton extends Button {
-}
-//# sourceMappingURL=elevated-button.d.ts.map

package/build/src/md/button/internals/elevated-button.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"elevated-button.d.ts","sourceRoot":"","sources":["../../../../../src/md/button/internals/elevated-button.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAa,CAAA;AAEhC,MAAM,CAAC,OAAO,OAAO,cAAe,SAAQ,MAAM;CAAG"}

package/build/src/md/button/internals/elevated-button.js

@@ -1,4 +0,0 @@
-import Button from './button.js';
-export default class ElevatedButton extends Button {
-}
-//# sourceMappingURL=elevated-button.js.map

package/build/src/md/button/internals/elevated-button.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"elevated-button.js","sourceRoot":"","sources":["../../../../../src/md/button/internals/elevated-button.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAa,CAAA;AAEhC,MAAM,CAAC,OAAO,OAAO,cAAe,SAAQ,MAAM;CAAG","sourcesContent":["import Button from './button.js'\n\nexport default class ElevatedButton extends Button {}\n"]}

package/build/src/md/button/internals/elevated-button.styles.d.ts

@@ -1,3 +0,0 @@
-declare const _default: import("lit").CSSResult;
-export default _default;
-//# sourceMappingURL=elevated-button.styles.d.ts.map

package/build/src/md/button/internals/elevated-button.styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"elevated-button.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/button/internals/elevated-button.styles.ts"],"names":[],"mappings":";AAEA,wBAmCC"}

package/build/src/md/button/internals/elevated-button.styles.js

@@ -1,38 +0,0 @@
-import { css } from 'lit';
-export default css `
-  :host {
-    --md-ripple-hover-state-layer-color: var(--md-sys-color-primary);
-    --md-ripple-focus-state-layer-color: var(--md-sys-color-primary);
-    --md-ripple-pressed-state-layer-color: var(--md-sys-color-primary);
-    --_container-background-color: var(--md-sys-color-surface);
-    --_container-elevation: var(--md-sys-elevation-1);
-    --_surface-color: var(--md-sys-color-primary);
-    --_content-color: var(--md-sys-color-primary);
-  }
-
-  :host(:hover) {
-    --_container-elevation: var(--md-sys-elevation-2);
-    --_state-background-color: var(--md-sys-color-primary);
-    --_state-opacity: var(--md-sys-state-hover-state-layer-opacity);
-  }
-
-  :host(:focus) {
-    --_container-elevation: var(--md-sys-elevation-1);
-  }
-
-  :host(:active),
-  :host .pressed {
-    --_container-elevation: var(--md-sys-elevation-1);
-    --_state-background-color: var(--md-sys-color-primary);
-    --_state-opacity: var(--md-sys-state-pressed-state-layer-opacity);
-  }
-
-  :host([disabled]) {
-    --_container-background-color: var(--md-sys-color-on-surface);
-    --_container-opacity: 0.12;
-    --_container-elevation: var(--md-sys-elevation-0);
-    --_content-opacity: 0.38;
-    --_content-color: var(--md-sys-color-on-surface);
-  }
-`;
-//# sourceMappingURL=elevated-button.styles.js.map

package/build/src/md/button/internals/elevated-button.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"elevated-button.styles.js","sourceRoot":"","sources":["../../../../../src/md/button/internals/elevated-button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    --md-ripple-hover-state-layer-color: var(--md-sys-color-primary);\n    --md-ripple-focus-state-layer-color: var(--md-sys-color-primary);\n    --md-ripple-pressed-state-layer-color: var(--md-sys-color-primary);\n    --_container-background-color: var(--md-sys-color-surface);\n    --_container-elevation: var(--md-sys-elevation-1);\n    --_surface-color: var(--md-sys-color-primary);\n    --_content-color: var(--md-sys-color-primary);\n  }\n\n  :host(:hover) {\n    --_container-elevation: var(--md-sys-elevation-2);\n    --_state-background-color: var(--md-sys-color-primary);\n    --_state-opacity: var(--md-sys-state-hover-state-layer-opacity);\n  }\n\n  :host(:focus) {\n    --_container-elevation: var(--md-sys-elevation-1);\n  }\n\n  :host(:active),\n  :host .pressed {\n    --_container-elevation: var(--md-sys-elevation-1);\n    --_state-background-color: var(--md-sys-color-primary);\n    --_state-opacity: var(--md-sys-state-pressed-state-layer-opacity);\n  }\n\n  :host([disabled]) {\n    --_container-background-color: var(--md-sys-color-on-surface);\n    --_container-opacity: 0.12;\n    --_container-elevation: var(--md-sys-elevation-0);\n    --_content-opacity: 0.38;\n    --_content-color: var(--md-sys-color-on-surface);\n  }\n`\n"]}

package/build/src/md/button/internals/filled-button.d.ts

@@ -1,4 +0,0 @@
-import Button from './button.js';
-export default class FilledButton extends Button {
-}
-//# sourceMappingURL=filled-button.d.ts.map

package/build/src/md/button/internals/filled-button.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"filled-button.d.ts","sourceRoot":"","sources":["../../../../../src/md/button/internals/filled-button.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAa,CAAA;AAEhC,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,MAAM;CAAG"}

package/build/src/md/button/internals/filled-button.js

@@ -1,4 +0,0 @@
-import Button from './button.js';
-export default class FilledButton extends Button {
-}
-//# sourceMappingURL=filled-button.js.map

package/build/src/md/button/internals/filled-button.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"filled-button.js","sourceRoot":"","sources":["../../../../../src/md/button/internals/filled-button.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAa,CAAA;AAEhC,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,MAAM;CAAG","sourcesContent":["import Button from './button.js'\n\nexport default class FilledButton extends Button {}\n"]}

package/build/src/md/button/internals/filled-button.styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"filled-button.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/button/internals/filled-button.styles.ts"],"names":[],"mappings":";AAEA,wBA2BC"}