fix: make style props optional by default (#20)

src/utils/animations/__tests__/animation.ts

@@ -24,6 +24,11 @@ describe('animation', () => {
     expect(result).toEqual({ animation: 'a' });
   });
 
+  it('should use an interface which marks `animation` as optional', () => {
+    const result = animation<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = animation<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/animations/__tests__/animationDelay.ts

@@ -24,6 +24,11 @@ describe('animationDelay', () => {
     expect(result).toEqual({ animationDelay: 'a' });
   });
 
+  it('should use an interface which marks `animationDelay` as optional', () => {
+    const result = animationDelay<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = animationDelay<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/animations/__tests__/animationDirection.ts

@@ -24,6 +24,11 @@ describe('animationDirection', () => {
     expect(result).toEqual({ animationDirection: 'a' });
   });
 
+  it('should use an interface which marks `animationDirection` as optional', () => {
+    const result = animationDirection<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = animationDirection<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/animations/__tests__/animationDuration.ts

@@ -24,6 +24,11 @@ describe('animationDuration', () => {
     expect(result).toEqual({ animationDuration: 'a' });
   });
 
+  it('should use an interface which marks `animationDuration` as optional', () => {
+    const result = animationDuration<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = animationDuration<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/animations/__tests__/animationFillMode.ts

@@ -24,6 +24,11 @@ describe('animationFillMode', () => {
     expect(result).toEqual({ animationFillMode: 'a' });
   });
 
+  it('should use an interface which marks `animationFillMode` as optional', () => {
+    const result = animationFillMode<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = animationFillMode<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/animations/__tests__/animationIterationCount.ts

@@ -24,6 +24,11 @@ describe('animationIterationCount', () => {
     expect(result).toEqual({ animationIterationCount: 'a' });
   });
 
+  it('should use an interface which marks `animationIterationCount` as optional', () => {
+    const result = animationIterationCount<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = animationIterationCount<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/animations/__tests__/animationName.ts

@@ -24,6 +24,11 @@ describe('animationName', () => {
     expect(result).toEqual({ animationName: 'a' });
   });
 
+  it('should use an interface which marks `animationName` as optional', () => {
+    const result = animationName<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = animationName<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/animations/__tests__/animationPlayState.ts

@@ -24,6 +24,11 @@ describe('animationPlayState', () => {
     expect(result).toEqual({ animationPlayState: 'a' });
   });
 
+  it('should use an interface which marks `animationPlayState` as optional', () => {
+    const result = animationPlayState<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = animationPlayState<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/animations/__tests__/animationTimingFunction.ts

@@ -24,6 +24,11 @@ describe('animationTimingFunction', () => {
     expect(result).toEqual({ animationTimingFunction: 'a' });
   });
 
+  it('should use an interface which marks `animationTimingFunction` as optional', () => {
+    const result = animationTimingFunction<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = animationTimingFunction<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/backgroundAttachment.ts

@@ -24,6 +24,11 @@ describe('backgroundAttachment', () => {
     expect(result).toEqual({ backgroundAttachment: 'a' });
   });
 
+  it('should use an interface which marks `backgroundAttachment` as optional', () => {
+    const result = backgroundAttachment<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = backgroundAttachment<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/backgroundClip.ts

@@ -24,6 +24,11 @@ describe('backgroundClip', () => {
     expect(result).toEqual({ backgroundClip: 'a' });
   });
 
+  it('should use an interface which marks `backgroundClip` as optional', () => {
+    const result = backgroundClip<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = backgroundClip<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/backgroundColor.ts

@@ -24,6 +24,11 @@ describe('backgroundColor', () => {
     expect(result).toEqual({ backgroundColor: 'a' });
   });
 
+  it('should use an interface which marks `backgroundColor` as optional', () => {
+    const result = backgroundColor<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = backgroundColor<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/backgroundImage.ts

@@ -24,6 +24,11 @@ describe('backgroundImage', () => {
     expect(result).toEqual({ backgroundImage: 'a' });
   });
 
+  it('should use an interface which marks `backgroundImage` as optional', () => {
+    const result = backgroundImage<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = backgroundImage<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/backgroundOrigin.ts

@@ -24,6 +24,11 @@ describe('backgroundOrigin', () => {
     expect(result).toEqual({ backgroundOrigin: 'a' });
   });
 
+  it('should use an interface which marks `backgroundOrigin` as optional', () => {
+    const result = backgroundOrigin<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = backgroundOrigin<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/backgroundPosition.ts

@@ -24,6 +24,11 @@ describe('backgroundPosition', () => {
     expect(result).toEqual({ backgroundPosition: 'a' });
   });
 
+  it('should use an interface which marks `backgroundPosition` as optional', () => {
+    const result = backgroundPosition<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = backgroundPosition<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/backgroundRepeat.ts

@@ -24,6 +24,11 @@ describe('backgroundRepeat', () => {
     expect(result).toEqual({ backgroundRepeat: 'a' });
   });
 
+  it('should use an interface which marks `backgroundRepeat` as optional', () => {
+    const result = backgroundRepeat<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = backgroundRepeat<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/backgroundSize.ts

@@ -24,6 +24,11 @@ describe('backgroundSize', () => {
     expect(result).toEqual({ backgroundSize: 'a' });
   });
 
+  it('should use an interface which marks `backgroundSize` as optional', () => {
+    const result = backgroundSize<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = backgroundSize<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/border.ts

@@ -24,6 +24,11 @@ describe('border', () => {
     expect(result).toEqual({ border: 'a' });
   });
 
+  it('should use an interface which marks `border` as optional', () => {
+    const result = border<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = border<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderBottom.ts

@@ -24,6 +24,11 @@ describe('borderBottom', () => {
     expect(result).toEqual({ borderBottom: 'a' });
   });
 
+  it('should use an interface which marks `borderBottom` as optional', () => {
+    const result = borderBottom<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderBottom<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderBottomColor.ts

@@ -24,6 +24,11 @@ describe('borderBottomColor', () => {
     expect(result).toEqual({ borderBottomColor: 'a' });
   });
 
+  it('should use an interface which marks `borderBottomColor` as optional', () => {
+    const result = borderBottomColor<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderBottomColor<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderBottomLeftRadius.ts

@@ -24,6 +24,11 @@ describe('borderBottomLeftRadius', () => {
     expect(result).toEqual({ borderBottomLeftRadius: 'a' });
   });
 
+  it('should use an interface which marks `borderBottomLeftRadius` as optional', () => {
+    const result = borderBottomLeftRadius<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderBottomLeftRadius<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderBottomRightRadius.ts

@@ -24,6 +24,11 @@ describe('borderBottomRightRadius', () => {
     expect(result).toEqual({ borderBottomRightRadius: 'a' });
   });
 
+  it('should use an interface which marks `borderBottomRightRadius` as optional', () => {
+    const result = borderBottomRightRadius<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderBottomRightRadius<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderBottomStyle.ts

@@ -24,6 +24,11 @@ describe('borderBottomStyle', () => {
     expect(result).toEqual({ borderBottomStyle: 'a' });
   });
 
+  it('should use an interface which marks `borderBottomStyle` as optional', () => {
+    const result = borderBottomStyle<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderBottomStyle<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderBottomWidth.ts

@@ -24,6 +24,11 @@ describe('borderBottomWidth', () => {
     expect(result).toEqual({ borderBottomWidth: 'a' });
   });
 
+  it('should use an interface which marks `borderBottomWidth` as optional', () => {
+    const result = borderBottomWidth<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderBottomWidth<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderColor.ts

@@ -24,6 +24,11 @@ describe('borderColor', () => {
     expect(result).toEqual({ borderColor: 'a' });
   });
 
+  it('should use an interface which marks `borderColor` as optional', () => {
+    const result = borderColor<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderColor<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderImage.ts

@@ -24,6 +24,11 @@ describe('borderImage', () => {
     expect(result).toEqual({ borderImage: 'a' });
   });
 
+  it('should use an interface which marks `borderImage` as optional', () => {
+    const result = borderImage<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderImage<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderImageOutset.ts

@@ -24,6 +24,11 @@ describe('borderImageOutset', () => {
     expect(result).toEqual({ borderImageOutset: 'a' });
   });
 
+  it('should use an interface which marks `borderImageOutset` as optional', () => {
+    const result = borderImageOutset<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderImageOutset<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderImageRepeat.ts

@@ -24,6 +24,11 @@ describe('borderImageRepeat', () => {
     expect(result).toEqual({ borderImageRepeat: 'a' });
   });
 
+  it('should use an interface which marks `borderImageRepeat` as optional', () => {
+    const result = borderImageRepeat<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderImageRepeat<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderImageSlice.ts

@@ -24,6 +24,11 @@ describe('borderImageSlice', () => {
     expect(result).toEqual({ borderImageSlice: 'a' });
   });
 
+  it('should use an interface which marks `borderImageSlice` as optional', () => {
+    const result = borderImageSlice<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderImageSlice<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderImageSource.ts

@@ -24,6 +24,11 @@ describe('borderImageSource', () => {
     expect(result).toEqual({ borderImageSource: 'a' });
   });
 
+  it('should use an interface which marks `borderImageSource` as optional', () => {
+    const result = borderImageSource<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderImageSource<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderImageWidth.ts

@@ -24,6 +24,11 @@ describe('borderImageWidth', () => {
     expect(result).toEqual({ borderImageWidth: 'a' });
   });
 
+  it('should use an interface which marks `borderImageWidth` as optional', () => {
+    const result = borderImageWidth<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderImageWidth<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderLeft.ts

@@ -24,6 +24,11 @@ describe('borderLeft', () => {
     expect(result).toEqual({ borderLeft: 'a' });
   });
 
+  it('should use an interface which marks `borderLeft` as optional', () => {
+    const result = borderLeft<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderLeft<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',

src/utils/backgrounds-and-borders/__tests__/borderLeftColor.ts

@@ -24,6 +24,11 @@ describe('borderLeftColor', () => {
     expect(result).toEqual({ borderLeftColor: 'a' });
   });
 
+  it('should use an interface which marks `borderLeftColor` as optional', () => {
+    const result = borderLeftColor<'a'>()({});
+    expect(result).toEqual(undefined);
+  });
+
   it('should allow using a theme', () => {
     const result = borderLeftColor<'value', IThemeWithoutBreakpoints>({
       themeProp: 'dummy',