@irojs/iro-core - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

package.json

 {
   "name": "@irojs/iro-core",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Core functionality for iro.js",
@@ -5,0 +5,0 @@ "source": "src/index.ts",

src/box.ts

@@ -14,3 +14,3 @@ import { IroColor } from './color';
   return {
-    [props.layoutDirection === 'vertical' ? 'marginLeft' : 'marginTop']: props.sliderMargin
+    [props.layoutDirection === 'horizontal' ? 'marginLeft' : 'marginTop']: props.sliderMargin
   }
@@ -17,0 +17,0 @@ }

src/colorPickerOptions.ts

@@ -7,7 +7,2 @@ import { IroColor, IroColorValue } from './color';
 
-export interface IroHandleOrigin {
-  x: number;
-  y: number;
-}
-
 export interface IroColorPickerOptions {
@@ -18,3 +13,3 @@ width?: number;
   handleSvg?: string;
-  handleOrigin?: IroHandleOrigin;
+  handleProps?: any;
   color?: IroColorValue;
@@ -27,3 +22,3 @@ borderColor?: string;
   layoutDirection?: LayoutDirection;
-  sliderHeight?: number;
+  sliderSize?: number;
   sliderMargin?: number;
@@ -38,3 +33,3 @@ padding?: number;
   handleSvg: null,
-  handleOrigin: {x: 0, y: 0},
+  handleProps: {x: 0, y: 0},
   color: '#fff',
@@ -46,5 +41,6 @@ borderColor: '#fff',
   wheelDirection: 'anticlockwise',
-  sliderHeight: null,
+  layoutDirection: 'vertical',
+  sliderSize: null,
   sliderMargin: 12,
   padding: 6,
 }

src/slider.test.ts

@@ -14,4 +14,5 @@ import {
     expect(getSliderDimensions({
+      layoutDirection: 'vertical',
       width: 300,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -28,4 +29,5 @@ handleRadius: 8
     expect(getSliderDimensions({
+      layoutDirection: 'vertical',
       width: 300,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 2,
@@ -43,4 +45,5 @@ handleRadius: 8,
     expect(getSliderDimensions({
+      layoutDirection: 'vertical',
       width: 300,
-      sliderHeight: undefined,
+      sliderSize: undefined,
       borderWidth: 2,
@@ -62,2 +65,3 @@ handleRadius: 8,
     expect(getCurrentSliderValue({
+      layoutDirection: 'vertical',
       sliderType: 'hue',
@@ -67,2 +71,3 @@ color: new IroColor({h: 0, s: 100, v: 0})
     expect(getCurrentSliderValue({
+      layoutDirection: 'vertical',
       sliderType: 'hue',
@@ -72,2 +77,3 @@ color: new IroColor({h: 180, s: 100, v: 0})
     expect(getCurrentSliderValue({
+      layoutDirection: 'vertical',
       sliderType: 'hue',
@@ -80,2 +86,3 @@ color: new IroColor({h: 360, s: 100, v: 0})
     expect(getCurrentSliderValue({
+      layoutDirection: 'vertical',
       sliderType: 'saturation',
@@ -85,2 +92,3 @@ color: new IroColor({h: 300, s: 0, v: 0})
     expect(getCurrentSliderValue({
+      layoutDirection: 'vertical',
       sliderType: 'saturation',
@@ -90,2 +98,3 @@ color: new IroColor({h: 300, s: 50, v: 0})
     expect(getCurrentSliderValue({
+      layoutDirection: 'vertical',
       sliderType: 'saturation',
@@ -98,2 +107,3 @@ color: new IroColor({h: 300, s: 100, v: 0})
     expect(getCurrentSliderValue({
+      layoutDirection: 'vertical',
       sliderType: 'value',
@@ -103,2 +113,3 @@ color: new IroColor({h: 300, s: 100, v: 0})
     expect(getCurrentSliderValue({
+      layoutDirection: 'vertical',
       sliderType: 'value',
@@ -108,2 +119,3 @@ color: new IroColor({h: 300, s: 100, v: 50})
     expect(getCurrentSliderValue({
+      layoutDirection: 'vertical',
       sliderType: 'value',
@@ -120,4 +132,5 @@ color: new IroColor({h: 300, s: 100, v: 100})
     expect(getSliderValueFromInput({
+      layoutDirection: 'vertical',
       width: 200,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -132,4 +145,5 @@ handleRadius: 8
     expect(getSliderValueFromInput({
+      layoutDirection: 'vertical',
       width: 200,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -147,4 +161,5 @@ handleRadius: 8
     expect(getSliderValueFromInput({
+      layoutDirection: 'vertical',
       width: 200,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -159,4 +174,5 @@ handleRadius: 8
     expect(getSliderValueFromInput({
+      layoutDirection: 'vertical',
       width: 200,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -171,4 +187,5 @@ handleRadius: 8
     expect(getSliderValueFromInput({
+      layoutDirection: 'vertical',
       width: 200,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -186,4 +203,5 @@ handleRadius: 8
     expect(getSliderValueFromInput({
+      layoutDirection: 'vertical',
       width: 200,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -198,4 +216,5 @@ handleRadius: 8
     expect(getSliderValueFromInput({
+      layoutDirection: 'vertical',
       width: 200,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -210,4 +229,5 @@ handleRadius: 8
     expect(getSliderValueFromInput({
+      layoutDirection: 'vertical',
       width: 200,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -228,2 +248,3 @@ handleRadius: 8
     expect(getSliderGradient({
+      layoutDirection: 'vertical',
       sliderType: 'hue',
@@ -243,2 +264,3 @@ color: new IroColor()
     expect(getSliderGradient({
+      layoutDirection: 'vertical',
       sliderType: 'saturation',
@@ -251,2 +273,3 @@ color: new IroColor('#f00')
     expect(getSliderGradient({
+      layoutDirection: 'vertical',
       sliderType: 'saturation',
@@ -261,2 +284,3 @@ color: new IroColor('#000')
     expect(getSliderGradient({
+      layoutDirection: 'vertical',
       sliderType: 'value',
@@ -269,2 +293,3 @@ color: new IroColor('#fff')
     expect(getSliderGradient({
+      layoutDirection: 'vertical',
       sliderType: 'value',
@@ -277,2 +302,3 @@ color: new IroColor('#000')
     expect(getSliderGradient({
+      layoutDirection: 'vertical',
       sliderType: 'value',
@@ -291,5 +317,6 @@ color: new IroColor('#f00')
     expect(getSliderHandlePosition({
+      layoutDirection: 'vertical',
       color: new IroColor('#f00'),
       width: 300,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -299,5 +326,6 @@ handleRadius: 8
     expect(getSliderHandlePosition({
+      layoutDirection: 'vertical',
       color: new IroColor('#000'),
       width: 300,
-      sliderHeight: 30,
+      sliderSize: 30,
       borderWidth: 0,
@@ -307,5 +335,6 @@ handleRadius: 8
     expect(getSliderHandlePosition({
+      layoutDirection: 'vertical',
       color: new IroColor({h: 0, s: 50, v: 50}),
       width: 300,
-      sliderHeight: 40,
+      sliderSize: 40,
       borderWidth: 0,
@@ -312,0 +341,0 @@ handleRadius: 8

src/slider.ts

@@ -28,3 +28,3 @@ import { IroColor } from './color';
   return {
-    [props.layoutDirection === 'vertical' ? 'marginLeft' : 'marginTop']: props.sliderMargin
+    [props.layoutDirection === 'horizontal' ? 'marginLeft' : 'marginTop']: props.sliderMargin
   }
@@ -38,6 +38,6 @@ }
 export function getSliderDimensions(props: Partial<SliderOptions>) {
-  let { width, sliderHeight, borderWidth, handleRadius, padding, sliderShape } = props;
-  const isVertical = props.layoutDirection === 'vertical';
-  // automatically calculate sliderHeight if its not defined
-  sliderHeight = sliderHeight ? sliderHeight : padding * 2 + handleRadius * 2 + borderWidth * 2;
+  let { width, sliderSize: sliderSize, borderWidth, handleRadius, padding, sliderShape } = props;
+  const ishorizontal = props.layoutDirection === 'horizontal';
+  // automatically calculate sliderSize if its not defined
+  sliderSize = sliderSize ? sliderSize : padding * 2 + handleRadius * 2 + borderWidth * 2;
   if (sliderShape === 'circle') {
@@ -55,9 +55,9 @@ return {
     return {
-      handleStart: sliderHeight / 2,
-      handleRange: width - sliderHeight,
-      radius: sliderHeight / 2,
+      handleStart: sliderSize / 2,
+      handleRange: width - sliderSize,
+      radius: sliderSize / 2,
       x: 0,
       y: 0,
-      width: isVertical ? sliderHeight : width,
-      height: isVertical ? width : sliderHeight,
+      width: ishorizontal ? sliderSize : width,
+      height: ishorizontal ? width : sliderSize,
     }
@@ -102,3 +102,3 @@ }
   let handlePos;
-  if (props.layoutDirection === 'vertical') {
+  if (props.layoutDirection === 'horizontal') {
     handlePos = -1 * (y - bounds.top) + handleRange + handleStart;
@@ -131,10 +131,10 @@ } else {
   const { width, height, handleRange, handleStart } = getSliderDimensions(props);
-  const isVertical = props.layoutDirection === 'vertical';
+  const ishorizontal = props.layoutDirection === 'horizontal';
   const sliderValue = getCurrentSliderValue(props);
-  const midPoint = isVertical ? width / 2 : height / 2;
+  const midPoint = ishorizontal ? width / 2 : height / 2;
   let handlePos = handleStart + (sliderValue / 100) * handleRange;
-  if (isVertical) {
+  if (ishorizontal) {
     handlePos = -1 * handlePos + handleRange + handleStart * 2;
   } 
-  return {x: isVertical ? midPoint : handlePos, y: isVertical ? handlePos : midPoint};
+  return {x: ishorizontal ? midPoint : handlePos, y: ishorizontal ? handlePos : midPoint};
 }
@@ -199,9 +199,9 @@
 export function getSliderGradientCoords(props: Partial<SliderOptions>) {
-  const isVertical = props.layoutDirection === 'vertical';
+  const ishorizontal = props.layoutDirection === 'horizontal';
   return {
     x1: '0%',
-    y1: isVertical ? '100%' : '0%',
-    x2: isVertical ? '0%' : '100%',
+    y1: ishorizontal ? '100%' : '0%',
+    x2: ishorizontal ? '0%' : '100%',
     y2: '0%'
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

269637

increased by0.36%

Lines of code

2421

increased by1.09%

No dependency changes